Dudoo Design System

UX research, UI design, BI Design

Jul 2021
‍

Project Overview

As the product team grew, training new members on fragmented design elements became costly. This project aimed to encourage collaboration and allow design material access for all team members.

My Contributions

・Created Dudoo design library.
・Created components and ensured consistent design style.
・Defined design style and guideline into design tokens.
・Built an online documentation via Zeroheight.
‍
‍

The problems

The design style looked different between different across design files and we did not have a standard to follow.

It was hard to communicate with stakeholders as we did not have documentation or same language to discuss. The frequent problems :1. Shared each others' design components. (Dudoo used Sketch at that time, so it was not efficient.)2. Took previous design files as the standard while starting a new project. 3. Inefficient communication with stakeholders about the design style.

Define & Kick-off

We had the idea to build a design system for our team, but we had no resources.

As we did not have resources to gather a design system team, we decided to build design system by designer without engineers involving.

Objectives

1. Built a library for the design team to access all the elements.
2. Defined design token to communicate.
3. Created a documentation using open resource and allowing to share with stakeholders.

Delivery

Classified all the visual components, defined the naming rules and design guidelines to consistent design styles and access rules, allowing every stakeholders can get access.

Easy to navigate online documentation

・Male sure everyone are aligned
・Grasp the elements quickly.
・Allow all stakeholders to access.

Design consistency

・Defined design style
・Align with the Web Content Accessibility Guidelines (WCAG).

Open picture in new tab