Today, design systems are mentioned in almost every conference dedicated to Internet marketing. Media makes ratings of the most successful cases, and big brands are actively working on their implementation. In this article, we’ll talk about why design systems are needed and how to correctly implement them in business
How to Get Executive Buy-in for Your Design System Approach
What is a design system
The term itself appeared in the middle of the 20th century. During this period, design systems were actively in demand in retail: supermarkets and product manufacturers used them to create the identity of their packaging.
With the Internet, web design has confidently stepped into our world. Until the end of the 2000s, it was quite primitive: the websites were a series of chaotic flash-animations and were completely uncomfortable to use. There was no such term as usability.
The situation changed after 2010 when people thought about how to make the site user-friendly and optimize the resources of the team that works on it. These problems had to be solved by the design system.
In fact, such systems on the web are elements of the visual part of the brand. They consist of small particles: fonts, colors, shapes, icons, transparency, and rounding. The components of the site are assembled of those — buttons, input fields, text blocks, forms, filters, and bar elements. Meanwhile, the code is attached to them, which allows the layout designer to quickly construct new projects.
The first meaningful attempt to create such a system was made by
Who needs a design system?
Design systems are convenient for the end-user. Practically, everything is implemented for him. Everyone should feel equally comfortable surfing the company’s content through an application or a desktop browser.
Large services that often updating current products and launch new ones require such systems. A good example is Airbnb . According to the creators, building the design system was worth the investment and a huge leap forward. Since the design language and code are often shared, they can build and release features on all native platforms at roughly the same time. Development became generally much faster.
Airbnb’s Design System Component Page
Design systems are also in demand for small fast-growing projects, as they facilitate to quickly launch new services, including new sections and functions on sites.
In general, a design system is able to achieve the following business objectives:
- Increase brand recognition — a company, that designed every detail of the service’s interface, will be captured by customer’s memory much longer;
- Optimize the work of the team — the design system will take over part of the operating issues that assigned to developers and designers;
- Save time — it will be much easier to assemble new pages: just pull out the prepared elements from the data library and construct them in a single puzzle;
- Will provide media publicity — the business community is keenly interested in fresh design system projects.
Today, banks, online platforms, and service providers use design systems in our world. It is important for them that the user feels as comfortable as possible, using their products from any device. One more example of an interesting case of the Uber design system can be found here.
The design system increases employee confidence in the products of their company and positively affects the brand reputation. Its integration can be a good PR step and improve the company’s position in the digital services market.
Deciding between the design system and Ul-kit
But the question is many companies manage with a regular UI kit and feel quite good. Why do they need a design system?
To understand, we’ll first agree on the terms. UI kit is a set of interface elements for a website — buttons, tabs, arrows, sliders, etc. All visual components of the project are stored in the UI kit. And, if necessary, on their basis you can construct the whole website.
The design system is a broader concept, which includes both the philosophical part (brand values) and the applied one — guidelines, brand book, and UI kit. It’s a set of brand components with the maximum upgrade presented as one package. And lastly, UI kits are translated into code, which allows you to assemble new projects even faster.
It makes sense to create a design system, and not just a UI kit, if:
- The company has several related products that require systemic scaling;
- The company got the necessity to optimize the work of development teams;
- The brand doesn’t have a single visual language;
- There is already a completed UI kit, but there is no single data library that could be used by both developers and designers.
If we are talking about a startup, it is better to concentrate on key business processes — the development of the sales funnel, product, and desired service level. These actions will provide a profit in the short term.
Speaking about the design system, everything is a bit more complicated — they won’t bring money here and now. This is a long-term project that focused on the strategic development of your brand. Developing a good design system takes at least six months and requires specialists in the state who will devote almost all of their working time to it.
It will take at least one designer, who will draw the elements, components, templates, and the developer who will connect them to code. If the customer does not want to invest his money and time into this, you can completely get by with the regular UI kit.
Before you start developing a design system, you need to complete several actions:
1. Align and agree with the whole development team. This project will require the mobilization of all workforce. The easiest way is to motivating colleagues, explaining the design system will simplify their work: creating new projects will be easier and faster.
2. Define the criteria to be used to measure the effectiveness of the system. This may be increasing of customer loyalty or website conversion;
3. Be ready to maintain the relevance of the design system. It will take a lot of time until the final version has launched. During this time, the team may have new ideas, and the system should be able to ensure them. Only in this way, the system will be effective.
Bringing the value of a design system to the product stakeholders
Creating a design system is obviously profitable for designers and developers. Because it simplifies their work. But all developers have faced one problem — how to convince all stakeholders or your product management of the advantages of implementing such a system?
1. Define the pain of your company for today As we learned above, not every company needs design systems. If you are an agency, offer them to customers who have a stable market position and a strong digital base. Small startups and companies could exist with the UI kit.
2. Collect the feedback Contact with the product manager or customer support staff. These people will help you understand what problems a business faces every day. Think of the solution based on design system implementation and offer the arranged proposal to the management.
3. Focus on the result Usually, the head is not aware of design systems. He just wants to see the result of your work. Therefore, it’s crucial to emphasize the outputs of the implementation of the system instead of focusing on the workflow. Those are optimization of the work of designers and developers and customer satisfaction, who would certainly appreciate the updated service.
4. Show business benefits Visual design is a subjective thing, it is difficult to immediately evaluate its profit. You can come from another angle and evaluate the effectiveness of the system for the company itself. The design system automates the process of developing new products and simplifies the work of the team.
This allows you to reduce the huge amount of operating work and focus employees on creativity and strategy.
Accessibility Scale. A peace of accessibility scale of Eleks’ Design System
A good design system will perfectly handle the task of optimizing the company staff — the necessity for a huge team of designers and developers will simply disappear. Tell your boss about this, and you will not meet the skepticism of your idea.
- Atomic Design by Brad Frost
- Designing The Perfect Date And Time Picker by Vitaly Friedman