This Case Study
Whilst I have spent significant time improving the core Racenet platform, the F1 Leagues feature aspires to engage a new audience of players into using Racenet whilst addressing a key oibjective for the F1 Game, building social connections. The solution to F1 Leagues will be used as a framework for WRC Clubs, due to this I have developed relationships with both the F1 and WRC teams to address the game and users' needs.
When I started on this project there was an existing framework for leagues designed and implemented, due to the significance of this feature, my time was required to identify issues and create solutions. This study will showcase the process from evaluating the existing feature and identifying pain points to researching and designing solutions.
Goals
Identify and research areas to improve F1 Leagues.
This feature launch intends to engage a significant new audience (100k+ new users) therefore it's important we have pre-empted user needs and ensured we are supporting them.
Design and prioritise solutions.
From the problem areas which I identified, I developed solutions which aim to improve the experience. I prioritised these improvements and worked closely with production to add to the roadmap.
Maintain, develop and improve game team partnerships.
I collaborated with various EA groups including, the F1 team, WRC team, Legal, EA shared resources, UXR (User Experience Research), QV (Quality Validation) and Marketing.
Responsibilities
UX Strategy
UX Research
User Journeys
Information Architecture
Interaction Design
Wireframe Design
Prototyping
Feature Design
Documentation
F1 Leagues
F1 Leagues is a feature designed in collaboration with the F1 team. It enables players to create and join leagues with other F1 players. A league owner requires significant management options, including creating and editing seasons, assigning member roles, moving players between tiers, applying penalties, connecting social platforms and inviting members. As this feature is difficult to directly compare to any others, multiple different areas have served as inspiration.
Research
To form a starting point for improving Leagues I spent time evaluating the existing feature, met with the designer from the F1 team, and spoke with our team to understand concerns and limitations. My research included benchmarking existing products, creating user journey maps of different key actions, and discussing with content creators during the F1 Creative Council.
After some time, I was able to convince my team it was worth putting Leagues through usability testing. I worked with the EA UXR (User Experience Research) team to determine key journeys and watched and evaluated them to put together a research summary. This supported my existing concerns and highlighted additional areas to improve.
Key Takeaways:
League Racing is not currently accessible to new players, lack of onboarding, complicated flows and confusing interactions will cause players to drop off.
Creating a league from discovery to the first in-game race is a complicated flow which is not explained to league owners effectively, management processes are complex.
The game hub design is not effectively supporting league positioning, with navigation blocking key visual areas. This is especially problematic on Mobile.
User Journey Map
From my experience navigating Leagues and watching users explore the process, I identified areas which needed improvement. This supported my prioritisation of the improvements.
Key Areas for Improvement
Core Game Navigation
Leagues Discovery Page
League Page
Create a League Flow
Create a Season Flow
Tiering
Admin Area
Create a Season
To keep this case study short, I will take you through one significant problem space. This complicated flow allows the player to create a season of events, for the league to partake in.
To keep this case study short, I will take you through one significant problem space. This complicated flow allows the player to create a season of events, for the league to partake in.
There are two key steps to creating a season, adding up to 20 events and setting tier placement. Both these steps have multiple steps and currently multiple issues:
- Drop-down interactions are used for every multiple-choice task, with lists over 20 items long.
- Event names and times are shown in tiles, which makes it challenging to get a clear overview of the upcoming schedule.
- Tiering is tackled before setting up events, whereas these events are the user's priority in this space.
- Key options are hidden behind an 'advanced options' button, which prevents users from finding these features.
- Space is lost with the banner image at the top of the screen, this wastes key screen space.
The mobile flow of creating a League and season before UX intervention.
The web pages from create a season before UX intervention.
Solutions
Improved navigation: Enabling Leagues to have more available screen space.
On mobile, navigation is replaced by clickable buttons.
On desktop, tabs are relocated to the top left of the screen with the between game dropdown removed.
This allows more screen space to be used for League-based content at the next step.
F1 new hub design - in-hub navigation improvements prioritised.
F1 new mobile hub design - in-hub navigation improvements prioritised.
Simplified League Page: Ensuring the 'Create Season' button is easy to find.
On mobile, Create Season button is stacked below the Admin Area.
On desktop, Create Season button is next to the Admin Area.
As Creating a Season is an essential step to having a league, this prevents it from being buried in the Admin Area, which is a confusing space too big to be solved at this stage. I also suggested a new layout to better accommodate each player's ability to customise their page.
League page improvements desktop.
League page improvements mobile.
Create a Season flow
Flow is broken down to one decision per screen, reducing cognitive load and allowing players to swiftly plan events.
Creating events comes before tier placement.
All choices are summarised for the player at the last step.
Step 1 - Create a Season flow
Step 2 - Create a Season flow
Testing
I encouraged the team to put this flow through usability testing following the updates. Results proved the flow to be straightforward with testers finding little to no trouble navigating this flow.
Next Steps
I have continued to create solutions for the additional pain points identified. Keeping a close eye on user feedback and sentiment since the Racenet Launch, I am working to continue to iterate and improve.