Remap keyframe timing with slider

[sahils98]

I'm trying to make an Essential Graphics preset for some editors I work with. They have requested control over how long the animation lasts. So I have a text animation where the range is animated with 2 keyframes. I want to control the timeline position of each keyframe independently using sliders. Is there an expression for this?

[Dan Ebberts · Accepted solution]

Something like this, probably:

t1Start = effect("Slider Control")("Slider");

t1End = effect("Slider Control 2")("Slider");

t2Start = key(1).time;

t2End = key(2).time;

t = linear(time,t1Start,t1End,t2Start,t2End);

valueAtTime(t);

Dan

[sahils98]

Thanks, That did the trick

[christianc73350637]

Thanks so much for this, Dan.

[mattb25075222]

Hi Dan, would this be possible with 4 keyframes?

I have an animated precomp with an "animate-in" range (first two keyframes) and an "animate-out" range (3rd and 4th keyframes).

Ideally, I'd be able to control the second keyframe and the third keyframe so I can extend or compress the animation

[Dan Ebberts]

Try this:

t2 = effect("Slider Control")("Slider");
t3 = effect("Slider Control 2")("Slider");
if (time < t2){
  t = linear(time,key(1).time,t2,key(1).time,key(2).time);
}else if (time < t3){
  t = linear(time,t2,t3,key(2).time,key(3).time);
}else{
  t = linear(time,t3,key(4).time,key(3).time,key(4).time);
}
valueAtTime(t)

[rheinklangmedia]

Is there a way to make this work in Premiere in the Essential Graphics section?
My animation just ignores the sliders.

[rheinklangmedia]

Nevermind, it worked after changing Premiere to english.

[jessej12891174]

Hey @rheinklangmedia - any chance you'd be willing to share the mogrt you have working in premiere? I'm really more of a tinkerer so I think I need to get my hands on a working example to make it work for my own context. If anyone is curious I'm trying to create a dynamic-caption-generator mogrt that allows for timing the specific words with a slider.

[THreeSH98]

thanks Dan, but how else to add a loop to this expression? for example, I have a looped animation, but I want to change the position of a keyframe in the timeline to speed up or slow down the animation to add it to Essential Graphics. I just added loopOut(); at the end of your expression. but it didn't work.

[Dan Ebberts]

You'd have to create your own loop. If you're talking about the first expression, you could do it like this:

t1Start = effect("Slider Control")("Slider");
t1End = effect("Slider Control 2")("Slider");
t2Start = key(1).time;
t2End = key(2).time;

t = time > t1End ? t1Start + (time - t1End)%(t1End - t1Start) : time;
tNew = linear(t,t1Start,t1End,t2Start,t2End);
valueAtTime(tNew);

[THreeSH98]

Dan, you are a genius. Thank you very much. I'm just learning AE, and just recently learned the expression section of my tutorial. I would like to understand what mathematical calculations you indicated in this expression, but I do not understand. This expression worked for, but I don't even see loopOut("cycle"); in your expression. but it works. I'm delighted 🙂 I have so many questions left, is it possible to personally contact you somehow? Or I can create a thread here, and send the thread link to you so you can give a clue to a newbie like me. For example, I'm having trouble importing AI files into After Effects:

https://community.adobe.com/t5/after-effects-discussions/ai-layer-resizes-1-pixel-more-when-imported...

[Dan Ebberts]

If you add loopOut() to an expression, it doesn't loop your expression, it replaces whatever your expression has done so far with its own, normal, loopOut() calculation based on keyframes. So you need to cook up your own version of the loopOut math, which is what my expression does.

People do contact me directly (you can send me a message through this site, or contact me through my web site) but my AE knowledge is pretty much focused on expressions and scripting, so for general AE questions you're probably better off posting them in this forum.

[THreeSH98]

Dan, please excuse me for impudence, but please tell me how to make an expression like with a loop like the previous example, but with the type loopOut("pingpong"). I tried to tweak your past expression somehow with a regular loop, but I'm still stupid for that 😞
Also, could you show the expression with the usual loopOut("cycle") as in the previous example, but with 3 three keyframes, so I can theoretically also call like "pingpong" but with more customizable charts. Sorry if I write a little incomprehensibly, I use a translator.

[Dan Ebberts]

That takes a little more code, so something like this probably:

t1Start = effect("Slider Control")("Slider");
t1End = effect("Slider Control 2")("Slider");
t2Start = key(1).time;
t2End = key(2).time;

if (time > t1End){
  seg = Math.floor((time - t1End)/(t1End - t1Start));
  phase = (time - t1End)%(t1End - t1Start);
  t = seg%2 ? t1Start + phase : t1End - phase;
}else{
  t = time;
}
tNew = linear(t,t1Start,t1End,t2Start,t2End);
valueAtTime(tNew);

[THreeSH98]

Hello Dan, I came to you a year later, I need help with an expression, I needed to connect two loops “loopIn” and “loopOut” in managing keys through a slider. You already helped me with loopOut("cycle") and loopOut("pingpong").
I think I was able to change your code with loopOut("cycle") for my purposes of simultaneous loopIn("cycle") and loopOut("cycle"), here is the code, but I'm not sure, I changed it without completely understanding it.

t1Start = effect("Slider Control")("Slider");
t1End = effect("Slider Control 2")("Slider");
t2Start = key(1).time;
t2End = key(numKeys).time;
if (time > t1End){
	t = t1Start + (time - t1End)%(t1End - t1Start);
}else if (time < t1Start){ //For the loopIn condition set "time < t1Start".
	t = t1End + (time - t1Start)%(t1End - t1Start); //just swapped t1End and t1Start, is that correct?
}else{
	t = time;
}
tNew = linear(t,t1Start,t1End,t2Start,t2End);
valueAtTime(tNew);

But I have a problem with the combination of loopIn("pingpong") and loopOut("pingpong"), it seems to have worked there too, but in one of the frames the animation changes. Which means incorrect calculations. My brain still refuses to read what manipulations over time occur in your calculation. Please help me complete the expression.

t1Start = effect("Slider Control")("Slider");
t1End = effect("Slider Control 2")("Slider");
t2Start = key(1).time;
t2End = key(numKeys).time;
seg = Math.floor((time - t1End)/(t1End - t1Start)); 
phase = (time - t1End)%(t1End - t1Start); // I suspect that the variables "seg" and "phase" should change for loopIn.
if (time > t1End){
  t = seg%2 ? t1Start + phase : t1End - phase;
}else if (time < t1Start){
  t = seg%2 ? t1End + phase : t1Start - phase; // I swapped t1End and t1Start again.
}else{
  t = time;
}
tNew = linear(t,t1Start,t1End,t2Start,t2End);
valueAtTime(tNew);

[Dan Ebberts]

I think that would be like this:

t1Start = effect("Slider Control")("Slider");
t1End = effect("Slider Control 2")("Slider");
t2Start = key(1).time;
t2End = key(2).time;

if (time < t1Start){
  phase = (t1Start - time)%(t1End - t1Start);
  seg = Math.floor((t1Start - time)/(t1End - t1Start));
  t = seg%2 ? t1End - phase : t1Start + phase;
}else if (time > t1End){
  seg = Math.floor((time - t1End)/(t1End - t1Start));
  phase = (time - t1End)%(t1End - t1Start);
  t = seg%2 ? t1Start + phase : t1End - phase;
}else{
  t = time;
}
tNew = linear(t,t1Start,t1End,t2Start,t2End);
valueAtTime(tNew);

[THreeSH98]

Thank you so much Dan, you helped me a lot. I sincerely wish you good health and longevity.