第5回 ユニティちゃんを笑顔にしよう ~アニメーションオーバーライド表情実装編~
今回からはVRchatの重要ギミック、アニメーションオーバーライドについて説明していきます
第4回でついに口が連動するようになりましたね。
口も大事ですが顔全体で気持ちを伝えてあげるとより深いコミュニケーションをとることができます。
「目は口ほどにモノを言う」なんて言葉もあるくらいですからね、そんなわけで今回は表情実装編です。
第5回はこんな流れで進めていきますよ
~STEP1.ユニティちゃんの表情を確認しよう~
第4回で口の形を確認したように今回も表情のパターンを確認しておきましょう。
表情を実装するときに必要な顔のパーツはEYE_DEF(両目),BLW_DEF(眉毛),EL_DEF(まつ毛)の三種類です。
三種類とも七種類の表情シェイプキーが既に作られています。
口の時と同じようにBlendShapesの値を変化させて表情を確認しましょう。
三種類のSMILE1の値を100にすると満面の笑顔を見せてくれます。
SMILE1の値を50にすると何やら怪しげな半笑いになりました。このように値を変化させることで笑顔一つでもかなりのバリエーションを作ることができます。
さらに表情は複数のシェイプキーを組み合わせることで無数の表情を作り出すことができます。
画像はSMILE2の値を50,ANG1の値を100に設定したものです。
ちょっとムッとしたような表情になりました。
ANG1のみを100にした場合はもっと怒りの成分が強くなります。
このように七種類ある表情を組み合わせて自分好みの表情を作りましょう。
今回はシンプルにSMILE1を100にした表情を実装していきます。
~STEP2.自分だけの表情アニメーションを作ろう~
気に入った表情が決まったらその表情をアニメーションファイルに設定しましょう。
メニュー欄のWindowからAnimationをクリックします、Animatorと間違えないようにしましょう。
Animationウィンドウが出てきました。この状態ではアバターにアニメーションファイルを作ることはできません。
HierarchyかSceneからユニティちゃんを選択しましょう。
AnimationウィンドウにCreateが出てきましたね、これでユニティちゃんにアニメーションを作ることができます。
Createをクリックすると新規のアニメーションファイルが作成されます。名前を付けてわかりやすいところに保存しましょう。
今回はUnityChanの中にあるAnimationsに保存します。
それではアニメーションを作っていきましょう。
作り方は簡単で左上にある録画マーク(赤丸)のアイコンをクリックして気に入った表情の値を打ち込むだけです。
ユニティちゃんが急に中腰に!?
安心してください、unityの仕様でアニメーションを作ると強制的に中腰ポーズになってしまうのです。
後でTポーズに戻す方法も説明するのでまずはこのまま進めていきましょう。
~追記~
解説していた方法がunity2017では対応していないので第18回のSTEP1.で改めて解説しました。(2019/1/17)
~追記終わり~
ここは少しだけ流れが複雑なので箇条書きにします
1.録画アイコンが押された状態でHierarchyの目、眉毛、まつ毛のいずれかを選択します。
2.Inspecterからシェイプキーを気に入った表情の値に変化させます。
3.するとAnimationウィンドウに変化したシェイプキーの値が反映されます。
以上の手順を繰り返し目、眉毛、まつ毛の表情シェイプキーをウィンドウに反映させます。
これで表情のアニメーションは完成です。録画マークのアイコンをもう一度クリックして録画モードを終了させましょう。
これで表情は完成…なのですが手が平手に固定されてしまいます。
ピースする指の形のアニメーションも設定しておきましょう。
もっと効率のいい指のアニメーション追加を追記しました、追記はこちらから
指のアニメーションは表情のように録画マークで反映させるのではなく、Add Propertyでウィンドウに追加していきましょう。
Add Propertyをクリックすると複数の項目が出てくるのでAnimatorを選択してください。
Animatorの中には体の各部を動かすアニメーションが入っています。
右手の指を動かすアニメーション、right Handを探してください。
名前の横にある+マークをクリックすることでウィンドウに反映されます。
指の関節三つ分、他の指との間隔調整の合計四つのアニメーションで指一本分になります。
これを五本分反映させていきましょう。
五本分反映した画像がこちらになります。
これは右手だけの設定ですが本来であれば左手の設定も追加してあげる必要があるためさらに倍の数反映させる必要があります。
根気よくやっていきましょう。
~追記~
VRCSDKの中にあるAnimationから指のアニメーションをコピーできることを教えていただきました!
指の形以外の不要なアニメーションも入っているので使わないアニメーションは削除してしまいましょう。
VRCSDK内にあるアニメーションはRead onlyで編集できないためCtrl+Dで複製したものを編集しましょう。
複製したアニメーションの適用方法は第6回の~STEP3.アニメーションファイルを複製、改変して実装しよう~を参考に進めてください。
~追記おしまい~
指のアニメーションはシェイプキーのように数値を変化させることで調整が可能です。
Sceneのユニティちゃんに直接数値の変化が反映されるため見ながら調整していきましょう。
ただし100ではなく1でかなり大きく影響を受けるので調整するときの値は小さめで大丈夫です。
画像はピースサインを作った時の数値設定です。
指の形が完成したらアニメーションのコマを一つ増やしましょう。
一番上のコマをクリックすると全てのアニメーションが選択されるので一つ隣の0.01の軸にコマを移動させます。
そのあとに赤枠で囲まれているマークをクリックすると0.00の軸にコマが追加されます。
これで「0.01秒間設定したアニメーションを再生する」設定ができました。
この作業を忘れると表情が高速で繰り返されて軽いホラーになってしまうので忘れずコマを増やしておきましょう。
これで表情アニメーション(右手ピース付き)が完成です。
無事アニメーションファイルが完成したので中腰ポーズからTポーズに戻しておきましょう。
まず録画マークをクリックします。
次に中央上側の再生マークボタンをクリックします。
するとunity全体がやや暗めな色合いになります。
暗めな色合いになったらもう一度再生マークのボタンをクリックします。
すると録画モードは終了し、ユニティちゃんはTポーズに戻ります。
~STEP3.表情アニメーションを実装しよう~
最後に今回作った表情アニメーションをアバターに実装させましょう。
VRCSDKのの中にあるAnimationからCustom OverrideemptyをCtrl+Dでコピーして名前を変更、otameshiと名前を変更させましょう。
このotameshiはアニメーションコントローラー、つまり
「あのアクションをとったらこのアニメーションファイルを実行する」という各操作に対するアニメーションをまとめているファイルです。
アニメーションコントローラーは指の動きだけでなく後ろ歩きや前歩きなど細かいアクションに対しても設定することができます。
基本的にアニメーションは手に仕込むことになると思います。
画像で囲まれている手に関するアクションにアニメーションを設定していきましょう。
今回はVICTORY(ピースサイン)のアクションを起こしたときに笑顔(と右手ピース)を設定します。
ここまで設定が終わったらアバターにアニメーションコントローラーを設定しましょう。
通常ではnoneになっています。
また、StandingとSittingで別のアニメーションコントローラーが設定できますからアニメーションコントローラーをもう一つ用意すれば幅広い表現ができそうですね。
今回は素直に両方ともotameshiを設定します。
ここまで設定したらアバターをアップロードして表情が実装されているか確認してみましょう。
ちゃんと右手をピースして笑顔になってくれていますね、表情の実装成功です!
次回はアニメーションオーバーライド第2弾、アイテムの取り出し方を説明していきます。