44
Great UI animation has purpose and style
http://img.archiexpo.com/images_ae/photo-g/contemporary-chair-polypropylene-charles-ray-eames-80422-3019841.jpg
Animating With Purpose
The Brain Benefits of AnimationReduce cognitive load
Prevent change blindness
Better recall of spacial relationships
Lower perceived load times
Design Problems Animation Can Solve
OrientationReinforce mental models of the interface and
show how content is related.
Guide TasksBy showing cause and effect and cueing
current or potential actions.
DemonstrateShowing how something works or what to
expect in a short amount of time.
Direct AttentionLeading the eye and calling attention to
changes and important items.
Going “Faster”Perceived performance gains by
transitioning content in.
“Our findings indicate that the psychological mechanism of transitions is completely different from progress bars”
viget.com/inspire/experiments-in-loading-how-long-will-you-wait
The Bigger Picture
ChoreographyDesigning all your UI animations
to feel logical and related.
Similar objects animate in similar ways
Entrance informs exit
Match velocities
Cohesive over consistent.
Consistent
Cohesive
Be Inspired!
