Orvia

A digital design and development studio in Vancouver

Motion is information

2 min read

Easing curve panel comparing linear and ease-out dot trails over a cubic-bezier graph

There is a simple test for any animation on a website: if you removed it, would the person using the page lose any information? If the answer is no, the animation is decoration, and decoration ages fast. The animations worth keeping are the ones doing explanatory work.

Good motion answers three questions people never consciously ask. Where did this come from? What caused it? Where should I look now? A menu that slides out from the button that opened it explains its own origin. A deleted item that shrinks toward the trash explains where it went. Without motion, interfaces teleport, and teleporting things ask your brain to reconstruct what just happened. Motion is the interface showing its work.

Timing is stricter than most people expect. Interface feedback should generally finish inside three hundred milliseconds; below that, motion reads as a response, above it, motion reads as a wait. Larger moves, a whole panel, a page transition, can stretch to around four hundred. Almost every animation that annoys you on the web is not wrong in style, it is simply too long, playing a flourish while you are trying to get somewhere.

Onion-skin frames of a card entering from the left, ghosts fading toward the edge

Easing is the difference between motion that feels engineered and motion that feels physical. Nothing in the real world moves at a constant speed: things accelerate, then brake. Interfaces borrow the same grammar. Elements should arrive quickly and settle gently, the way a drawer closes. And exits should be faster than entrances, because people care about what is arriving, not what is leaving.

There is also a person on the other end for whom all of this is a problem. For people with vestibular disorders, large sweeping motion is not a preference but a physical trigger, which is why operating systems expose a reduced-motion setting. A well-built site listens to it and quietly replaces movement with simple fades. It is one media query, and it tells you a lot about whether a team sweats the unglamorous details.

So when a site feels calm and legible in a way that is hard to name, watch what moves. The craft is rarely in the things that animate. It is in how briefly, how purposefully, and how much was left still.