Pujasera Design System

Background

ESB is a company that has multiple products, in every product has a unique design foundation and component. Currently, every product has its design system but does not have a centralized guideline for all products. This concept has been running but in several products that use the same brand color there is a different HEX color code and we also found many design inconsistencies.

After a long time of discussion, and finally, tried to implement a design system to be used for multi-products. To define this project, we start from 2 W 1 H (why, what, and how).

Why?

Before starting this project, we brainstormed again about why we needed to centralize a design system. We found the highlight problem is:

Collaboration Gap
Miscommunications at different paces between designers & developers.

Slow Delivery
Many redundancies in the process, meanwhile we have to deliver it fast!

Inconsistency Design
The team’s getting bigger, and each of them has its unique visual approaches.

What?

Many of us are ignorant about system design, both designers and non-designers. We’ve been looking for a workable approach, and we came across this.

How?

Start by defining the existing design, then create new components that adjust to new foundations and variant properties. Then, testing the components before published or consumed by designers. And the next step, components are ready to hand over to a developer.

Team Model

By defining the existing design, then create new components that adjust to new foundations and variant properties. Then, testing the components before published or consumed by designers. And the next step, components are ready to hand over to a developer.