1

I used After Effects recently to design easing for objects in an interactive graphic I'll be programming. For example, I animated a square's position and mask using the standard eases in the graph editor. Below shows the mask's speed graph which I'm interested in reproducing.

enter image description here

I'm fairly confident that eases on value graphs are standard cubic Bezier curves, so position is a piece of cake. However, speed graphs behave differently: pushing both keyframes to zero makes a bell-shaped speed curve, not zero. It needs to do this preserve the total amount of change (the integral), which means that it is not a cubic Bezier curve, not directly anyways.

Does anyone know how speed curves work mathematically?

Improve this question
2
  • It dawned on me that it's probably the derivative of a position cubic Bezier, and with some testing it looks like the influence translates to the horizontal influence in position, and the speed at each keyframes corresponds to the slope of the position influence handle.
    – concat
    Jan 15, 2018 at 22:09
  • You can see a numeric representation of the influence and speed by selecting a keyframe using the keyboard shortcut shift-cmd/ctrl-k. The handles are indeed cubic Béziers, so the derivative should give you the speed. You can access the speed of a property with expressions, so you could actually animate something to follow the speed of that property.
    – stib
    Jan 17, 2018 at 12:45

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Browse other questions tagged or ask your own question.