Abby Rolfe
05-03-2015
Play icon

We're seeing a lot of video and animation on websites these days, and it's proven to be quite useful in brightening up the web experience. Designers have the freedom to express their creativity in a way that allows businesses to effectively enforce what they do and who they are. Videos and animations can tell a story, explain the use of a product, and keep users interested by being short and to the point.

Explainer videos

Attention spans are dwindling. Often viewers will make an instant decision on whether they're interested in your business. Explainer videos can be useful in keeping the audience engaged, and can tell your story creatively. They are short marketing videos (a few minutes long max) used to explain your company's product or service in a snappy and interesting way. A good explainer video should:

  • be succinct and to the point: not all of the details need to be included as long as the main important points are 
  • clarify the objective of your product
  • be creative and memorable: hard selling is off-putting 
  • appeal to and engage the target audience
  • be high quality and well thought out: the illusion of a professional looking site is easily burst by an amateur how-to video

IT company Panorama 9 have a quirky 8-bit explainer video, evoking the old school gamer in us all. Whilst taking us back to a simpler time, it uses the hero character 'IT Man' to show the work they can do to help the customer.

Our brains are wired to detect movement. So a good explainer video can work wonders for a brand if done correctly. Here are some of the creative techniques being used on websites and in explainer videos: 


Character animated video: 

These often use cartoon characters and are useful in telling a story. The characters can be likeable and endearing and the story could spark an emotional response in the viewer. 

A website advertising a children's illustrated e-book features a brief outline of the story including the characters moving around the site. It's a great way to showcase the creativity involved in the illustration and story and compels viewers to learn more by purchasing the e-book. 

http://babeltheking.com/eng

Whiteboard animation: 

This is quite literally what it says. It comes from the process of someone drawing on a whiteboard and recording it. Software is now used to create the whiteboard animations, and the outcome is usually a time-lapse or stop-motion effect. 

Adobe created this whiteboard animation to explain the use of their Echosign service which allows for electronic signatures and stores signed documents.


Motion graphics:

They are often used within a video to create interesting movement and rotation effects. Usually in combination with script and/or music, they can produce some visually impressive effects and can also help to explain how a product or service works. 
Designer Marisa Passos includes an eye-catching background animation on her homepage that is relatively simple and not too distracting, but adds a creative and dynamic element to the website.

http://marisapassos.com/

Screencast video: 

This is a simple way to showcase how a product or service works on a computer screen or smartphone. It involves a simple capture of the screen, and is useful for how-to videos.
CRM sales application Sales Cloud created a useful and easy-to-follow explainer video that uses a mixture of screencast and real life interaction. This allows the viewer to connect personally with the product and draws viewers more quickly into the conversion stage.


Video is one of the most powerful tools of communication. Communicating your story quickly and efficiently is essential to your success as a business, and video is an excellent creative platform on which to do this. You can create anything from a thought-provoking tear-jerker to an informative how-to video. The possibilities are endless. Providing that it's relevant to what you do, a good quality and well-thought out video can be great in telling your story.