This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Raghunath Rajaram
Posted Nov 03 - Read on Facebook

Hey guys, I'm new to Framer and would like to know what the best approach would be to create an animation like this. I've worked with after effects for years so it's a bit tricky getting used to animating without a timeline. What I've tried so far is chaining states where the 1st state is scale up, 2nd is rotate right, 3rd is rotate left, then return to default. This works ok, but since I'm waiting for one state to end before starting the next, it doesn't feel fluid. It's almost like there's a pause at the end of each one. How would I overcome this? I'm wondering if there's a way to trigger the next state at a defined time after the previous state has been triggered, instead of waiting for it to end? e.g. animate to StateA then 0.4secs later initiate animation to StateB. I was able to achieve this with multiple, Utils.delay functions but I'm wondering if it's the most efficient way to do this.


Jordan Robert Dobson

Utils.delay 0.4, ->
foo.animate “stateB”

Utils.delay 0.825, ->
foo.animate “stateC”

Jordan Robert Dobson

Are you using springs? If so the tolerance on them will need to be adjusted using your previous method since they essentially spring forever. It’s just if we notice they ended or not.

Stavan Himal

I think you can define all the properties in one state only. Just use two states: state A for animating it and state B for resetting it

Read the entire post on Facebook