
前回のPrjを引き継いで編集していきます。
ダンスアニメーションには口パクブレンドシェイプが入っていない
前回動画をみて分かるとおり「僕らのミライ」ダンスモーションにはLipSync口パク、表情が付属していません。
いくつか理由があります。
- ブレンドシェイプ名は統一されておらずアバター毎にバラバラ
- アニメーションクリップ(ASCII .anim)はファイルサイズが大きすぎる
- HumaroidアニメーションクリップをバイナリFBX(ファイルサイズ小さい)に変換できるツールは、現状UMotion Pro($70)のみ。
- しかしUMotion Proであってもブレンドシェイプ込みのFBX Exportには対応していない。
結局、ダンスアニメーションはFBXから読み出してniwako-v01アバターで再生、口パクのブレンドシェイプはbodyオブジェクト(ブレンドシェイプが入っている)にもう一つAnimatorをつけて平行再生する、という方針が良さそうです。
LipSyncツール
今回はuLipSyncを使います。OculusのOVR LipSyncが有名ですがOVR LipSync+Unity Animation Recorderで口パクブレンドシェイプを録画すると一曲900MBと非常に大きなファイルになってしまいました。よりコンパクトにファイルサイズ制御可能なuLipSyncをを選択します。
uLipSyncのGithubサイトからunitypackageをダウンロードして、前回のPrjにimportします。
PhisBoneのniwako-v01の方は非アクティブにして、niwako-v01_DBのみ扱っていきます。

uLipSync セットアップ
下記サイトを参考にします。
GitHubから最新版uLipSyncを入手し、importしておきます。
Audioソース+LipSyncオブジェクトを作ります。Hierarchyのトップで右クリックし、Create EmptyからGame Objectを作ってください。それをRenameしてobj-Audio-LipSyncとします。そしてAssets/Dataフォルダの音楽ファイル「M09_僕らのミライへ_VocalOnly」をobj-Audio-LipSyncへDrag&Dropしてください。再生ボタンをおして歌声だけが再生されるか確認しましょう。obj-Audio-LipSyncの位置が顔にかかっていたら見にくいので適当に上下に移動しましょう。

uLipSyncをobj-Audio-LipSyncにAdd Componentしていきます。

Profileには「uLipSync-Profile-UityChan」を選んでおきます。だいたいこれでうまく認識してくれます。
次は口パクブレンドシェイプ(v_aaなど)が登録されているオブジェクトを選びます。niwako v01.01ではbodyオブジェクト(次のバージョンではMMD口パク対応のためBodyに変更予定)です。

bodyオブジェクトにU Lip Sync Blend Shape (Script)をAdd Componentします。
「・・・(縦並び)」からMove upを選択して上に移動させます。

U Lip Sync Blend Shape (Script)をSkinned Mesh Rendererより上に配置してください。

Skinned Mesh Redererにniwako-v01_DBの方のbodyオブジェクトを設定します。水色のcubeアイコンはプレファブをあらわしていてniwako-v01側です。黒いcubeのbodyを選びましょう。(青いcubeしかない場合は、Hierarchy中のアバターPrefabをUnpakすると黒いcubeになります)

Phenome – BlendShape Tableの「+」を押して、A, I, U, E, O, N, – と対応する庭子のブレンドシェイプを登録していきます。Nは「ん」ですので、ここではv_silをあてました。-はノイズ音対応なのでNoneです。

次にobj-Audio-LipSyncのU Lip Sync(Script)とbodyのU Lip Sync Blend Shape(Script)を接続します。
obj-Audio-LipSyncを選択します。
U Lip Sync(Script)のOn Lip Sync Update(LipSyncInfo)の「+」を押して、niwako-v01_DBのbodyをDrag&Dropします。

No Function を押し、uLipSyncBlendShape→OnLipSyncUpdate を選びます。

これで二つのuLipSyncモジュールが繋がりました。
リアルタイムLipSync
これでリアルタイムLipSyncします。再生ボタンを押してみてください。
非常に簡単で感動します。uLipSyncはとても素晴らしいです。OVR LipSyncはもっと苦労しました。
ベイク
次にベイクして、アニメーションクリップを作っていきましょう。
Window→uLipSync→Baked Data Generator を選択します。

下記ウィンドウが表示されます。
Profileは「uLipSync-Profile-UityChan」。Audio Clips の Size を1にして、Element 0に「M09_僕らのミライへ_VocalOnly」を選択。OutputはAssts/Baked というフォルダを作ってそれを指定。最後にGenerateボタンを押してください。

時計マークも何も表示されず少し不安ですが待ちましょう。
Assets/BakedフォルダにBakedファイルが生成されます。

これを先ほどのようにLipSync再生することも可能ですが、ここでは取り回し安いようにUnityのAnimation Clipに変換します。
前準備としてブレンドシェイプの入っているbodyオブジェクトにAnimatorをAdd Compomenntしておきます。

最終的に、niwako-v01アバターのAnimatorでダンスモーションを、bodyのAnimatorで口パクを再生することになります。
Window→uLipSync→Animation Clip Generatorを選択してください。

ウィンドウが立ち上がりますので、下記のように入力します。
Animatorは先ほど作成したbodyのAnimatorを指定しますので「body」を選択。このAnimatorのためのブレンドシェイプ・アニメーションクリップが作成されます。
Anim BakeにもuLipSyncBlendShapeが入っている、先ほどと同じbodyオブジェクトを指定します。
Baked Data Listをクリックして中身を表示し、Sizeを1にします。Element 0には先ほど作成したBaked Dataである「M09_僕らのミライへ_VocalOnly」を選択します。
Sample Frame Rateの初期値は60fpsですが、今回はダンスモーションと一緒に使用する口パクなので、多少粗くても問題ありません。データ量削減のために15fpsとします。
Thresholdも多少粗くて問題ありません。初期値:0が高品質ですが、データ量多くなり取り回しもしにくくなります。30%くらい変化したら記録するという意味で0.3くらいにしておきます。0.5でも十分見れるでしょう。
Output Directoryは先ほどと同じAssets/Bakedフォルダを指定します。
最後にGenerateボタンを押してください。

ほぼ一瞬で、2MBくらいのAnimation Clipファイルができあがります。

ではタイムライン・オブジェクトを作って再生してみましょう。
口パク再生
Assetsフォルダ直下に右クリック→Createからタイムラインを作っておきます。名前はそのまま「TimeLine」とします。

Hierarchyのルートで右クリック→Create Emptyで新しいGameObjectを作って。Renameでobj-TimeLineとします。それに先ほど作ったAssetaのしたのTimeLineをDrag&Dropします。

★★重要ポイントです。
最初に作っVoice Onlyの音をならしてリアルタイムLipSync行うobj-Audio-LipSyncをdisable(非アクティブ)にしておきます。そしてbodyの中のU Lip Sync Blend Shape (Script)をdisableにしておきます。これをdisableしておかないとbodyのAnimatorが口パク再生してくれません。

AssetsフォルダのTimeLineをダブルクリックするとタイムラインチャートが表示されるので、下側などの同時に見れるところに置いておきましょう。

タイムラインで口パク再生させる手順は下記の通りです。
①:obj-TimeLineをクリック選択して、対応するタイムラインウィンドウを表示させます
②:Assets/Bakedにある三角マークのアニメーションクリップファイル「M09_僕らのミライへ_VocalOnly」をタイムラインウィンドウ左側にDrag&Dropします。
③:AnimatorがNoneになっているので、Hierarchyからniwako-v01のbodyをDrag&Dropします。
これで再生ボタンをしてください。口パク再生されるはずです。

次に音楽を合わせていきます。
Assets/Dataフォルダにある音楽付きの「M01_僕らのミライ」をタイムライン左側にDrag&Dropします。Audio SourceはNoneのままでOKです。再生ボタンを押してみましょう。
音楽、歌付きで口パク再生されます。

ダンス・口パク・音楽付きで再生
最後にダンスも合わせます。
①:Asseta/DataフォルダのFBX:bokuranomiraie_danceに入っている三角マークのアニメーションクリップbokuranomiraie_danceをタイムライン左側にDrag&Dropします。
②:AnimatorとしてDynamic Bone版のniwako-v01_DBをDrag&Dropします。
③:タイムラインのダンスアニメーション・クリップが選択された状態で、InspectorのClip Inを「4」にします。ダンスアニメーションには最初の4秒間予備動作が入っているので4秒後から始まるように設定します。

これで再生ボタンを押すと歌音楽・口パク・ダンス総合して再生されます。これをunitypackage化することで、VRChatワールドに歌って踊っている庭子アバターを設置することが可能になります。
目の表情を簡単に入れたい場合は、「あ」のブレンドシェイプである v_aa を eye_close + v_aa のブレンドシェイプを新しく作って置き換えると、それなりに見えます。