総決算！てっくん演出アニメーション其の壱【アニメ・モーションのつくりかた！】〜スプライトスタジオ編〜　part30

2018.03.13

投稿者： 

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

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

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

前回のpart29では、ショートカットツール「SsKeyBindingEditor」について説明いたしました。

今回からは、今まで紹介してきたアニメーション設定を駆使して、てっくんの短い演出アニメーションを作成していきたいと思います！

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

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

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



てっくんの演出アニメーションは短いとは言っても100フレームを超えるアニメーションになると思います。

なので、数回に渡ってお送りいたします！

今回制作するアニメーションのイメージとしては

空間に穴が開く
↓
噴射する沢山の丸いエフェクト
↓
てっくん登場！

です！^^


セクション1：完成の法則に注意！空間に穴が開くアニメーション


1）まず「○_1」の0フレーム目にキーを打ちます。

2）「X,Yスケール」を、0.1と小さく設定します。

3）「不透明度」を0に設定します。



1）次に「○_1」の6フレーム目にキーを打ちます。

2）「Xスケール」を10に、「Yスケール」1に設定します。

　地面に、空間の穴が空いたイメージです！

3）「不透明度」を1に設定します。

4）「カラーブレンド」で、色も白にしております！



最後に6フレーム目よりも「X,Yスケール」を大さく設定した「○_1」を4フレーム目に打ちます。

慣性の法則をイメージしました。

車は急に止まれない。ならぬ

次元の穴は急に止まらない。です(^ω^ )

次元の穴なので物理法則無視しても良いかもしれませんが、アニメーションに変化がつくと思います！



動かしてみるとこんな感じです。



スローで見るとこんな感じ！

最後の慣性の法則は「よく見なければわからない」くらいでも良いと思います！


セクション2：UVを活用！てっくん登場！

UVはセルマップの矩形を移動して作るアニメーションションです。

主に、長ーい絵をスクロールしたり、同じ絵をループさせるときに使用されます。

今回はてっくんの登場シーンに使用したいと思います！



1）「body」の7フレーム目にキーを打ちます。

2）「UV Y移動」を−0.3に設定します。



本来「UV」を使用する場合は、パーツを切り出している矩形を移動するので、セルマップのパーツの位置関係に注意してください。

「body」はセルマップの端にあるため、今回は矩形を移動してもなにも表示されずに済みました！



1）「body」の16フレーム目にキーを打ちます。

2）「UV Y移動」を0に設定します。



これでてっくんが何もないところから出てきたように見えると思います。



次は「body」に合わせて他のパーツも設定していきます。

「body」と違い他のパーツは周りに別パーツが配置されているので「UV」は使えません。

なので、だましだましの設定になります！

「●●」の11フレーム目にキーを打ち、表示させます。



「mouth_▽」の12フレーム目にキーを打ち、表示させます。



1）「hand_R」の11フレーム目にキーを打ち、表示させます。

2）「不透明度」を0に設定します。



1）「hand_R」の16フレーム目にキーを打ちます。

2）「不透明度」を1に設定します。

「hand_L」も同様に設定します。



1）「leg_R」の14フレーム目にキーを打ち、表示させます。

2）「不透明度」を0に設定します。



1）「leg_R」の16フレーム目にキーを打ちます。

2）「不透明度」を1に設定します。

「leg_L」も同様に設定します。



こんな動きになりました！



スローにすると最後の方の下半身に違和感がありますね…

ここはエフェクトで解消しましょう！


セクション3：目隠し効果！エフェクトの調整

今回のエフェクトは「次元の穴からなにかが出てきた！」という演出の意味合いでつけておりますが、同時にてっくんが穴から出てくる時の不自然な境目を隠す役割を持っております！



1）「effect_1」の7フレーム目にキーを打ちます。

2）「.ssee」ファイルをダブルクリックします。



「基本情報」にチェックを入れます。



1）「パーティクル数」を500に増やします。

　エフェクトの数が増え、より隠せるようになります。

2）「一度に作成するパーティクル数」を100に増やします。

　これで絶え間なくエフェクトが出続ける時間が増えます。

3）「エミッタ生存時間」を10に減らします。

　あまり長いとアニメーションも長くなってしまうので、30フレームくらいになるように調整しました。

4）「パーティクル生存時間」を1〜20に設定します。

　こちらも30フレームくらいになるように調整しました。

5）「射出方向範囲」を177度に調整します。



特に「射出方向範囲」につきましては、今までの120度ですと赤丸部分が隠せていませんでした。

なので大幅に角度を広げ、隠せる範囲を広げております！



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

セクション2で設定した境目が、エフェクトでうまく隠せていると思います！



次回も引き続きてっくんの演出アニメーションを作成していきたいと思います！

まとめ

・細かい「慣性の法則」の表現でアニメーションに変化を！

・「UV」設定を使用して、何もない所からパーツが出現する演出を！

・今回のエフェクトは都合の悪いものを隠すように！
ここまでで何か質問やコメントなどございましたら是非書き込んでください！

私も皆様と一緒に成長していきたいと思います！



次回もテクノブログにご期待くださいm(_ _)m
The following two tabs change content below.
Avatar photo

やじキチ

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

コメントを残す