別アニメーションから流用！?「angry」アニメーションの制作！【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜　part14

2017.10.10

Notes

スプライトスタジオ

どうも！（・∀・）やじキチです。

イチから学ぶ！【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜の連載ブログです！

前回のpart13では、新しく「スケール」や「カラーブレンド」を使って「damage」アニメーションの制作を行いました。

今回は！「＼／」の目を使って、プンプンと怒った「angry」アニメーションを制作していきます！

イチから学ぶ！【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜のPart14です！
- まとめ
  - - やじキチ
    - 最新記事 by やじキチ (全て見る)

イチから学ぶ！【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜のPart14です！

スプライトスタジオ http://www.webtech.co.jp/spritestudio/

夢を描いて、動かそう。
インディーゲーム開発に無料で使える
アニメーション作成ツール

セクション1：別アニメーションから流用!?大まかな動きの設定！

今回作成する「angry」の大まかな動きは下記でいきたいと思います！

1、怒った顔をする
2、ダンダンと2回、地団駄を踏む

今まで通り、既存のアニメーションを複製して、「angry」を作成します。

今回は初めから目を「＼／」にしたいので、

1）「●●」をダブルクリックして、非表示に設定します。

2）「＼／」をダブルクリックして、表示に設定します。

1）次に「mouth_▽」をダブルクリックして、非表示に設定します。

2）「mouth_△」をダブルクリックして、表示に設定します。

これで怒った顔ができました！

1）次に6フレーム目で「body」の「Z軸回転」を-15度に設定します。

2）12フレーム目で元に戻すので、0フレーム目を12フレーム目にコピペします。

2回地団駄を踏むので、6〜12フレーム目を18フレーム目にコピペします。

次に足の設定です。

体が傾いても、片足は動かないようにしたいので

1）6フレーム目、「leg_L」の「Z軸回転」を15度に設定します。

2）12フレーム目で元に戻すので、0フレーム目を12フレーム目にコピペします。

次に6フレーム目の「X,Y座標」を調整して、0フレーム目と6フレーム目で「leg_L」のが動いていないように見えるようにします。

2回地団駄を踏むので、6〜12フレーム目を18フレーム目にコピペします。

続いて「leg_R」の設定です。

体を傾けると同時に足を上げるように見せたいのですが、「Z軸回転」の角度を設定しただけではアニメーションの変化が寂しく感じます。

なので「damage」の時のように、足裏を見せている感じで設定したいと思います。

前回の「damage」アニメーションの制作の時に、すでにその設定をしているので「damage」からその設定を持ってきて、工数を削減しましょう！

1）まず「damage」アニメーションに移動します。

2）5フレーム目の「leg_R」を選択しコピーします。

1）再び「angry」アニメーションに戻ります。

2）6フレーム目の「leg_R」に、先ほどにキーをペーストします。

偶然にも、傾いた体にぴったりの位置でした！

「leg_R」も同じように、2回地団駄を踏ませます。

これで大まかな動きの設定は完了です！

セクション2：「頂点変形」でクオリティアップ！

「leg_R」の「優先度」を変更したので、今まで見えなかった部分が動き出した瞬間に見えています。

このままだとチカチカしてしまうので、「頂点変形」で「body」と「leg_R」の重なっている部分を少しでも少なくしましょう。

「leg_R」の1フレーム目で「頂点変形」の設定をします。

「body」に「leg_R」があまりかからないようにすることで、チカチカしたのを抑えられます。

同じように、チカチカする箇所が3箇所あったので、1フレーム目のキーを11,13,23フレームにコピペします。

これで、地団駄2回とも調整完了です！

ついでに、地団駄に合わせて「hand_R」と「hand_L」も上に振りあげましょう。

1）6フレーム目の「hand_R」と「hand_L」の「Z軸回転」を80度で設定します。

2）6フレーム目のキーを18フレーム目にコピペします。

3）最後に、0フレーム目のキーを12,24フレーム目にコピペします。

これで、地団駄に合わせた手の動きは完了です。