Why should you invest in a design system when planning digital transformation?

With a design system, work on IT projects is cheaper, quicker, and more cohesive, providing a better user experience.

Too many promises for one article? We don't think so.

To prove a point, we have gathered information on the design systems, examples of companies that use them and their opinions. Let's dive in!

A design system is a collection of tools and processes that facilitate designing, building, and developing digital products… Yes, it isn't straightforward.

Let us give you an example.

Imagine you need a single button for your app. Preparing this simple element relates to making a few decisions: shape, fill, size, shadow, typeface to be used, margins, on-mouse-over, on-click effects, iconography, or the final code which will place it within the system. Let's add that such a button has to be coherent with other elements of the application, of which there are tens or even hundreds.

Here's where a story begins, one which everyone, who has anything to do with software development, knows:

• The UX Designer doesn’t deal with most of the above characteristics of the button,
• The UI Designer designs a new look for every button for each of the created projects separately,
• The Front-end Developer writes code in a way that multiplies discrepancies by making further decisions of their own.

And this is just the beginning of all problems to come. Let's multiply those issues by the number of projects at the company and the number of people that work there, considering staff and team rotation, time, and budgetary pressures. Result?

The example above leads to unpleasant consequences:

• A waste of time and energy – software development is limited by lengthy design and development procedures.

• Weak UX – users who use many different apps from the same company don’t feel they are dealing with a single ecosystem.

• Lack of coherence – every system of the same company works and looks different, even if it has similar elements at first sight.

• High cost of development – the company bears the cost of creating the same elements repeatedly for different purposes.

In practice, a design system is a library of components that combine design, code, and knowledge of how to use them. It is based on the simple idea – create once, use many times.

And no, a component library itself is not yet a design system. Design or code on their own does not comprise a design system. Knowledge itself is not a design system either. All those elements must be properly combined and created together as a process and the final source of truth for designers and developers alike.

Signals that you should develop a design system within your organisation can be combined into a few common characteristics:

• If your company already has an extensive ecosystem of IT systems, which it intends to develop, you may need a design system.

• You may need a design system if your company plans to develop new IT systems.

• If teams of designers and developers at your company are facing communication issues and struggling to obtain coherent results, you may need a design system.

We use the word "may" deliberately because the discussion on design systems is much more complex. In our initial conversations with our clients, we closely examine their project portfolio, platforms, and the technologies used to build those platforms. We define the expected level of coherence between those platforms and systems and analyse the structure and competencies of their implementation teams.

There is no single, universal way to build a design system. The plan depends on the ecosystem of IT projects within your company and the goals you want to achieve.

The stakes are high indeed. A correctly implemented, used, and developed design system translates into tangible advantages for your business:

1. You can use it to create new projects faster by increasing the productivity of your design and development teams.
2. You can save money on developing existing products because your code will be reusable, and prototyping will become simpler.
3. You can make your applications more coherent regarding how they look and feel, and work and turn them into a single ecosystem.
4. You can provide your users with a proper level of comfort by promoting good UX and reusable UX templates.

We asked Basilissa Albers, design system Product Owner @Adverity, what are the three most important benefits of implementing a design system in her organisation:

Take a look at the flagship solutions of IT giants. They have been providing proof for quite some time that a design system is a meaningful improvement of their development process:

• Shopify's Polaris design system: https://polaris.shopify.com/
• Salesforce's Lightning design system: https://www.lightningdesignsystem.com/
• IBM's Carbon design system: https://www.carbondesignsystem.com/
• Adobe's Spectrum design system: https://spectrum.adobe.com/
• Google's Material design system: https://material.io/design/

We have been working together with Wirtualna Polska Group for more than four years. They are one of the biggest media holdings in Central Europe and reach 22.1 million users every month. Over the 25 years, they have accumulated many different digital tools ( advertising, IT, and editorial, among others). Our job was to create a coherent back-office system (including a design system) . Set of solutions that support the growth of existing and development of new tools. If you want to learn more, check out our case study.

Here’s what Aleksandra Rabenda, Head of Delivery Team @ WP says about design system:

A design system is a collection of tools and processes that simplify digital product development, construction and design. The decision to develop your design system must be preceded by a thorough analysis based on solid business grounds. It is the kind of conversation we would like to encourage. Are you ready to join it?