Design Systems carry business values as well as numerous benefits for designers and developers. When is it worth developing Design Systems, and what do we actually mean by this?
The design system describes the rules of developing and functioning of digital solutions, most often it exists in the form of a dedicated page. Those are the rules regarding the visual layer but also the way of functioning specific elements. They present a code that will be used by developers. Those descriptions and guidelines define the direction and set restrictions for products or services which we develop.
source: Material Design
The most popular design system is Material Design by Google, dedicated to Andriod products. It quickly became popular and scaled for use in different systems. With opening multiple applications, native to the Andriod system, we notice that the buttons placement, typography style, patterns for information and edits – regardless of different functionalities – work and look similar.
źródło: Material Design
Visual and functional coherence allows users to quickly understand all elements of an interface and the way they work. It also enables them to understand various applications because they use patterns that we all recognize. Of course, not all systems need to be described so meticulously as in a case of Material Design, but while creating your own solutions it is advisable to use good practices worked out by Google.
source: Material Design
Design System is often mistaken for a simple Style Guide, which is a description of components focused on the visual side. It allows faster and easier designing of consecutive views and translation from one project to another. In most organizations, it is a Style Guide that works best, because not every company will need own system.
source: Material Design
When is it worth to think about a dedicated system?
If we are planning for new digital solutions in addition to already having a website and mobile application (on iOS and Andriod), this is the best moment to organize and describe the guidelines, which will be leading us during the process. It is worth mentioning that introducing a uniform system does not mean that all the products will become identical (although you can strive towards that). However, it will be easier to confer upon them one character and style, which can intrench brand recognition. Design System helps keep all products consistent – in their look and flow. Moreover, it saves time. The well-prepared system will be a collection of scalable elements that are ready to use in other functionalities.
Among many advantages, there are also disadvantages, which you should be aware of before creating your system.
The dark sides of making a Design System
I am tempted to say that the Design System is never a finished product. In the beginning, we are unable to generate all elements of an interface and their correlation. We need to remember that the visual layer is only one part of a system, designed components should be described in a context of various cases, and hand over to implementation. Attempting to make all at once is possible, but would be a waste of time. The system should evolve with products it relates to, which means that it will be created for months, if not for years.
It is not a project we can do in between others, we cannot create it single-handedly. The team working on the system should consist of experienced interface (UI) designers and front-end developers, and the organization should treat that work as developing the next product. It is rare that the organization has enough resources, that enables it to dedicate a year, two or more to develop internal projects. On that issue, is it possible to contract out working on the Design System?
I need the system but I don’t have resources
As long as generating the description of a visual layer of the product (Style Guide) is not an elaborated process, in case of the system, contracting out the project (to an agency, software house or freelancers) may turn out to be an expensive mistake.
In 2017, Diebold Nixdorf company started to work on refreshing their portfolio and to build a new product based on a collection of preliminary chosen guidelines. Creating a Design System in case of a company with a portfolio of tens of products is a true challenge. A small design team from Diebold Nixdorf was joined by Mobee Dick, which in close collaboration with a team of designers and developers started to work on the system.
The collaboration between agencies cannot be ad hoc or limited to the project. We are not interested in outsourcing the “I pay so I demand” type. In a scale of corporate business, there is no place for sporadic work because it will not be able to change anything. Our products live and evolve. The best results give constant collaboration, without an established end date.
Principle UX Designer
Today we still develop the Design System for Diebold Nixdorf, which gradually expands, adding next components and usage variants, and the collaboration with Mobee Dick brings solid financial benefits (read an interview with Head of UX in Diebold Nixdorf – Łukasz Krebok).
Thanks to working inside the client’s organization, we are able to quickly understand their products and processes. We can deliver products that meet the client's real needs, without being misled by the agency's way of thinking, which often is different from the corporate vision.
Overall, is it worth to outsource building the Design System? Yes, but only under the condition that it will be built by the experienced team, working side by side with the internal design and developer team.