I like the term “invisible animation”. It’s catchy and it plays off the classic theme of Good design is invisible. The same goes for interface animation. When it’s done well, it becomes invisible.
Great UI animation improves the user experience. It clarifies, or adds to the task at hand. It becomes invisible by fitting in so well.
With UI animation you know you’ve hit that invisible goal when your users don’t even notice they’re looking at an animation at first. Animations like these are considered very early on in the design process. They are iterated on, tweaked, and improved until they feel like they’re organically part of the design.
It’s a lot like typography. Thoughtfully chosen and well designed type becomes invisible to the reader, yet still communicates so much. We put effort into choosing typefaces because we know it will make a difference. The same goes for animation.
There are two qualities all great interface animations have no matter their context:
They have purpose.
A lot of thought is put into why the animation is included in the design. Whether it’s there to orient the user, show relationships, give feedback, or demonstrate. The reason for these animations being there is known. The designer knows exactly what it is this motion is meant to communicate or tie together.
They have style.
Serious style. The look and feel of the movement is fitting, classy, and done with restraint. If the motion was too flashy or too slow, they’d stick out like a sore thumb no matter how well placed they were.
Great interface animation has both purpose and style.
Tweet this
Like much of design it takes time, patience, and a little bit of trusting your gut to get animations just right. We don’t always hit the mark perfectly, but when we do, we’re rewarded with that wonderful “ah ha!” moment where everything falls into place.
