読者です 読者をやめる 読者になる 読者になる

ハロトレWebデザインの勉強 | 求職者支援訓練Webサイト制作科 フェリカテクニカルアカデミー

未経験者からプロになるハロートレーニングWebデザインの勉強

タイムラインアニメーション

タイムラインアニメーション

  • ActionScriptではなく、タイムラインの動機によって動くFlashムービー
  • 初期設定は、1秒間に24フレーム使用して同期する
使用頻度の高いメニュー(修正メニュー)
  • タイムラインアニメーションを作成するには、修正メニューを理解する

(1)ドキュメント
(2)シンボルに変換
(3)分解
(4)ビットマップ
(5)シンボル
(6)シェイプ
(7)オブジェクトを結合
(8)変形
(9)重ね順


新規ドキュメントを作成(ステージを準備する)
  1. 新規ドキュメントを作成(ActionScript2.0)を選択
  2. プロパティパネルで、ステージサイズを「550×400 px」を確認する

 

イラストを描画する
  1. 楕円ツールを選択
  2. Shiftキーを押しながら正円を描画



キーフレームを追加
  1. キーフレームの挿入(選択したフレームに、それ以前のフレームのインスタンスを複製し同じ位置に配置すること)




通常は、「F6」キーを押すことで、「キーフレームの挿入」を行います。

消しゴムツールで一部分を消す


  • 「キーフレームの挿入」→「続きを消す」を、円がなくなるまで繰り返す
  • 消す割合を、徐々に少なくすると、逆再生したときに加速がついたように表示させることができます


タイムラインをすべて選択
  • レイヤー名をクリックする


タイムライン→フレームの反転
  • 時間軸を反転して時間を逆再生する


ムービープレビュー
  • 再生する(Enter)
フレームレートを変更
  • 再生スピードが速すぎるとき、1秒間に再生ヘッダが読むフレーム数を減らす


オブジェクトとインスタンス

  • シェイプを描画


シンボルに変換
  • 描画したシェイプを選択したまま「修正」メニュー →「シンボルに変換」を選択する


  • 「グラフィック」を選択し、名前をつけます(ActionScriptインスタンスに記述しない場合は、グラフィックを選択します)


インスタンス
  • グラフィックシンボルはライブラリに入り、ステージ上には、「インスタンス」が生成されます

  ※インスタンスには、基準点が表示されます。


インスタンスを動いているように見せる
  1. 「50フレーム」で「コンテクストメニュー」で「キーフレームの挿入」
  2. 「50フレーム」の位置を移動させて「1フレーム」と違う位置にします


クラシックトゥイーンを作成
  • キーフレーム同士の中間を「コンテクストメニュー」で「クラシックトゥイーンを作成」を選択



 ※中間が矢印が見えれば成功です。


再生
  • 「1フレーム」に戻り、Enterキー「再生」を押すと以下のアニメーションになります


ムービープレビュー
  • Ctrlキー + Enter