A presentation at Design Matters in in Copenhagen, Denmark by Val Head
Elevate Your Design With Animation Creating meaningful animation in interfaces Val Head • @vlh Author of Designing Interface Animation Design Advocate, Adobe
What makes good UI animation?
Great UI animation has purpose and style
Continuity Reinforce mental models of the interface and show how content is related
Visual Continuity Maintaining the “thingness” of an object during points of transition
Choreography Many moving pieces, and “real” expectations
Overlap groups of actions Tip: overlapping action (offsets) can also be great for performance!
Similar objects should animate similarly
Entrances should informs exits
Match velocities, not duration
Feedback Letting users know that something has happened
Direct Attention Leading the eye and calling attention to changes and important items
Hinting & Affordances Helping users see the effects, or potential effects, of their actions
Designing Interface Animation designinginterfaceanimation.com
for free. You
can too.