Why Subtle Animation Is a Rising Star in Modern Web Design

Aug 31, 2015
Subtle animation

In the early 2000s, animation reigned supreme, thanks to Flash. You could do all conceivable things – make things fly in, rotate, grow and shrink and flip and twirl — to amaze the viewer. But there was a downside to this explosion — websites devolved into style over substance. But animation couldn’t be blamed for this shift. In fact, the treasure of possibilities opened up by Flash, tempted creators to go crazily overboard. Today, several things are coming together to bring animation back into modern web design, the most important of which is the functional and aesthetic purpose, the proper use of which can enhance user delight and provide the right context to make an interface easy to use. The other reason being Flat design, which has been in use for so long that it now looks a tad predictive and, at times, even boring. Animation, when used in subtle and creative ways, takes all that dullness away and makes a website stand out, look dated and intuitive.

Subtle Animations Can Create Magical Impact

Subtle animation gives life to your ideas, products, and services in such an attention grabbing way that it encourages, if not compels, the user to engage with the site. A look at how it has helped some great brands present themselves in interesting ways do let us know the reason behind the resurgence.

Fleet Feet Sports

Try buying something online from Fleet Feet Sports, a famous sports gear retail chain. When you try adding a product to the cart, the item transports itself into the bag. Additionally, the bag is made to bounce a little once the product lands inside. The resultant impact — an instant feeling of satisfaction, with the knowledge that click button had its intended effect.

Pro Foods

This site uses a hero shot to magnify the product – something we commonly come across. When users move the mouse around, they are severed with a subtle parallax effect that draws attention back to the main product. The light animation is designed to engage which at the same time ensures the user doesn’t lose focus should their eyes begin to wander.

Should You Use Animation for Your Website

If animations help to steer the user through your website, there’s no reason why you should be shying away from using them. It’s apparent, that in the days ahead animation will become an essential tool for designers just the way grids, color, and flow are today. Moreover, when languages like CSS3 and jQuery have made it easier to animate items on a page than before, you have another sound reason to include them in your site. However, it’s important that you keep an eye on the codes. Go for ones that are lean and efficient, so that integrating them into your website or mobile app design is hassle free. Also, don’t go for an overkill. Keep the concept simple and restrict it to navigation, scrolling, buttons, page transitions, images, pop ups and notifications to create a welcoming experience which is enjoyable and easy.