Adobe Animateって?
まずAdobe Animateというソフトをご存知でしょうか?
他のAdobeソフトに比べて知名度も低く、私も全く知りませんでした。
Animateとは、アニメーション作成に特化したAdobeソフトで、Flashの後継ソフトがAnimateとなっています。
直接絵を描いて動きを付けていくこともできれば、IllustratorやPhotoshopで用意した図やキャラクターに動きを付けてアニメーション化することもできます。
AnimateでTVアニメを作っている会社もあるそうです。同じソフトなのか疑いたくなる凄さなので、ぜひ一度調べてみてください!
では今回は、Animate初心者が触ってみて一番初めにつまずいた「トゥイーン」についてお話ししていきたいと思います。
Animateの「トゥイーン」とは
「トゥイーン」とは、アニメーションの始まりから終わりの間を補完する機能のことを示します。つまり動きの途中を自動的に埋めてくれる便利な機能です。
この聴き慣れない音の響き「トゥイーン」は、英語の「〜の間」を意味する「in between」から来ているそうです。
そしてこのAnimateには 3つの「トゥイーン」があります。
・クラシックトゥイーン
Flash CS3 以前でのトゥイーン処理を指しており、主に移行のために維持されているそうです。
モーショントゥイーンと似ていますが、キーフレーム間の動きをモーショントゥイーンのようには編集できず、柔軟性に欠けます。
・モーショントゥイーン
位置・大きさ・角度などが違う同じシンボルの間に不足している画像を自動生成することで、滑らかな映像を作ります。
また動きの軌跡がパスとなって可視化され、簡単に編集することができます。
・シェイプトゥイーン
二つのシェイプの間の形状を補填するようにイメージを生成します。
簡単なアニメーション作りながら違いを見ていきましょう。
跳ねるボールを作ってみましょう
まずはクラシックトゥイーンで跳ねるボールを簡単に作ってみましょう。
①最初のフレームにボール(シンボル)を配置したら、最後のフレーム(60Fとします)を選択、床となるところまで移動します。
②フレーム間で右クリック、クラシックトゥイーンを作成。
③跳ねているようなイメージで、12、24、36、48Fを選択→位置をそれぞれ変えていきます。
キーフレーム間は直線的な動きですが、跳ねるボールができました。
では変化点の数は同じでモーショントゥイーンだとどうなるのか同じように作成してみます。
最初のフレームにボールを配置したら、フレーム間で右クリック、モーショントゥイーンを作成。
先ほどと同じように作成していきます。
ここでわかる違いが、ボールの動きがパスで可視化されていることです。
そのため次にどこに移動させれば良いかが分かりやすいですね。
ではカーブをつけてよりボールらしい動きにしてみましょう。
クラシックトゥイーンでこれを再現しようとすると、新たにキーフレームを追加する必要がありますが、モーショントゥイーンではこのようにパスを掴んで調整するだけで簡単にボールをカーブさせることができます!
シェイプトゥイーンについて
「シェイプトゥイーン」は”シェイプ”を様々な形に変化させるトゥイーンアニメーションで、”同じシンボル”の位置や大きさを変化させていくクラシックとモーショントゥイーンとは少し異なります。
①最初のフレームにボール(シンボルに変換せずシェイプのまま)を配置したら、最後のフレームに空白キーフレームを挿入します。
②好きなシェイプを作成したら、フレーム間で右クリック、シェイプトゥイーンを作成。
このように最初と最後のシェイプの色・形・位置の間を補填してくれています。
色や形が変わるのと同時にクラシックやモーショントゥイーンと同じように跳ねさせることも可能です。
キーフレームを追加して位置を調整してみましょう。
空白キーフレームを追加して、途中で違う形や色に変えることもできちゃいます。色々と応用が効きそうですよね◎
是非色々試してみてください。
まとめ
いかがでしたでしょうか?
初歩的なところですが初めて触る人には違いがわからないこの3つのトゥイーン。
なんとなく違いを知ることができたのではないでしょうか。
初めはとっかかりにくいですが、使いこなせるようになると様々なことができそうですね◎
WEBであればKVにロゴアニメーションを入れたりすることも多くなっているので、そこでAnimameを活用できるのではないかな?と思いました。
After Effectsよりもソフトが軽量なのも個人的にいいなと思ったポイントです!
あまりAnimateを知らなかった方にも興味を持ってもらえる良い機会になれば幸いです。
一緒に学んでいきましょう!