So-net無料ブログ作成
検索選択

制作備忘録(FLASH) [Web制作関係]

「動画は向いてないんだよなぁ、静止画しかできんよ」とブータレつつ、でも他にやる人がいないのでしぶしぶFLASHやってるあやこです。

今回は、「簡単に画像だけ差し替えられるようなムービーにして、更新コストをおさえてほしい」というご要望。
ということは、外部ファイル(SWFまたはJPEG)を読み込んで表示させる方法を採る必要があるようで。
それだけなら簡単かな?
ステージにMCを配置して、そこにスクリプトで外部ファイルを読み込ませればOK。
外部ファイルは現時点でもすでに何種類かあるそうなので、ランダムに選んで表示させるようにすると面白いかも。
ただ表示させるだけではイマイチなので、さらにMCに対してMCでマスクをかければ、動きも出てちょっと豪華に。

…ということで実施してみたら案外簡単だったので、とりあえずは制作メモ。

まず、読み込ませたい外部ファイルを用意。
(ここでは、外部ファイル名を image1.jpg , image2.jpg , image3.jpg と仮定)

そして適当にMCをライブラリに登録。MCはサイズとかカタチはなんでもOK。
そしてそれを、ステージの上に、インスタンス名(ここでは、 read_photo と仮定)をつけて配置。
注意するポイントは、実際にimage1.jpg~image3.jpgを表示させたい場所に、左上のポイントをきちんとあわせること。MCの中心でなく、左上になるので間違えないようにすること。

その後、レイヤーを追加。
追加したレイヤー上で、image1.jpg~image3.jpgを表示させたいタイムライン位置に、Action Scriptを追加。
スクリプト内容はこれだけ。

image = "image" + (Math.floor(Math.random()*3)+1) + ".jpg";
loadMovie(image , _root.read_photo);

一行にまとめることもできそうだけど、今のところはこれでOKとしておきます (^^;

そんで、マスクムービー用のMCを別途用意。
更に、read_photoのMCを配置したレイヤーの上にレイヤーを追加して、そこにマスク用MCを配置。
レイヤーをマスク設定すれば、自動的に読み込んだ画像に対してアニメーションが施される。

制作の作業はこれだけでOK。
注意として、アップする際に、SWFと画像ファイルを同一ディレクトリに置くこと(異なるディレクトリに置く場合は、Action Scriptのimage変数に相対パスの情報を追記する必要あり。
 例: image = "./file/image" + (Math.floor(Math.random()*3)+1) + ".jpg";)。
さらに、画像ファイルを変更する際は、ファイル名を同名にして上書きさせるだけで更新できるという嬉しさ。
まあ、画像サイズetcを調整する必要は当然あるけど、それはどのみち必要な作業なので問題なし。オーサリングの手間が省ける方が嬉しいし。

…なんか、想像よりもずっとあっけなく実現できてしまった感があるので、もうちょい工夫を加えてみました。
ダイナミックテキストでテキストファイルからキャッチコピーを読み出して表示させるという小技。
これなら、キャッチコピーの文章を変更するのに外部テキストファイルを編集&アップするだけでよくなって、FLASHをオーサリングする手間が省けますよね。
さらに、テキストのフォントを埋め込み設定しておけば、見た目も美しいので、クライアントもご満足かと。
その手順はまた次回。


nice!(0)  コメント(0)  トラックバック(0) 
共通テーマ:仕事

nice! 0

コメント 0

コメントを書く

お名前:
URL:
コメント:
画像認証:
下の画像に表示されている文字を入力してください。

トラックバック 0

この記事のトラックバックURL:
※言及リンクのないトラックバックは受信されません。

関連リンク

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。