There’s been an endless content feed on how big global companies keep on building their design systems. Having such examples can be a good attention grabber but how do you know if you and your company actually need one?
Over the last year we’ve been working on design systems for huge national companies or even Slovak e-government. Although there’s been a lot of theory and recommendations before, here’s a first-hand experience of an agency building design systems on demand.
So you’ve probably heard about them design systems
Having to put it in just one sentence, design systems are processes and relationship between assets and people. Fancy but too abstract, right? Let me explain it in more detail then:
Design system is a source of truth that centralizes all the knowledge you have about your product or service design. It’s that one place, where you can gather it all – from brand and design manuals all the way through the visualization and digital documentation to the core principles and the mindset that you follow as a company and a team. It’s the entirety of internal understanding and external insights and it results into unified design language, specific for your product or service development.
In a much less poetic definition, it basically is an inventory of components and patterns based on your customer-centric approach that define your design language and the process of how to use it. It allows you to manage design at scale, consistency, efficiency and teamwork in the long run. It also shows how your design evolves to all stakeholders and contractors who come to participation on your product or service development and it is a powerful tool to boost a mindset shift from project to product vision.
Design system consists of three layers that make this ecosystem complex and inclusive:
1. Principles = CX approach
The very bottom layer merges the philosophy, strategy and service design principles that you follow as a company. Even the things like your company values or a tone-of-voice define your unique design language and have to be involved into your design system.
2. Foundation = Brand assets
The middle layer represents all the visual guidelines necessary for building products. This includes things such as colors, typography, layout etc. Put simply, things that dictate how the visual design will show up in production.
3. Components and patterns
And these are the ones you will work with most of the time because they will actually become a „vocabulary“ of your design language. However, it won’t be easy building them – before contributing into the design system they should pass the toughest UX and accessibility criteria.
Why you should care about the design systems anyway
Building a design system and using it when developing your products gives you a whole lot of benefits:
1. Better usability, consistency and accessibility
Components and patterns that passed the internal rules and usability testings and became part of your design system, are the best elements to build new products with – while investing much less effort. Also, improving usability is a proven tool to increase company revenue so be strict when it comes to testing the patterns.
2. More effective collaboration and faster delivery
Thanks to design systems all your colleagues, stakeholders and contractors will collaborate with much more ease. This can massively improve the relationships between all the collaborators and influence the teams’ satisfaction. And eventually, with satisfied and productive team you can expect remarkably shorter time to market.
3. Less communication clutter and misunderstanding
Once you work with design systems, building a page can be a task solved in just minutes. You don’t focus on pixel pushing and instead your designs are ready to be shown to the team fast. Also, the feedback is saved from the unnecessary comments because what was made based on one unified source of truth cannot be doubted, right?
4. Increasing productivity and quality assurance
The most helpful part of design systems is documentation which lets you rely on the process. Once something is a part of the design language, you can be damn sure it guarantees a certain quality of your output. You don’t have to start from scratch, just use the components and proven patterns straight away and save time for some delights and fine-tuning.
5. Faster onboarding of new collaborators
Whether it is a new team member or a different agency, design system is a huge pain reliever when it comes to onboarding someone to the project or handing it over. Having a design system yourself makes you totally independent from whatever the contractor is. You just „teach them speak your language“ and the project consistently goes on.
6. Spreading the CX mindset across the team
Having them all work with design system, you will soon begin to notice the mindset shift in your team. The documentation covering processes, usability, Personas, CX vision etc. helps write customer-centricity deeper into DNA of anyone who collaborates. And although it seems like a minor thing among the other pros, it actually leads us to the one that is most beneficial.
The ultimate benefit of building and using a design system
All of the above are great advantages you can soon feel on a day-to-day basis. But in fact, an absolute win it can lead to is this:
Design system simply makes room for CX, innovation and disruptive ideas.
When you’re consistent with your design system, you’ll eventually come to the point when you have enough time to make changes that really matter and bring value to the product development. You don’t have to design the basic stuff over and over again and spend hours pushing pixels. Hence you produce “zero waste” and finally have sources to come up with revolutionary ideas.
The main benefit of design systems is not saving you money. But it saves you all the other commodities and you can use them for things that matter. Building this ecosystem is nothing new in a world full of awesome customer-centric companies, now you can become one of them. Follow our series on design system topic or subscribe to our newsletter.