Easing
The curve mapping elapsed time to progress, and the main reason motion feels right or wrong.
Easing is the function describing how an animation's progress relates to elapsed time. Linear motion — constant velocity — looks mechanical because nothing physical moves that way; everything real accelerates and decelerates.
The standard vocabulary is ease-out for things entering (fast start, gentle settle, feels responsive), ease-in for things leaving (gentle start, quick exit, feels decisive), and ease-in-out for things moving between two on-screen positions. Spring-based motion parameterizes stiffness and damping instead of duration, which produces movement that reads as physical and responds naturally to interruption.
Most "the animation feels off" complaints are easing complaints rather than duration complaints. A characteristic one: a curve that decelerates too abruptly makes an animation appear to stop and hang mid-flight before continuing. The fix is smoothing the transition between the fast and slow portions, not making the whole thing faster.
Duration still matters and the useful range is narrow. Under roughly 100 milliseconds motion is not perceived as motion; beyond roughly 500 it begins to feel like waiting. Larger objects and longer distances justify longer durations, which is why a single global duration rarely serves everything — and why two deliberately different durations in one composite animation can be correct rather than a bug.
See also4
Motion Design
Using movement to communicate change, continuity, and hierarchy rather than to decorate.
Design & Interface17 connections
Staggered Animation
Offsetting the start of sibling animations so a group reveals in sequence.
Design & Interface8 connections
Reduced Motion
An operating-system preference signaling that animation should be minimized, for real medical reasons.
Design & Interface12 connections
Rhythm Game
a genre that judges player input against a musical beat, where calibration is a fairness problem, not a preference.
Play & Games9 connections
Related5
Nearby in the graph rather than deliberately chosen. Looser, sometimes surprising.
Linked from5
- Color ContrastDesign & Interface
The measured luminance difference between foreground and background, and the accessibility floor it must clear.
- Game FeelPlay & Games
The perceptual layer between input and simulation, and the tuning that makes a control scheme read as responsive.
- Motion DesignDesign & Interface
Using movement to communicate change, continuity, and hierarchy rather than to decorate.
- Reduced MotionDesign & Interface
An operating-system preference signaling that animation should be minimized, for real medical reasons.
- Staggered AnimationDesign & Interface
Offsetting the start of sibling animations so a group reveals in sequence.