Unityだけで3Dアニメーションを作ろう！

#初めに
　この記事は「[Unityアセット真夏のアドベントカレンダー 2020](http://assetstore.info/eventandcontest/adventcalendar/summer-advent-calendar-2020/)」の31日目最終日の記事になります
　昨日の記事はVR発掘隊さんの[VR発掘隊さん](https://mobile.twitter.com/VR51054377)の「[unityアセット Gaia2の機能まとめてみる！](https://qiita.com/VRhaltukututai/items/1a98c56d2d9c22a3c24c)」でした。
　この記事は**[VeryAnimation](https://assetstore.unity.com/packages/tools/animation/very-animation-96826?utm_source=twitter&utm_medium=social&utm_campaign=jp-advent-calendar-summer)**について解説いたします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/1b824571-7015-5b34-d589-a782a3cb5542.png)
　記事の内容は、**簡単にアニメーションを作りながら機能の解説をする前半部分**と、**良く使う設定画面の説明を後半部分**でしています。
　前半では、このような階段を上るアニメーションを作成します。
![gif_animation_00620h59m.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/9698b1b6-e028-e79c-ff85-fd8344cba6a3.gif)
　また、実際に始める前に[公式チュートリアル](https://www.youtube.com/playlist?list=PLk2zFKUFoq3kqPz9pGIKRrExhM9qdLMGI)を見ておくと理解が早くなります。
　特に最初の[QuickStart](https://youtu.be/rkCYVfA4yaU)はこの記事を読む前に一度視聴をして下さい。動画形式で基礎的な部分のほとんどを知る事が出来ます。
　この記事には[QuickStart]に無い部分や偶に陥ってしまう問題についても解説していますので、動画と一緒にこの記事も合わせて読んでいただき、読者のアニメーション制作第一歩となれば幸いです。
　VeryAnimation公式チュートリアル動画は音声は無く日本語字幕で説明が行われています。Youtubeの設定から字幕を日本語にして視聴しましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/0750ec47-bab7-877d-7ea8-3d915d1b847f.png)
#アニメーション作成
##環境
　使用した各環境のバージョンは以下の通りです。
・Unity　　　　　　 　2019.4.2f1
・[Unity-Chan! Model](https://assetstore.unity.com/packages/3d/characters/unity-chan-model-18705) 　1.2.2
・[VeryAnimation](https://assetstore.unity.com/packages/tools/animation/very-animation-96826?aid=1011lGot&utm_source=aff) 　　　1.2.7
##目指すアニメーション
　今回作るアニメーションを振り返りましょう。
　![gif_animation_00620h59m.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/9698b1b6-e028-e79c-ff85-fd8344cba6a3.gif)
　足がしっかり接地しつつ、重心が移動しながら階段を上る2秒ほどのアニメーションです。
##オブジェクトの設置
　まずは、アニメーションを作る前にオブジェクトを設置していきます。画像のようにユニティちゃんを設置し、PlaneとCubeを2つ作成します。床は高さ0の位置に設置し、Cube2つで階段を作ります。階段はユニティちゃんが届く範囲になるようにある程度近くに配置してください。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/f421707a-fdce-c140-754f-56071b98aa01.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/40373ef4-6820-c0d0-2691-d7c18e9d7906.png)
##アニメーション作成・解説
　それではアニメーション作成に移っていきます。
　[Window]タブから[Very Animation/Main]を選択し、[VAEditor]ウィンドウを開きます。このボタンはVeryAnimationが入っていないと出てきません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/b954596a-68fd-a320-fe79-016fb83688e2.png)

　[VAEditor]ウィンドウを開くと同時に[VA Control]、[VeryAnimation]、[Animator]、[VAEditor]が開き、下の画像ような画面になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/97455512-ee08-22f8-03e9-4dc89f612911.png)
　次にAnimationウィンドウから赤枠で囲ったところをクリックし、[Create New Clip]を押して新しくAnimationClipを作成します。
　今回は「ClimbTheStairs」と命名しました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/1abd3fae-9dde-7f69-c1cc-6d4e36d888ec.png)
　最初のポーズが膝や肘が曲がっている状態なので[VAEditor]ウィンドウ[POSE]タブから[T-POSE]を選択し、ポーズをリセットします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/c8d236c5-a19b-bdc4-d632-bf6b4b58b98f.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/ce20a7b4-fa54-4a4b-fa8b-833d18ac0b8e.png)
　TポーズにリセットするとVeryAnimationウィンドウに警告とエラーが出てきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/819888ad-6bf1-9805-5af6-58399c8e550e.png)
　これらはAnimationClipのInspector画面でを下の画像のように変更すると消えます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/79abaa82-472f-e49c-6fd1-9898a86d0164.png)
　最後にFootIKを設定します。これは後々に足をしっかりと接地させるために必要となります。
　ユニティちゃんのAnimatorにアタッチされているUnityChanARPoseを開いて今回作成したAnimationClipの「ClimbTheStairs」を選択し、Hierarcyから[FootIK]にチェックを入れます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/5e4a6043-8c4c-2b0d-0cf6-dcacbd2b665e.png)
　さて、ようやくTポーズの状態でアニメーション作成に入る事が出来るところまで来ました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/d04f6ba0-983e-684a-bfb5-edb5ea753857.png)

###初期ポーズ（0.0s）

　まずはアニメーション開始時のポーズを作成しましょう。
　もし、操作が分からない部分があれば公式チュートリアルも合わせて確認してみてください。
　開始時のポーズでは、肩を回転させて腕を下に下げるのと、指の形を微調整します。
　肩はユニティちゃんの方付近にある丸いアイコンを選択し、回転させることで腕の角度を操作できます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/1d5008b5-adc5-6949-8fbb-fcb278d29e60.png)
　指は[VAEditor]の[Muscle Group]で調整をするとスムーズにできます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/14dfc8e4-5fc4-41a5-03e8-43175e63a988.png)
　肩と指の調整が終わり、初期ポーズが出来ました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/fe555d36-02bb-a065-3b4a-bfb748230266.png)

###右足を上げるポーズ（0.3）

　次にAnimationウィンドウから0.3の位置にバーを動かしてキーを書き込む時間を設定します。この0.3というのは1秒間に60フレームの中で、30フレーム目という意味です。つまりアニメーション開始から0.5秒後となります。
　それでは足を上げるポーズを作りましょう。
　足を上げるポーズはVAControlウィンドウで該当の位置のIKにチェックを設定するとIKで動かす事が出来ます。これによって関節の角度を設定しなくても足自体を動かすと自動で関節の角度を計算してくれるので、スムーズに操作できます。
　動かしたのは右足のIKの位置のみです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/33dd1baf-92ed-faed-375c-cbd828fd6150.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/5298f5f5-2cd0-c25e-8a49-5bfb92b41759.png)
　実際に足を上げているポーズは下の画像のような形です。時間は0.3の位置にバーを動かして設定します。
　赤く見えているのは以前までのポーズで、滑らかなアニメーションを作る参考に出来ます。この設定は[VeryAnimation]ウィンドウの[Setting/Onion Skinning]から出来ます。
　今回動かしたのは右足のIKと腰の近くにあるルート（モデルの親の位置、全身に影響がある）の位置の2つです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/f1489e19-2113-e006-0177-72bdada6da21.png)
　ルートはお腹にある二重丸で表されているアイコンを選択し変更します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/d7a23a56-6835-9e87-1508-95f8055481a0.png)

###右足の着地ポーズ（0.4）

　次は足の着地時のポーズです。時間は0.4の位置にバーを動かして設定します。
　この着地時のポーズの作成中はVAEditorのCollisionを設定しておきましょう。足がオブジェクトに触れた際に止まるようになります。
　動かしたのは右足のIKとルートの位置の2つです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/f3b3b7bb-0119-e3ef-f567-e8773902f9b8.png)

###左足を上げるポーズ（0.55）

　次は左足を上げる時のポーズです。時間は0.55の位置にバーを動かして設定します。
　左足を上げて2段目にまで移動させるのですが移動距離が長いため、一度の移動で動かしてしまうと直線的な動きとなってしまい、違和感が出てきます。そのため足が交差した1テンポ後で、左足が一番高くなるタイミングでキーを打ちます。
　左足のIKとルートの位置の2つのみを動かしています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/92c9e68c-52d3-85a9-d7f4-c3b5bd50e304.png)

###左足の着地ポーズ（1.1）

　ついに2段目まで来ました！次は左足を2段目に着地させるポーズです。時間は1.1の位置にバーを動かして設定します。
　ここでも1段目の右足と同様にポーズの作成中はVAEditorのCollisionを設定しておきましょう。
　左足のIKとルートの位置の2つのみを動かしています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/58979a67-b112-5ae3-f766-48bf722648f3.png)

###右足を上げるポーズ（1.3）

　それでは次は右足を2段目まで持って行きましょう。時間は1.3の位置にバーを動かして設定します。
　左足と同じく、着地前の一番高い位置で1回キーを打ちます。
　右足のIKとルートの位置の2つのみを動かしています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/ae8ff90e-bcfb-427d-63aa-e6d97b09aee9.png)

###右足の着地ポーズ（1.4）

　次に右足が2段目に着地時のポーズです。時間は1.4の位置にバーを動かして設定します。
　ここでも同様に、ポーズの作成中はVAEditorのCollisionを設定しておきましょう。
　右足のIKとルートの位置の2つのみを動かしています。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/2015c3a9-9a39-8f55-a093-ecea5a65609d.png)

###待機ポーズ（2.0）
　それでは最後にこのポーズを少し維持しましょう。ポーズは右足の着地ポーズと変わりません。[VAEditor]の[QuickSave]で[1]を押し、右足の着地ポーズをセーブします。その後、時間を2.0の位置にバーを動かして設定し、[Quickload]の[1]を押してポーズをコピーします。
　これで待機ポーズは完成です。

　それでは作成したアニメーションを振り返ってみましょう。
　このようにユニティちゃんが階段を上っているアニメーションが出来ました！
![gif_animation_00519h58m.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/77f0ee55-7f73-e59e-da2c-b0861bcfc22a.gif)
　しかしよく見ると、足が揺れてしまっています。
　これでは完成とは言えないため、修正していきましょう！
### FootIKの修正
　この状態を修正するには[Very Animation]ウィンドウの[Tool]にあるタブから[Humanoid IK]を選択し設定画面を表示します。[Foot IK]にチェックをいれ[Generate]ボタンを押してください。これによって作成したキーとキーの間が補完され、足が揺れなくなります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/59e9eca6-4ef1-c2ab-2e1d-33f7c71e429e.png)
それでは再度アニメーションを見て見ましょう。足に注目してください。
![gif_animation_00620h59m.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/71401909-c495-ebed-77ce-2b99f9708874.gif)
しっかりと揺れずに階段に設置しているのが確認できます。
　いかがだったでしょうか。両肩と左右の足IKとルートの計5カ所を触るだけで階段を上るアニメーションが出来ました。
　VeryAnimationを用いれば他の関節や髪の毛、表情もアニメーションさせてクォリティをさらに上げる事が出来ます。
　このVeryAnimationは自分の欲しいアニメーションが見つからない方や、アニメーションを作りたい方、既存のアニメーションに変化を加えたい方などに非常にお勧めです。是非触ってみて下さい！
#付録
　[VAEditor]の上部にある各設定について解説します。
　どれも非常に重要で会ったり便利な項目ですので、知っておいて損はありません。
##Option
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/d6f55c66-507b-9f63-c43d-473ed82a4e64.png)
###Clamp
　Muscleの値を-1~1の間に制限します。
　Clampを設定すると関節が制限され、異常な角度にならなくなります。
　下の画像は左がClampを設定して腰を限界まで回した画像で、右がClampの設定を解除した結果腰が360度回るようになってしまった画像です。
　Clampを設定しなくとも気を付けていれば人体の許容内に収める事は可能ですが、しっかりとClampを設定しておくことで気兼ねなく関節を曲げる事が出来ます。基本的に設定しておきましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/9dd200f9-dcc4-c8b5-853e-0bb84b6d8f67.png)
###Foot IK
　FootIK情報を自動的に更新します。
　FootIKは異なるモデルのアニメーションを適応した時や、足がその場で設置せずに微細に動いてしまう現象に対応し、設置した足をしっかりと動かないようにします。
###Mirror
　左右のミラーでの編集を行います。
　ミラーを設定する事でアニメーション編集が左右対称になります。
　左右対称になるのは選択中の部分だけで、子や親のボーンは変わりません。
###Collision
　編集中のアニメーションに衝突判定を持たせる事が出来ます。
　例えば段差がある床に足をかける時にこのCollision設定を行う事で、段差の中に足が沈まずに接地して止まるようになります。重い処理ですので、必要な時に設定するのが良いでしょう。
 下の画像では、Collision設定をしていない左は段差を貫通していますが、Collision設定をしている右は段差に衝突してそれ以上下に貫通していかない様子が分かります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/16bf68c0-3d33-8820-c8d6-9bda8b30d1ce.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/5bf979ea-f605-db64-4803-37cf2d5c866d.png)
###Root Correction
　関節などを変更したときに、全身が動いてしまわないようにRootを自動補正する機能です。
　[Disable]の場合はこの機能を使用しないため、腰だけ曲げているにもかかわらず下の図.TODOのように下半身まで動いてしまっています。[Single]と[Full]にすると図.TODOのように腰だけが動いており、他の部分には影響がないことが分かります。
　[Single]と[Full]の違いはキーの影響範囲です。[Single]は現在の1つのキーのみに影響しますが、[Full]はアニメーション全体に影響します。[Full]にすると毎フレームにキーが打たれてしまうため、基本的には[Single]にしておくと良いでしょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/3fb6f52b-dc9e-e565-6bce-2a6309c8b2ee.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/abd49559-23bd-3895-24c8-8b0b08736496.png)
##Pose
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/beae9a3c-ac2c-a5cf-73b4-67c7df477499.png)
###Reset
 ポーズをリセットします。
　新たにAnimationCLipを作成した際には「Humanoid Default-Pose」に近い状態になっています。基本的に新しくアニメーションを作成する際は「T-Pose」を選択してリセットすると良いでしょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/fe16ae93-925c-b8e4-7fab-9369f5b7ec7d.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/bc63117a-4ae8-c45f-f99b-97217d33831e.png)
###Mirror
　現在のポーズを左右反転したポーズにします。
　最上段にも「Mirror」がありますが、機能が違います。こちらは**全身を左右を反転します。**選択した部分だけではないため、注意してください。
###TemplateとSave as
　ポーズをセーブしたテンプレートポーズに変更します。
　現在のポーズを「Save as」ボタンでフォルダにセーブを行い、「Template」ボタンからロードして現在のポーズを変更する事が出来ます。
　よく使うポーズ等を保存しておくと時間短縮をする事ができる項目です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/b5363d34-c2c9-8e3e-d5ec-73ff0d42d92e.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/393006/e27c8110-9be1-95a8-c7d2-a296dcffbd3c.png)
###Quick LoadとQuick Save
　「Template」と「Save as」に似ていますがこちらは手軽にセーブとロードが出来きます。「Quick Save」の[1]~[3]を押すと現在のポーズが保存され、「Quick Load」の[1]~[3]を押すと現在のポーズが番号に対応したポーズに変更されます。
ただ、VeryAnimationのエディターウィンドウを閉じるとセーブしたポーズが消えてしまうため、使う時は注意して使いましょう。


#まとめ
**[VeryAnimation](https://assetstore.unity.com/packages/tools/animation/very-animation-96826?utm_source=twitter&utm_medium=social&utm_campaign=jp-advent-calendar-summer)**は
・豊富な機能
・少ない手順
・簡単にアニメーションが出来る
・日本語で書かれた公式チュートリアル動画
といった状態で、非常に初心者に優しい環境になっています。
自分でアニメーションを作ってみたい方や既存のアニメーションを編集したい方等に非常にお勧めです。
是非**[VeryAnimation](https://assetstore.unity.com/packages/tools/animation/very-animation-96826?utm_source=twitter&utm_medium=social&utm_campaign=jp-advent-calendar-summer)**を使って自分の手でオリジナルアニメーションを作ってみて下さい。