Animation at Work
Studies show that the more alive something appears, the more likely it is to capture attention and thus break change blindness.
Using a transition between changes in task flow or locations in information architecture ideally reinforces where the user has been, where they are going, and where they are now in one fell swoop.
The best way to spot a purely decorative animation is to ask, “What can a user learn from this animation? Does this guide them or show them something they wouldn’t know otherwise?” If the answer is no, you might have a decorative animation on your hands.
Context-rich animations have purpose and real meaning on the page, as opposed to existing solely to “delight.”
Just because an animation makes something look nicer doesn’t mean it’s worth the effort to implement from a development standpoint. Consider whether or not it’s adding information back into the system.
“Don’t make something unless it is both necessary and useful; but if it is both necessary and useful, don’t hesitate to make it beautiful.”
Jank breaks the illusion of life, so it’s important to stick to performant properties.
UI animation works best when it conforms to predetermined sets of rules. And if you’re working on a large project with a long-term growth plan, you’ll want to use animations that can be adapted to multiple uses while maintaining cohesion and consistency. This is where animation language comes in.