When it comes to Design Token, the first reaction of many students may be what is this? In fact, this is not a new term. As early as 2014, salesforce began to conduct research in this area. Its name comes from Jina Anne. Design Token is the visual design atom in the design system. They are a set of entities with a uniform naming convention, used to store specific parameters of the visual design part, such as HEX color value, spacing, size in pixels, etc. Using it can help maintain a scalable, consistent visual system for UI development. In our actual work, we often face problems and challenges such as the large number of participating members,
the complexity of the business background, and the changing design trends. Do you have the following questions: The design team joins new people, because they do not understand the specifications, they often do not know the application b2b data of the corresponding color values in different scenes. The code of developers is fragmented. When encountering new business, secondary development is required, iteration and maintenance costs increase. With the upgrade of the company's strategy, the brand color has been adjusted. Because there are many adjustment pages, the adjustment is often forgotten because of some color details. So let's learn about Design Token together~ Design Token is the smartest to use in this way,
so hurry up and put it away, it's so practical! 1. Concept In essence, Design Token is a working thinking and method used jointly by design and development . "Token" means a token or instruction, which can be simply understood as an attribute parameter that encapsulates a visual style . In terms of naming rules that designers and developers understand, each element in the component is named in a regular code , which unifies the communication language of two different types of work (front-end and design), ensuring that the design system can be quickly managed, Ensure flexibility and consistency of product experience.