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

ハロートレーニングWebデザインの勉強 Webデザイン フェリカテクニカルアカデミーWebサイト制作科

基本操作と描画

新規ファイルの作成

  • 「ファイル」メニューから「新規作成」→「ActionScript2.0」を選択

  • 新規Flashファイルが開く


Flashの画面構成

タイムライン
  • 1秒間に「24フレーム」を使用してアニメーションを作るための時間軸


プロパティインスペクタ

ステージ上の任意の場所を選択している場合


タイムライン上の任意の場所を選択している場合

画面の表示サイズを切り替える

  • 表示比率を切り替える
  • 100%で表示 [Ctrl+1]
  • ステージ全体を表示 [Ctrl+2]
  • すべて表示 [Ctrl+3]
  • 表示位置を左上に固定する「ペーストモード」 [Ctrl+Shift+W]

ルーラを表示する

[Ctrl+Alt+Shift+R]

ルーラからガイドを表示させる

ルーラ目盛り部分からステージ上にドラッグするとガイド線が表示されます。
Illustratorなどと同様の使い方です。)

グリッドを表示する

グリッドの設定を変更する



※線がおもようにかけない場合は、この吸着が邪魔になっている場合があります。グリッドの吸着のチェックをはずして、描いてみましょう。


描画

ツールパネルの基本的な使い方
  1. ツールを選択する
  2. カラーやオプションを選択する
ツールパネル

Illustratorなどと使い方は同じです。
注意が必要なことは、矩形ツールの設定を「オブジェクトの描画」をONにしていることで、グループとして描画され次のステップに進みにくい場合があることです。


最初から「グループ」として描画される場合、以下の「オブジェクトの描画」がONになっています。OFFにすると通常の描画ができるようになります。



鉛筆ツールのオプション
  1. ストレート
  2. スムーズ
  3. インク

というオプションがあります

  • ストレートやインクで線を描くと、描き方によっては少しガタガタした線になってしまうことがあり、ガイドレイヤーの線として描くと思い通りの動きにならないことがありますので、注意しましょう
線の微調整方法
  • 線を描いたあとでちょっとした微調整をしたい場合には、矢印ツールでドラッグすることで微調整ができます
  • ガタガタになってしまった線も、微調整可能です

流し消す
  • はみ出たところを消すためには「流し消す」を使います


シンボルとインスタンス

シンボル
  • Flashのアニメーション内で使用する「オブジェクト(部品)」
  • シンボル化されたオブジェクトは、ライブラリに保管されて、そこからいつでも取り出すことができます
  • ライブラリからステージ上にドラッグ&ドロップすることで使うことができます
インスタンス
  • ライブラリから、ステージ上にシンボルをドラッグ&ドロップしたときや、ステージ上にあるオブジェクトを「シンボルに変換」した際、そのオブジェクトは「インスタンス」と呼ばれます
  • これは、シンボルの「分身」にあたるものと言うことができます
シンボルとインスタンスとの関係
  • シンボルは「オリジナルの部品」
  • インスタンスは、その部品を元に作られた「コピー」


  • シンボルを修正したい場合は、ステージ上のインスタンスをダブルクリックするか、ライブラリパネルでシンボル(上に表示されているグラフィック)をダブルクリックすることで可能です
  • ステージ上にあるインスタンスは、色・大きさ・透明度など、オリジナルの内容を変えない範囲での変更は行えますが、文字の内容の変更などは行えません


シンボルを使うことのメリット

  • データ量が少なくてすむ
  • 変更が効率的に行える

シンボルの種類

ムービークリップシンボル
ボタンシンボル
  • 「アップ」「オーバー」「ダウン」「ヒット」という特別な意味を持ったフレームを持つシンボル
グラフィックシンボル
  • 静止画像をそのままシンボル化し、タイムラインを使って動かすときに使う

フレームとキーフレーム

  • 1フレーム目には、最初から「空白キーフレーム」が挿入されています
  • そのままステージにオブジェクトを配置すると、○が●に変化します
フレーム
  • アニメーションのひとつひとつの「コマ」のこと
  • タイムラインの一つのマス目が1フレームとなり、フレームが右方向に進むほど、時間が経過していることを示す
  • アニメーションは、フレームの状態が変化していくことで実現します
キーフレーム
  • フレームの中でも特殊な位置付け
  • 文字通り「キーとなるフレーム」で、アニメーションの一つの「区切り」を示す
  • 単純なアニメーションはキーフレームとキーフレームとの間の動きを補完することでできている


  • キーフレームではないフレームのステージ上にオブジェクトを置こうとすると、そのオブジェクトは、直前のキーフレームから次のキーフレームまでの間のフレームすべてにコピーされます
  • もしそのフレームに新しくオブジェクトを配置したい場合は、まず最初に必ず「空白キーフレーム」を挿入する必要があります


  • キーフレーム以外のフレームは、動きを補完している間隔です

トゥイーンアニメーション

  • トゥイーンアニメーションに対して、一つ一つのフレームに、パラパラアニメのように動きを設定していくアニメーションは「フレームアニメーション」と呼びます

  • 「トゥイーン」とは、キーフレームとキーフレームとの間の動きを補完してくれる機能
  • トゥイーンアニメーションには、「モーション」と「シェイプ」の2種類がある
モーショントゥイーン
  • オブジェクトの動きや大きさ、色などの動きをアニメーションするもの
  • 動かすオブジェクトはシンボル化しなければならない(インスタンスであること)
  • 動きのあるインスタンスは、1レイヤーにひとつしか配置できない(別々に動かすオブジェクトは、レイヤーを分ける)
  • 位置や形を編集するフレームはキーフレームにする
  • モーショントゥイーンを設定する


クラシックトゥイーン
  • モーショントゥイーンと同じ条件で設定する


シェイプトゥイーン
  • オブジェクトの形を変化させるアニメーション
  • トゥイーンを設定するためにはいろいろな条件があり、動きの制御もやや難しいのが特徴





広告を非表示にする