Do I need Animation on my Website?

Animation is great, animation is snazzy. Animation is also intrusive, annoying and distracting when in the wrong hands.

My retinas have been burned by many a website where the design or developer (or both) have taken it upon themselves to cram in as many flying windows, parallax scrollers (more info on those here: https://en.wikipedia.org/wiki/Parallax_scrolling), hover effects, switches, colour changes, text effects and myriad other bits of ‘digital glitter’. When combined, these elements can often make for a poorly functioning website and a disappointing user experience, which discourages users from visiting your site again or buying your products.

However, animation isn’t all bad — it can play a vital role in improving the user experience of websites, through improved story-telling, encouragement and navigation.

Animation as Branding

When used appropriately (like in the Norway Travel App by Alexander M), animation can go a long way to providing a feeling of luxury or quality, making users feel excited by — and more willing to engage — with a website.

The style of animation used is an important extension of the company’s brand, much the same as their brand colours, typefaces and tone of voice — factors which affect how an audience perceives a brand and the level at which they interact with a company.

Norway Travel App

Animation as Navigation

Providing clear way-finding points and routes to help users navigate through content and information (like bright green fire exit signs in a dark cinema) is crucial when creating good quality online experiences.

When used well — like in the Trello Navigation by Aurelien Salomon pictured below — animation can be a powerful tool to help users perform a particular task, or quickly find an important piece of information.

Trello Navigation Animation

Animation as User Experience

Most modern websites have some kind of animation included in their design, and without any, can often look dull and uninteresting. Including animation at points where users perform tasks, interact with technology and require some kind of reward or gratification, can improve their experience.

In web design circles, these are called ‘micro-interactions’. For example; confirming to users that they’ve pressed a ‘like’ button on a dating app profile, or highlighting a GO TO CHECKOUT button once they’ve selected particular size of trainer.

5 Things to Consider

1. Does my website need animation? We know that it’s really common for websites to have animation, but will it do anything other than make things look pretty?
2. Is the style of animation ‘on brand’? Fast and aggressive motion effects might not be appropriate for a bed retailer.
3. Try and ensure that all animation on your site has the same kind of feel, that matches the brand and the type of content your are displaying.
4. Will animation be distracting or obscure the most valuable content or prevent users navigating smoothly through your site?
5. Test test test! Try out your animation on as many people as you can — using animation is ultimately about users and how they feel when using your site or app; if they’re not happy or they find something annoying, chances are they won’t come back and use your site again or buy your products.

Neil Quinn has over 10 years of experience working in the creative industries and has worked on projects for PayPal, Virgin Media, Sky and Foxes Biscuits. Neil co-founded and ran a graphic design agency in Nottingham where he was a Director for four years, before moving to Bristol in 2016. Neil worked as lead designer for a digital agency, before co-founding Polleni in October 2017 alongside Cat How and Rog How. Neil’s wide-ranging expertise encompasses the design of identities, websites, mobile apps, corporate stationery and vehicle graphics. Originally published at www.polleni.com on April 24, 2018.