Motion Design
Motion design is the use of movement to support meaning, transition, hierarchy, and emotion.
In UI, motion should clarify behavior, not only decorate the interface.
Motion can also be used before implementation through animated mockups, where a team shows how an interface could behave before building the real product.
Useful Roles
- show cause and effect
- guide attention
- explain transitions
- soften state changes
- communicate loading or progress
- support storytelling
- reduce uncertainty
- help clients understand interactions
- align designers and developers
Watch Out
Motion becomes weak when it is too slow, too decorative, or inconsistent with the interaction.
Good motion helps the user understand what changed.
Handoff
Useful motion handoff should explain:
- trigger
- duration
- easing
- start and end states
- what is essential
- what can be simplified for implementation
Static screens often cannot communicate these decisions clearly.