Style Guides and Design Systems

A Style Guide is a document that sets the tone for how your business communicates. It incorporates brand, visual styles (colours, fonts, logos), company philosophy and an understanding of who your customers and audiences are. It describes the visual, written and sometimes even spoken styles that are and are not acceptable in content created by and for a business.

The style guide is aimed at people who’ll be creating content, not code. It describes the tone of voice and visual treatment you’ll use when communicating in different media.

The main goal of the Design System from a business perspective is to communicate and govern a visual and behavioural consistency to be used in all business communications.

A Design System sets the rules for what’s acceptable to put in visual communications and to minimize the work required to creating digital or print content. The intention of a design system is to make design decisions once, document those design decisions in the design system and then re-use every subsequent time that those same design components are required, so it’s clear to everyone on the project just how they should look and behave.

These two items, a style guide and a design system, have a lot in common. Both try to describe and standardize the user experience, but they serve different purposes and for different audiences. The design system acts like an extension of the style guide. It takes all the reasoning and rules from the style guide and incorporates them into a common pattern library and design language for your company’s products.

Consistency is useful from a usability perspective because your customers only have to learn how to use your site or app once, and then it’s the same every other time they use it. But consistency goes deeper than that. Visual consistency is important for customers sense of trust. If two parts of your site look different, then visitors may not trust that they’re still on your company’s pages.

This is just as important for smaller organizations, as it is for larger ones. In fact, having a consistent look and feel is one of the things that makes smaller organizations appear bigger. Customers will assume that because you have your visual appearance act together, you must be a larger company with an integrated brand and marketing department. This helps them to trust you, and it makes it more likely that they’ll do business with you. So any company can benefit from having a consistent communication strategy.