Loading
June 4, 2026
I spent years in After Effects before I wrote a line of React Native, which means I notice a badly timed transition the way a musician notices a flat note. Most app animation is not broken — it is just poorly timed.
Reanimated for anything driven by a gesture or running continuously. Its worklets execute on the UI thread, so the animation keeps running while JavaScript is busy. This matters more than any API difference: an animation that stutters exactly when data arrives is running on the wrong thread.
Moti when you want Reanimated's engine with a declarative API. It is a wrapper, not a competitor — same performance, far less ceremony for the common cases. Most of my screen transitions are Moti.
Animated (the built-in) only for something trivial with useNativeDriver: true, or when you cannot add a dependency. It is not bad, it is just superseded.
Layout Animation is tempting for list insertions and genuinely hard to control. I reach for it last.
This is the part that actually separates apps that feel expensive from apps that do not.
Everything is 300ms. It is the default in every tutorial and it is wrong for most things. Small elements move faster than large ones — a toggle should settle in about 150ms, a full-screen sheet nearer 400ms. Uniform duration is why an interface can feel sluggish and twitchy at the same time.
Ease-in on entrances. An element arriving should decelerate: fast at the start, slow as it settles — ease-out. Ease-in makes it crawl then snap, which reads as broken. Exits are the reverse.
Everything animates at once. A list appearing should stagger, 20–40ms apart. Simultaneous is what a computer does; sequential is what the eye expects.
Spring physics with no damping. A bouncy spring on a modal is fun on the first open and irritating by the twentieth. Save overshoot for things that are meant to feel playful, and use it once per screen at most.
No reduced-motion path. useReducedMotion exists in Reanimated. Some people get motion sickness from parallax and full-screen transitions. Honour the setting.
If a user notices the animation, it is too slow or too big. Motion in an interface is there to explain where something came from — not to be admired.
Motion design is the other half of what I do. The studio side is here, and the apps are here.