Design System
Building a scalable foundation for digital products
A design system with foundations, tokens and an architecture that can grow. It settles recurring design decisions once, so future product work is consistent by default.
Role
Product & Design Systems
Year
2025
Platform
Web & Mobile
The Problem
As products grow, small inconsistencies in colour, type, spacing and interaction patterns add up. Each new screen makes a decision that an earlier screen already made differently, and nothing keeps them consistent by default.
What I did for Design System
I built the foundation layer on my own: colour, typography and spacing, plus the primitive-to-semantic token layer that components will reference. It's documented and applied end to end to a real interface. I did the foundations before the components on purpose, because components built before the token layer would need rebuilding as soon as the tokens changed.
The Outcome
A working foundation: colour, typography and spacing tokens, documented and applied to at least one real interface. The component layer comes next. Nothing has been handed to another team yet, so there are no adoption numbers.
3
Foundations built
6
Semantic token groups
Next
Component library
Foundations, in Figma
Overview
Colour
Typography
SpacingHave a similar project in mind?
Let's talk about what you're building and how I can help you ship it.