21 パターン画像を重ねたビデオ | デザインってオモシロイ -MdN Design Interactive-
【サイトリニューアル!】新サイトはこちらMdNについて


21 パターン画像を重ねたビデオ
制作・文=沖 良矢(世路庵)







【1】画像編集ソフトウエアで、ビデオに重ねるためのパターン画像を作成しよう。ここでは古いテレビのような効果を得るため、1px間隔の横線を引いた画像を用意した。ファイル形式は、PNGなどアルファチャンネルが利用できるものを選んでおこう。






【2】【1】で制作した画像をFlashのライブラリに読み込む。ライブラリメニュー→“プロパティ”でビットマッププロパティダイアログを開いたら、“ActionScriptに書き出し”にチェックを入れ、“クラス”に任意の名前を入力しよう。ここでは「MaskPattern」とした。合わせてビデオをM.C.にし、ステージに配置する。



【3】パターン画像を表示するためのSprite「masker」を作成し、表示する。【2】で設定したクラスを呼び出した後、「beginBitmapFill」を使って先ほど作成した「masker」をパターン画像で塗りつぶす。このとき、5行目で塗りつぶす範囲をビデオの位置とサイズに合わせておけば、両者が重なって表示される。


[INDEX]
●Flashの動き表現のアイデア
>>> 21 パターン画像を重ねたビデオ
>>> 22 背景のカラーバーが伸縮するメニュー
>>> 24 リアルなボールのバウンド
●注目のSilverlight 3の新機能
>>> 01 長針・短針・秒針が動くアナログ時計
>>> 02 オブジェクトのフェードイン・アウト
>>> 03 ブラウザ外でも動作するアプリ


twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在