← All work
UEFADesign systemsComponent library2020–21

A design system for UEFA's B2B platforms.

Two years spent designing, documenting and promoting the component library that became the foundation for every new design and development initiative across UEFA's B2B products.

COMPANYUEFA
ROLEProduct Designer, Design System
TIMEFRAME2020 – 2021
TEAMProduct Designer · Front-end Developer

A way of working

During my two years at UEFA, I dedicated roughly 25% of my time to maintaining, evolving and promoting the B2B design system across UEFA's B2B platforms.

Together with another product designer and a front-end developer, we continuously created and updated components in the Figma library — keeping them aligned with business, project and user needs — and thoroughly documented everything in Zeroheight to support consistency and adoption across teams.

View the UEFA B2B design system →

UEFA Champions League starball branding used across B2B tools

Competition branding lived in the system — Champions League, Europa League and the rest of the UEFA calendar, applied consistently across internal tools.

Key responsibilities

Golazo Cards page on Zeroheight — Champions League card anatomy

Cards in the system: competition header, status body, and a single action — documented so every team used the same pattern.

Golazo Buttons page on Zeroheight — default and compact variants

Buttons documented with variants and heights — the everyday language of every B2B form.

Golazo Top bar page on Zeroheight — anatomy of the app bar

The top bar: app identity, navigation, competition selector, notifications and profile — one of the more complex components in the library.

The tools it served

The system was the shared language for UEFA’s internal products — accreditation, club operations, matchday volunteering — so each team did not invent its own UI.

Champions League application form — stepper, theming and form patterns from the B2B design system

Accreditation for Champions League: competition theming, a step indicator, and form patterns from the library.

Kit registration — Playing Attire Approval Form for Atlético de Madrid

Kit registration for clubs — a dense B2B flow on the same components: stepper, fields, status, actions.

Achievement

The UEFA B2B Design System became the foundation for all new design and development initiatives — ensuring consistency, scalability and efficiency across projects.

NEXT PROJECT — 06/06

Unified Platform, King