How to grow your own design system

Design systems have received a lot praise in recent years despite existing for a lot longer than their current popularity might suggest. In this month's keyword, we'll take a closer look at these systems, the challenges of developing your own as well as how to gain stakeholder buy-in.

Up until recently, design systems might have been referred to as pattern libraries, design style guides, UI kits, CVI, digital CVI, or online brand manuals¹. With that in mind, it can be difficult to pin down exactly what a design system is – so let’s start there, before branching off into some of the challenges you might face when developing your own system.

“Design System — is the single source of truth with rules, constraints and principles. This helps teams tie every bit of the product together.” - Medium.com²

A design system is a ‘living’ resource

The word ‘truth’ comes up a lot in common definitions of design systems, describing them as ‘a single source of truth’ with ‘rules, constraints and principles’ to guide a design team. Without wanting this article to descend into tenuous semantics, there are a couple of inaccuracies within this description that should be pointed out.

First, let’s consider the idea of a ‘single source of truth’. As the old saying goes, “what is true today, may not be true tomorrow”. That’s pretty much the case with any design system. Codifying your approach to design, whether for a client’s brand or your own, should be treated as a continual exercise of refinement. Take a look at the graph below, based on Sparkbox's 2019 Design System Survey³:

design-system-failure-data

Here you can see the most common reasons design systems fail. We'll touch on each of the main culprits shown above throughout the article, but for now let's focus on maintenance difficulties.

Growing your design system - How much do you know about gardening?

A design system is not a collection of sacred rules etched in stone; it is a living document that will evolve in alignment with business requirements over time. There will always be a host of new considerations, additions and revisions orbiting around your design system, ready to be implemented at any given moment.

Think of your design system more like a tree. Yes, a tree. It continually grows, sheds its leaves, flowers, requires pruning and changes with the season. It's a reliable source of information that, if maintained correctly, will always contain the most up to date guidelines and best practices for various scenarios your design (or indeed development and content) team are likely to encounter.

When you’re developing your own system be sure to prioritise modularity and scalability because there will be ongoing resource demand to keep your system up to scratch as time goes on. So, make sure you plant strong roots! In return, you’ll be rewarded with more free time to focus on important tasks, greater efficiency and consistency across your team’s output.

Getting stakeholder buy-in for your design system

We’ve already drawn attention to the importance of maintaining your design system. Part of this process is winning stakeholder buy-in, so the creatives among you might have to get comfortable wearing the business hat.

When attempting to acquire stakeholder buy-in, it’s important to communicate that a design system isn’t just for designers, and will often also include useful information for developers and content creators too.

Stakeholders will be more willing to assign resources for the development of a design system if they know it will improve quality of output and speed of delivery for multiple teams, not just designers. Formalising best practices and brand identity becomes increasingly important as your workload expands. So, stakeholders hoping to grow the business (which is all of them) would be wise to invest in a design system sooner, rather than later.

When you start developing your design system is an important factor to consider and one stakeholders need to consider if they want to avoid crippling technical debt.

“If you have design and code debt, you will need to spend quite some time and resources to build a system from scratch and unify all the teams for collaboration.” Medium.com⁴

We recently published a blog post on technical debt discussing the subject in detail which you can read here. To give just a quick summary, technical debt is incurred, often knowingly, when teams decide to stick a pin in certain aspects of design or development in order to meet a scheduled release date. Everyone is aware this will result in more work down the line but agree, or have no choice but to agree, that it is necessary in order to meet a deadline.

Design systems are a great way of reducing technical debt (also referred to as code debt and design debt). They help designers and developers work together more efficiently, which in turn means work gets done faster, freeing up bandwidth across the team. More bandwidth means a higher likelihood of meeting a launch date and a reduced risk of accumulating technical debt. Stakeholders will of course approve of this.

Know what to include

We opened this article by highlighting the challenges of defining exactly what a design system is. Part of that difficulty is the fact that you’ll have specific needs that others won’t, so every design system could mean something different for every company.

We developed a system for Amadeus and one of our designers said she found herself continually revisiting questions like: How much detail should I include? How much flexibility is too much? How technical should the language be? These are all things you’ll need to consider when building your own design system and this is where input from other teams can be a real help. Each team can ensure the design system is coherent and understandable for their respective discipline.

Be realistic. It’s easy to go overboard in the planning stage and ultimately fail to deliver when it comes to actually building your system. The likelihood is that you’ll only be assigned finite resources for planning and building, so use your time wisely!

Take-home message

Design systems are a fantastic way to save time and money, as well as ensure consistency in design, development and content output. That said, it’s important to allow for flexibility in your system so it can easily scale and adapt to business need over time. Remember, your design system is there to make common, simple tasks easier to deal with and enable your team to focus on more important priorities. A design system does not replace exploratory design, rather, this is what continually feeds and refines your system as time goes on.

Before developing your own design system clearly define what you want from it and make sure ample resources are allocated to get it off the ground, as well as maintain it over time, before you begin building. Productivity, quality and consistency of output, as well as cost savings are just some of the benefits a well-developed design system can offer your business. Make sure your stakeholders know it!

If you’re looking for support in building your own design system, don’t hesitate to contact us!