F1 Fan Engagement App – Mobile UI/UX Design
Introduction / Overview Section
This case study showcases the design of a Formula 1 fan engagement mobile app, focused on live race data, driver tracking, and team performance. The goal was to create a clean, data-driven experience for passionate fans using a human-centered design approach.
Problem
F1 fans often juggle multiple sources to follow live race data, driver updates, and team performance. This app was designed to bring everything into one personalized, accessible mobile experience.
Aims/Objectives
•To design and evaluate a mobile app that enhances the Formula 1 fan experience through interactive, data-driven features and human-centered design.
Objectives:
1.Understand the needs and preferences of both new and experienced F1 fans.
2.Identify essential app features like live race data, latest news, F1 drivers' historical stats,
3.Build a high-fidelity prototype using Figma, focusing on usability and intuitive navigation.
4.Evaluate the app's usability through expert reviews and user testing.
User Research
Figure 1: Interest in Accessing Live Race Data
•Purpose: Understand how interested users are in using live race data in an F1 app.
•Key Insight:
•Around 62.5% of respondents (25 out of 40) rated their interest as high (4 or 5 out of 5).
•Even new fans rated this highly, indicating that live race data is a core expectation across fan types.
•Confirms that live timing, telemetry, and strategy data should be a priority feature in the app.
Figure 2: Current App Usage & Satisfaction
•Left Chart:
•Shows that 65% of surveyed fans currently use an F1-related app (mainly the official F1 app).
•Right Chart:
•User satisfaction is low to moderate.
•About 46% of users are dissatisfied (rated 1–2), while only 19% are satisfied (rated 4–5).
•The most common rating was 3 (neutral) — shows room for improvement in UX and features.
•No one rated it 5 (very satisfied), meaning there’s a gap in meeting fan expectations.
Wireframes & Low-Fidelity Screens
Low-Fidelity Wireframes Overview
Image 1 Breakdown:
Splash & Pitch Screens
Very simple introductory screens with branding (F1 logo).
Navigation arrows suggest user can swipe or tap through.
Login Screen
Basic login form with fields for email and password.
A button clearly labeled “Login.”
Latest News Screen
Card-style list of news articles.
Possibly scrollable, each card has a title and a snippet.
Live Race Telemetry Screen
Includes graphical race data (lap times, positions).
Likely to show real-time updates and driver performance.
News Navigation Screen
Seems to offer quick navigation to different race-related sections (like Driver News, Race Summary, etc.).
Image 2 Breakdown:
Race Calendar/Upcoming Race
A visual calendar or list-style upcoming race view.
“Upcoming Race” section is highlighted.
Race Insights Screen
Likely to show post-race analysis, lap data, etc.
Two horizontal data blocks suggest stats comparisons.
User Profile Screen
Personalised greeting (e.g., “Welcome Alex”).
Option to edit favourites or user settings.
End Screen (Congratulations)
Displays a congratulatory message.
Contains a button to return to home or start again.
Final UI Designs (Main Section)
Reflection / What You Learned
Key Takeaways”
Example Text:
Designing for a data-heavy app requires balance between detail and clarity.
Understanding F1 fan behavior helped shape the features.
Figma’s auto layout and prototyping tools made it easy to simulate real interactions
Future Work
•Full development of the app using live F1 data feeds (e.g., timing APIs).
•Expanding features like social sharing, driver comparisons, and personalized notifications.
•Introduce gamification (prediction games, trivia).
•Improve accessibility (screen reader testing, localization for global audiences).
•Limitations:
