DENXブログ

同志社大学 電気情報研究会(DENX)の活動や日常風景などを紹介します。

Unityの2DAnimationで動かしてみた

こんにちは!電気情報研究会のらむーねです。

今回はUnityの2D Animationを使ってサークルのマスコットのでんくすちゃんを動かしてみたので、その紹介をしていきたいと思います。

f:id:denx:20201025200035g:plain

2D Animationについて

"2D Animation"とはUnityのパッケージのひとつで、2Dスプライト用のボーンアニメーション作成することができます。もともと、Anima2Dというアセットがありそれの後継になっております。(といっても互換性はありません)ボーンの設定・メッシュ作成・ウェイト設定などが可能で、アニメーションの作成もエディタ内でできるため2Dのアニメーションを気軽にゲーム内に組み込むことができるでしょう。Spineやlive2Dなどでも2Dアニメーションを作ることができますが、無料でUnity内で完結していることがメリットでしょう。

導入

それでは2D Animationを使用するための準備物を説明していきます。

  1. Unity 2018.1 以降 (2019.3を使用しました)
  2. 2D Animation
  3. 2D PSD Importer
  4. PSBを出力できるソフト(PSDではなくPSBです)

今回はIKをしていませんが使用する場合には2D IKのパッケージも導入してください。

f:id:denx:20201025194056p:plain

PSBを用意

最初にPSDを用意します。

f:id:denx:20201025202252g:plain

事前に頭や腕、胴などのパーツごとにレイヤー分けをしておきます。PSDのレイヤーの順序が自動的にUnity側でのレンダリング順(スプライトの表示の順)になるのでこの時点で整えておきましょう。 その後、PSDをPSBというファイルに変換します。Photoshopがなくても他のソフトでも変換できるようなので調べてみてください。(今回はCLIPSTUDIOを使いました)変換されたPSBをUnityのProject内にいれてやるとPSD Importerが各レイヤーごとにスプライト化してくれます。

画像を動かす準備

UnityにいれたPSBをSpriteEditorで開きます。 SpriteEditorの左上のプルダウンをSkinning Editorを選択します。すると左の方にBones・Geometry・Weightsとあり、まずボーンから作成します。

f:id:denx:20201025213721p:plain

BonesからCreateBoneを選択し、クリックするとボーンが配置され、続いておいていくとボーンが親子関係となり追従するようになってます。またボーンを選択した状態で(画像内で橙色になっているもの)ボーンを作成すると離して置いたボーンでも親子関係となります。このあたりを意識せずに作ると胴体と腕がばらけたりするので注意しましょう。 また、最初に置いたボーンが軸となるので人型の場合ならばへその下あたりからボーンを伸ばすといいでしょう。

f:id:denx:20201026021002p:plain

次にGeometryにあるAuto Geometoryを押します。これによってメッシュというスプライトを変形させるためのものができ、右下にあるGeometoryの項目からGenerate For All Visibleをさらに押すとにメッシュに対するボーンの依存具合であるウエイトも設定してくれます。 また、Geometryにある項目からメッシュの頂点や辺を手動で弄ることもできます。頂点数を増やすと処理が重くなるので注意です。

f:id:denx:20201026020856p:plain

最後にWeightsからボーンのウエイトを調整してやります。ここで、Auto Weightsでおおよその重みを自動で与えてくれます。(そもそも前段階のAuto Geometoryである程度できているので省略可)そして、Bone Influenceからメッシュ生成の時についた余分なボーンの影響を消します。例えば、髪の毛に腕のボーンの影響がでてしまってる場合には髪の毛のメッシュを選択し、右下にあるBone Influenceの項目から腕のボーンを削除してやります。

これでキャラクターを動かす準備は整いました。

動かしてみた

できあがればScene上にPSDファイルを置くとBone付きのオブジェクトとして配置されます。そしてそれをAnimationで動かしてみたのがこちらです。

f:id:denx:20201026030749g:plain

f:id:denx:20201026030755g:plain

立ちモーションと歩きモーションですがなかなかうまくいきました。走りやジャンプのモーションなんかもすぐに作れそうです。

まとめ

動かすようのイラストを分割さえしてしまえば思っていたより簡単にAnimationが作れました。人の顔などを動かすのにはLive2Dなどの方がよいかもしれませんが、アクションやRPGなどのゲームでマップ上を動くキャラの作成なんかにはこちらの方が向いているかもしれません。これを使って2Dゲームを何か作ってみたいと思いました。

公式サイトはこちらですので詳しい使い方はここを参照してください。 最後まで読んでいただきありがとうございます。

docs.unity3d.com