Blog 6.4.2020

Why you should definitely have a Design System in place already

Design System

Good to see you here! We have no doubt this post has good information, but please keep in mind that it is over 4 years old.

Design Systems are the ”new norm” in the product design industry

Market transformation is accelerating in every field, and also the importance of production line resiliency is constantly increasing. Customers require rapid change, businesses merge, and others close down. Some solutions gain popularity and boom, while others become obsolete.

This constant change also requires product and service development processes to react and adapt to new situations more rapidly than ever. To enable this, a systemic approach is needed. Design System is a solution to manage changes in product development in a sustainable and profitable way.

Design System ensures an efficient development flow between different organization units in an ever transforming, complex environment.

Design System – what is it?

As the naming affirms, a Design System approaches the product development systemically, on both atomic and holistic levels. Every developed element – be it an icon, software code or a component shape – is part of a bigger product portfolio system and can be utilized in several instances. The system gets updated in real-time by designers, developers and engineers, and always provides access to the most recent materials.

“Design System also streamlines the design maintenance process. This maintenance impact is significant specially in software development: When one item is changed, it will be automatically updated in all its instances. This reduces the manual updating burden greatly.”

Design System

Design System enhances collaboration and communication

Some of the key ideas of a Design System are accessibility and transparency. Design System provides a platform that all stakeholders are can access in real-time, be it the marketing department, construction, manufacturing, production, industrial design, software development, or user interface design unit, for example.

Design System elements

Design System adapts to organizational needs, and the elements it covers can vary. Some of the more common elements are:

1. DESIGN

  • Visual building blocks
    E.g. Icons, Universal shapes, Font sizes and typefaces, Warning labels, Color Palettes, Components and modules, Templates
  • HMI patterns
    E.g. Error patterns, User Interface interaction rules

2. PROCESSES AND STANDARDS

  • E.g. Ergonomics, Tone of voice, Design Principles, UI grids, Implementation standards
  • E.g. Design-Manufacturing workflow, Design-Code workflow, Component version control, Component adaptation and management, Naming structure

3. ENGINEERING AND SOFTWARE DEVELOPMENT

  • E.g. Code snippets and base, engineering specific work-flows etc

 

Engineering and software development

Start small

Instead of starting from a giant development effort when building the Design System, start small. Proceed step by step in phases that will bring instant value to your development process. Be agile and proceed in increments.

Start by making an inventory of the existing components and identify the universal elements. Start to build such a component library that everyone can access and update (get in contact for more practical tips). More elements can be then added later on to the system – let it grow alongside the natural development cycle.

Build your Design System iteratively. Design System is never ”ready”; rather, it is a constantly evolving artifact. It is more of a scalable platform and approach, than a ”single shot” solution.

Design System saves money and increases velocity

Some of the commonly faced problems and Design System solutions:

Problems:
Design System Benefits:
  • Elements are not being shared in a timely manner across the development team, which commonly leads to:
    – spending excess time looking for correct material
    – recreating already existing material again
    – laborious maintenance
    – in worst case: using wrong or outdated elements in development
  • Every new hire slows down velocity, since new people don‘t know where to find the relevant and most up to date materials
  • Every new project increases chaos in the process
  • Design System provides quick access to the most recent materials for all relevant stakeholders
  • Design System enables the organisation to develop an efficient workflow
  • Design System speeds up the development and maintenance processes
  • Design System enhances constructive communications and interactions between different units
  • Design system maximises consistency throughout the product range
Without a design system:
With a design system:
  1. Software and product development process becomes gradually slower and slower
  2. The user experience suffers from growing inconsistencies
  3. Significant amount of time and money is wasted
  1. Design system makes the work of each individual more pleasant and professional
  2. Design System optimizes the User Experience –> Client satisfaction
  3. Design System increases velocity –> faster go-to-market process, increases revenue
  4. Design System saves time = saves money

Let’s say we have a multivendor team of 40 people – designers, engineers and programmers. And let’s assume all of them spend in average 30 minutes per day pondering about the following issues:

”What shade of blue are we using?”
”Can you redesign this? We can’t build it”
”Where’s our logo?”
“Do we have already an icon we can use for this function?”
“How did our new colleagues in the other department solve this?”
”Was this pattern used somewhere else?”
“How do we build this pattern?”
”Where are our approved stock photos?”
“Can you rebuild this, it doesn’t match the design?”
“What’s the latest documentation?”
“Does this meet the code/construction standards?”
“Where are our universal components?”

–> 2,5h/week per person * 48 weeks * 40 people = 4 800 h.
Let’s multiply that with a cost of 70€/hour = 336 000 €

In this example, the annual ROI of a Design System would be 336 000 €.
And even more: this calculation doesn’t include the cost of re-building nor bad customer experience due to wrong component usage in the development process.

And let’s not forget the human factor: Using a Design System provides a motivational and productive boost for the employees by removing everyday workflow obstacles.

ROI of a Design System

Gofore’s case examples

We have successfully created several Design Systems for our clients, e.g. public sector, mining technology and agricultural manufacturing. These solutions serve the development of dozens of services and products. (Contact us to hear more, we would be happy to share our experiences).

What next?

We’re happy to help you to plan on how to take the Design Systems effectively in use so that it supports your business and processes. Book a free planning session with us: jonna.iljin@gofore.com or call: +49 173 391 0744

Read also:
Design Systems Simplified – An Outlook Beyond the Trend

Jonna Iljin
Designer

Jonna Iljin

Jonna is "a Jane of many design trades", a seasoned Designer located in Munich. Jonna focuses on Service and Business Design, Design Thinking, Innovation Development, Agile ways of working, and Impactful Facilitation. She's passionate about Transformation through Human-Centric Design and User Experience.

Back to top