FPEで使ってできる、簡単な波の効果をご紹介します。
スライドショーで表示させる画像数枚と、波として利用する画像を用意します。
今回、波として利用する画像はFireworksで作成しました。単純に540x300の矩形を白黒グラデーション(サテン)で作成しています。
Fireworksをお持ちで無い方は、別途斑模様っぽいグラデーション画像で代替して下さい。

このサンプルでは3枚の画像を左上へ連続縮小させるスライドショーに、『波』画像をブレンドモード『overlay』で重ねています。
FPEのカスタムプラグインとして『波』画像の横幅を縮小させながら、高さを微妙に拡大縮小させることで揺れている感じになります。カスタムプラグインの詳しい利用方法はELZのFPEマニュアルを参照して下さい。

Flashで1から波の効果を作ると結構面倒なものです。擬似的ではありますがoverlayを利用した当テクニックは便利です。是非応用して下さい。

準備した画像の縮小イメージ

FPEでの波効果

FPEに読み込ませる定義ファイル(xml)の例


<?xml version="1.0" encoding="UTF-8" ?>
<pagedata>
<common>

    <copyright>elz.jp</copyright>

    <banner_align>3</banner_align>

    <image_max>3</image_max>

    <effect_type>in,out</effect_type>
    <effect_time>90</effect_time>
    <stop_time>0</stop_time>

    <prefix>images/wave</prefix>

    <zoom_mode>0</zoom_mode>

    <plugin_effect_type>filter1</plugin_effect_type>

    <plugin_blend_mode>overlay</plugin_blend_mode>

    <plugin_url>images/filter001.jpg</plugin_url>

</common>

<effect>
    <filter1 x="1,-540,0" xs="1,200,300" ys="304,10" alpha="301,50,0" />
    <in layer="0" x="1,0,50" y="1,0,50" xs="1,100,150" ys="1,100,150" alpha="13,100,0" />
    <out x="1,-50" y="1,-50" xs="1,50" ys="1,50" alpha="211,0" />
</effect>

</pagedata>