This is translation of amazing article by Seryozha Plaschinsky.
Dreams to create a universal designer’s tool that would allow for a couple of clicks and lines of code to assemble ready-made solutions were unattainable. Like once the ideas of architects-modernists to settle people into residential units and rationalize their lives.
People turned out to need chaos, and design needed space for expression, drama and product growth.
History of Russian Design Systems
The growth of interest to design systems in Russian market began somewhere in the mid-tens. The starting point is probably Anton Vinogradov’s speech at PiterCSS about the architecture of Alfa-Bank’s design system in March 2016. Although the roots, of course, should be looked for earlier.
In 2013 Brad Frost presented Atomic Design (the book will be published in 2016) and for the first time described the concept of building a design system holistically. At the same time, Sketch is gaining popularity among designers as a faster, more convenient and interface-aware alternative to Photoshop. And in the same year, at the conference JSConf US Facebook reveals the source code of React, which popularizes the component approach.
In 2014 iOS 7 comes out and brings the world Flat Design, and along with it the idea that the design of the future — interfaces without frills, and the designers of the future — the engineers who will code, prototype and become independent of developers.
After Apple, large companies are publishing their design systems one after another: Material Design, UWP, IBM Design Language, Lightning, MailChimp, BBC GEL.
In the wake of the success of Sketch, React, and the concept of “designer = engineer,” the idea is born that graphic editing software has no future, that it is artifact, and the only source of truth will be components in the code. After that there is an explosion of popularity of tools that try to combine both visual design and programming. The most famous of these are Framer and Origami.
From that moment on, Yury Vetrov’s digest has a section called “Visual Programming” with all the news on the topic and a subsection called “Live Guidlines and Component Systems”, which after Anton Vinogradov from Alfa-Bank’s presentation will move to the “Guidlines of Platforms and Companies” section. And a year later, in April 2017, “Guidelines of Platforms and Companies” will be renamed to “Design Systems and Guidelines”. And the first thing to let us know is that Anton Shane of Yandex has recorded screencasts on using Depo, a BEM-based prototyping environment for designers.
The rise in demand for design engineers and tech solutions that accelerate the release cycle came during a period of renewed economic growth in Russia after the fall of the ruble (from 2015 to 2018) and may have been a response to the shortage of skilled labor.
(At least, that’s how it was in Avito. Back when there were no cross-functional teams, no agile, no standups, no syncs, and no one to do A/B testing. Everything was done blindly, and we wanted to be serious).
At this time there was a rise of Russian design systems and one after another major companies began to demonstrate their achievements: Design System of Russia, Paradigm, Design System of Rambler & Co, Design System of MegaFon, BEM Design, Alfa-Bank Design, Design System of Oleg Chulakov Studio, Bars Group, VKUI Styleguide
At the same time a site aggregator of Russian design systems DESIGN SYSTEMS CLUB appears, and at all conferences and meetings there is nothing but talk about design systems and their problems. This goes on until 2019. And then it all dies down.
What’s Up With Design Systems Right Now
If you go to DESIGN SYSTEMS CLUB today, you will see only 8 links to design systems of companies of Russian market (Yandex can be crossed out, because BEM Design, DEPO and BEAST projects did not take off, and the link leads simply to BEM methodology).
All of them, by and large, copy each other and are branding pages with sets of basic elements and principles. And all the differences boil down to who chooses which font and color palette.
It’s not about a powerful prototyping tool for designers. Nor is there anything about the principles of constructing complex blocks and pages from these components, which would allow the designer not to think about composition, visual weight, optical compensations and contrasts.
Yes, some you can download as a kit (Rambler, Alfa-Bank), install and play with, if you know how to code. But all this is nothing more than a repainted Bootstrap, with which you can solve only simple problems — build an admin panel, for example. I suspect that these systems bear a very distant resemblance to real production.
And from the latest news about design systems: last week VKontakte published its mobile library of basic VKUI components in Figma. After studying it, we can make several conclusions:
- Graphic editing software (largely thanks to Figma) have survived the war with code and remain the main tools of the designer.
- It is still only mobile design that lends itself to some sort of systematization. Largely thanks to the standard platform interface elements and patterns in iOS and Android. And also thanks to a simple single-stream vertical structure, which allows a simple system of containers and indents between them, which simplifies the process of page design. Another thing is the web, where there are columns, which means there are several threads between which you need to maintain consistency.
- This is not a design system, but a library of basic components. A little more complicated, a little more tricked out, augmented with templates, but still a library — the well-established knowledge that registered, formalized and put on the shelf.
- The main task of this library, as the guys themselves say, is saving time on searching for or redrawing standard screens or states, which allows you to focus more on the task. In other words — the designer does not need to start with a blank frame, but can take a ready-made page (or quickly build it themselves) and, with it, start solving their problem.
The Problems of Design Systems
Why haven’t design systems moved beyond UI libraries with basic components? There are several reasons:
Designer ≠ Engineer.
From my own observations I can say that when a designer starts to get involved in something other than design — project management, research, prototyping in code — it immediately affects the visual quality of his solutions.
Design, in essence, is an overthinking of options. The more options you try and twist, the more stylish the solution will be.
Working in a graphic editing software is the cheapest way to do this — copy, change, copy, change.
Code is a more labor-intensive tool. It has a very high entry threshold. And because of fiddling with it, the designer will have less time, effort and desire to work out the solution. (By the way, complication of components in Figma also leads to this problem).
But the need for designers-engineers disappeared not because of this, but with the emergence of cross-functional teams and resources for engineers to engineer, and designers to design, and each doing only one thing.
Product Growth
The market is constantly growing and accelerating. To compete, a product has to learn to react faster to changes around it and constantly offer something new and something better.
And a new component has a long way to go to get into a library, much less a design system: from justification in front of everyone to implementation. This may take several weeks.
And there is more than one such component. I cannot recall a single task (neither my own, nor that of other guys from the team) that could have been solved only with the use of ready-made components. Another page-form with input fields and buttons? Unfortunately, there are very few such tasks.
And the business doesn’t care whether it’s done using the system or not, as long as you’re losing to your competitors.
Ilya Mikhailov told us well about this.
The Need for Strong Designers
Well, of course, one of the main ideas of all this was to create a tool that can be given to even an unskilled designer and expect in response if not strong, then at least a confident solution.
But in practice, an unskilled designer with even the most elaborate tool will still do poorly.
And what is worse, when a designer has a feeling that everything has already been thought out for him, he stops to analyze and think critically. This stops his development.
Only strong art-management can help here.
You can’t do without strong designers anyway, and it is often enough for them to have simple guides so that they can work quickly and accurately. And all this complication of components in an attempt to provide for everything is useless for experienced designers, and sometimes even harmful. For example, when every time you have to take apart all these autolayouts and detach symbols, because Figma doesn’t allow you to move objects properly.
The Future of Design Systems
The topic of design systems is gradually leaving the zeitgeist. And this is a good sign that the era of the race for a spectacular picture for conferences is gone, and the companies that started all this with us five years ago, have moved on to reflect on the work done: what of what we have done during this time, works effectively?
And now we see that the world is gradually giving up on the idea that a designer should be able to code.
Then we see that you cannot solve the problem of an illiterate designer and that a designer, even a product designer, has to be a carrier of design culture: taste, figurative thinking and a sense of composition. Because without that, even with the most perfect system-components, a designer cannot offer the best solution. As well as a programmer who does not know mathematics.
This can be indirectly testified by the return of Dima Barbanel with his designworkout, the appearance of the W1D1 project, the increased interest in the Kamchatka project and other institutions aimed at the development of creative thinking. And also an increasing interest in fonts, typography and 3D. And the society’s growing demand for crazy stuff like type.tomorrow, Andrei Shugalsky, and Anton Schneider, who has never really left the industry.
Of course, guides, libraries, and basic principles will always be needed — it is, as Ilya Mikhailov rightly said, the visual DNA of the company. Here we can only assume that soon they will stop imitating the code with their tokens, autolayouts and symbols and will become a little simpler and lighter. And the dictatorship of components will become advisory in nature:
Each team should be empowered to diverge from our recommendations, acknowledging that one solution may not work for everyone. spotify.design
But still, design is not about tools. First of all it is a strong team, strong communication within the team, and strong art leadership. And gradually after the big guys, everyone will start investing in it.
On July 15, 1972, at 3:32 p.m., when the first high-rise of the modernist residential neighborhood of Prütt-Aygow in the American city of St. Louis was blown up, the American architect and critic Charles Jenks stated “the death of new architecture”.
Today, May 24, 2020, with the release of this post, I, designer Seryozha Plaschinsky, state “the death of new design systems.”
