4min browse / 15min read
01/06
Overview
Ke Design hereinafter referred to as KeD is the internal design system of Beike. It mainly supports nearly 20 products such as financial and personnel backend and middle-end system, including PC and mobile. With a user satisfaction of 92%, KeD enables PM to finish Hi-Fi wireframe , which can be entered into development phase without designer.
Target
-
Unify UX/UI of existing products and future products, guide designers to design landing.
-
Improve the efficiency of the product development for product managers and developers.
-
Release design resources and enhance the influence of Shanghai Design Department.
Role/Responsibilities
Main designer/Project owner
-
Iteration planning, execution and promotion.
-
Seek development resources and follow up development progress.
-
Responsible for user satisfaction and promotion to company-wide personnel.
-
Design and organize webpages and mobile components.
Problem
-
How to build a sense of identity of KeD towards PMs, designers and developers?
-
How to seek resources and use resources effectively?
Timeline
02/06
Start
Design system have various kinds. First, platform system, such as Material Design. Second, corporation’s external design system, such as Dropbox. Third, corporation’s internal design system, focuses on the specific design landing. With understanding of business, create design system meets business demands was our goal.
Background
Shanghai branch is responsible for financial / personnel / realtors education and other B-end products. Each of them had its own design system. The problems were:
-
There were inconsistent components.
-
The use of multiple design systems increased workload.
-
The old design systems were not complete, the UI style were old.
-
There’s a shortage of design human resources, and some needs couldn’t be allocated a designer, resulting in delays or instability in quality designed by product managers.
Users and Platform
This design system is provided to product managers (30+ people) / designers (about 10 ) / developers (about 100 ), including web and mobile sides, and Sketch and Axure resource packages.
Initial Resources
-
Time : a month (multitasking)
-
Human resources : designer x 1,RD x 2
Initial Target
03/06
V0 → V1
Before, we used: the company's old design system, Ant Design, and Element UI, three sets of design system. With consideration of limited time (multitasking at the same time) and development evaluation (“React”, a relatively powerful, good compatibility choice), we decided to create a localized design system, based on Ant Design. The method was to sort out (compare existing components with Ant Design) → filter (remove unnecessary, add missing) → classify (classify components by attributes).
One month later (January 2018), the KeD_Web_V1 was launched, I was responsible for public promotion to the whole company, and served as the main designer and project owner. In December 2018, the KeD_Mobile_V1 was launched. Almost all B-end products were in use. To enable product managers and designers to quickly get started with design, we writed down introductions and specific details of rules and scenarios in each components.
04/06
Problems & Solutions
Insufficient Resource & a Sense of Identity
In the past two years, with the deadline-driven nature of products, it’s hard to promote KeD and to reach consensus with different stakeholders. These were interlocking issues. To conclude, raise the sense of identity of KeD could make it more widely used, and let more people willing to invest resources to improve it. It would be a positive cycle. So why was the sense of identity not high? What problems did we face?
—— Problems ——
05/06
Present Situation
Now, it’s in a stable iteration cycle divided into three parts:
-
Meet the demand of each product line of Shanghai branch and raise usage rate. Due to the different nature of the products of Beijing and Shanghai, Beijing also has a design system. And the communication costs for both sides are also relatively high, so at this stage, it is mainly to take care of the Shanghai product teams.
-
Provide more components that fit the company's business. So to improve KeD's usability and project value.
-
Improve KeD's user experience and satisfaction. Including, 1) optimizing the user experience on the official website, 2) teaching prototype tools, 3) providing real scenarios templates, 4) optimizing the using experience of design resource package.
06/06
Take Away
In this project, I have learned that it is easy to do things by yourself, but to let everyone do one thing together requires motivation and integration.
-
Change the workflow to allow relevant personnel to increase participation and to improve project progress.
-
Use data and open operations to negotiate and integrate resources.