複数レイヤーを階段状にせず、ヌルのキーフレームだけでディレイさせるエクスプレッションです。各レイヤーを別々のものに変えたり、他パラメータが自由だったりと、エフェクト『エコー』よりも柔軟なコントロールや応用が可能です。
- ヌルを作成。名前は『ヌル 1』。
- ヌルに『スライダー制御』を２つ適用。名前は『スライダー制御』『スライダー制御 2』。
- 好きなレイヤーをとりあえず１つヌルの下に置く。
■その他
作例ではY位置パラメータのエコーを作るので、位置は『次元に分割』しておく。
*名前類はエクスプレッション内の記述と合わせればなんでもよいです。
mCtrl = thisComp.layer("ヌル 1");
mMove = mCtrl.effect("スライダー制御")("スライダー");
mDly = mCtrl.effect("スライダー制御 2")("スライダー");
mActIdx = ( index - mCtrl.index ) -1;
mRst = mMove.valueAtTime( time - ( framesToTime( mDly * mActIdx ) ) );
mRst;- レイヤーを好きなだけCtrl+Dで増やす。
- 『スライダー制御』はマスターの動き。好きな動きのキーフレームを打つ。
- 『スライダー制御 2』はディレイ具合。１レイヤー毎に遅らせたいフレーム数を入れる。
■その他
作例では他パラメータの自由度がわかりやすいよう、最後に各レイヤーのX位置を手動で横並びにしてあります。
以上です！
使いどころ
同キーフレーム値のレイヤーをずらして重ねる手法は、色々な場面で使います。が、修正の際はいちいちレイヤーのずれを元に戻してキーフレームを修正、コピペしてまたずらし…と面倒ですね。そんなときに使えます。また、他のインデックス系エクスプレッションと組み合わせた応用次第で色々なことができます。まずは仕組みを詳しく解説します。
解説
最初に、コントロール用ヌル、パラメータとなるスライダー制御２つを扱いやすいよう変数に入れます。
mCtrl = thisComp.layer("ヌル 1");
mMove = mCtrl.effect("スライダー制御")("スライダー");
mDly = mCtrl.effect("スライダー制御 2")("スライダー");次です。このエクスプレッションはレイヤー番号を使った、いわゆる『インデックス系エクスプレッション』です。しかしヌルを上にしたことで、ヌルの下にあるレイヤーの番号が『１』ではなくなってしまいました。そこで、レイヤー自身の番号からヌルの番号を差っ引くことで、レイヤー番号を『１から順』に修正します。都合のよいことに、これでヌルの上に何か置いても番号が変わらなくなります。
*インデックス系エクスプレッションの番号は『ゼロ始まり』のほうがなにかと都合がいいので、そこからさらにマイナス1しています。
mActIdx = ( index - mCtrl.index ) -1;最後です。このエクスプレッションの肝ですね。やりたいのは「同じキーフレーム値だけど、各レイヤーでずれた値にしたい」ってことでしたよね。「同じキーフレームを時間差で読み取る」ことでそれを実現します。
mRst = mMove.valueAtTime( time - ( framesToTime( mDly * mActIdx ) ) );
mRst;■日本語訳
mMove（動きキーフレーム）の指定時間の値を読み取ります。その指定時間っていうのは、現在のインジケータの場所から『mDly（ズレ尺フレーム数）×レイヤー番号』ぶんだけ左へ戻った箇所です。
くだいて言えば「同じキーフレームを読み取ってほしいけど、ちょっとずらしてくんない？ズレ間隔は指定するけど、レイヤーが下にあるほどズレを増やしてく感じで」というオーダーですね。
ここで、番号を１からではなくゼロ始まりにしたのが生きてきます。１枚目のレイヤー番号がゼロのため、ズレ尺×ゼロとなり、１枚目のレイヤーはずれないんですね。
*注意
「後ろにずらしていくから『time – 〇〇』じゃなくて『time + 〇〇』じゃないの？」と考えがちです。マイナスしているのは「ちょっと『前の値』から読み取っていくことで、読み取り箇所がキーフレームまで来るのが遅れる」ということですね。
■使用メソッド＆関数
- 〇〇.valueAtTime(時間)：〇〇の値を時間指定して得るメソッド。
- framesToTime( 〇〇 )：単位が『フレーム』の数値〇〇を『時間』表記に直してくれる関数。
*ここで言う『時間』とは、１秒を『1』とする単位。なので１フレームは『1』ではなく、もっと分割した数となる。具体的に言えば、29.97fpsであれば 1 / 29.97 = 0.0333667…となる。計算がめんどうだから、関数を使うのです。
例えば「インジケータが3フレームのところの値を得たいなあ」と思って〇〇.valueAtTime(3)とすると、３秒のところの値を得てしまう。なので、framesToTime(3)で『時間』表記に変換してから入れる、ってことです。
発展
mMove（キーフレーム）は、操作するレイヤーパラメータと『値の形式』さえ合っていれば、どこから持ってきてもいいです。つまりパラメータが『次元に分割していない位置』とか『スケール』など値が２つのものなら、mMoveをスライダー制御ではなくポイント制御にすればOKです。なんだったらエフェクトではなくヌル自身の位置キーフレームを使ってもよいわけですね。
以下、そのような場合のエクスプレッションです。
mCtrl = thisComp.layer("ヌル 1");
mMove = mCtrl.position;
mDly = mCtrl.effect("スライダー制御 2")("スライダー");
mActIdx = ( index - mCtrl.index ) -1;
mRst = mMove.valueAtTime( time - ( framesToTime( mDly * mActIdx ) ) );
mRst;
そしてこれが核心ですが、まず１つは、このエクスプレッションはアニメの道具箱様に記載されているような自動整列するインデックス系エクスプレッションと組み合わせれば、最初の動画のような整列＆アニメーションを自動でできます。
そしてもう１つ。『mMove』のキーフレームを0～100にして、それが『各レイヤーにとって具体的にどんな値を表すか』は各レイヤーにスライダー制御を２つ、〇〇と××を作って決めておく。そしてリニア関数を使い、linear( mRst , 0 , 100 , 〇〇 , ×× )とすると――「同じキーフレームの動きでズレながらアニメーションするが、結果の形は各レイヤーで違う」といったことが可能です。つまり、工夫次第でグラフが自作できるんですね！
是非とも活用ください！
