Project Overview

The Racing section redesign was my first major project at TAB, a 6-month initiative that required revamping every Racing page in the app and migrating it into the Flutter framework. The challenge was twofold: the existing experience was outdated and clunky, and the visual design lagged behind competitors’ apps, frustrating users and reducing engagement.

Our objectives were to:

• Migrate to Flutter for improved performance and scalability.

• Retain familiarity for loyal users while introducing a modernised look and feel.

• Address pain points like slow load times, navigation complexity, and visual design inconsistencies.

This project coincided with the design team’s transition from Sketch to Figma, enabling better collaboration, prototyping, and testing. A new design system was also established from the ground up, ensuring consistency as other teams worked on parallel redesigns of Home, Sports, Play Central, and Accounts sections. I contributed components to the design system, helping maintain consistency and alignment across the project.

My Role

As the Product Designer, I led the end-to-end design process for Racing, starting with a kickoff workshop in Miro. Here’s how I contributed:

• Competitor Analysis: Conducted a review of market leaders to identify opportunities for improvement.

• Existing Page Audit: Analysed every Racing page to assess what was working and what wasn’t.

• Stakeholder Interviews: Alongside the Product Owner, I interviewed internal stakeholders to understand the current Racing section, gather ideas, and pinpoint challenges.

• User Research: Worked with the User Researcher to synthesise insights from external users and internal discussions, shaping the redesign direction.

• Wireframes and Prototypes: Created iterative designs to enhance navigation and visual clarity, ensuring feasibility within Flutter’s framework.

• Collaboration: Partnered with the senior product designer and other teams to align components within the new design system, and contributed new components to the system to ensure consistency across the app.

Research & Insights

Collaborating with the User Researcher, we uncovered that racing fans valued speed, familiarity, and simplicity above all.

Key Insight: Did you know that over 80% of bets are placed within 90 seconds before a race starts? This reinforced the need for a fast, intuitive experience that eliminated friction.

These insights guided our focus:

• Simplify navigation to reduce friction.

• Modernise visuals to make the Racing section competitive with market leaders.

Design Process

Kickoff & Competitor Analysis

• Conducted a Miro workshop to review competitor apps and map out opportunities.

• Audited existing Racing pages to identify pain points and areas for improvement.

Prototyping & Collaboration

• Designed wireframes and prototypes, iterating to align with Flutter’s framework.

• Focused on creating smoother navigation and refining the visual hierarchy.

Testing & Iteration

• Conducted usability tests with internal and external users to validate designs.

• Refined navigation flows and enhanced visual clarity based on feedback.

The Outcome

• Achieved a 20% increase in Racing section visits within the first week of launch.

• Users highlighted the faster performance, smoother navigation, and modern visuals as standout improvements.

• Established a new design system, ensuring consistency across app sections and enabling better collaboration between teams.

Reflection

The Racing section redesign was a defining moment in my career at TAB. Leading such a large-scale initiative taught me how to balance user needs, business goals, and technical constraints while collaborating across teams.

Key Learnings:

• The value of kickoff workshops and stakeholder alignment to establish a clear vision from the start.

• How transitioning from Sketch to Figma enabled better collaboration and rapid iteration, allowing us to work more efficiently.

• The importance of a design system to maintain consistency across a multi-team app redesign.

• The iterative process of usability testing and user feedback taught me how to refine designs quickly, prioritising the most impactful changes based on real user insights.

This experience strengthened my ability to lead the design process and tackle complex, high-impact challenges. Working alongside senior product designers provided invaluable mentorship, helping me blend design innovation with user needs in a fast-paced, results-driven environment.

Ultimately, this project has been fundamental in shaping my approach to design leadership, cross-team communication, and iterative design processes in future projects.