初めまして!この度記事を寄稿させていただくことになりましたSwordGと申します!
さて、皆さんは以前の記事で服やアイテムのオンオフアニメーションは作れるようになったと思います。
でもせっかくなら見出しの画像のようにカッコよくオンオフさせたくありませんか?
実はコレ、liltoonを使えば簡単に実現できちゃうんです!
こちらの記事はすでにオブジェクトのオンオフギミックを作れる方を対象としています。オンオフギミック自体の作り方が知りたい方は「【ツール不用】VRChatアバターの着せ替えアニメーション設定方法を分かりやすく解説!誰でも設定可能。」を御覧ください。
目次
動作のイメージ
以前の記事ではオブジェクトの「オン」と「オフ」のアニメーションクリップ、それらを切り替えるアニメーションコントローラーを作っていました。今回はそれに加えて「オン→オフ」と「オフ→オン」のアニメーションクリップを作り、それらを経由するようにAnimatorを組みます。
要するに「オン」のアニメーションと「オフ」のアニメーションの間にそれらを切り替えるアニメーションを再生するわけですね。
なんとなくこのギミックに必要なものはイメージできたのではないでしょうか?
ではまずは「オン→オフ」と「オフ→オン」のアニメーションクリップを作っていきましょう!
プロジェクトの準備
まずはプロジェクトの準備をします。すでにアップロードしているアバターのもので構いません。
今回の記事ではひゅうがなつみかん様のウルフェリアちゃんで解説をしていきたいと思います!ウルフェリアちゃんにはあらかじめプレファブが用意されているのでそれを利用していきます。
ウルフェリアちゃんが右手に持っているweaponをカッコよくオンオフさせていきます。
シェーダーをliltoonにする
まずはオンオフさせたいオブジェクトを選択します。このときマテリアルが他のオブジェクトと共用の場合は複製してそれ専用のものを用意しましょう。シェーダーがliltoonではない場合は変更しておきます。また、描画モードは半透明にしましょう。
ウルフェリアちゃんの場合、シェーダーはliltoonでしたがマテリアルが他のアクセサリーと共用でしたので複製して分けておきました。
「オフ→オン(Activation)」のアニメーションクリップを作る
それでは早速アニメーションを作っていきましょう!
アニメーションの作り方は人によって癖があると思いますが、とりあえず私が一番慣れている方法で解説していきたいと思います。
あまりアップロードするアバターを直接弄りたくないので、まずはアバターを複製します。理由は後述しますがアニメーションをよく作る方は癖にしておくと良いと思います。
次にProjectウィンドウで右クリックからアニメーションクリップを作成します。作成する場所はAssets内ならどこでも良いですが、専用にフォルダを作っておくと後から自分で見てわかりやすいです。
アニメーションクリップを作成したら先ほど複製したアバターにドラッグアンドドロップしましょう。
オンオフしたいオブジェクトを選択するとAnimationウィンドウの録画ボタンが押せるようになると思います。押せない場合はInspectorを確認し、Animatorが適用されている場合は削除してください。これが先ほどアバターを複製した理由です。Animatorを消したアバターをそのままアップロードするとギミックがうまく動かなくなってしまう場合がありますので、複製したアバターでアニメーションクリップを作るよう癖をつけておくと良いと思います。
ウルフェリアちゃんのweaponにはAnimatorが適用されていたため削除しました。
また、スクリーンショットのようにAnimationウィンドウは画面下部に固定しておくと操作しやすいのでおすすめです。
録画ボタンを押したらオンオフしたいオブジェクトのチェックボックスを2回クリックします。するとオブジェクトをアクティブにするアニメーションクリップができます。
オンオフしたいオブジェクトのメッシュを選択し、シェーダーの「Dissolve」を有効にします。種類はお好みですが今回は「UV」、「形状」は「点」で設定していきます。
「範囲」をオブジェクトがギリギリ全部消える数値にします。できるだけギリギリにしておくとアニメーションの再生時間が狙い通りになります。
weaponの場合は「Dissolve」の「範囲」を1.4にするとちょうど全部消えるようです。
今回は1秒でオブジェクトを表示させようと思うのでAnimationウィンドウの再生位置を1秒の時点に合わせます。フレーム数で指定する場合は60と入力することでも再生位置を変更できます。
「Dissolve」の「範囲」をオブジェクトがぎりぎり見える数値にします。これができたら録画ボタンを押して録画を終了します。
想定通りの動きになっているかどうか再生ボタンを押してみて確認してみましょう。
うまく再生されていればActivationのアニメーションクリップは完成です!
こだわりたい方は「Dissolve」の種類を変えたり「ぼかし」の度合い、「色」などを弄るとより凝った演出ができます。
「オン→オフ(InActivation)」のアニメーションクリップを作る
次はInActivationのアニメーションクリップを作っていきます。今回は簡単にActivationのアニメーションクリップを複製して作りましょう。
まずはProjectウィンドウのActivationのアニメーションクリップを選択して「Ctrl + D」で複製します。複製したアニメーションクリップはわかりやすいようにリネームしましょう。
次にリネームしたアニメーションクリップを選択した状態でAnimationウィンドウ内の数値を弄っていきます。
「Skinned Mesh Renderer.Material._Dissolve.Params」の中の「Material_Dissolve Params.Z」が「範囲」の数値ですので、0秒時点の数値と終了時点の数値を入れ替えましょう。
これでInActivationのアニメーションクリップも完成です!
これらに加えて通常のオンオフアニメーションも必要ですので作っておきましょう。
Animatorを組む
それではいよいよAnimatorを組んでいきましょう!……という前に複製したアバターは削除するか非表示にしておきましょう。シーンにアップロードするアバターのみが表示されている状態にします。
アップロードするアバターのルートオブジェクトを選択し、Inspectorの「VRC Avatar Descriptor (Script)」内の「Playable Layers」にある「FX」に入っているアニメーションコントローラーをダブルクリックします(②-1)。オリジナルのファイルを編集したくない場合は複製しておきましょう(②-2)。
通常のオンオフアニメーションを作ったときと同じようにBoolパラメーターとWeightを1にしたレイヤーを作成します。
ウルフェリアちゃんの場合はパラメーターもレイヤーもあらかじめ作ってあるのでこちらを流用させていただきます。
先ほど作成したアニメーションクリップを選択してAnimatorウィンドウにドラッグアンドドロップするとステートが自動で作成されます。自動で作成したステートはRight Defaultsがオンになっていますが、VRChatではオフが推奨されていますので忘れずオフにしましょう。ただし、他のレイヤーのステートでWrite Defaultsがオンの場合はオンに統一したほうが良い(らしい)です。
既存のTransitionがある場合は削除して、それぞれのステートを以下のように繋げてください。
特にInspectorのSettingの値とConditionsは重要ですので気をつけましょう。
Animatorの設定ができたら、あとは以前と同様にVRCExpressionParametersとVRCExpressionMenuを設定しましょう。
以上でカッコいいオンオフアニメーションの完成です!アップロードしてVRChat内で動作を確認してみましょう!
画像のようにカッコよくオンオフできるようになればオッケーです!
お疲れ様でした!
おわりに
今回の記事は普段の記事と違って少し専門的な内容だったかと思いますがいかがでしたでしょうか。
私の記事では「基本的なことはわかったのでもっとステップアップしたい!」や「他の人とは一味違った改変がしたい!」という方の参考になるような内容を扱っていきたいと思っていますので、ぜひ次回の記事も楽しみにしていてください!
この記事を読んで改変をしたという方がいらっしゃいましたらぜひVRChat内やTwitterなどでご報告していただけると嬉しいです!感想もお待ちしてます~!
普段はフレンドさんとのんびりしたりイベントに参加したりして遊んでいます!