Choosing motion that helps people orient

Motion can explain how an interface changes, but essential content should never depend on waiting for an animation to finish.

Interaction design · 2 min read · Arden Shaw

Choosing motion that helps people orient

Choosing motion that helps people orient editorial visual

Motion can explain how an interface changes, but essential content should never depend on waiting for an animation to finish.

Connect related states

Use movement to preserve a sense of place when a panel expands or an item changes position. Keep the path short and the timing consistent. A visitor should understand the relationship without consciously studying the transition.

Prioritise feedback

A clear loading label, a stable layout and a completed-state message matter more than decorative movement. Make sure the same information remains available to keyboard and screen-reader users.

Respect reduced motion

Offer a quieter version that removes large translations and looping decoration. Test that version as a complete experience. Focus indicators, error messages and content hierarchy must continue to work when animation is absent.

For an expanding panel, begin with a stable heading and a short transition. Keep the control in place, preserve keyboard focus and make the expanded content available immediately to assistive technology.

← Return to the journal

Keep exploring

More from the studio.