Member-only story
A guide to adding animations to your product — examples and tools
Animation, it might be a buzzword in 2015. Though we don’t talk web animation a lot, it is still happening. Animation helps us to tell a better story. It captures users’ attention and makes users more engaging. According to this article, the web animation can be divided into several types: Interface Element Animation, Waiting Animation, Storytelling Animation, and Purely Decorative Animation. In a UXer’s perspective, I do not encourage Purely Decorative Animation on website design. Be sure to make every animation meaningful. I’ll suggest two situations that animation works well :)
When the page needs time to load…
It is always frustrating to see nothing on the page, and it causes bounce. Of course, we all know page speed (please kindly try this) influence user experience a lot. However, there is one way to soothe the anxiety. There was a study indicated that the skeleton screen was perceived lower time than the blank or spinner screen. And it is wildly used in Facebook, LinkedIn, YouTube, Google Drive and more. So, try it!
