A presentation at From Business To Buttons 2019 in in Stockholm, Sweden by Val Head
Purpose and Style Using motion with meaning in interfaces Val Head • @vlh Author of Designing Interface Animation Senior Design Advocate, Adobe
Designing Interface Animation designinginterfaceanimation.com
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
Feedback Letting users know that something has happened
Direct Attention Leading the eye and calling attention to changes and important items
Choreography Many moving pieces, and “real” expectations
Accelerate into an action Tip: use “ease-in” easing for exits
Slow down before stopping Tip: use “ease-out” easing for entrances
Overlap groups of actions Tip: overlapping action (offsets) can also be great for performance!
Similar objects should animate similarly
Match velocities, not duration
Thank you! Newsletter: uianimationnewsletter.com Let’s chat on twitter: @vlh
Here’s what was said about this presentation on social media.
for free. You
can too.