Image by Invision

Design System for People

Eric Yang Jia Wei
5 min readNov 9, 2020

During this semester, I attended an online conference titled Design System for People” by Invision. Invision is a company which helps other companies to improve their digital product design. Inferring from the title, I thought that I signed up for a discussion on the various ways to improve the design system to provide better user experience for the users. However, the conference discussed the importance of investing in a well-designed design system. Although the content was unexpected, the conference provided me with insights not covered in class.

Bootstrap buttons vs Material Design buttons

The conference started with the emphasis that design systems are for people. As real-world problems are getting more complex and increasing pressure to deliver fast to the market, a well-designed design system can help to accelerate production and efficiency. Bootstrap and Material Design are examples of good system designs that streamline the collaboration between the designers and the developers to help them make a beautiful product. Bootstrap and Material Design are popular frameworks that consist of a collection of reusable elements and is guided by clear standards and structure. The idea of having a set of design guidelines resonates with what I have learnt in class. Under the lesson on prototyping and evaluation, one of Jakob Nielson’s ten usability heuristics is Consistency & Standard. Having a set of guidelines and standard in place helps to ensure that the appearance and behaviour of the product are always consistent. Besides enhancing the user experience, the design system also reflects the company’s values and branding. A well-designed design system can better promote the company.

Bread and Toast

Invision believes that the design system is a team sport which requires effort from everyone in the company. Most companies only have external empathy for their customers when they are designing their product. They often forget to practice the same level of internal empathy for their colleagues, who are working together with them on the same product. I agree with this point made during the conference. In class, we learnt to come up with use cases, user stories and user personas to cater our product to the end-users. However, we did not work on collaboration and speaking a shared design language with one and other. Invision used an appropriate example to highlight the importance of a shared design language in a team — Describe the process of making a toast. Although it is a simple question, there is a diversity of answers. Some describe the process of putting the bread into the toaster. Some describe starting from the wheat to the toasting. This difference in interpretation highlights the importance of the team to adopt a shared language internally. Perhaps the group project in class was too small to exercise these concepts, but it will be insightful to learn about them so that we are more industry prepared.

RACI Model

Invision introduced the RACI model, which consists of:

  • Responsible: Facilitates the feedback process and makes the final decision
  • Accountable: Held accountable for the “Responsible” party’s process and decision making
  • Consulted: Solicited for feedback to influence, but not control the outcome
  • Informed: Receives consistent status updates on key decisions

The RACI model advances a shared understanding of the problem and potential solutions(s), driven by an identified and empowered decision-maker. The following is how the RACI model works at different phases of the project.

When the company is designing a component:

  • Responsible: Designer
  • Accountable: Design Manager
  • Consulted: Functional & Cross-Functional Peers (Design, Design Ops, Engineer)
  • Informed: Engineer, QA, Design, Product

When the company is building a component:

  • Responsible: Engineer
  • Accountable: Engineering Manager
  • Consulted: Functional & Cross-Functional Peer (Engineers, DevOps, Design)
  • Informed: Engineer, QA, Design, Product

The change in roles amongst the teams made them more involved with the project and have a better understanding of the design system in place. Each team will better understand the constraints faced by the others and come to a design system that works for all the team.

Image by Invision

There are several design systems introduced: the Solitary model, the Centralised model and the Federate model. The Solitary model consists of an overlord who rules the design system while the Centralised model consists of a single team to maintain the system design as their full-time job. These models are not optimal as they do not scale well, or they distanced the designers and the customers since the designers do not work on a customer-facing project. A better model is the Federate Model, where team members from across the company come together to work on the design system together. In the Federate model, there is a need to find a balance so customer-facing designers can contribute to the system and not get overwhelmed. To ensure that this model work, there is a need to invest in design ops management and regular prioritisation is critical for this model.

“Design System for People” provided another perspective of what design system is to me. Some concepts taught in class were brought up but this conference mainly introduced me to the RACI model and design governance model which are important when working with a large team. In addition to the aesthetics design, the design system is about collaboration and speaking the same language. Design system may be financially taxing, and companies may not ripe the benefits in the short term. However, it is definitely worth the financial commitment and effort to start a well-designed design system at the start. Teams can always start with a small design system and slowly scale up to convince the companies to invest in setting up a well-designed design system.

--

--