Overview
Patentcloud is a SaaS platform that has six products, and the scenarios and interactions are different from each other.
The design system is very orderless due to every product was designed by different designers.
It does not just cause the difficulty of the code maintains and also causes the user experience not to unify. Therefore, establishing a flexible design system and considering the development needs of new features has become a big challenge.
Skills
UI/UX Design
User Research
Information Architecture
Interaction Design
Design Systems
Outcomes
High-Fidelity Mockups
Interactive Prototypes
Style Guide
My Role
Product Designer
The Problem
System dependency
The design unify can be divided into consistency within the product or the platform. To decide the component should follow which consistency logic needs careful consideration and discussion with PM and RD, and the process involves inventory, organization, and definition.
Workflow
The design system is not just a simple document; it’s a dynamic, collaborative process. It will continue to evolve according to new feature development or component iteration, and the design system’s purpose is to make development and maintenance more efficient and easy.
Design Process
01
02
03
04
05
Color system
In the beginning, there was only one product in Patentcloud. Therefore the color system was not suitable for other products. It not just confused the branding image but also made the experience inconsistent. After researching many documents, I propose a color system ratio that is 5% primary color and 95% grayscale color because the clean and minimalist color scheme will make the primary color more impressive.
Components
Here take the dropdown and selector component as an example, showing how is the design process going.