最終回！てっくん演出アニメーション其の肆【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜　part33

2018.04.03

投稿者： 

このエントリーをはてなブックマークに追加

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

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

前回のpart32では、一通りのアニメーションが完成しました。

今回はさらなるクオリティアップを図りたいと思います！

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

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

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



セクション1：拳にクローズアップ！

力を溜めている時に、画角を拳へズームする演出を追加いたします。



1）「body」の48フレーム目の「X座標」を410に設定します。

2）同じく、「Y座標」を96に設定します。

「hand_R」が画面の中央に来るように調整します。



しかし、動かしてみたら体にズームしてから、横にずれるように動いてしまっています。



原因は28フレームから48フレームまでの間のキーも、「X,Y座標」の数値が決まっているためです。

まずはこちらを解消していきます。



まず、「X座標」の調整です。

「body」の「X座標」の横の「ー」をクリックします。



28フレームから48フレームまでの間のキーを選択し、deleteキーを押します。



28フレームから48フレームまで、斜線でつながりました。

これで「hand_R」に向かって、「X座標」は一定の間隔でズームします。



次に、「Y座標」の調整です。

「body」の「Y座標」の横の「ー」をクリックします。



28フレームから48フレームまでの間のキーを選択し、deleteキーを押します。



28フレームから48フレームまで、斜線でつながりました。

しかし、「Y座標」にはもともと、上げに揺れる動きもあるので、その設定も必要です。

一旦、「カーブエディタ – Y座標」のウィンドウは閉じます。



まず、変化させない32,36,40,44フレーム目の「Y座標」にチェックを入れ数値を固定します。



次に、

1）30フレーム目「Y座標」の現状の数値から、-2に設定します。

2）34フレーム目「Y座標」の現状の数値から、-3に設定します。

3）38フレーム目「Y座標」の現状の数値から、-4に設定します。

4）42フレーム目「Y座標」の現状の数値から、-6に設定します。

5）46フレーム目「Y座標」の現状の数値から、-8に設定します。



これで、スムーズに「hand_R」にズームするようになりました。

しかし、ズームする時に動いてしまうため、今までの上下「Y座標」の変化具合では目立たなくなってしまいました。



なので、「Y座標」変化率を大きくしたいと思います。

1）30フレーム目「Y座標」の現状の数値から、−5に設定します。

2）34フレーム目「Y座標」の現状の数値から、−5に設定します。

3）38フレーム目「Y座標」の現状の数値から、−5に設定します。

4）42フレーム目「Y座標」の現状の数値から、-10に設定します。

5）46フレーム目「Y座標」の現状の数値から、-20に設定します。



これで、ズームしながらでも、上下に揺れているのがわかりやすくなりました！


セクション2：パンチにあわせて画面の拡縮

パンチのインパクトも強調したいので、画面の拡大と縮小で演出します。



「body」の50フレーム目で、「X,Yスケール」を0.6に設定します。

一度元の大きさより小さくすることで、アニメーションに勢いが出ると思います。



「body」の50フレーム目で、「X,Yスケール」を2に設定します。

今度は元のおおきさより大きくして、勢いを足してみました。



最後に54フレーム目で「X,Yスケール」を1に戻します。




これで、パンチ繰り出すの瞬間の演出は完了です！



次に、連撃をうっている時も、体を拡縮して力強さを演出したいと思います。

54フレーム目の「body」を56,58フレーム目にコピペします。



「body」の55フレーム目の「X,Yスケール」を1.1に設定します。



55フレーム目の「body」を57,59フレーム目にコピペします。



連撃の威力に体も振動！しているように見えると思います！^^



そして完成したアニメーションがこちらです！



まとめ

・拡大と縮小で画角の変更が可能！

・拡大と縮小で演出の強調が可能！
今回でイチから学ぶ【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜は終了です。

みなさんいかがでしたでしょうか？

少しでもスプライトスタジオに興味を持っていただいたり、お役に立てれば幸いです！

今までご覧いただき、誠にありがとうございました。

次回もテクノブログ、並びにやじキチの新ブログにご期待くださいm(_ _)m
The following two tabs change content below.
Avatar photo

やじキチ

どうも！(・∀・)やじキチです。 影が薄いのをカバーするためにチャラチャラしております。 常日頃から皆々様に笑顔でいて欲しいと思っております。 皆々様が笑顔で、世界が平和なら最高です！ よろしくお願い申し上げます！
一覧へ

コメントを残す