Illustrations & Characters: Why Do We Use Them?

Illustrated characters are everywhere. Why do brands like Discord, Dropbox and even Google use them?

Blog Author ImageCalum McEneaney

October 17, 2020

What we'll cover:

There's a fad in the air. A trend. It seems like everybody's hopped onto the illustrated graphics bandwagon (ourselves included). So what's so good about using illustrations and illustrated characters in your design? Is there a reason for using these types of graphics beyond "oh it just looks nice"?

I think so.

Read on and find out how using illustrations can help your business connect with its customers and create a more authentic, approachable image online.

A brief history of illustrations

Throughout the long (but ultimately fleeting) history of humankind, we humans have been master storytellers. Let's take a quick trip through time, and get an understanding of where it all started.

The Stone Age

From the neolithic period (starting around 20,000 BC), cave paintings were used to share stories and concepts that humans couldn't quite grasp with words.

Using illustrated imagery, cavemen and cavewomen alike told stories of important events to their peers. The paintings above from Lascaux cave in France marked the beginning of visual storytelling as we know it.

Lascaux Cave Paintings
The Lascaux cave paintings. Image from Bradshaw Foundation.

The Renaissance

Jump forward several millennia and we come to arguably the most beautiful artistic period of all time. (Sorry, Picasso!)

While the quality of life during the renaissance wasn't good - at all - the quality of paintings had soared to unheard of heights.

As with the grubby, human-prototypes that lived in the Neolithic period, renaissance painters like Da Vinci and Sandro Botticelli used paintings and mesmerising artwork to depict stories.

(fun fact: the 'Botticelli' nickname means 'little barrel')

Renaissance Paintings
Examples of Renaissance paintings.

The Surrealism Movement

One of my favourite times in art history - and for good reason.

The surrealist movement shimmied away from realistic depictions of people and events, and ventured into the land of the imaginary - picture melting clocks and de-humanised faces (like the ones below).

This new, modern type of illustrative storytelling was all about portraying concepts and thoughts that words couldn't justify.

Surrealist Paintings
Some examples of artwork from the surrealism movement.

Anyways, let's move on.

To save your time (and my precious page speed), let's cut the historic stuff here, and move onto the importance of illustrations and characters in modern storytelling.

How Illustrations Tell a Story

Illustrations, as mentioned some 12,000 times already in this blog, tell stories.

And they're here for us when words aren't enough.

Oftentimes, a brand has a story to tell. Some brands use real-life photos or stock imagery that coincides with their story. This is alright for a lot of brands and works well sometimes.

Zendesk Home Page
Taken from Zendesk's website.

While photography can narrate stories really well, it lacks when it comes down to conveying concepts or ideas that are abstract, imaginary or intangible.

Mailchimp does a good job here in visualising a tricky concept. In the screenshot above taken from their home page, they're using an illustration to visualise the very concept of thought itself.

Mailchimp Homepage
Mailchimp's home page.

This wacky but effective illustration is confusing and practically impossible to describe, and that's the point. Illustrations are used when words aren't enough.

Mind-blown yet?

How Characters Depict an Emotion

Now let's talk about illustrated characters, and how they can help to guide your customers' emotions throughout your brand's story.

Where illustrations cast the net to capture users' attention and craft a storyline, characters and animated people portray the emotions that relate to your story.

Smart designers and brand agencies use happy faces and smiling characters to show customers how happy their other customers are.

Discord Home Page
Cute happy faces on Discord's home page.

Discord uses illustrations of happy little animals and characters to show how happy their customers are, and to remind potential customers how happy they might be while using Dropbox's software.

But it's not all about positivity.

Take for example our very own 404 page.

Input Media 404 Page
Our unhappy (but cute) 404 ghost.

While cute, our 404 ghost isn't happy, and either is the customer who landed on that empty page.

Characters should relate to the way your customer feels, all the time. If not, then they should be used to make the customer feel a certain way.

Make sense?

  • Brand new product or service? Happy, smiling faces.
  • Landed on a 404 page? Sad, disappointed or glum faces.
  • A limited offer or free goodies? Excited faces.

When To Use Illustrations

You don't HAVE TO use illustrations in your design and online. There's a time and place for illustrated graphics, as with everything.

You SHOULD use illustrations in certain scenarios though, like when you're trying to communicate certain ideas more effectively.

Mailchimp photography
Mailchimp doesn't always use illustrations.

To refer back to Mailchimp once more, their website is littered with illustrations, except for when they're referencing somebody (i.e. a human).

In sections or stories regarding real life people, Mailchimp use photography of those people instead of imaginary illustrated people. The reason for this is obvious - it just makes more sense to use real-life imagery when talking about real-life people.

So when SHOULD you use illustrations?

When trying to convey abstract concepts

When there's a concept, idea or thought that you're trying to convey that just isn't reachable by using words. Things like emotions, 'dreams' or when you're trying to portray characteristics like 'playfulness' or 'friendliness'.

Did you know that your brain can read and understand images within 13 seconds of first laying eyes on them? This means that sometimes it makes more sense to throw in an illustration to quickly summarise a concept that may take a few lines to describe.

When helping users navigate

Illustrated icons make life easier for users scrolling through your website (if you've got one). They make obvious where each button leads to, or what each heading really means.

Using icons and such, you're letting your customers understand where they're going and what they should be doing, without them even needing to read the text.

Webflow Home Page
Example of icons on Webflow's home page.

When trying to keep people interested

Sometimes you've got to write a long piece of text. Maybe it's a blog post or a walkthrough on how to use one of your products.

A lot of people are lazy, easily bored or they might not have the time to read everything. Using illustrations in situations like these ensures your customer has a base point while reading your text. Think of it as a beacon for every chapter, something that helps them understand what they've just read and what they're about to read.

How To Properly Use Illustrations

Before adding an illustration to your design, whether it's on your website or on an advertisement, ask yourself these 3 questions:

Question #1: What's the purpose of using this illustration?

Are you trying to convey an abstract thought that can't be relayed with words? Are you trying to help users navigate quickly and seamlessly through your website? The purpose of the illustration will directly affect the style, sizing and subject matter of that illustration.

Question #2: How am I going to display or visualise that purpose?

In what way are you going to accentuate the point you're making with the illustration? For example, Dropbox used this image to help you understand the heading it's connected to.

Dropbox's home page.

It clearly and effectively shows people who are running from their busy work schedule and into a different, more organised space.

The heading it corresponds to? "Say goodbye to busywork"

You see how the image and the heading both add up?

Question #3: Will this illustration tie in with my brand's look and feel?

Illustrations are just like any other element within your brand, and they need to relate closely with your brand's core message and aesthetic. If your brand colours are yellow and green, your illustrations need to match up with that colour scheme (or at least look good and consistent with your colours).

You also should pick an illustration style and stick with it throughout your design and brand experience. You shouldn't use 3D illustrations on one section and then 2D on another (unless it makes complete sense to do so).

Useful Illustration Resources

Here's a list of online resources for finding and downloading/purchasing illustrations. Some offer different types of styles than others, so find a website that works for you and your brand.

  • Freepik - All types and styles of illustrations, generally available in vector format. Go to Freepik.
  • Flaticon - For - you guessed it - icons. Allows customisation. Go to Flaticon.
  • Envato Elements - For illustrations and also pretty much any other graphics or images. Go to Envato Elements.
  • Vecteezy - Vector graphics and illustrations. Go to Vecteezy.

Click here and let us know how our team can help your business, whether that means getting you online or updating a previous, dated website that's been slowing you down.

Like this post? Keep up with us on Twitter, LinkedIn and Instagram.

More like this

Get free tips and insights in your inbox.

Just pop your email down below to be the first to hear when we post a new helpful article.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

More like this

web design wireframe Input Media

Get free tips and insights in your inbox.

Just pop your email down below to be the first to hear when we post a new helpful article.

Thank you! More useful articles will be delivered to your inbox in the near future.
Oops! Something went wrong while submitting the form.
. Get in touch today. Get in touch today