Importance of motion
Motion is not simply the cherry on top of the UI. Motion is essential in directing the user’s attention to an important event and showing them what has happened.
- is a visual cue that an event has occurred
- reduces cognitive load as it makes it easier to understand what is happening
- makes the interface feel faster
- makes it easier to recall and learn for next time
A good example of this is the transition of the side panel sliding in from the side. If it didn’t animate, it would suddenly appear and the user would wonder ‘where did that come from?’. But when it transitions in smoothly, the user is given a vital get a clue where the element came from.
Animations should be fast and nimble, never keeping the user waiting longer than is necessary. The aim is to prioritize user-perceived performance over technical benchmarks.
Motion should help ease the user through the experience. It should aid the flow of actions, giving clear guidance for user orientation: spatial or temporal.
Enterprise level applications require highly effective user interactions. So in their animation design, transition times should be as minimal as possible.
Preventing change blindness
Significant changes in a web page can remain unnoticed when they lack strong cues, because of the limitations of human attention. [Nielsen]
- Make one change at a time
- Group all elements that will change simultaneously in the same region of the screen
- Use animation to signal change, but avoid having too many competing animations on the screen to prevent a dilution of attention