Flashのマスクを用いて静止画を効果的に見せる方法教えます

文:John Lee(Special to TechRepublic)
翻訳校正:村上雅章・野崎裕子
2008/03/05 08:00

Flashを用いることで、ビットマップベースの静止画にインパクトのある視覚効果をつけることができる。本記事では、マスクアニメーションという手法を用いて静止画に動きをつける方法を紹介する。

 いったん写真をステージ上に配置できたのであれば、キーフレームアニメーションに使用するためのレイヤーを用意する必要がある。まず、タイムラインパレット上にある、[レイヤー1]と書かれた部分をダブルクリックし、このレイヤーの名前を「Photo」に変更する。その後、マウスのポインタをPhotoレイヤーの24フレーム目に持って行く。そしてそれを選択した後、右クリックし、表示されたポップアップメニューから[キーフレームの挿入]オプションを選択する。これでタイムラインパレットは図Dのようになっているはずだ。

図D 図D アニメーションの最後にキーフレームを挿入する

 次のステップはPhotoレイヤーをロックすることだ。Flashのタイムラインによって1つのレイヤー上で動かせるオブジェクトは1つだけであるため、今回のようにマスキングオブジェクトを描画し、それを動かそうとする場合、ここでロックしておくことは重要である。Photoレイヤー上に誤ってマスクオブジェクトを直接描画した場合、あなたのアニメーションはうまく動作しないばかりか、Flashは何の警告メッセージも表示してくれないのだ。また、プロのFlash開発者たちは皆、すべてのステージオブジェクトをそれぞれ個別のレイヤー上に保持させることでアニメーションを作成している。このことは、保存をまめに行うことと同様に、習慣付けておくことが望ましい。Photoレイヤーのロック方法が判らない場合には下記の図Eを参照し、ロックボタンの位置を確認してほしい。

図E 図E Photoレイヤーをロックする

 タイムラインパレット上にある[レイヤーの追加]ボタンを押下し、先ほどと同じようにして新しいレイヤーの名前を「Mask」に変更する。このレイヤーが、すべてのアニメーションを実行する場所となる。これでタイムラインパレットは図Fのようになっているはずだ。

図F 図F マスク用の新たなレイヤーを追加する

 ここで、Flashのタイムラインパレット中のマスクがどのように機能するのかを説明しておこう。マスクレイヤー上で表示されるオブジェクトはすべて覗き窓のようなものとして機能し、それを通じて下のレイヤー上にあるオブジェクトが表示され、該当マスクレイヤー上のこういったオブジェクトの外側にある領域は下にあるレイヤーを覆い隠してしまうわけだ。もしも私の説明していることのイメージがよく把握できないという場合でも、すべてはすぐにはっきりするはずなので、読み進めてみてほしい。

 それでは作業に戻ろう。タイムラインパレットに表示されているMaskレイヤーの1フレーム目をマウスでクリックして選択する。次に、左端にあるツールボックスから[矩形ツール]を選択する。そして[塗りのカラー]オプションから塗りつぶし色として赤を選択する。われわれが描画しようとしているものはマスクであるため、この矩形がどんな色であっても構わないものの、背景を黒にしていることから、視認性を考えると赤が適当だろう。また、[線のカラー]オプションが選択されていないことを確認しておく必要もある。このオプションが選択されていると、ステージ上に矩形を描画した際、囲み枠が描画されることになる。ツールボックスに馴染みのない方は図Gを参照してもらいたい。

図G 図G ツールボックスから[矩形ツール]を選択した後、[塗りのカラー]で赤を選択する。[線のカラー]は選択しないようにする

記事の感想やご意見をコメントでお寄せください(CNET_IDログインが必要です)
ログイン パスワードを忘れた方  |  新規登録
  • 昨日のトップ記事
  • 2日前
  • 3日前
  • 4日前
  • 5日前
  • 新着記事
  • 人気記事
  • 特集
  • ブログ