What are the principles of system design? What is the system design itself? Where does this concept come from and why is it important?
In this article I will answer these questions. But before getting to the point, I need to make a little introduction. Because I want to talk about a relatively new concept in the field of digital product design and user experience design. It goes without saying that those two areas (product design and user experience design) are also new.
Designing digital products, such as websites and applications, is a complex and detailed task. Economic and market considerations, technological considerations, and changing user demands and needs should be taken into account. Therefore, digital product design must be constantly improved to meet the above considerations.
Digital product improvement is part of the duties of product designers and may involve changing some features of the product or adding or subtracting from them. Another point is that, basically, digital product design and product promotion is team work and different specialties play a role in decisions. Therefore, to design a successful product, it is necessary for different people and teams to understand each other and be able to work together.
This is where system design becomes essential in product design.
Table of Contents
Principles of system design
Before I talk about the principles of system design, I need to define it and also explain a little about the benefits of system design and its importance in the product design process.
How many pages do you think Amazon has? How many icons and buttons are used in the design of the Amazon site? What color or text does each one have? Basically, how many colors are used on the Amazon site? What happens if the user interface or user experience design team decides to change the design of one or more elements throughout the site? The product design team should ask the technical team to implement the changes.
Well, it goes without saying that this is difficult and confusing. Because the number of elements is large. Even if the number of elements is small (compared to a very large site like Amazon), there may still be inconsistencies and problems between the technical team and the product design team to make these changes. I must emphasize again that different people, specialists and teams are involved in the design and production of digital products. The coordination and coherence between the teams and that everyone has a clear picture of the different components of the product is a decisive factor for the success of the design of any product (site).
So, companies and businesses that are engaged in the design and production of digital products decide to reduce possible errors, misunderstandings, strengthen teamwork, streamline the product design process, reduce rework, increase the speed of work, and also ensure the beauty and success of the experience design. User and user interface; define a system for designing each product.
What is system design?
Let me quote a definition from nngroup.com, which is considered a reference in the field of user experience design and design. This definition is brief and useful, and according to the explanations I gave, it will clarify the meaning of system design or design system for you.
“A design system is a set of standards to manage design at scale by reducing redundancy while creating a shared language and visual consistency across different pages and channels.”
4 basic principles in system design
Each company defines its own system design according to various factors. Therefore, the system design does not have a single set of standards, and the system design of each project is specified for the same project and with the standards of the same project. Defining the system design is one of the tasks of the user interface designer.
It is true that every project and every product has its own design system, but can a UI designer design a system without any basic criteria? In order for the system design to achieve its goals (that is, it can create a common language, coherence and integration in the product design process among all the people and specialties involved), it must be designed considering the following principles from the beginning.
1. The goals and values of the project (product) must be considered in the design of the system design.
Yes, system design is defined for a specific product design. The goals that the product wants to achieve as well as the values of that product are the first things that should be properly reflected in that system. The design of the system must be in accordance with what product is going to be designed and produced with what features and specifications.
2. The design of the system must be compatible with the identity and language of the designed brand.
In addition to considering product goals and values, brand identity and brand values should also be considered. It is not possible to design and produce a product as a subset of a specific brand, but not have any coordination and compatibility with the brand’s values. The design of the product somehow shows the identity and voice of the brand. For example, a brand may be represented by a specific color or element or a combination of colors and elements. The UI designer should pay special attention to those colors or elements in the system design and include them in the design.
3. The design of the system specifies both the general rules and principles of the design and the details.
The design of the system is supposed to make the work of the design team and the technical team (programmers and developers) easier and faster. So, in its design, one should proceed based on the principles and rules of product design and specify all the details based on those principles as well as the design thinking. It is for this reason that system design includes components and patterns. Components are the most detailed parts of the system design (buttons, forms, CTA, etc.). Components can be compared to bricks. Components are arranged next to each other based on patterns.
So, for example, when the programmer is going to create a contact form on the site, he refers to the patterns in the system design and sees what structure and details (components) the contact forms have. The contact form may be designed with three fields with specific colors as well as a CTA with specific text. By using the design system, the programmer makes the form possible in the shortest possible time.
4. It must be ensured that all teams understand the design of the designed system.
What’s the point of designing a system if the teams can’t understand it? The system design is designed to help teamwork and facilitate communication between teams. So, its contacts are from different worlds. In system design, in addition to many parts written in the language of designers, there are code snippets.
The system design should be simple and clear. Because if it is vague, it will not achieve its goals and may create misunderstanding and become an obstacle to team work. Therefore, although the system design is implemented with the help of software such as Figma, Descriptions and written text (Documentation) also accompany it. The purpose of description in system design is to ensure understanding of the common language in which it is designed.