I led the design of a scalable, accessible design system for Fanatics to support multiple brands and teams worldwide. My work focused on defining clear UI components, detailed documentation, and developer-friendly tokens to ensure consistent, high-quality experiences across web and mobile.

The system enabled faster handoffs, easier theming for new brands, and supported Fanatics’ international expansion by making design changes predictable and easy to implement.

More details:

Role: Lead Designer

When: June 2024 - Present

Platform: SaaS - Desktop

Industry: Sports, B2B

Responsibilities: UX Research, UI Audit, User Testing, Prototyping, Documentation

UX Audit, User Flows, Wireframes & Prototypes, Style guide and tokenization, Components Library, Design System Documentation.

Fanatics is a global digital sports platform focused on serving fans throughout their entire sports journey. The company brings together commerce, collectibles, and betting under one ecosystem to deliver an integrated, personalized, and immersive fan experience.

With Fanatics Commerce, fans can gear up with officially licensed merchandise. Through Fanatics Collectibles, they can dive into the world of trading cards and memorabilia. And with Fanatics Betting & Gaming, they can engage with the sports they love in new and exciting ways.

To build a consistent, scalable, and developer-friendly design system, I used a hybrid approach combining Figma Variables, Atomic Design, and Lean UX.

Why? It lets us iterate quickly, validate with users, and stay aligned across design and development.

I structured components as atoms, molecules, and organisms for easy scaling.

We focused on design tokenization with Figma Variables to manage color, spacing, typography, and themes in one place. This made the system flexible for branding changes or platform needs.

This setup reduced handoff friction and kept design and development in sync, speeding delivery and increasing team confidence.

The FC Design System was created to support multiple brands and teams across Fanatics globally. It included accessible color styles, spacing, grid, and breakpoint systems, and consistent typography as its foundations. The system defined core elements like buttons, input fields, toggles, and switches, and expanded into more complex components such as tables, cards, and dashboard widgets. It also covered organisms, templates, and pages to ensure a fully scalable and consistent UI across all products.

User Experience Improvements – Faster Comprehension: Time spent understanding safety data decreased by 25%, thanks to clearer layouts and improved dashboard design. – Fewer Errors: Clearer components and input patterns reduced user mistakes by 70%, leading to more accurate data. Team scaling – Less Rework: Well-documented components and design guidelines cut down on bugs and back-and-forth, resulting in a 15–20% drop in design-dev rework. – Better Team Collaboration: Shared understanding and smoother workflows improved cross-functional collaboration—early feedback shows a 10% boost in developer satisfaction.

Business-Level – Scalable Growth: The system helped the team scale quickly, making it easier to onboard new clients and adapt to different needs without sacrificing quality. – Stronger Client Relationships: Stakeholder feedback pointed to a more intuitive, effective product, helping to build trust and long-term partnerships. – Mission Alignment: The work directly supported the company’s mission to reduce workplace incidents and build a stronger safety-first culture.