And so, we move on to the fourth stop on our tour of the elements that make up all our online communications. The subject this time is animation. What contribution can it make? In which situations is it less effective? How is animation best delivered online?
What animation is good for
Animation is to diagrams and illustrations what video is to photographs. The added ingredient in each case is motion, and motion can be useful: it is eye-catching; it can represent in simplified form the action that we experience in real-life; it can also help in explaining how elements interact with each other.
Online animations come in a variety of forms:
- Transitions provide a bridge from one state to another, usually just for decorative purposes.
- Animated diagrams are particularly useful when explaining how things work and what the stages are in a process.
- Animated cartoons function as they always have, as entertainment.
- Interactive games and simulations have the potential to engage users in motivating challenges, free of risk.
- Software sims explain how tasks are completed in software packages.
- 3D environments go beyond the 2D to provide a more immersive experience, whether for gaming or for interaction in real-time with other online users.
- Application and desktop sharing, as used by web conferencing and other online software, makes it possible to review what is on a person’s computer from a remote location.
When animation is not so suitable
Animations, like images, struggle to convey precise meaning without verbal support from either speech or text. And they clearly have little practical function when there is no strong visual aspect to the content.
When used purely as an attention grabbler, animations can be annoyingly distracting. Users have been known to cover up a repetitive animation with their hand so they can concentrate on a task elsewhere on the screen.
Optimising animations for online delivery
As a general rule, animation should be used only very modestly for decoration or show. If a user is engaging with an online experience primarily for their own amusement or entertainment then fine, but more often than not the user is goal-orientated and does not want any distractions that get in the way of achieving that goal. A good example is the way in which elaborate animations are sometimes used to provide a gateway into a site – more often than not, users will find this annoying and look to get past it as quickly as possible. Online, the need is for speed; to get to the point.
Where animation is the main feature, as it would be with an animated cartoon or a software sim, then it makes sense to organise the content into short modules which users can access easily from a menu. You’ll also need to make it easy to replay any animation.
If you’re using an animation to draw attention to something new or important, then don’t loop endlessly, because this becomes irritating and distracting.
Combining animation with other elements
Animations combine particularly well with audio, which allows the eye to maintain attention on the animation, while the verbal content is communicated aurally. Text is an option, but then the eye has to switch back and forth. Animations do not combine well with a second visual source such as live video. If you want the user to focus on the animation, then it’s best to turn the video off, at least temporarily.
How animations are represented online
In the early days of the World Wide Web, the only available animation format was the ‘animated GIF’. This allows a series of images in the GIF format to be sequenced and looped. Animated GIFs are still used, noticeably for advertising banners, but the format is too bulky and inflexible for any serious animation tasks.
Macromedia introduced the Flash format in 1996 as a way of adding animation capabilities to web pages. Because Flash stores graphical elements in vector format, the animations (stored as Flash ‘movies’) are small in size and can be scaled up or down without losing quality.
The Flash format has grown enormously in sophistication and popularity since then and, in its current form, now under the wing of Adobe, it is capable of driving complete websites and applications as well as smaller interactive and multimedia elements within standard websites. Artists and designers can work directly with the Flash tool (and its associated scripting language ActionScript) to create bespoke animations, games, simulations and applications. However, the technology is also accessible to less specialist users through much simpler third-party applications which export in the Flash format. Examples include software simulation tools, game engines and many e-learning authoring tools.
Most but not all browsers can run Flash. Where not, this is usually because of the IT policy of a particular organisation, rather than the capability of the computer or browser. It does matter which version of Flash is being used, because earlier versions have much reduced functionality.
3D environments are not supported directly within HTML or Flash, although some applications (such as Caspian Learning’s Thinking Worlds tool) will work in a standard browser with the aid of the Adobe Shockwave plugin. More commonly, 3D games and worlds have to be installed on local computer.
Non-interactive animations, such as cartoons and software sims, can also be rendered as videos. This increases the range of situations in which the animations can be accessed (principally because some mobile devices, such as the iPhone, do not support Flash), but restricts the ability to scale the animations without quality loss.