Unity　2Dキャラクターアニメーション勉強 1

前回に引き続きUnityでアニメーションの勉強をしていこうと思う。
今回は2Dアニメーションの勉強をしていこうと思う。

２Dアニメーションの勉強をしようと思った理由

なぜ２Dのアニメーションを勉強したいかというと、いまのところ絶賛頓挫しているYoutubeを使ったアニメゲームの製作につかえるかなと思ったこと、今後他のゲームを作る時にいつかは必要になるだろうということからだ。

教材にえらんだのがこちら

わかりやすくて面白かったので、この動画の内容を記載しつつ理解を深めてみようと思う。

Unitiで２Dアニメーションを始めるには

Universal Render Pipelineと2Dどちらを選ぶか

まずはUnity Hubで選ぶテンプレ―トは「２D」が良いとのこと。
「Universal Render Pipeline」よりも、便利な機能がすでにそろっている「2D」の方がお得なのだとか。

始めの設定

プロジェクトを作成したら、パッケージマネージャーから「Universal RP」をインストール。

アセットの中で右クリックして
作成 / レンダリング / Universal Render Pipeline / PipeLine Render Forward Renderer
を選ぶと
UniversalRenderPipelineAssetとUniversalRenderPipelineAsset_Rendererの二つのファイルができる。さらに、
作成 / レンダリング / Universal Render Pipeline / 2D Rendere (Experimental)
を選ぶと、
New 2D Renderer Dataが作成される。
UniversalRenderPipelineAssetのインスペクター内、一般 / レンダラーリストに、New 2D Renderer Dataをアタッチする。

さらにProject Setting / グラフィックス
内の「スクリプタブルレンダーパイプライン設定」に
UniversalRenderPipelineAsset
をアタッチする。

これで、URPを２Dで使う準備ができたとのこと。


Unity 2D Animation

Unityのアニメーションには
スプライトアニメーション
スケルタルアニメーション
の２種類、小分類あわせると３種類ある。

スプライトアニメーション

ぱらぱらアニメーションのような仕組みでアニメーションを作成すること。

スケルタルアニメーション

  • スプライトのローテーション

スプライトにピボットを作ってそこを支点にして動かす
味気ない動きになってしまう欠点がある

  • ボーンによるメッシュのでフォーム

ボーンに追従する頂点を動かす。自然な動きが実現できる反面、大きく動かすと破綻しやすいとのこと。

Unity 2D Animationは上記の３つの機能を全て使うことができるとのこと。

2D PSD Importerでの読み込み

素材の作成と準備

Photoshop等のソフトで、各パーツ毎にレイヤーに分かれたファイルを作成
f:id:kazhase:20220115113849p:plain

各パーツ毎に見やすく並べるとこんな感じ
※Unityにインポートする際は、このように本来の表示したい位置から動かさない方が良い
f:id:kazhase:20220115113859p:plain

2D PSD Importer

2D PSD Importerは一見.psdファイルを読み込めるのかと思いきや
Photoshopビッグファイル（PSB）での読み込みにしか対応していないとのこと。
講師の方はPhotoshop以外でビッグファイルでの書き出しできるソフトがあまりないとのことだったが、自分がお絵描きにいつも使用しているClip Paint Studioは対応していた。

Photoshopビッグファイル（PSB）ファイルの取り込み

UnityへのPSBファイルの取り込み方は、他の画像の取り込み方と同じ。
自分はUnityのアセットウィンドウにポイっと入れたら早速読み込みできた。

インスペクターのCharacter Rigにチェックが入っていることを確認。
Sprite Editorをポチっとすると、Sprite Editorが立ち上がる。
f:id:kazhase:20220115114759p:plain
※勝手にレイヤー毎に読み込んでくれた。これは便利！


Skinning Editor

読み込み～Boneの設定

左上のSprite EditorのプルダウンからSkinning Editorを選択。
元のファイルの通りの、パーツ配置の画面になった。
f:id:kazhase:20220115115654p:plain

右上の「可視性」のボタンを押して操作パネルを出す。
スプライトを選択して、重なって見えている部分のパーツを非表示にする。
左側の操作パネルのCreate Boneを選択して、股下から各パーツ事にBoneを作成していく。
※親子関係を考えながらBoneを設定することにより、体をねじると、腕がついてくるなど連動して動かすことができる。

Boneの作成が完了したら、右側のパネルのBoneタブを選び、各Boneに名前をつけていく。
f:id:kazhase:20220115130359p:plain

ジオメトリ（ウェイト）の設定

Sprite Editor内左側のパネルの、Auto Geometryを選び、右側のパネルの一番下
何も選択していなければ「Generate For All Visible」を押す。
すると体全体にGeometryが自動で設定される。
なお、複数パーツある部位の場合、全てのパーツにジオメトリを設定しないとダメなので注意。

各Boneが正しいGeometryに連動しているか、動かしながら確認。
余計に連動している場合は、左側のパネルの一番下Bone influenceを押して、
右側パネル下に表示される、余計に連動するスプライトを削除する。

微調整

曲げたときに、その付近のスプライトが変な感じにゆがむ場合は
曲げる部分のスプライトの頂点だけに影響が出過ぎているせちなので、
その部分のスプライトを選択して、左側のパネルのWeight Sliderを選択肢
右側のパネル下のModeをSmoothに切り替え、Amountのスライダーの値を増やす。


FKとIK

講師の方によると「ご存じの方の方が多いと思いますが」とのことだったが、自分にはさっぱりわからない単語だった。

FK＝Forward kinematics

身体の中心のBoneから先端に向かってBoneの数だけ順番に動かす

IK=Inverse Kinematics

身体の先端から動かす（一つのBoneだけを動かせば良いのでラクができる）
※どちらも関節を動かす手法
※Kinematicsとは運動学（運動の幾何学的性質を論じる学問）のこと。ギリシャ語が語源で、CINEMAと同語源。


シーンに読み込んでからの作業

シーンを作成し読み込み

新しいシーンを作成し、先ほど設定を施したPSBファイルをシーンにドラック＆ドロップする。
すると、真っ黒なシルエットがシーン上に現れる。真っ黒なのは照明が無いからなので、ライトを設定する
ヒエラルキー上で右クリックして、
ライト / 2D / Global Light 2D
を選択すると、ヒエラルキー内に Global Light 2Dが現れ、シーン上の真っ黒だったキャラクターに光があたり見えるようになる。

この状態だと、複数パターンある身体のパーツが全て見えている状態なので、どれか一つずつ以外は非表示にする。

アニメーターを追加

アセットの中のキャラクターを選択した状態で、インスペクターのAdd Compornentからアニメーターを追加する。

IK Manager 2D を追加(Script)

ヒエラルキーの中のキャラクターを選択した状態で、インスペクターのAdd CompornentからIK Manager 2Dを追加する。
IK Solversの「+」ボタンを押し、ドロップダウンリストの中からLimbを選ぶ。
※2つの関節を一つの関節で動かす場合にLimbを使う。
Limbの位置を動かしたい先端の関節の根本の位置に合わせる。
Limbのインスペクター上にあるEffectorに、動かしたい関節のBoneをアサインして、Create Targetをクリックする。
これを先端の関節毎に繰り返し設定する。

スプライトの順番を変えられない

ここで問題が発生、左手が左足より手前に表示されてしまう。
順番を変更したいものの、ヒエラルキー上の順番を変えようとすると
「プレハブインスタンスの子は削除/移動することはできません。そして、コンポーネントは並び変えできません」
とエラーが出て変更できず。
それならプレハビの大元を変えればよかろうというところなのだが、大元が見当たらない。
これはおいおい考えることにしょう。
→後日、途中で詰まり、大幅にやり直しをしなければならなくなったときにわかったのだがレイヤーの順番はPSBファイル毎変える必要があるということがわかった。なので、Assets内のPSBファイルをダブルクリックしてPhotoshopなどで開き、レイヤーの順番を切り替えてほぞんしなおせば良い。

そして、Limbを付け終わったのがこちら。