TERRA: Ninety Design System
Building a scalable, accessible foundation for Ninety
As part of a small but mighty design team, I helped build Terra, our first unified design system at Ninety—from the ground up. Before Terra, each tool within our platform had its own look and feel, making the user experience inconsistent and hard to scale. Our goal was to bring cohesion, clarity, and efficiency to every corner of the product.
My Role
I co-led the system’s development alongside other designers, working closely with engineering to define foundational elements and ensure seamless implementation. My contributions focused on:
Design tokens: I established a structured token architecture for color, spacing, and typography, with semantic naming that made it easy to manage themes and responsiveness.
Component design & documentation: I designed and documented a suite of reusable components—including cards, tables, and modals—with accessibility and flexibility in mind.
Cross-functional alignment: I collaborated with product and engineering partners to align UI patterns across tools, resolve inconsistencies, and build shared understanding of Terra’s purpose.
What We Solved
Inconsistent visual language across tools
Inefficient handoff and duplication of design/engineering efforts
Lack of accessibility and responsive standards
Team: 6 product designers, 1 product manager, 2 engineering leads
Atomic Design
The design system is built upon the methodology of Atomic Design. Our design system is categorized by Atoms, Molecules, and Organisms. The goal was to have our app integrate seamlessly with our larger parent brand. This didn’t just mean a visual facelift, but fully living up to our “everyone, working as one” motto.
Impact
Cut design-to-dev handoff time significantly by aligning on shared components
Reduced visual debt across web and mobile
Enabled faster onboarding for new team members with centralized documentation
Laid the foundation for future governance and contribution guidelines
