Interaction design · 2 min read · Arden Shaw
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.
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.


