見出し画像

【VRChat】アバターのちょっとしたアニメーションをメニューに追加する方法 ~Modular Avatarより~

Modular Avatarを使ってアバターのアニメーションをメニュー登録する方法。類似記事はいっぱいあるけど古いものが多く、Modular Avatarを使ったらどうなるのか?を書いてみたかったため執筆します。
ある程度は簡単なので初心者さんにもオススメです。みんながんばれ!!

ここではマヌカちゃんを用いてマテリアル(エプロンの色)を変えるアニメーションを作成します。

 もし衣装やアイテムのオンオフ(非アクティブ化・アクティブ化)をアニメーションで行いたい場合、使いまわしできるように衣装やアイテムそのものをオン・オフしないよう留意しましょう(以前の記事)


シーン管理する

1.新しいシーンを追加

File → New Scene → Add New Scene

確認画面でAdd New Sceneを選択
Unity2022の場合はLoad additivelyにチェックをつける

シーンがUntitledで作成されるのでCtrl+Sで「名前をつけて保存」する

最初はUntitled
保存後
Assetsにシーンファイルが置かれる

ポイント1:シーンが何も無くなってしまったときは、データが消えたのではなくシーンファイルが画面から消えてしまっただけなので、ProjectのAssetsにあるシーンファイルをドラッグ&ドロップすると復活します。

ポイント2:余分なシーンは右クリック→Unloadで非アクティブ化できます
Removeするより便利。

2.シーンの準備

さきほど作成した「マヌカ テスト」のシーンにPrefabをドラッグ&ドロップ

これでシーンにアバターが出る

ポイント3:ヒエラルキーから全てのシーンをUnloadすることはできないので一番下に「ダミー」という何もないシーンを追加しています

このダミーシーンに
Tools→Av3Emulator→Enable より
Av3Emulator起動用のオブジェクトを配置します。

これでEmulatorが起動可能

その他、シーンによらず必要なオブジェクト(高さをみるとき用いる床面など)はダミーに置いています。

Av3Emulatorが見つからないひとはUnityプロジェクトを開くときの横のボタン(ManegeProjest)を押して入っているか確認してください
プロジェクトを再生してアバターをクリックするとリングメニューが出てたらひとまず成功

メニュー作成まで

アバターを右クリックしてModular AvatarからExtract Menu(メニュー抽出)

Avatar Menuを開いて右クリック→Creat emptyからGameobjectを作成してください

このゲームオブジェクトを「その他」みたいなメニューのまとまりに整形します。
GameobjectにMA Menu Itemというコンポーネントをアタッチします

タイプ→サブメニュー サブメニュー引用元→子オブジェクトから生成に変更

こうやって探す↓

Add Componentからitemで検索

さいごにGameobjectから名前変更します。

マヌカちゃんを再生▶ リングメニューがこうなったら成功↓

(アイコンなどは編集可能です)

アニメーション作成まで

今回はマヌカちゃんのエプロンの色を変更するアニメーションにします
アニメーションファイルをAssetsの好きな場所に新規作成してアバターのルートへドラッグ&ドロップ

アニメーションファイルをダブルクリックすると編集画面(Animationタブ)が開きます

ポイント:なかったら適当なタブを右クリック→AddTabから追加

この状態でアバターのルートをクリックすると録画ボタンがオンにできるようになります(儀式)

アバターをクリックしたときAnimationのファイルが変わって
それが目当てのファイルじゃなかったらファイル名の横の▼ボタンを押そう

登録されているアニメーションファイルがこころから全部 閲覧・変更できる

ここから録画ボタンでアニメーション作成していきます
裏技として通常状態を0フレーム目に、変化後の状態を1フレーム目に登録します(Motion Timeで制御するから)


0フレーム目
最終フレーム目


アニメーターコントローラー作成まで

テンプレートを参考に組んでください

変数 1 float 値1
変数0 float 値0
切り替え用変数 Bool

StateのMotion timeに0をセットするとアニメーションファイルの0フレーム目、1をセットすると最終フレーム目が再生される仕組みです

今回はエプロンの色を変えるので、テンプレートからコピーして該当箇所を書き換えます

変数名は衝突しないよう変えましょう
motionをセット
motionをセット

Animatorコントローラーはこれで完成

メニュー追加まで

アニメーターの統合

アバターのルートを右クリックしてCreate Empty→名前変更
「エプロン色変え」の空オブジェクトを作ります

エプロン色変えにMA Merge AnimatorとMA Parametersをアタッチ

統合されるアニメーターを先程のものに指定するとこうなります
MA Parametersのプレハブ開発者向け設定を表示して

切り替え用の変数をAnimatorのみからBoolへと変更
これで同期する変数となります

メニューの登録

追記:MA Menu GroupコンポーネントをMA Menu Installerと同時にアタッチすることで、ExpressionMenuファイルを作成しなくてもメニューを特定の場所にもっていくことができます(複数可)

タイプをtoggleにする
パラメータ名は先程作った引き換え用変数の名前

今回はメニューがひとつなのでMA Menu GroupコンポーネントではなくMA Menu itemでもOK

MA Menu Installerを同じ場所にアタッチ

インストール先を「メニューを選択」して「その他」を指定

プレハブ開発者向け設定を展開して先程アタッチしたMA Menu Groupが追加されることになっていか確認して終了です

続き

再生してみましょう▶

「その他」に設定項目ができ
エプロンの色が変わりました

注意点:今回作成したような色変更アニメーションはLight Limit Changerの「色温度調整」「再度調整」機能などをオンにするとバッティング(衝突)して色が変わらなくなることもあるため留意しておくこと

Prefabまで

先ほど色々なMAのコンポーネントをアタッチした「エプロン色変え」をAssets下にドラッグ&ドロップしてPrefabにします

つくったPrefabはほかのマヌカちゃん改変に移植することができます
このときインストール先はリングメニューのトップに戻ることがありますが
、「メニューを選択」から再設定でOKです

メニューを選択で変更

以上でした。よかったら参考にしてみてください




この記事が気に入ったらサポートをしてみませんか?