Challenge
The organization was struggling with inconsistent variable libraries and fragmented component sets. Fonts, spacing, and even corner radiuses varied across platforms, making it impossible to maintain a cohesive brand identity or scale efficiently.
Solution
I architected a semantic variable system where tokens are defined by intent of use rather than just visual hierarchy. This foundation was built to be hyper-flexible, allowing for complete brand pivots—from typography families to corner radius—using Figma Modes. By merging the two existing systems, I created a "Master Foundation" that supports multiple sub-brands. Additionally, I co-defined the governance framework and contribution process, ensuring the system remained scalable and organized
The Outcome
The system is now fully prepared for Phase 2, which will focus on expanding the component library and rigorous stress testing. This solid foundation ensures that, in the next stage, users will benefit from a highly cohesive interface, while the product teams gain the ability to build screens and deploy multi-brand updates with speed, reducing manual rework and ensuring a seamless handoff to engineering.
