Flash術
Flashでサイトを制作する。これが当たり前のようになってきた。最近のブロードバンド化により、通信環境に対する問題が軽減され、今までHTMLベースでやってきたことがFlashにシフトし、より豊かな表現が可能になってきたのだ。表現の幅は確実に広がっている。オリジナリティあふれる表現を見つけだそう。
fujimaki 藤牧 篤   ATSUSHI FUJIMAKI
Web制作会社にてデザイナーとして経験を積む。
2001年、フリーで活動を開始し、現在、NON-GRIDにてアートディレクションから制作までをこなす。


NON-GRID >> http://www.non-grid.com/
ARCHI-TYPE >> http://www.archi-type.com/
■バックナンバーへ
■VOL.57 [SLIDE&BOUND : スライドしながら跳ね返る(3)]

■VOL.58 [SLIDE&BOUND : スライドしながら跳ね返る(4)]

VOL.59 [ MX tech 1 : ボタン機能を無効にする(1) ]
 Flash MXが登場してから大分経つが、プラグインの普及を考えるとまだプレイヤー5をターゲットとした制作が必要な場合も多々ある。しかし、MXになり作業が軽減されるような機能や、非常に便利だなと思える機能が多く追加され、出来ればバージョン6をターゲットとした制作に移行したいものだ。プラグインの問題などユーザの環境を考えて、より多くの人が見ることの出来るサイトにすることも非常に重要だが、制作側が最新のプラグインを必要とするサイトを制作し、プラグインのインストールを促していかなければ、普及率もなかなか上がっていかないのだとも思う。なので、この連載でもMXの機能も使用しながら紹介を行っている。今回からは、幾つかの新機能に焦点を当てて紹介していく。
 今回その一つ目は、ボタンを無効にするアクションだ。例えば、ナビゲーションボタンがありボタンを押すとモーションが始まり次の画面へ移り、ストップする。このモーションしている間に別のボタンを押すことが出来てしまうと、ものによっては誤動作をするおそれがあるので、ボタンをムービークリップにし、モーション中は別のフレームに配置したグラフィックを表示させるなどして対処していたが、MXからは今回紹介するアクションを設定するだけで済んでしまう。
今回の作品は、下部に配置したボタンをクリックすると、イメージが次々とスライドしていく仕組みだ。ここでは、スライド中にボタンを無効にしている。
1. スライドパーツの作成

 まずは、スライド部分のパーツを作成していく。スライドが終わると現れるタイポを作成する。
新規シンボルでムービークリップを作成し、図のようなフレーム構成で文字をブロックごとに点滅させながら表示させる。

capture

1番目に表示されるタイポグラフィ

 同じような手順で、2番目、3番目と作成する。

capture

2番目に表示されるタイポグラフィ

capture

3番目に表示されるタイポグラフィ

 次に、スライドさせるイメージを作成する。ここでは3つのイメージを切り替えていくので、3枚の画像を使用する。
 新規シンボルでムービークリップを作成し、画像を読み込み、配置する。

capture

1番目表示に使用する画像を読み込んだ

 2番目、3番目の画像も読み込み、配置する。

capture

読み込んだ画像3枚を並べた

2. .スライドモーションの作成

 今度は、画像をアニメーションさせる。
 新規シンボルでムービークリップを作成し、中心点が左上になるように、画像を並べたシンボルを配置する。

capture

画像を並べたシンボルを配置

 そして、40フレーム目にキーフレームを挿入し、2番目のイメージ左上に中心点がくるように移動する。

capture

2番目のイメージ

 今度は、80フレーム目にキーフレームを挿入し、3番目のイメージ左上に中心点がくるように移動する。

capture

3番目のイメージ

 3番目のイメージが表示された状態でボタンがクリックされると、1番目のイメージに戻るようなモーションにしているので、120フレーム目にキーフレームを挿入し、再び1番目のイメージ左上に中心点がくるように移動する。

capture

再び1番目のイメージ

 次回は、これらを組み合わせ、アクションの設定をしていく。
VOL.58 [ SLIDE&BOUND : スライドしながら跳ね返る(4) ] 終わり