A motion language built on springs instead of timelines, so every transition in the product can be caught, reversed, or redirected the instant the user changes their mind.
- Role
- Design engineer
- Timeline
- 8 weeks, 2025
- Stack
- React, Motion, springs
Problem
Animations you have to wait for
Every transition was a fixed-duration tween. Dismissing a dialog mid-open meant watching it finish opening first; fast users felt like the interface was ignoring them. Motion was decoration, not feedback.
Principles
Interruptible by default
Every transition can be reversed mid-flight. Springs carry their velocity into the new target, so a change of mind never snaps or stutters.
One clock, many layers
Surfaces, backdrops, and content share a single driving value, so a transition reads as one object moving — not four animations racing.
The page is the origin
Dialogs and detail views grow out of the element you touched and return to it, keeping spatial continuity across navigation.
Outcome
Perceived latency dropped because nothing ever blocks input: the interface responds to the second tap as fluidly as the first. The spring vocabulary shipped as a small set of named presets, so product teams stopped inventing durations and easings per screen.
Motion should listen, not perform.