Good illustration matters

Illustration is probably one of the oldest forms of communication. Conceptually speaking, it's prior to alphabets and text, and it was never replaced. Instead, it became a complement to the complexity and length of written text, even helping people learn how to read, whilst providing visual cues and context. In different states of cognition, illustration will serve different purposes, because it's such a rich means of communication.

According to the Merriam-Webster dictionary, it is "to make clear by giving or by serving as an example or instance", "to provide with visual features intended to explain or decorate" and "to show clearly". The church, for example, did this for many centuries, through drawings in books, paintings, sculpture and even architecture.

To illustrate is to clarify.

Example of an illuminated manuscript

People kept on illustrating within several types of media, but mostly print. Then new media, such as cinema, appeared and animation came along. Eventually we reached the point where we're at now and illustration is progressively having a comeback as a forefront form of communication. It's not just print anymore, not just magazines or select types of books. It's websites, it's branding, it's UI.

That being said, could you design your product by only using typography, navigation elements, colors and stock photos? You definitely could, but here's why I think you should go the extra mile.

Get everyone's attention with illustration

First and foremost, illustration is an attention grabber. And there are several reasons why you want this attention grabber. It could be that you're just introducing your product for the first time to your target through a landing page for example. Or it could be that within an informative page layout you need to direct the user's eyesight somewhere specific.

https://dribbble.com/shots/4405446-Rubik

https://dribbble.com/shots/3278766-Marketing-Page & https://dribbble.com/shots/3993210-Organic-Shapes

Images will often be picked as an attention focus over text, so there's multiple ways you can use this to your advantage, which leads us to the next point: illustration is informative.

Make a point

A good illustration will complement your copy. It will be a support to the points you're trying to make across, whilst also enhancing the information that is most relevant. It will also make the user more prone to reading your text because they want an explanation for what the illustration has suggested but not explicitly told.

https://dribbble.com/shots/3367317-Universitet-Modules

Besides this, illustration will manage to communicate things that are hardly comprehensive through copy, such as emotions and moods. Everyone is getting tired of the copy that tries to appeal to your emotions whilst informing you what they do, through a list of vague adjectives followed by catchphrases and calls to action.

Don't (just) say it, show it. Show those emotions and moods through imagery, shapes and colors.

https://dribbble.com/shots/4811070-Tracker-Onboarding

Play it all together

Allow your typography and colors to truly shine through images that carry the viewer to another place, another mindset, a happy space where their problems are solved by your product.

https://dribbble.com/shots/4374127-Friends

Your Times New Roman won't be just a simple serif font anymore, it will be part of something greater that can carry the seriousness and reliability of a newspaper serif, whilst conveying all the ideas and identity of your product.

https://theblog.adobe.com/introducing-spectrum-adobe-building-design-system-scale/ & https://dribbble.com/shots/3903997-Illustration-for-the-Everwill-part-2

Colors will gain another weight and meaning, and won't be just abstract and vague anymore. They will serve a purpose in a scenario where the user is satisfied.

Tell a Story

Good illustration work will guide your viewer through a narrative, thought process or even tutorial for example, whilst allowing the page to breathe in order to not swamp your user with information.

These illustrations can also represent the product itself. If you feel like a printscreen of your product might contain too much information for a landing page, for example, don't be afraid to show a minimalistic representation that conveys what the product does. It will surely avoid overwhelming your user.

https://dribbble.com/shots/3634954-Exploration

This is a technique that can efficiently be used for step by step tutorials and on-boardings, for example. Focus on the feature you want to introduce to your user. Or on the way that the feature will be used in a real-life context - in other words, showing the user interacting with the product. You could even go as far as using animation.

https://dribbble.com/shots/2851448-Nooklyn-Onboarding

Sure, you can have just a regular loader with a spinning animation, but how about using that time to convey a message? It could be a tip of how to use certain features like "did you know that...?", or just an entertaining animation that will not bore the life out of your user. It could be the make or break of certain interactions within your product, as people do not enjoy waiting.

https://dribbble.com/shots/4102925-Shopify-POS-Empty-state

Just stop using stock photos

Of course none of this will come cheap, as good illustration takes some time. One alternative within an illustrative solution would be to use stock material, but that's where you'll be missing out on specificity and identity. Your illustrations should be a mirror of your principles and aesthetic values.

Another alternative would be to use paintings as one uses stock photography, with the added benefit that you can graphically mess with them and come up with some interesting visuals that reinforce what your brand is all about. There are plenty of libraries with free-to-use paintings, from renaissance to modern art.

https://www.behance.net/gallery/13623643/Modern-Renaissance

One could say this is not illustration work, but I would consider this solution to be a mix of photography with the usage of art to convey ideas and moods. It's possible that it won't be as specific in what comes to the description of your services or features, but it could be a fresh alternative.

https://www.behance.net/gallery/37096653/The-Fine-Wine-Embassy

An alternative to the same old stock photos of laptops and smartphones on top of designey wooden tables that pretty much no common folk can afford. It's not believable anymore, it's overdone.

Not to say that illustration is something new, but there's definitely a lot more space to explore different expressive and informative possibilities, whilst reinforcing your brand's identity.

At Imaginary Cloud, we simplify complex systems, delivering interfaces that users love. If you’ve enjoyed this article, you will certainly enjoy our newsletter, which may be subscribed below. Take this chance to also check our latest work and, if there is any project that you think we can help with, feel free to reach us. We look forward to hearing from you!