Interfaces that guide attention rather than compete for it
Motion, contrast and hierarchy are attention budgets. Spending them everywhere is the same as spending them nowhere.
/ In this article:
Every element that moves, pulses or glows is making a claim on a visitor's attention. A page where everything makes that claim is a page where nothing does.
The attention budget
Treat contrast as a budget. Each screen gets one primary focus, and everything else is arranged relative to it. When a stakeholder asks for a second element to be "made to stand out more", the honest answer is that something else has to stand out less.
Emphasis is relative. You cannot add it to everything.
/ TITANMATTER
Motion with a job
Motion earns its place when it explains a relationship: where a panel came from, what a control just did, which item is now selected. Motion that exists to demonstrate that motion is possible costs load time and, on a long page, costs patience.
Practical rules we keep
- One primary action per screen, visually unambiguous.
- Animation under 300ms for anything on the interaction path.
- Respect the reduced-motion preference — it is a stated choice, not a hint.
- If a hover state is the only way to discover something, it is undiscoverable on half your traffic.
