HUOLALA DESIGN GUIDELINE
UI Component Library + UE Interaction Guidelines
Project Roles
Project Lead
Interaction Guidelines Definition
Main Designer of Component Library
Project Duration
Non-product Requirement Project
Design Initiative Project
3 months
Goals Achieved
Uniformity, Efficiency, Consistency
Efficiency
Consistency
Background of the Project：
Upon starting formal business requirements, I noticed the current team lacked a complete set of guidelines. This resulted in a chaotic state of design styles, interaction processes, and terminology definitions across multiple products.
As the product lines and business requirements gradually increased, the issues became more severe. Thus, I organized and initiated the design team’s Design Guideline project.
Framework Sorting - Problems
Product Side, Interaction Side, UI, Visual Side
Sorting out the product architecture of the "My Page" on the HuoLala driver side
Extracting and summarizing issues
Guideline Advantages
Uniformity, Efficiency, Consistency
Innovation - This guideline will start from an overall perspective
Ensure the correspondence of UI components and interaction guidelines
Module Sorting
Prioritize the development of interaction guidelines for basic components
Extend the component library based on basic components
Work Execution
Track and control UI component design and progress
Develop guideline templates
Guide design direction and team member division
Component Library and Guidelines Gradually Built V1.0
V1.0
After completing V1.0 and conducting internal promotion within the company, significant issues were still found in the integration of components and interaction guidelines Thus, began optimizing for V2.0
V2.0 Guideline Framework Structure Setup
Addressing issues from 1.0 and internal feedback
2.0 aims to solve problems from the structure level of the guidelines
Design and Development Service Platform
Documentation Website
A Service Platform That Can Track the Entire Design Specification to Output and Improve Design and Development Efficiency
