Crypto Tax Calculator
Design System
01 - The challenge
When I joined, the product's user interface was fragmented, relying on a mix of disparate, out-of-the-box components. This resulted in hundreds of undocumented inconsistencies across the user experience, leading to a disjointed user journey, brand dilution, and significant slowdowns in both design and development workflows.
02 - My role & approach
Recognising the need for standardisation, I took the initiative to lead the creation of a new, comprehensive design system. This was a self-directed project, not a formal assignment.
I approached this pragmatically to avoid impacting team velocity, I developed the system incrementally. The work was done in parallel with active projects, allowing us to build, test, and roll out new standards without ever pausing design or development output.
03 - The outcome
A robust scalable design system, established as the source of truth for the entire product. It included:
- A library of componentised elements
- A foundational layer of design tokens for managing colours, fonts and radiuses
- Full multi-theme support
The flexibility of the system directly:
- Enabled a new strategic partnership with MetaMask as we could seamlessly match their design style and theme
- Facilitated a full company rebrand with significantly reduced engineering effort.
Components built in Figma and linked directly to code using Figma Code Connect
Design tokens across fonts, colours and Radiuses linked directly to code using Figma Code Connect
