From Baidu MEUX, dual background in R&D and design, ten years of experience in the Internet industry, now focusing on the design and development of the design system management platform (LIGHT DSM). Looking forward to the combination of design, technology and art.
What is the cultivation of a good programmer? if else (Bug) ----- Find bugs
What is the discipline of an experience designer? What would (user) do if (scenario)? ----- Insight
Design philosophy: subtract and be natural
Nowadays, UX designers are not only involving in interaction designs but also in insights and opportunities. Furthermore, they should pay attention to user experiences and how to outperform competitors as well. Nevertheless, many designers spent most of their time on interface design, communication, check UI implementation, and suchlike. As a result, they are less likely to have enough time or energy to fully understand products, users, and related scenarios, let alone the glass ceiling, which is looming in the near future.
On the other hand, engineers used to solve and think in engineering ways. Is it also possible that user interface designers would be able to borrow some programming thinking? That just the purpose of this essay, that is the user interface engineering.
As related researches have revealed, the most critical attribute is design structuring (precise description). Simply put, Design Token allows designers to clearly describe or express design properties such as design guidelines, resources, elements, and documents. This way, design tends to use some program attributes, such as inheritance, citation, instance. Furthermore, there should be platforms and tools to support user interface engineering. As a result, we, as Baidu's designers, have been creating LIGHT DSM (the design system management) for several years. To maintain an organic system, we reorganized a series of properties of the user interface design and combined it with the working process. The user interface engineering has so many advantages, such as codification, iterations, flexibilities, and even the efficiency of design and research would be better able to boost considerably.
During this workshop, participants could further understand the basic principles and attributes of user interface engineering. And how to create a design system using LIGHT DSM. In other words, attendees will learn how to create and switch dark and light themes, implement UI-style explorations. They also tend to enhance their structural thinking and let the design team work more swiftly and effectively. At last, their products will outperform related competitors as well.
The main contents of this workshop:
Part one: The principle of user interface engineering
1、Design token: the key to connecting design language and development.
2、Design structuring, variable design is not enough. We also need design structuring, let design become logical.
3、Implementation, besides design theories, platforms and tools are also critical. These allow the user interface engineering to be feasible and practical.
Part two: LIGHT DSM, That is all about design system management.
1、Overview of DSM, introducing the structure and workflow of the DSM
2、Team management: to demonstrate the platform of team cooperation and synchronization
3、Design resource management: how to manage icons graphic resources
4、Design guideline managements: to clarify the abstract principles of design guidelines, how to organize online resources.
5、Design tools: demonstrating how to connect design resources and tools and create the engineering user interface.
6、Design output: how to implement the online user interface designs and better ways to provide codes and resources for developers.
Part three: cases of user interface engineering
1、One step to switching to the dark mode
2、Redesign of a new style
3、Development demonstration
1、Workshop and theme introduction
2、Principle Introduction: the principles of user interface engineering, implementation, and advantages.
3、Case study: low cost of dark mode and style upgrading implementations.
4、Practice interaction: dividing into several groups to implement a structured user interface, finishing an automatic dark mode case, and how to export online design outputs.
5、Q&A
6、summary
1、architectural designers / man-machine interaction experts /user interface designers
2、design managers / design leads
3、H5 / NA front-end engineers.
4、Operation system-related workers
1、To further understand the design architects
2、Expanding the connected thinking of design and technology
3、Hoe to utilize user interface engineering to boost team cooperation and resource quality