今回は前回まで解説していた「波紋」エフェクトの動きをまとめて紹介していきます。
「波紋」エフェクトは「振幅」を変更すると見た目が大きく変わるのでそれをいかに使いこなせるかだと思っています。
「波紋」エフェクトアニメーション
「波紋」エフェクトには主に「X」「Y」「波長」「振幅」「周期」の設定項目があり、それらの値を変更することでオリジナルの「波紋」エフェクトを作成することができます。
「波紋」エフェクトをカスタマイズ
「波紋」は先にも書きましたが「X」「Y」「波長」「振幅」「周期」の項目があり、それぞれの値をカスタマイズすることで面白い動きを作ることができます。
今回はそんな「波紋」のそれぞれの値を変えたらどうなるかをまとめて紹介していきます。
1.「波紋」エフェクトの値を変更しよう
1-1.「波紋」エフェクトのデフォルトは以下の通りです。
(デフォルト値:「X:0px」「Y:0px」「波長:60px」「振幅:15.0px」「周期:0.50秒」
1-2.「波紋」エフェクトの「X」の値を「500px」にすると次のように右から左に向かって波紋が広がっていきます。
(他の値はデフォルト値です)
1-3.「波紋」エフェクトの「Y」の値を「500px」にすると次のように下から上に向かって波紋が広がっていきます。
(他の値はデフォルト値です)
1-4.「波紋」エフェクトの「Xの値を「-1000px」、「Y」の値を「-1000px」にすると次のように左上から右下に向かって波紋が広がっていきます。
(他の値はデフォルト値です)
1-5.「波紋」エフェクトの「波長」の値を「1000px」にすると次のようにゆったりと動くようになります。
(他の値はデフォルト値です)
1-6.「波紋」エフェクトの「振幅」の値を「100px」にすると次のように超音波の様なエフェクトになります。
(他の値はデフォルト値です)
1-7.「波紋」エフェクトの「周期」の値を「0.1秒」にすると次のように波紋が広がっていく速度が上昇します。
(他の値はデフォルト値です)
1-8.「波紋」エフェクトの「波長」の値を「20px」、「振幅」の値を「5px」にすると次のように波紋が小さく小刻みに動くようになります。
(他の値はデフォルト値です)
今回はここまで。
次回は「反復移動」について解説していきます。
コメント