「FLash CS4」体験版ダウンロードはこちらから
「Adobe CS4」購入はこちらから

前回は、ムービークリップを中心としたアニメーション制作を行った。Flashにおいてムービークリップは非常に重要な構成要素だが、「ムービークリップ」のようなFlashムービーを構成する重要な要素があとふたつある。それは、「グラフィック」と「ボタン」だ。Flashの世界では、「ムービークリップ」、「グラフィック」、「ボタン」をまとめてシンボルと呼んでいる。

今回から、グラフィックというシンボルの作成を行う。意外なことに、使い方を知らない人も多いシンボルなので、しっかりと学んでほしい。

グラフィック・シンボルとフレーム

「グラフィック」もアニメーションを作成する要素なので、ムービークリップと似ているのだが、決定的な違いがある。ムービークリップは、1フレームだけでもアニメーションを再生できるのだが、グラフィックでは、それができないのだ。両者の違いを、肌で感じるため、今回から数回にわたりグラフィックの特性を活かして3分だけ計ることができる時計を作成しようと思う。完成した3分計を動画で確認してほしい。今回と次回で以下の3分の動画を作成する(※サンプル動画は10倍速)。

サンプル動画(10倍速)

今回は、3分計の基本パーツであるカウンタの作成をしながら、グラフィックの特徴を学んでいこう。作成するCS4専用Flaファイルはこちらからダウンロードして欲しい。

カウンタ素材の作成

カウンタは、フレーム・バイ・フレームのアニメーションで構成されている。そこで、1フレームで1つの数字が表示されるアニメーションを作成しよう。そのアニメーションは、今回あらたに学ぶグラフィックというタイプのシンボルということになる。

まず、タイプが「グラフィック」のシンボル(＝グラフィック・シンボル)を作成するところから始める。ステージにテキストツールを使って「1」を書こう。「1」を書いたらテキストのプロパティで次の確認をして、色やサイズなども調整しておく。

テキストのタイプ:静止テキスト

テキストツール。クリックしたら、ステージをクリックかドラッグすると、フィールドが作成される

テキストのプロパティ。今回は静止テキストであることが重要だ。その他、フォントや色、サイズなど自由に調整してほしい

次にステージのテキストを選択して、シンボルに変換(F8キー)する。すると、シンボルに変換ダイアログが開くので、次のように入力する。変換ダイアログが下図のように2種類出る場合があるが、現在のところ、詳細表示する内容には何も入力しないので「基本」だけで良い。シンボル名はFlashの内部的な名前でしかないので、デフォルトの「シンボル1」などでも構わないが、筆者は次のような命名規則を作っている。

テキストがメインのシンボル･･･●●_txt
グラフィック･シンボル･･･●●_g
ムービークリップ･･･●●_mc

その他の心がけている事として「全角はなるべく使用しない」などがある。このシンボル名については、厳密なルールがあるというわけではないが、ある程度自分なりのルールを作っておくと、後の作業時にわかり易い。

それでは、次の要領でシンボル化しよう。

名前:1_txt タイプ:グラフィック

シンボルに変換ダイアログ(基本)。詳細ボタンを押すと、項目が増える

シンボルに変換ダイアログ(詳細)。基本ボタンを押すと、入力項目が整理される。最初はこの状態で問題ない

同様に、「2_txt～9_txt、」、「0_txt」というシンボルも作成したいが、この場合は、1_txtの複製になるので、作り方を変えてみよう。作り方は、大きく分けてふた通りある。

方法1:ライブラリの複製を利用する

1.ライブラリにある1_txtを右クリックして「複製」を選択する

2.シンボルの複製ダイアログが表示されるので、シンボル名を入力する

3.ライブラリの中にできた新しいシンボルを右クリックして「編集」を選択する

4.シンボルの中のテキストを「2」に変更する

方法2:入れ替え時に複製する

1.ステージにある「1_txt」のシンボルインスタンスを選択してプロパティパネルを見ると、「入れ替え」というボタンがあるので、それをクリックする

2.入れ替えダイアログが出てくるが、入れ替え対象のシンボルが無い場合は、シンボルの複製ボタンを押して、その場でシンボルを複製することができる

4.シンボル名を「2_txt」などと付けてOKボタンを押せば、シンボルが複製される

5.さらに入れ替えダイアログで「OK」を押すとステージにあるシンボルは「2_txt」という、複製したばかりのものになる

5.ステージにある「2_txt」の中を編集して、「1」を「2」と直せば良い

今回紹介したどちらの方法でも良いので、「1_txt」と寸分違わぬシンボルのバリエーションを9個作成しておこう。次回は、この複製したシンボルをカウンタにするという作業に入っていく。

伊藤のりゆき(NORI)
有限会社トゴル・カンパニー代表。オーサリングエンジニアとしてFlashとMovable Typeでの制作を中心に活動。ロクナナワーク ショップ講師、アックゼロヨン審査員、ライターとしてFlash関連書籍や雑誌記事の執筆を行うなど、幅広く活動している。また、写真家としての顔も持つ。フォトブログ「Snap || Nothing」はこちら。