Freedoms and limitations of design systems

Hello! We are a team of designers and developers creating Rostelecom’s digital design system. What for? There are many products and projects in a large enterprise, and each of them has needs that a design system can cover.

When you start building such a system, it seems to you that the first thing to do is to design all the necessary components. You conduct research, audit current projects and understand that this list of components is what you need, that is, you solve current problems and look a little into the future, assessing what else you may need.

And in the process, the question arises – how will users use the design system? Will they follow all the rules and guides if we put them into the system? If we write detailed manuals, will they be read? And if we don’t write, will there be a lot of questions about the boundaries and correctness of using the components? Which is better: a rigidly fixed instruction or, conversely, no rules?

To answer these questions and simplify your life, you need to understand, is your design system, first of all, a tool or a product? At first, we thought that it was a tool after all and conveyed this idea in all presentations and demos. They said that the system is intended for designers and developers, and that they need it in their daily work. It worked, the system was really used to solve product and design problems (at that time, 26 projects were using the system!).

Later we came to understand that a design system is a product too. It is created and developed as a complete product, moreover, it can be packaged for different segments in different ways. It dawned on us that there are not two user roles (designer and developer), but much more, and we can adapt the design system to their tasks, thereby forming a kind of design culture and corporate standards system.

At the same time, we were still worried about the question:

Do we need standards at all?

If the rules can be broken without consequences, they will be broken. Our team had experience in creating a design system and understanding that no matter what reference guidelines are created, they will still not be read carefully enough by absolutely all designers, and, moreover, they will not follow them punctually.

When we rolled out the design system for internal projects of Rostelecom, we noticed that designers use it in different ways. We wrote detailed instructions for all components, and even entire UX patterns, but the designers either followed them selectively or simply ignored them. When you painstakingly create something and then see that your so carefully grown brainchild is being used in a barbaric way and absolutely not in the way you imagined it, it leads to despair. Sometimes we were overwhelmed by the melancholy of how the design system was applied.

But designers can be understood. They don’t want to think again about how to use the design system correctly, they have other tasks – to think about their projects, user scenarios and good UX. They often have neither the desire nor the time to scrupulously study the design system guides.

Therefore, we decided that we will have rules for the use of components, but the requirement to follow them will not be strict. Otherwise, we will run into rejection of the system, or even sabotage. You need to be constructive – how can you help a designer?

The solution was to introduce our own interpretation of the well-known Pareto law, we called it the 20/80 principle – 20% of the layouts are elements from the design system, and 80% are unique product or design elements. Moreover, we did not tell the designer what exactly in the layout should be taken from the design system.

The proportion of design system components in the layout — The share of design system components in the layout

As a result, the designer does not suffer, since there is no strict requirement to apply something specific, he simply takes what he needs to solve the problem and is happy. We are also happy because it helped him. On the one hand, we have detailed guidelines, on the other, we do not shake hands for non-compliance. Perhaps this approach will seem strange, but, as practice has shown, it works. Moreover, the ratio 20/80 itself was also not strict – there are projects where the share of the design system was only 5%, and there are those where 80%.

Training

Another tool that allows you to improve adherence to guidelines is training. We conduct regular reviews of layouts in teams and suggest where the designer could make his life easier if he used the design system according to the rules. And a frequent case that we meet at the review – the designers did not find the necessary component in the library and are drawing it anew:

Here the designer did not find the select and made it from the input number input.

And here we advised the designer to use the notification from the design system in the personal account card so as not to customize — And here we advised the designer to use the notification from the design system in the personal account card, so as not to customize again

Another common case is different styles of components:

Here the designer mixed the button and input of different styles and created an icon with a label. They suggested that everything can be taken from the design system, and even one style

The story has leveled off: there are reference guidelines and rules for using the design system, it is recommended to follow them, but not necessarily, non-use is not punished, but designers in the end follow. At the same time, everyone is happy. Voicing a simple principle solved a bunch of problems, made life easier for designers and saved the design system team from nervous breakdowns.

Author of the text – Denis Pushkar