アニメーションのしくみを学ぶ

DVD「ノーマン・マクラレン作品コレクション」パイオニアLDC、より「ノーマン・マクラレンのアニメーション講座 1」を視聴

• 映画のフィルムとコマ
• あるコマと次のコマの違いが「動き」となる
• 撮影台を使用した、アニメーション撮影の手順
• 直線AからBまで移動するアニメーション
• 何回の動きでAからBまで移動するのか
• アニメーションの重要な要素「テンポ」
• 2地点間の分割数によるテンポのスペクトラム
• 「動きの距離」がアニメーターにとってとても重要

従来のアニメーションとFlashでのアニメーションの違い

• 基本的な原理は従来のアニメーションと同じ
• あるコマと次のコマとの差が動きとなる
• しかし、より効率的に、なめらかなアニメーションが作成できるよう工夫されている
• 同じ動作を何度もくりかえすのはコンピュータが得意とすること
• その部分は人間がやるのではなく、自動化する

トゥイーンとは

• トゥイーンという概念が重要
• もともとはアニメーション用語、主要アニメーターが重要なフレーム (主要な変更を含むフレーム) だけを描画し、アシスタントがその間のフレームを描画するという工程を指したもの
• Flashでも同様に、主要となるコマ(キーフレームと呼ぶ)を描くだけで、あとはアシスタント(コンピュータ)が残りのフレームを自動的に描いてくれる
• モーショントゥイーン：「動き」のトゥイーン、ステージに配置したもの(インスタンス)を、移動、拡大、縮小、回転などすることができる
• シェイプトゥイーン：「形」のトゥイーン、ステージに配置したもの(インスタンス)の形状を変化することができる

実際にアニメーションを作ってみる

A地点からB地点まで直線移動するアニメーションを作成する

• 「Flashファイル(AS3.0)」で、新規作成

• ツールボックスの楕円ツールを選択して、ステージ上に円を描く

• 矢印ツールで描いた円の全体を選択する。網点で選択範囲が表示される

• メニューから「挿入」→「シンボルに変換」を選択。ダイアログボックスが表示されるので、このエレメントの名前をつけ、タイプを「グラフィック」にして[OK]ボタンを押す

• 作成した物体(インスタンス)が選択された状態で、メニューから「挿入」→「モーショントゥイーン」を選択

• 自動的に1秒分の長さのモーショントゥイーンが作成される

• 最終フレームを選択した状態で、物体(インスタンス)を移動する。移動経路(モーションパス)が表示される。

• モーションパスは変形することも可能、いろいろな動きを作ってみる

• 最後のフレームの右端にマウスポインタを重ねて、マウスポインタが「←→」という表示になった状態で左右にドラッグすると、アニメーションの長さ(テンポ)を変更できる

• メニューから「制御」→「再生」または、[Enter]キーで、アニメーションを再生する

拡大、縮小、回転

• 自由変形ツールを使用すると、移動だけでなく、拡大、縮小、回転することも可能
• 表示される枠の周囲8箇所にあるコントロールポイントで、拡大、縮小、変形することが可能
• 枠の角にマウスポインタを近づけて、矢印が回転する表示になったポイントで、物体を回転することができる
• 変形、回転を使用して、いろいろな動きを試してみる

自由変形ツール

レイヤーの活用

• 複数のシンボルをアニメーションさせるには
• ひとつのモーショントゥイーンには1つのシンボルしか使用してはいけない
• 2つ以上のシンボルがあると、トゥイーンは生成されないはず
• 複数のシンボルをトゥイーンするには、レイヤーを活用する
• レイヤー = 層、ステージ上に複数の透明なセルが積み重なっているイメージ
• レイヤーを重ね合わせることで、複数の動きを同時に表現可能
• レイヤーの追加は、タイムラインの左下にある、レイヤーの追加ボタンから