Category:
Design System & Foundations
Date:
Since November 2023
Duration:
4 weeks (Foundations)
Anticipating design challenges in a startup with no existing design infrastructure, I proactively deepened my knowledge of design systems since 2023. Recognizing the likelihood of working on a product with no prior design experience and inconsistent design elements, I opted for a strategic, gradual approach.
This portfolio project details my journey of creating a design system from scratch, focusing on implementation and sustainable maintenance strategies over the year.
(IMPACT)
(VISION & INNOVATION)
Working at a startup, I recognized a critical gap in our design infrastructure: the lack of capacity to develop a component library, let alone a comprehensive, tokenized design system. My vision is to establish a centralized design system that transforms our design elements into modular, reusable components. By leveraging Figma as our primary design tool, we can create a scalable framework that ensures design consistency and accelerates product development.
(CHALLENGES)
When the product was first built, large amount of input fields, a table, and various buttons were used. They were placed across the product with no styling or inconsistent behaviour. The colour theme was not accessible.
Every time we started a new feature, developers created projects with the limited reusable components or from scratch with their own codes. This would mean extending inconsistency in the product while the number of feature grows.
(PROBLEMS)
Each time, we needed to:
Discuss on which colour, icons and buttons to use…
Despite the challenges encountered, I have established a robust design foundation and infrastructure in Figma.
(SOLUTION SPACE)
The approach that I have adopted:
Set up a components board
Prioritize components to work on
Pair designer and engineer
Discuss behaviour, accessibility, variants etc.
