Unityでパリピ孔明のモーションデータをVRMモデルに流し込んでみた

発端

友人「パリピ孔明が公式にダンスモーションを配布してるから、自分のモデルを踊らせてみたいんだけど、やり方が分からないから教えて」
おおや「よっしゃ任せとけ！」（俺も分からん）

という経緯から、
Unity初心者があれこれ調べながらパリピ孔明のモーションデータをVRMモデルに流し込んだときの記録です。

偉大なる公式様

1. Unityプロジェクトの準備

UnityHubを起動して、新しいプロジェクト→3D→プロジェクト名と保存場所を指定してプロジェクトを作成

2. VRMモデルをインポートする

1. VRMモデルをUnityにインポートするために、以下のページからVRM用のパッケージをダウンロードする

2.ダウンロードしたパッケージをダブルクリックすると以下のウィンドウが表示されるので、Importを選択する
2.1 バージョンの新しいUnityだとスクリプトを更新するか確認されるので、Yesのどちらかを選択する
3.その後、インポートしたパッケージの推奨設定にするか聞かれるので、Accept Allを選択する
4.Thank you!　→　Close

5.UnityのAssetsフォルダにVRMファイルをドラッグ＆ドロップする（左図）
6.自動的にVRMモデルのprefabが生成されるので、Hieralchyウィンドウにドラッグ＆ドロップする（右図）

---

これでVRMモデルの準備はOK

3.パリピ孔明のダンスモーションデータ（.fbx)をインポートする

1. 公式からダンスモーションデータをダウンロードし、解凍する。
2. 解凍したら、フォルダ内のfbxファイルをUnityのAssetsフォルダにドラッグ＆ドロップする

1. Assetsフォルダのfbxファイルを左クリック

2. 画面右のInspecterウィンドウのRigを選択する

3. Animation TypeをHumanoidに変更する

4. 変更したらApplyをクリックして適用する
   

5. Assetsフォルダのfbxファイル右にある三角ボタンを押し、表示されたデータを選択する

6. 画面上部のメニューバーから、Editを開き、Duplicateを選択してデータを複製する（Ctrl+Dでも良い）
   

4.アニメーターコントローラーを作成する

1. Assetsフォルダ内で右クリックし、Create → Animator Controllerを選択する
   

2. 作成したAnimator Controllerをダブルクリック

3. 表示されたAnimatorビューに3.6で複製したデータをドラッグ＆ドロップする
   

これでモーションデータの準備はOK

5.VRMモデルにモーションデータを流し込む

1. 画面上部にあるSceneタブをクリックして、画面をSceneビューに切り替える
2. HieralchyウィンドウでVRMモデルを選択する
3. 画面右側のInspectorウィンドウ内にAnimatorカテゴリがあるので、スクロールして表示しておく
   　　※ホイールでスクロールすると見つけにくいのでスクロールバーを動かすと良い
4. AssetsフォルダのAnimator ControllerをAnimatorカテゴリのControllerにドラッグ＆ドロップする
   　　※ドラッグ＆ドロップしづらい場合はControllerの右にある◎ボタンを押すと表示されるウィンドウで選んでもOK
   

6.動かしてみる

VRMモデルとモーションデータの接続が完了したので、もうPlayボタンを押すと踊ってくれるものの、カメラの設定をしないと遥か遠くで踊り始めてしまうので、まずはカメラの位置を調整する

1. Sceneビューでは右ドラッグでビューの向きの調整、ホイールボタンのドラッグで視点の上下左右を移動できるので、良い感じに視点を調整する
2. 視点の調整ができたら、HieralchyビューのMainCameraを選択する
3. MainCameraを選択した状態で、メニューバーからGameObjectを開き、Align With Viewを選択する
4. MainCameraが視点の位置に移動するので、さらに細かい調整は画面右側のInspectorウィンドウのTransformからPositionやRotationの値で行う
5. 画面上部の中央にあるPlayボタンを押す
6. ビューがGameビューに切り替わり、VRMモデルが踊る！

VRMモデルとモーションデータの接続に成功したので、あとはステージアセットと音楽データをインポートして設定すれば、良い感じにパリピ孔明のOPのように踊ってくれるはずですが、今回はここまで。お疲れさまでした。

7.おまけ

友人「ここまで出来たらあとはクロマキーで動画作るから大丈夫！」

8.おまけのおまけ

Unityでグリーンバックにする方法

1. HieralchyウィンドウでMainCameraを選択する
2. InspectorウィンドウでClear FlagsをSkyboxからSolid colorに変更する
3. Backgroundの色をグリーンに変更する（グリーンだとクロマキーで抜けない人は他の色で）
   

Unityでの動画撮影方法

1. メニューバーからWindowを開き、Package Managerを開く

2. Package Managerの検索窓にRecorderと入力する

3. Recoderが表示されたらInstallを押す
   

4. インストールが終わったら、メニューバーからWindowを開き、General>Recorder>Recorder Windowを開く（左図）

5. Recorder WindowのAdd Recorderを押し、Movieを選択する（中央図）

6. Output Resolution(出力時の解像度）、Media File Format(ファイル形式）、Quality（動画品質）を選ぶ（右図）

7. File Name（ファイル名）、Path（出力する場所）を選択する

8. 画面左上のPlayボタンを押すとGameビューに切り替わり、動画撮影が始まる

9. もう一度Playボタンを押すと動画撮影が終わる（Gameビューは動き続けるので別に止める必要がある）

OBSでクロマキー合成する方法
Unityに慣れている人は「クロマキーでやらなくてもUnityでやれば良いのでは🤔」となりそうですが、これはこれで救われる命があるかもしれないので書き残しておきます

1. OBSの画面左下、ソースの＋ボタンを押してメディアソースを選択、グリーンバックで撮影した動画を追加する

2.メディアソースを右クリックし、フィルタを選択する（左図）
3.フィルタの選択画面から左下の＋ボタンを押してクロマキーを追加する（中央図）
4.クロマキーの設定画面で、背景が透過されるように設定する（右図）
5.設定できたらウィンドウを閉じる

6.ソースの＋ボタンを押して画像を選択、背景にする画像を追加する（左図）
7.画像がメディアソースより下にくるようにドラッグ＆ドロップする（右図）
　※参考画像で背景として設定したのは知り合いのグラボが壊れたときのモニタ画面です（ちょうどいい画像がなかった）
これでクロマキー合成動画の準備はOK

8.設定から録画の設定を行う。出力先や品質、フォーマットなどはお好みで。（左図）
9.設定が終わったら、録画開始ボタンとメディアソースの再生ボタンを押して録画を行う（右図）
10.動画の再生が終わったら、録画を終了する
あとは動画編集ソフトで音楽データと合わせたり、同様の手順で他のカメラアングルで作った動画と繋ぐなどして完成

おまけのおまけまで読んでいただきありがとうございます。
Unityをもっと使えるようになれば、色々とできることが増えそうなので今後も勉強していきます。