Olympic Games App

Olympic Games App

Design System
Product Design
Visual Design
Cross-platform
Quality Assurance

Design System

Product Design

Visual Design

Cross-platform

Quality Assurance

Agency

The Cocktail

Role
Product Designer
Visual Designer

Duration
8 Months

The International Olympic Committee wanted to consolidate its digital presence into a single, definitive channel for all Olympic content. Until then, Olympic Channel had been responsible for distribution, but the ambition was to bring everything under one official platform with a stronger digital identity, wider content offering, and a modern, accessible visual language.

The project spanned mobile, web, and even TV apps, but here I’ll focus on the mobile app, where I was responsible for designing features, building the design system, and ensuring a consistent, accessible experience.

Agency

The Cocktail

Role
Product Designer
Visual Designer

Duration
8 Months

The new app had to become the go-to digital destination for fans worldwide, offering live coverage, personalization, results, archive and storytelling beyond competition. This meant designing for inclusivity on a scale few projects face: supporting 13 languages (including complex scripts like Arabic, Chinese, Japanese and Cyrillic), high accessibility standards, and audiences with widely different contexts and expectations.

Research

Much of the research we conducted for this project cannot be disclosed in detail, but we were able to run focus groups, user interviews, surveys, and questionnaires to better understand the needs of different audiences.

The summarized outcome was clear: fans wanted a centralized hub with personalization features to follow their favorite sports, athletes, and events, while the IOC required a scalable design system that could ensure consistency across platforms and remain adaptable for future growth.

Goals & Design Strategy

To guide the design process, we defined a set of goals that addressed both user needs and the IOC’s (International Olympic Committee) long-term vision:

Unify all Olympic digital content in one platform

Personalize the experience so users could follow sports, athletes, and stories most relevant to them.

Design for inclusivity, ensuring accessibility and language support without compromising clarity. The new visual language was built around this principle, focusing on achieving strong contrasts in both color and typography.

Build for scalability, with a robust design system to serve mobile, web, and TV consistently.

Challenges

Challenges

Designing for such a global audience came with unique challenges. Our team had to test layouts in disruptive languages such as Arabic, which required a mirrored layout, or Asian scripts like Chinese and Japanese, which demanded careful spacing. Longer translations in European languages also pushed components beyond their initial scope.


We validated accessibility across the board, ensuring strong contrast, scalable typography, and flexible layouts that remained consistent regardless of script. Navigation patterns had to be robust enough to scale from mobile to TV without overwhelming users. These constraints made inclusivity not just a requirement, but a guiding principle in our design process.

Desktop test to ensure the layout could support a variety of languages.

Key Design Solutions

Key Design Solutions

To address the project’s goals and challenges, we developed a series of design solutions that balanced inclusivity, scalability, and user engagement.

Personalisation at Scale

Beyond following sports or athletes, users could receive personalized notifications and reminders, turning the app into a true “companion” to the Olympic and Paralympic Games.

Olympic Archive

We created a dedicated archive where users can access past results, athlete profiles, and videos from previous Games. This feature added historical depth to the app and gave fans a way to connect the Olympic legacy with current events.

Behind-the-Scenes Value:

The app didn’t stop at scores and schedules, it delivered original series, podcasts, and human stories that deepened fans’ emotional connection with athletes and the Games.

Showcase video of the Asset Detail Page features

Showcase video of the Asset Detail Page features

Showcase video of the Asset Detail Page features

Live Coverage & Notifications

Real-time results, schedules, and live qualifiers directly from the app, ensuring fans never missed a moment.

Olympia: A New Design System

I contributed to the design of the new visual style for the Olympics, and was later assigned to build the design system Olympia entirely from scratch, light/dark mode included.

In parallel, I created thorough documentation in Zeroheight to ensure developers and designers could easily use and scale it in the future. This new system is set to be applied across all Olympic digital channels, guaranteeing a consistent and unified experience.

Card System Adaptations

By designing a wide range of card variations (different types of content and different card sizes), we ensured the flexibility to cover the needs of every platform: mobile, web, and TV, while also creating a system that could highlight key content.


This approach allowed cards to serve both as adaptable building blocks and as a way to establish clear sections for featured stories.

Accessibility First

Accessibility was a fundamental requirement from the start. We worked with high-contrast design, scalable typography, and inclusive interaction patterns to ensure the app remained usable and consistent for audiences with very diverse needs.

Cross-platform Consistency

Since the project extended beyond mobile to also include web and TV experiences, consistency across platforms was essential. We ensured mobile design principles could scale seamlessly to web and TV apps, creating a unified experience regardless of device.

Impact

The launch of the new Olympics app created a lasting impact across platforms and audiences, achieving the following key outcomes:

The app launched as the official Olympic digital hub, successfully replacing Olympic Channel and consolidating the audience in one destination.

Delivered a scalable design system (Olympia) used across mobile, web, and TV.

Enabled personalized user journeys through tailored feeds, notifications, and reminders.

Strengthened the IOC’s digital identity with a modern, inclusive design language.

Expanded the scope of Olympic coverage by blending results with exclusive storytelling and behind-the-scenes content.

35+

Languages including complex scripts and RTL layouts, adopted globally without loss of usability.

Languages including complex scripts and RTL layouts, adopted globally without loss of usability.

16M

Downloads across platforms worldwide, making it one of the most widely used sports apps.

Downloads across platforms worldwide, making it one of the most widely used sports apps.

40%

less repetitive manual work through bulk editing

I worked closely with the Product Manager and the IOC team on this project, collaborating within a small team of three designers supporting each other when needed throughout the process.

I worked closely with the Product Manager and the IOC team on this project, collaborating within a small team of three designers supporting each other when needed throughout the process.

Reflection

Reflection

Working on this project was both challenging and rewarding. Designing for such a broad and diverse audience required constant iteration and attention to detail, especially when adapting layouts to languages that stretched the system to its limits.

For me, it was also a chance to take full ownership of the design system while collaborating closely with PMs, developers, and the IOC team. That collaboration was key to shaping a product that felt consistent, accessible, and truly global.

Working on this project was both challenging and rewarding. Designing for such a broad and diverse audience required constant iteration and attention to detail, especially when adapting layouts to languages that stretched the system to its limits.

For me, it was also a chance to take full ownership of the design system while collaborating closely with PMs, developers, and the IOC team. That collaboration was key to shaping a product that felt consistent, accessible, and truly global.

Design System
Product Design
Visual Design
Cross-platform
Quality Assurance

Agency

The Cocktail

Role
Product Designer

Duration
8 Months

The International Olympic Committee wanted to consolidate its digital presence into a single, definitive channel for all Olympic content. Until then, Olympic Channel had been responsible for distribution, but the ambition was to bring everything under one official platform with a stronger digital identity, wider content offering, and a modern, accessible visual language.

The project spanned mobile, web, and even TV apps, but here I’ll focus on the mobile app, where I was responsible for designing features, building the design system, and ensuring a consistent, accessible experience.

Desktop test to ensure the layout could support a variety of languages.

Live Coverage & Notifications

Real-time results, schedules, and live qualifiers directly from the app, ensuring fans never missed a moment.

Card System Adaptations

By designing a wide range of card variations (different types of content and different card sizes), we ensured the flexibility to cover the needs of every platform: mobile, web, and TV, while also creating a system that could highlight key content.


This approach allowed cards to serve both as adaptable building blocks and as a way to establish clear sections for featured stories.

Cross-platform Consistency

Since the project extended beyond mobile to also include web and TV experiences, consistency across platforms was essential. We ensured mobile design principles could scale seamlessly to web and TV apps, creating a unified experience regardless of device.