ついに「Adobe CS5.5」が発表された。「CS5.5」の発売が待ち遠しいが、今回は改めて復習の意味もこめて、「Flash CS5」に搭載されている便利な機能のうち、ボーンツールの「スプリング」を使いこなしていく。今回はこちらのサンプルファイル(CS5用)を参考にして欲しい。

「Adobe CS5」体験版はこちらから


スプリングのオプション -強さと減衰とは

「強さ」とは、バネをシミュレーションしたときの硬さになるため、スプリング効果である跳ね返りを期待するときは最も強い100に近づける。すると、結果として、バネとしての反応が強くなりアニメーション速度が上がる。

逆に強さを1としたときは、柔らかいバネという設定になり、反応自体も鈍くなりゆっくりとした反応となる。結果、アニメーション速度も遅くなる(スローモーションのよう)ため、アニメーションに要するフレーム数も長くなる。

「減衰」とは、指定した強さがどれくらい速く弱くなっていくかを示す。たとえば、強さが100で減衰が0だと、バネの跳ね返りは弱くならない。現実世界では空気の抵抗などがあるので、少しずつ減っていくはずだが、それとは違う結果をアニメーションできる。逆に、リアルな表現にしたいときは、減衰を50に近づけると良いだろう。

ゼリーを作る

CS5にスプリング機能が付いたときに、まず「作りたい!」と思ったのが、昔カートゥーンアニメーションなどで見たゼリーだ。今回は、そのプルプル感を演出してみよう。

1. ステージに台形のシェイプを作成し、ボーンツールを使って図のように底辺から3個のボーンを追加する。

2. アーマチュアレイヤーにポーズを2つ追加する。

左から、4フレーム目、105フレーム目の台形のポーズ(1フレーム目は、図1.の状態)

3. スプリング設定は次の通り。

  • 上のボーンからそれぞれ[強さ:100、減衰:0]、[強さ:80、減衰:0]、[強さ:0、減衰:0]とする。
  • 一番下のボーンは、回転のジョイントをオフにする。

アーマチュアレイヤーは、どのポーズで設定しても全フレーム共通の設定になる

4. アニメーションがループで違和感なく繋がるようにフレームアクションで調節する。

(1)ループ再生の先頭フレームのプロパティパネルで「loop」とラベルを設定。

ラベルはキーフレームを作成してから、そのプロパティパネルで設定する

(2)ループ再生の最終フレームの次のフレームに「gotoAndPlay("loop")」と記述する。

フレームを選択した状態で[ウィンドウ→アクション(F9)]でアクションパネルを表示してからフレームアクションを記述する

5. アニメーションを再生していて、台形の底辺が不自然になっているようなら、それを覆い隠すために上のレイヤーにシェイプを追加する。

手前のレイヤーに、不自然な変形を隠す目隠しを作成した

これで「ゼリー」がプルプルするループアニメーションが完成した。


まとめ

ボーンツールのスプリングは、ムービークリップなどにあらかじめ作成しておいて利用すれば応用は広がる。高度なアニメーションを利用しやすくなっているので、ぜひ、いろんな表現にチャレンジして欲しい。

次回は「フォントの埋め込み」を試していきたい。