Along with typography, color, and texture, image style is one of the central elements of a brand’s visual identity. This is especially true on a website, where images have a huge impact on the user experience.
Illustrations are an always-popular choice for website imagery. There are a few reasons why brands choose this style over other options:
✅ Unlike stock photos, illustrations can be made completely custom (so you know no other brands are using the same images).
✅ Unlike custom photography, illustrations can be created remotely (which is especially important post-COVID).
✅ Unlike product images, illustrations don’t become outdated when the product changes or the UX gets updated.
Unfortunately, website illustrations have gotten kind of a bad rap over the past few years. That’s because of one specific style that was suddenly everywhere in the software, tech, and startup space. That style, since dubbed “Corporate Memphis”, has become something of a joke in the designer-verse.
Notably, many of the brands that were early adopters of this trend (Airtable, Zendesk, Asana, Hinge) have moved on to more photography-focused website styles.
At Salted Stone, we’ve helped hundreds of companies redesign their websites and improve their brands’ visual identities without falling into the traps of clichés and trends. In this article, I’ll explain our process for choosing an illustration style, and share four styles we still love in 2022.
How to choose a website illustration style
Design decision should always be born from the brand identity or story. The wrong illustration style can muddle or even degrade the personality of the brand if not chosen intentionally.
To help with this process, we'll usually start with a moodboard — a collection of images from around the web that enables us to triangulate what works with the brand personality and what doesn't
When discussing the moodboard, we guide the conversation to focus on a few key factors that will help us narrow down the possibilities. These are:
Concept and content: What’s the idea behind the illustrations? What do they need to depict? Should they represent your product? The people using it? Both? Are we going for realistic images, or abstract ones?
Execution: How will the illustrations be used? Where will they live on the website? What types of content will they be accompanying? Are we using a mix of styles, or just one? Do we need to create multiple versions of recurring elements? Will any of the illustrations need to be animated?
Brand attributes: What key words describe your brand voice and identity? If your messaging is bold and powerful, do we want bold and powerful illustrations to go with it?
4 website illustration styles we love
We create each brand’s moodboard based on everything we know about them, so every one is different. But for illustrative purposes (pun intended), here are a few styles we might include:
Style 1: Line work
A minimal and mostly monochromatic style that preserves negative space. Color is introduced to highlight specific information or brand elements.
This style is effective for isolating certain elements, or exhibiting a lot of information in a clean way — perfect for tech-based brands that want to create a feeling of precision. It's also a good choice if you're looking to add some subtle animation (e.g. elements that move on scroll).
Image source: BTR Energy
Image source: Highcourt
Image source: Bloom
Style 2: Clean, colorful, poppy
A modern and lively style, great for brands with “bold” personalities. This style is effective for adding some additional life or movement into the page, and is usually detailed enough to pull out specific elements or graphic motifs for later use.
Because these elements are shape-based, they can be saved as scalable vector graphics (SVGs) — which means they'll remain clean and crisp at any scale.
Image source: Zoe Pepper
Image source: Cacao 70
Style 3: Textured and dimensional
A more detailed style that includes painterly or "hand-drawn" elements that help with perspective and depth. Great for brands with “artistic” or “creative” personalities.
This style is effective in combining the digital presence of a brand with a more organic feeling. It also provides an opportunity to expand color palettes, as the multi-dimensional quality allows for more color variation.
Image source: Energizou
Image source: Treecard
Style 4: Isometric
A calculated and informational style. Although it’s been around a long time, this style remains effective in displaying information clearly and cleanly. It’s useful in situations where connectivity is an important element, but can be limiting in its applications.
Image source: Wrk
Image source: Wired Avenue
Need help choosing an illustration style for your brand?
Before you redesign your website, contact Salted Stone to get started with a visual identity workshop.
