Everybody likes animation. When done properly it looks beautiful, adds uniqueness, makes things more expressive. It can do wonders regarding driving traffic and boosting your website’s popularity. Better yet, it is still not particularly widely used in web design – probably as a hold-over from the times of small bandwidths and non-optimized animation methods. For you, it is an opportunity to get ahead of your more conservative competitors – and you don’t even have to hire a professional animation studio like Spiel Creative to create promotional animation videos.
The uses of animation in design are many: you can spruce up your typography, make your navigation shine and, in general, add movement to the areas of your website where one doesn’t expect them. Here are some easily accessible WordPress plugins that can do the trick:
1. Animate It!
If you aren’t particularly tech-savvy or just want something that will work right out of the box, without much tinkering, Animate It! is a choice for you. It is well-optimized, offers a user-friendly interface and more than fifty animations that can be applied to actions like a scroll, hover and click. Selecting Animate It! Means you won’t have to waste any time analyzing comparative advantages of animation sets offered by several plugins – it covers an impressive mix that is more than enough to start out.
2. Social Media Flying Icons
Social Media Flying Icons perform two functions: on the one hand, they add movement to your website, making it look alive and active. On the other hand, they guarantee that your social media buttons are going to be noticed by the visitor, and you won’t lose your precious likes and follows. As usual, the simplest solution is the best one – you won’t have to create any complicated animations, as this plugin comes with smart-looking floating movement.
3. Enliven ‘em!
Enliven ‘em is a port of a jQuery plugin which purpose is to animate any vector graphic in SVG format. It offers an impressive library of animations that begin playing as the image becomes visible in browser’s viewport (which is a clever method of demonstrating animation on non-hover devices). The animation may be set to repeat if the user taps or clicks it.
One of the most popular WordPress slider plugins, MetaSlider allows for the creation of four different types of SEO-oriented slideshows. These can be further customized with a variety of options – you will find anything from a lightweight variant aimed at maximum effect alongside with minimal bandwidth use to one with 16 transition effects and a number of other features.
5. Page Animations and Transitions
If you want the animation to accompany the visitor all the time he browses your website, why not prettify transitions from one page to another? Page Animations and Transitions offer nine animation effects (Fade, Rotate, Flip, etc.) that can be customized and tweaked to meet your requirements.
6. Image Hover Effects
When you need to attract additional attention to a particular element of your website, there are few things more effective than adding hover effects to them. These will play an animation when the visitor scrolls over different options, making them stand out and encouraging the user to click them. There are many other similar plugins, but Image Hover Effects is unbeatable in terms of simplicity and ease of use. It offers more than 40 hover effects and a full-fledged set of admin options.
7. The Loading Bar Plugin
This simple yet powerful plugin displays a loading bar (shaped and colored according to your preferences) as the visitor opens your website. As different elements of your website are loaded, the progress bar will fill in, and when it fills up completely, the visitor is shown your website. There are two reasons to use this plugin: first, it assures the visitor that the website started loading. Second, it prevents the visitor from seeing your website as a mishmash of broken, half-loaded images while it gets loaded.
Animation plugins are a simple but effective way to liven up your website and direct the visitor’s attention the way you want. Just don’t overdo the things: too much animation is just as bad as no animation at all.