Building a System for Scale

A centralized component library built to unify a fragmented product ecosystem, bringing consistency, speed, and scalability across every product surface.

Clinical intelligence product dashboard presented in layered desktop browser mockups

Role

Product Designer

Timeline

March 2026- Ongoing

Team

2 designers (design lead + self), close collaboration with Developers, 2 stakeholders

Platform

Figma

Overview

TartanHQ's products had grown fast, but the design behind them hadn't grown with any shared structure. Every product team was solving the same UI problems independently different chart libraries, different input patterns, different visual language and it was starting to show, both in the product experience and in how long it took to design and build anything new.

I partnered with my design lead to build a centralized component library from the ground up: auditing what already existed, defining what needed to be built, and creating a governed system any product team could adopt without slowing down.


The challenge

There was no single source of truth for design. Similar components had been rebuilt slightly differently across products, sometimes down to using entirely different charting libraries for the same type of data. This created three compounding problems:

  • Inconsistency, products didn't feel like they belonged to the same company

  • Duplicated effort, designers and engineers kept rebuilding the same components from scratch

  • No governance, there was no process for deciding what got reused vs. rebuilt


Research and insight

Before designing anything new, I audited every product surface to map where visual and functional patterns diverged, cataloguing which components were reusable as-is, which needed refinement, and which gaps had no existing solution at all. I also researched design systems across SaaS and adjacent domains for governance models and naming conventions worth borrowing from.

This meant no decision was made in a vacuum, everything was grounded in what already existed in the product and validated against how mature systems elsewhere solved the same problems.


Product strategy

Every component decision started with the same question: does something like this already exist? Where it did, we standardized and refined it. Only where a genuine gap existed did we design net-new components.

This reuse-first approach kept the system grounded in patterns teams already recognized, which made adoption easier later. Founders, the marketing head, and graphic designers were all part of shaping direction, ensuring the system reflected both usability needs and brand consistency from day one.


Business Impact

These weren't just design wins — they translated into measurable outcomes across the org:

  • 2× Faster Delivery — reusable components cut design and dev time in half per feature

  • Fewer Bugs & Regressions — shared components meant fewer edge cases and far less QA overhead

  • Stronger Brand Trust — consistent visuals built user confidence across every touchpoint

  • Lower Engineering Cost — eliminated duplicate UI code and reduced frontend maintenance debt

  • Faster Team Onboarding — new designers and engineers ramped up in days, not weeks

  • Built to Scale — new products could launch with zero accumulated design debt from day one


Interface system

The result is a system engineers can implement with confidence and designers can extend without guesswork — covering form fields, chips, banners, and data visualization components with every state accounted for.


Outcome

Completed and shipped in August 2026, the system has reshaped how product screens get designed and built across TartanHQ. It's been applied across a mix of redesigns and net-new builds, most visibly in the HR benefits dashboard redesign and, in an entirely different product, the compliance/regulatory dashboard, proving the system holds up across products that look nothing alike on the surface.

Results:

  • Faster design & development, reusable components cut the time to design and build new screens

  • Consistency across products, the same system now holds together visually distinct products, from HR to compliance

  • A shared design language, what was scattered and product-specific is now one system every team builds on


Ready for the work ?

Let's talk

Currently open for collaboration

Connect on socials

Ready for the work ?

Let's talk

Currently open for collaboration

Connect on socials

Ready for the work ?

Let's talk

Currently open for collaboration

Connect on socials

Create a free website with Framer, the website builder loved by startups, designers and agencies.