A picture worth a thousand words: How to create a design language for your brand

Massimo Vignelli, creator of the ground-breaking Modernist New York subway map, said ‘Good design is a language, not a style.’

A design language is a visual vocabulary. It refers to the unified application of consistent visual and interactive elements across multiple mediums or products.

In the case of digital design for marketing purposes, that is: how a design is applied to a website and other marketing collateral.

It’s worth saying that concepts like brand positioning, tone of voice and messaging are as foundational to the visual part of your brand as the content on your website. They should inform the creation of your design language. If you have yet to put these in place, sign up for our free email lessons in strategic foundations.

Why brand design is worth caring about

Designing with intent, constructing a visual context to aid written communication, is not an easy task. But, when it's done right, it’s worthwhile.

To go one step further, they say we humans communicate more with body language than with the words that come out of our mouths. The communication iceberg applies to online B2B comms, too. You need to convey a complex, multi-faceted impression of who you are as a business, why customers should care, and what they need to do to buy from you, all in a very short span.

Visual design is the only way to achieve all of that easily and quickly. Design is the art of functionality. It’s a doing word. A workhorse. It elicits emotion and inspires action in a Pavlovian way, bypassing our frontal cortex and speaking straight to our basic selves on a deeper level.

Plus, good design (and content) inspires faith that your business does good work. In that ‘emotional eye-blink’ as a visitor lands on your website, they will make instant assumptions about your level of attention to detail and your decision-making capabilities. They will apply those assumptions to how you operate and the quality of your products or services.

In short, good design gives you a competitive advantage and a means to differentiate. And yes, you can absolutely differentiate on this basis even if you sell a commercialised product in a saturated market. Lots of different aspects of a brand can capture people’s attention. Values matter. Personality matters. Looks matter, too.

The components of a design language

No part of a design language is random. Everything serves a purpose. Every component makes up the whole. Here are the main building blocks of your design language:

Logo

In truth, if you’re updating your design language then of course it needs to be cohesive with your logo, and one can inform the other. Saying that, one of the signs of a great brand design is this: If your logo and business name were to be hidden, is your brand still recognisable?

Typography

The fonts you use for headers, sub-headers, body text, buttons and so on. Serif, sans-serifs — you name it. Fonts for B2B websites must be readable and aligned with the brand and industry.

Colour

The colour palette you use throughout your visual branding. Normally, you’d have a handful of neutrals and main colours that are harmonious with one another, with a few accent colours. You’d also have colours for things like text, headers and links.

Shapes and patterns

The use of certain shapes and patterns, whether these are more of an organic style or more cubist, smooth or textured. These can work alongside or be part of imagery, iconography and animations.

Imagery

The images you use. This could be stock photos, custom photos (i.e. pictures you have commissioned, or indeed AI-created ‘photos’), illustrations or a combination of any of the three. You need to decide what kinds of images, in what styles, conveying what subjects, best represent your business.

Iconography

The icons that you would use on your website or elsewhere. These could be flat icons, three-dimensional, simplistic, linework, coloured… there are many options here.

Animations

Animation on a website can enhance the user experience, creating a sense of movement and flow. Done badly, it can be jarring and distracting. Be judicious in how much animation you use, and where.

Semantics

These are the meanings of interactions on your website and elsewhere. That is, the result of an action or the indicator of a possible action. For example, the colour might change on a link when you hover over it.

How to document your design language for marketing

Once you have made decisions about your design language, there are a few options for documenting these components. It’s important to have your design language documented in some way so that all relevant stakeholders, such as designers and marketers, are using the same design language.

1. Design principles — You could simply have a set of design rules or principles to ensure things stay cohesive. This is a good place to start. But, these are often applied with the discretion of the designer, so you may end up with some variations.
2. Brand books or style guides — This is the most common outcome when documenting a design language. A brand book or style guide will include all the brand components with some text to explain how and when to use each element. Sometimes, businesses will include things like their mission and purpose, values, personas, tone of voice and so on in a mega brand bible.
3. Design systems — A design system is a sophisticated and highly granular collection of reusable design components or tokens, and pattern libraries, sorted into folders with specific naming conventions. Typically, these are used in complex product development because they require quite a lot of up-front investment to implement and maintain, but they save time during production. For most businesses, a brand book would serve; however, if you have a bigger website, multiple sites, a lot of marketing collateral or you have complex product and marketing production that also needs to be on-brand, a design system is the way to go.

If you’re ready for a rebrand but are worried about the cost, check out this article from our Head of Creative Innovation on how to implement a rebrand on a shoestring budget.