Building a unified design system from scratch
Creating consistency, scalability, and clarity across a growing product ecosystem.
Posted on:
Setting the scene
I joined Orbi in year 2 of the company and was the 5th hire. Being the only UX designer, I instantly knew that it was going to be up to me to take care of the many design-related tasks.
Right at the beginning of my tenure, Orbi underwent a rebrand that was led by our CMO. Naturally, I was tasked to oversee the project. I quickly noticed that the rebrand was quite drastic, meaning our digital products would need to follow suit.
The problem
Since there was no dedicated designer before me, the design files were mismanaged by external contractors. There was a simple design system that laid out colours and a miniscule component library that was made up of icons and buttons.
I knew if we were going to do this right and be consistent across all of our digital products, we needed to have a design system with a unified component library that each product could utilise.
The outcome
After 8 weeks of constant iterations, I created a detailed design system that meticulously showed every component, across every state, as well as what it looked like both in light and dark mode. I called it ODLS, Orbi Design Language System.
I broke down it down to two important files:
Foundations
This file contained all the foundational elements for the Orbi Design Language System (ODLS).
Components
This file was the centralised hub of app and web components. Building new views for new features was a breeze since I no longer had to reinvent the wheel.
Design tokens
I even took advantage of Figma's variables feature and implemented design tokens to help create a level of consistency across the apps. Allowing me to easily implement light and dark mode across all the components.
Lessons learned
Although the creation of the ODLS has helped speed up design and our production rate. In hindsight, if I were to do it all over again, I would probably adopt an existing design system. Being a startup, speed is everything. The 2 months it took me to build the ODLS, could have been time spent on other ideas that could generate revenue.
Saying that, both the CEO and our developers appreciate the creation of the ODLS as it has helped us design and build at an alarming rate. Not only are our products unified, but it is bespoke and doesn't look like every other app that has adopted an existing design system.
