You’ve spent a great deal of time on your brand.

Think about it. From researching your niche, to coming up with logo concepts, to creating and incorporating those concepts into products, marketing materials, and social media – there is a lot more to branding than simply coming up with a flashy logo.

Today in particular, branding tends to occupy more time and energy than ever before. Corporate reputation is so important that in 2016, 59 per cent of companies spent more on their employer brand than in 2015 – and the figures are constantly rising. Consumers are paying more attention to this element of branding than ever before.

The one area where branding is particularly important – and particularly challenging – is website User Interface or “UI”. Web technologies are constantly changing, and with those changes come new user attitudes and expectations – all of which need to be addressed in a branded manner.

But creating a great website UI is one thing; maintaining a consistent brand voice over a period of years is another. Where most companies fall short is coming up with a solid future-proof plan for incorporating branded design after the website’s initial deployment. This is where forward-thinking executives and creative directors implement a key tool for maintaining brand consistency efficiently: The Design System.

Example: How Things Work Without a Design System in Place
The best way to illustrate the benefit of design system optimisation is by looking at how website UI works long-term without an internal design system in place.

First, the company’s executive decision-makers agree on a branding style and direction. Then, it’s up to the creative team to incorporate that brand on the company’s website and products, creating a branded user interface.

So far so good. When the website launches, every icon, button, and typography style is on-brand and correctly voiced. At this point, almost everything is made from scratch, so it’s all completely new.

Now, fast-forward a few years. The company has grown, its user base has widened, and the creative team has added new talent to accommodate the increasing demand for creative output.

This team’s new members have specific instructions to maintain a consistent brand voicing for new product lines, new web pages, and new marketing materials. Furthermore, they have most of the necessary elements available to them.

But do they know where those elements are? Are those design elements organised and easy to access?

Typically, the answer is no. More often, those design elements are hidden in folder structures and code, so UI developers, under pressure to deliver, simply make new elements to meet their needs on an ad-hoc basis.

Over time, inconsistencies creep into the brand ecosystem. Multiple redundant versions of the same elements coexist in a complicated, disorganised hierarchy based on each team member’s individual needs. The user experience design process becomes inefficient, and significant developer man-hours are spent reproducing things that already exist, often imperfectly.

Design systems reduce duplicate elements and save hours of expensive developer time. You can think of the design system as the roots of the creative development tree – the more extensive the system is, the taller and more beautiful the tree can become.

Case Study: Teachers Health

Deepend launched Teachers Health in 2016 as part of a multi-tenancy site plan that included two other brands – Uni Health and Nurses Midwives Health. Each of these brands has its own logo, content colour schemes, and design elements.

After two years, a Design and Brand Audit determined that the rollout of landing pages and new digital technology products was taking, on average, longer than it was at the beginning – even though the team had grown since then.

Audit data analytics showed that the creative team’s lack of a formally defined design system led individual developers to create their own stashes of redundant elements. If a team member left or got promoted, their design tools typically went with them.

We incorporated a design system that improved development ROI and established a common design language for the entire department. This generated efficient team workflow evolution, anticipating future consumer needs so that everyone could benefit from an established, readily available set of design elements that were all consistently on-brand.

The effect was immediate. Our design system improvement allowed for faster and more cost-efficient turnarounds for product updates. Landing page rollout times were shorter, the end-result quality increased, and customer satisfaction soared.

Find out more about shaping your digital design systems to help you better leverage the value of your brand.