
A design system built from scratch with a four-year rollout that's almost complete. AA accessibility as the baseline, entirely tokenised, around 100 components. When I joined, the CTO wanted a fresh start. A few weeks of exploration, then formal component work began. What started as someone else's brief became something I owned completely.
Three layers. The theme file holds raw values — complete greyscale, primary colours with accessible variant pairs, success/error/warning states. Design tokens reference those and apply them to specific use cases. Components consume the tokens through a published Figma library.
Change the theme file and everything updates automatically. Built to AA as a minimum, but structured so we could upgrade to AAA without rebuilding.

Tokens 1
The original plan was front end first. That proposal got designed but never implemented — the admin panel was deemed more important. So the mobile app went first in 2021, as a proving ground. Workflow Builder in 2022. Admin Panel through 2023 and 2024. Front end is about six months away — that completes the journey. Four years to get there.

Rollout 1

This is the fourth or fifth design system I've built from scratch. Mitrefinch had light and dark themes. OneAdvanced was a full rebuild for the HCM suite. A couple of personal projects along the way. Design systems keep coming up in my work. At this point, it's just how I think about product design.