Yonyou entered the 3.0 stage, agile development, reverse development, double pizza principle of rapid combat, “user’s friend” value return, all of which put forward higher requirements for rapid prototyping, high fidelity verification, rapid development, consistent experience. It also brings more pressure.

The new changes include:

1. Stage release becomes continuous iteration, with short cycle and fast progress

Weekly or biweekly iterations leave very little time for individual characters

3. Users spoiled by C-side apps demand a higher B-side experience

4. In order to avoid waste of resources, the r&d process must be UE first, and the design scheme and hi-fi verification can be completed in a very short time

5. All parties have higher and higher requirements for product and experience consistency

6, collaboration each role requires quick and immediate communication, all staff share design plan without delay

7. Design teams need to abandon simple and repetitive inefficient work and require efficient cooperation, resource sharing and collaborative design

Everyone is a product manager, requirements change frequently, and design changes on demand

How to meet the new requirements?

To meet the new requirements of the transformation, the only solution is to need a design system, a real design system, which is different from the level of project guideline or uikit systemic design system, the system requirements: what you see is what you get, the more clear, visible and clear standards, can be coordinated, reusable and configurable, extensible… … Cloud platform design system is born for this purpose.

Design system, can make the design team better, faster to create products and large-scale output.

The design system is made up of basic reusable components that are put together using clear standard principles to build any application.

Cloud platform design system

· Cloud platform design system is a UE design system that supports consistent experience and efficient development of platform products, and is the design language of cloud platform products. It is a “communication mode” based on Yonyou’s consistent product standards and style guidelines and follows Yonyou’s product design mode. It is the theoretical support and application of design methods, modes and experience principles accumulated on the platform for many years. It can effectively guarantee the consistency of platform product interaction, vision and experience, and effectively guarantee the agility and efficiency of team development.

· For UE and FE roles, the system tries its best to ensure the integrity and consistency of cloud platform products and services in the field of user experience. Provide basic reference principles and shared resources for the team to improve work efficiency and promote collaboration and innovation.

· Cloud platform design system adheres to yonyou’s core experience values of “Friends of users” and is committed to the cloud platform user experience concept of “steady as a rock and silky as smooth”. Help products and services to achieve customers’ demands of high value and high user experience.

Principles of cloud platform system design

The cloud platform design system is positioned to serve the middle and background products, providing systematic, logical, business-based and implemenable design theory, mode and standard support. The design goal is simple, clear, efficient and consistent.

Simple:

Designers try their best to present complex things in simple forms

Clear:

The description, implementation and feedback of the problem are not entangled and ambiguous

High efficiency,

System design, resource sharing, element and pattern reuse, team collaboration

Consistent:

Consistent goal, consistent interaction, consistent vision

Cloud platform design system characteristics

1. The cloud platform design system has completed the customization of most components.

In the realization of business, there is no need to consider how big the button rounded corners should be and how much line spacing should be left. It can focus more on the business logic itself and save time and energy.

2. The design system has atomic-level style customization capability.

We can efficiently produce design systems for different requirements, and then quickly reuse components.

3. Systematization of elements.

Atomic colors, fonts, shadow styles, and so on can all be customized, and all components can be changed synchronously at once.

4. Coordinated operations

The style resource is shared by all members of the specification design team

5. Design the system first, then the business and component library

This is the fundamental difference between cloud platform design systems and pseudo-systems

Application of atomization design method



Design system maintenance and evolution

The cloud platform design system integrates the previous products, projects, experiences and forward-looking trends, breaks these information into “atomic” particles, and then combines the product, project, business and user needs to comb, extract and precipitate again, reserving the most original and public parts to form the basic design norms and elements. Based on the underlying design elements to assemble extensible and configurable block elements and large components, through granular elements + block elements + large components to build flexible but consistent pages, and then integrated into the precipitation of the design pattern, quickly build applications, quickly complete visual, interactive hi-fi, interactive interface output.

Elements of the cloud platform design system follow the following principles:

1, structured, modular

All elements are presented and modelled as reusable parts; All are based on structural design, build and disassemble at will. Minimize dependencies. Enhance the systematization elements.

2. High efficiency and standard

Elements or components are based on common standard specifications. Assembly with minimal elements, output with minimal notes and descriptions to achieve and articulate a clear design.

3. Abstraction and patterning

The base elements (controls, components, patterns) are shaped separately from the generalized typical scenario.

4. Configurable

Custom base elements are generated through optional parameter configurations and do not need to be redesigned.

5. Scalability

The components are easy to expand with anticipation for future designs.

6. Accuracy and clarity

All the design is not vague, not tangled, fit the scene and accurately convey the role.

How to achieve rapid development of cloud platform design system?

The guarantee of high efficiency and consistency of platform design system also comes from the guidance that the output of UE team and FE team depend on this system.

General Sketch library and front-end component library based on cloud platform design system

Design systems to support fast delivery and consistency

Integrated cloud platform Sketch-libraries, including common platform Symbol. Based on sketched-libraries, normal UE designers can output standardized high-fidelity interactive pages in just a few hours with a full understanding of the business, instead of the original 2-day interface. All UE symbols are based on the same standard symbol, which can be used and maintained together to realize the coordination and reuse of design resources.

For front-end development, there is no need to write the basic style repeatedly. The basic control vision here is also the design specification of the tinper-React basic control. Designers can quickly complete the design scheme based on the cloud platform Sketch Libraries and publish the design scheme to the ink knife project document. Through the shared address, all roles in the team can share the design scheme and synchronize the real-time update.

Front-end development does not need to distract attention to the IMPLEMENTATION of the UI layer, just need to introduce Tinper-React to ensure consistency. Tinper-beereact component library contains rich basic components and application components, which are packaged based on the platform design system specification. It contains rich basic components and application components, and supports flexible invocation and extension of components.

Based on cloud platform design system design and implementation scheme

Proprietary cloud – development platform

Developer Center

Cloud platform design system application case

Enterprise service center, Yonyou cloud operation system, cloud business system, mobile platform, Moli, enterprise account, data portal, developer center, open platform, friendship communication, iot platform, intelligent industrial cloud platform, service governance platform, cloud ESB, MDM master data management, micro-service platform… And other products or systems are based on cloud platform design system.

In the end, we save a lot of time. What do we do with it?

Cloud platform design systems help designers save time by avoiding repetitive and useless work, avoiding being reduced to intensive labor, and eliminating work that is of no value to designers. This time comes from, say, doing the same tweak on 100 different pages, changing the style of the entire system, creating the same component 50 times or replacing the same text 70 times.

Then we use that new time to focus on things that are more important to the user or customer, things that add value and experience: deep understanding of the business, user insight, process improvement, incorporating brand identity, analysis of user feedback, innovation and relevant solutions, emotional design, and so on.