目次ホームページ作成実験室macromedia FLASH 2J


原子風アニメーション


 
上のアニメーションはmacromedia FLASH 2J のモーションガイド機能を使ったものです。
モーションガイドとはシンボル化した絵をトゥイーン機能で移動させる時にモーションガイドに沿った動きをさせるものです。
上のアニメーションでは赤いボールは楕円のモーションガイド(表示はされない)に沿って移動しているわけです。

上の例の場合、基本的に3つのレイヤで構成しています。第1レイヤ(一番上のレイヤ)には右下から左上に右周りで回転する赤いボール(電子に見立てている)、第2レイヤには左下から右上に左周りで回る赤いボール(もう一つの電子に見立てている)、第3レイヤ(一番下のレイヤ)には中心にある青いボール(原子核に見立てている)です。
でも、そのままでは原子核の裏側に回り込んだはずの電子が見えてしまって立体感を表現できません。

そこで、さらに2つのレイヤを追加して原子核の裏側に電子が回り込んだとき電子が見えないようにマスクを設定します。マスクの形は原子核の裏側を通る軌道のみを隠すように半月状にしています。マスクを設定するレイヤは各電子が設定されているレイヤの一つ上のレイヤに設定します。
すなわち、第1レイヤにある右回りの軌道を隠すために右下から左上にかかる半月状のマスクを一つ上のレイヤに設定します。また、第2レイヤにある左回りの軌道を隠すために左下から右上にかかる半月状のマスクを第1レイヤと第2レイヤの間に設定します。
電子が描かれているレイヤで「モーションガイドを追加」をするとすぐ下のレイヤにモーションガイドのレイヤが設定されます。ですから、最終的なレイヤは以下のようになります。
第1レイヤ右回り軌道を隠すためのマスクを描く
第2レイヤ右回りの電子を描く
第3レイヤ右回りの軌道を描く(モーションガイド)
第4レイヤ左回り軌道を隠すためのマスクを描く
第5レイヤ左回りの電子を描く
第6レイヤ左回りの軌道を描く(モーションガイド)
第7レイヤ原子核を描く


この状態でアニメーションを再生すると少しおかしな映像になります。
第1レイヤのマスクのために第5レイヤの電子の絵が原子核より手前にあるのに一瞬消えてしまうのです。そこで、第1レイヤのマスクを表示するタイミングをタイムライン上でコントロールしています。右回りの電子を隠すときだけ表示してそれ以外の時間では表示しないようにしています。




以下に各フレームの映像を示します。全部で21フレームあります。
マスクを分かり易くするために、第1レイヤのマスクを緑色に、第4レイヤのマスクを黄色にしてあります。
実際のマスクは第7レイヤのグラデーションの掛かった青いボールをコピーして切り取ってあるので、見た目には分かりません。
また、第3および第6レイヤのモーションガイドの線も表示されません。
第1フレーム第2フレーム第3フレーム

第4フレーム第5フレーム第6フレーム

第7フレーム第8フレーム第9フレーム

第10フレーム
ここから第1レイヤのマス
クを表示
第11フレーム第12フレーム

第13フレーム第14フレーム第15フレーム

第16フレーム
ここから第1レイヤのマス
クを非表示
第17フレーム第18フレーム

第19フレーム第20フレーム第21フレーム



下の絵は今回のタイムラインです。

一番上の目盛りはフレームを表しています。
青く塗りつぶされた○はキーフレームと言って絵が描かれているフレームです。
中が白の青○は空白キーフレームで絵が入っていないフレームです。
赤い○はトゥイーンで使用する先頭のキーフレームです。
赤い矢印はトゥイーンしているフレームで先頭キーフレームから最終キーフレームまでの間のフレームを自動作成しています。
ですからレイヤ2の場合、私が設定しているのは第1フレーム、第14フレームそれと第21フレームだけです。
何も記号のないフレームは前のフレームと同じものが表示されます。


ムービーレポートは以下のようになっています。
ファイルサイズは1326B(1.29KB)となりました。
Movie Report
------------

Frame #    Frame Bytes    Total Bytes    Page
-------    -----------    -----------    ---------------
    1           326            326        シーン 1
    2            46            372          2
    3            46            418          3
    4            46            464          4
    5            46            510          5
    6            46            556          6
    7            45            601          7
    8            45            646          8
    9            45            691          9
   10           126            817          10
   11            46            863          11
   12            46            909          12
   13            45            954          13
   14            45            999          14
   15            46           1045          15
   16            52           1097          16
   17            46           1143          17
   18            46           1189          18
   19            46           1235          19
   20            46           1281          20
   21            45           1326          21

Page                       Shape Bytes    Text Bytes
-----------------------    -----------    ----------
シーン 1                        148             0

Symbol                     Shape Bytes    Text Bytes
-----------------------    -----------    ----------
ボール青                         91             0
ボール赤                         81             0

Bitmap                     Compressed  Original    Compression
-----------------------    ----------  ----------  ------------