→プロジェクトデータ公開中←
※外部(itchiio)サイトへのリンクです
■はじめに
２Dボーンアニメーションの練習場へようこそ！
ここでは第1回「始めよう、２Dボーンアニメーション」で作成した≪人形≫を使用し
AnimationPlayer
で登録する流れを解説します。
こんな感じのアニメーションを作っちゃいましょう！
Itchiioさんにて、動かせるサンプルが公開中
こんなのがツクれるよ！の参考になります。
■お品書き
- レストポーズを確認し、無理なポーズに備える
- animeの基本。全てのスタート≪待機≫を作成する
- animeってなんだろう（読み物）
- 本格的な登録。≪移動≫アニメを作成
- アニメを跨ぐ際の注意点等
- まとめ
■1.レストポーズを確認し、無理なポーズに備える
1-1.Skeleton2Dから「レストポーズを上書き」しておく
これによって「レストポーズへリセット」すると戻れます
元に戻せる安心感がありますので、好きに動かしましょう！
1-2.元画像はoffにしても良いです
ボーンアニメ作成時に使用した「下書き画像」のSprite2Dが邪魔な場合は非表示にしておきましょう。
■2.animeの基本。全てのスタート≪待機≫を作成する
2-1.Animation2Dから新規アニメ「00_wait」を作成する
2-2.時間を[0.5]に変更します。（変更しなくても良いです）
2-3.今回は待機animeはしないので、これで完成になります
■3.animeってなんだろう（読み物）
例えば「パンチ」のアニメを作成する場合、
待機→パンチ→待機の一連のアニメが必要ですね。
①≪何秒で終了するか≫考える
高速のジャブなら0.1秒でも遅いかもしれないし、大振りのアッパーは0.5秒ほどかかりそうです。
実際にストップウォッチ片手に素振りやイメージするのをお勧めします。
②アニメ時間中の予定地点を考える
アッパーを細分化してみると
・待機
・体を後ろに軽く引き、拳を構える
・腕を引き切り、溜めた状態
・重心は前に移動し、肩から出始める
・アッパーの一番かっこいいポーズ
・振り切った余韻で柔らかく
・脱力気味に腕を下げる
・待機
（大事なのは雰囲気）
③何を設定するの？
AnimationPlayerでは
TVアニメでいうトコロの「原画」部分を【キーフレーム】として登録していきます。
各キーフレームの間を埋める「動画」部分は、自動補完して繋げてくれます。
※ぐっと溜めて…シュ！ギュギュンっと戻る、でもイメージできてます
④正解は無いので≪教える≫事はなく、気持ちいい動きを感じよう
爽快なアクションゲームをプレイするのも良し、リアルな動きを追求するのもOK
自分の正解を見つける事が制作を楽しくするコツかもしれません
⑤そうは言っても、簡単な組み方はある？
パーツ毎に動かす方法は組みやすいかもしれません
全身[torso]の動き部分をキーフレーム登録し
腰→足→頭→手→全体調整・・・と、順番に動かすことでいい感じになります。
・手足が小さいのでHIT時に拡大
・足運びを意識し、滑ってない意識を入れ込む。
さて、次項目で実践に移りましょうっ
■4. 本格的な登録。≪移動≫アニメを作成
4-1.時間を決める
・AnimationPlayerのアニメーション、新規「01_move」を作成します。
・全体時間を0.4秒にします。（この辺は自由に変更してください）
4-2.[torso]だけを動かし、動作のシルエットを作成する
・Bone2D「torso」を選択し、時間[0]にあわせる（動画2:00-）
・Y座標を少し下げ、カギiconを押す。
新規キーフレームの場合、確認窓が出ますので[続行]する。（動画7:00-）
・時間[0.1]に合わせる（動画10:00-）
・Y座標を少し上げ、カギiconを押す。※確認窓はでません
・時間[0.4]に合わせる（動画18:00-）
・Y座標を少し下げ、カギiconを押す。（時間0と同じ数値、もしくはコピーしても良い）
・ループアニメをONにし、再生。動作を確認する（動画24:00-）
4-3.手を動かす準備
・AnimationPlayerを選択し、アクティブにする
・時間[0]に合わせる
・Bone2D[Arm_f]を選択し、≪インスペクター≫の「トランスフォーム」から「回転」のカギアイコンを押す。
・同様に[Arm_b]も「回転」のカギアイコンを押し、キーフレームとします。
4-4.手を動かす
・Bone2D[Arom_f]の≪インスペクター≫の回転、もしくは回転ツールで調整する
・動画の位置へ移動し、[回転]のキーフレームを打つ（鍵icon）
→同じ作業を[Arm_b]にも行います
・AnimationPlayerの時間[0.1]へ移動し、[Arm_f]を選択。
・回転させ、元気に開かせてキーフレームにする
4-4.同じ要領で足を動かす
ループアイコン
をONにしておくと、最終フレームから１フレーム目の自動補間をしてくれます。
■5.アニメを跨ぐ際の注意点等
こんな調子で別のアニメも作成していきたいところですが、注意すべきことがあります。
元のアニメーションで変更した情報は引き継がれます。
動画2:00-で[待機]に切り替える箇所に注目してください。
待機ポーズなのに移動用の「足開き」ポーズがそのまま引き継がれてる！？
☆原因は待機のアニメーションでLeg_fとLeg_bのキーフレームを作成していないからです。
あらゆる行動に引き継がれますので、回転を使用したら回転、拡大を使用したら拡大の変更を１フレーム目で正しく戻すようにしましょう。
■6.まとめ
実際は正解は無く、感覚に頼るアニメーションです。
好きなアニメを見たり、気持ちい動きを再現できれば素敵なアニメーションが完成ですね！
表情差分の変更方法って結局…
全部の表情差分を仕込んで置き、アニメ毎に痛がる顔をON、それ以外はOFF
のような「結構メンドイ」作業が発生しそうですね…
良い解決策が見つかりましたら次の記事にしたいと思います。
→プロジェクトデータ公開中←
プロジェクトデータのオブジェ「2D-bone elf boy」が参考になればと思います。