Faster production, better accessibility, more efficient with your £££. Welcome to the world of design systems.
Reduce production costs and time to market
Typical website projects begin with a blank page.
Imagine the scenario. Your designer creates an event sign-up page. When the finished version arrives, you notice that it’s different from the designed page.
Why? The developer likely started the page from scratch, making some ‘improvements’ along the way.
Each time a designer changes components on a page, like a button style, someone must sign it off, and a developer has to mirror that change in the code.
With a design system, designers and coders draw from an agreed library of components (also called patterns). Any changes to the approved library go through a sign-off procedure before being transferred into code and added to the website.
A well-governed design system provides the framework for website design and build, meaning changes can be deployed faster and for less money. When well-executed, design systems allow creatives to work on other value-creating projects.
Re-focus efforts on elevating the customer experience
Design systems may, at first, appear restrictive. After all, you’re asking designers and coders to build from pre-existing elements.
This is not our view. We believe design systems enhance rather than stifle creativity.
All websites share common structural elements such as blocks of text, images, buttons, and forms that are arranged on a page into patterns. Certain patterns work better than others, so designers will take the best patterns for the job e.g. the ones that convert.
A design system predictably takes care of 80% of your website design needs - the structural elements - allowing your team to focus on the 20% that elevates the customer experience. The best design systems encourage designers to explore the full expression of a brand through more than the basics like colours and fonts to include techniques such as interactions and animations.
Re-architecting basic web elements is not the best use of your designer’s creative talents. Liberated from the blank page, they can focus on valuable activities such as crafting engaging, branded user journeys.
Control your brand identity across all digital entities
Opinion or ‘design by committee’ is the enemy of brand.
Seemingly small changes made to components because someone “didn’t like” the previous version eventually add up to significant brand inconsistencies.
Your company website is typically a prospect's first engagement with your brand. The quality of this interaction determines your credibility, trustworthiness, and ability to meet their needs.
A design system removes the risk that new pages or elements break with established brand conventions. You can use the same design system for every branded digital interaction, ensuring consistency across your entire portfolio.
Furthermore, if your designer/developer leaves, you change agencies or outsource App design, you can be confident there is an established design system protecting brand integrity.
Bake accessibility into design and code from the start
Website accessibility is non-negotiable in our view.
In the ‘blank page’ scenario, accessibility checks fall at the end of the design process, not the beginning. Designers and developers who retrospectively fix accessibility issues incur substantial redevelopment costs.
With a design system, all components in the library meet accessibility standards on day one. A website will continue to meet standards if designers and developers follow the system and only draw from the approved library.
In our experience, this is the most effective and cost-efficient way of managing accessibility.
Design systems require a cultural shift
A library of approved assets is not a design system. How you govern the system is essential to success and requires a cultural shift for most organisations.
Ownership of the system will differ between organisations. We believe it sits best with whoever owns the brand. Organisations with the most successful design systems view their website as a fundamental part of their brand language.
Websites seen as marketing assets invite all stakeholders to participate in its management. One that belongs to the brand has the same status as a company’s logo or colour scheme.
You wouldn’t consider changing your logo without internal consultation. You shouldn’t be making significant changes to the foundational design of your website without the same consideration.
To be clear, this doesn’t mean that every design decision must go through a brand guardian. A well-governed design system empowers marketing, design and tech teams to manage day-to-day updates and then follow the approval process for new initiatives.
