📈 Business Impact
• Designed and launched a core set of 30 global components used across 28+ product teams
• Standardized UI decisions company-wide, eliminating redundancy and reducing development time
• Contributed to a system that now supports consistent, scalable, and brand-aligned design across Ticketmaster platforms
🎯 Project Role
Drove the creation and rollout of Ticketmaster’s global design system. Collaborated across product, engineering, and design teams to align on patterns, component behavior, motion, and documentation. Helped navigate governance, decision-making, and adoption strategy.
🛠 Skills Used
• Design Systems
• UI Component Design
• Visual Design
• Interaction Design
• Motion Design
• Facilitation
• Design Governance
• Documentation
• Cross-functional Collaboration
• Brand Systems
The Problem
Component mayhem
At the time, Ticketmaster had over two dozen product teams, and no unified design system. Components were being re-invented across teams—buttons, dropdowns, spacing, colors, typography. There was no scalable way to update design globally or ensure visual consistency.
It was costing time, money, and trust.
The Solution
Once everyone's hearts are broken, you have a design system.
Building a component library isn't difficult—getting consensus is. Everyone has opinions, especially when it comes to the seemingly simple things: corner radius, padding, or button shape.
I often joked (truthfully) that a successful design system begins when no one gets everything they want.
That question alone can take weeks to resolve. Once that decision is made, perhaps two-thirds of your design team has a broken heart. Once everyone's hearts are broken, you have a design system.
Design Governance: Our "House of Representatives"
To manage decisions, we formed a Design Governance group—3 designers representing different parts of the company. I was one of them.
We collected samples from each product line, debated on Slack, huddled on Zoom, and slowly aligned on decisions. Our job was not to be dictators, but to make progress and break deadlocks. The system had to work for everyone—even if it wasn’t perfect for anyone.
Start with Buttons
Hair was pulled. Teeth were gnashed. But we got there.
We began with buttons—a deceptively small but foundational component. Rounded? Square? Pill-shaped? What sizes? What labels?
We audited current UIs, identified common patterns, and standardized on three sizes: Small, Medium, Large—mapped to typical use cases like data tables, forms, and call-to-actions.
I pushed the team to shift from preference to practicality. The goal wasn’t pixel-perfection. It was alignment—and getting these things into code.
Designing States & Interaction Patterns
The system starts to take shape
You got to start somewhere, and this is where we started. Hair was pulled out, teeth were gnashed, dry erase markers were mangled, but we got to the finish line and settled on this initial system of buttons.
The States
Every state must be accounted for
Moreover, here are the other states as you can start to see here that a system is beginning to develop for how to express each state.
- On hover, go 20% darker
- On press, go 40% darker
- On focus, use a blur outer shadow
- Disabled, use a 40% opacity on text and background separately
- On press, go 40% darker
- On focus, use a blur outer shadow
- Disabled, use a 40% opacity on text and background separately
Now we have a pattern we can repeat elsewhere.
Motion
It's gotta move, right?
Motion adds delight and clarity. I designed motion specs in Framer, testing ~15 variations until we agreed on the final behavior:
- Time: 0.3s
- Easing: Bezier In Out Quad
- Scale: 0.97
- Easing: Bezier In Out Quad
- Scale: 0.97
I probably tried 15 variations before we all agreed on the above.
The Results
We got there!
• 30+ global components designed, built, and documented
• All assets published on GitHub with usage guidelines on the Ticketmaster Brand Site
• Adopted across internal tools, marketing, and consumer products—providing speed, consistency, and brand alignment
What started with messy debates became a scalable, maintainable system used across the entire organization.
