UX/UI Presentation SuperCoach App
Brock McConnell - Academy Xi - Presentation
Introduction
Product Overview
1
What is the product about? Each user selects a fantasy football side of 22 players (plus 8 bench players) to compete against other teams weekly. After each game in the round, each player earns a score which is contributed to your overall teams score for that week.
Also included in the product are weekly articles, which are posted by journalists from Herald Sun. Some of these are free to view, but most are hidden behind the subscription model.
2
What is the purpose product? Their purpose is to deliver a fantasy football game experience which coincides with the AFL Premiership Season each year.
This experience is delivered through an online browser platform, aswell as an iOS/Android app. The game is free to play, but they also offer a subscription model, ‘Supercoach Plus’.
Costing $24.95 annually, it helps by having a team picker before you can register, tells you who’s playing each week, optimiser to predict the best possible line up, breakevens, projected scores and players price increases, prediction if players will perform well or poor for the week, access to Supercoach Plus articles and double prizes for the weekly cash winners.
3
Who is the their audience/target market? The audience is predominantly male, in the 18-39 age bracket. The audience are AFL fans who are interested in the game, beyond their team they support. In terms of gender, there are female Supercoach players within the Supercoach community, just not as many.
Academy Xi - Presentation
Introduction
Key Questions
The brief from the client was to look at the AFL Supercoach app holistically, to listen to users of the product and find out what could be
What problem/s are we trying to solve?
improved. At the start of this journey, there was no set goal to be achieved. The feedback from our users would set the challenge.
How do we know this is a real problem?
Why is it important to solve?
Who are our users? What are their goals and aspirations?
Client/Product Owner
Herald Sun
UX/UI Designer
Brock McConnell
Timeline
12 weeks
Academy Xi - Presentation
Discover
Academy Xi - Presentation
Discover
Problem Statement
AFL fans, who participate in fantasy sports, feel frustrated and confused about the Supercoach app and want to understand how to improve/build their team but are confused on how to achieve this within the app.
Academy Xi - Presentation
Discover
Competitor Analysis
AFL Fantasy
ESPN Fantasy Sports
EPL Fantasy
The AFL Fantasy app is the main
The ESPN Fantasy sports app is
The EPL Premier League Fantasy
competitor to the AFL Supercoach
similar to the SuperCoach app, as it
sports app is cleanly designed using a
complete Competitor Analysis to look at the
App. For footy fans, this fantasy game
handles mutliple sports within the
much brighter palette, and utlising
current landscape of similar products in the
is the direct competitor to AFL
same app. This app showcases sports
more sub menus to house specific
SuperCoach. Key points taken away
from across the world, including
pages. Along with the AFL Fantasy
American Football, NBA, and soccer.
app, this app very easy to navigate,
The app uses a minimal colour
With this in mind, key points taken
very clear.
palette within the experience so
away
The first task in the research plan was to
market.
The app utlitises colours very well
items that need to breath and stand
Key takeaways
All three competitor apps were consistent with their navigation structure, and when they did provide fantasy services across multiple sports, they had a clear selector to choose which sport you would like to be viewing. For the
U
I, AFL Fantasy and ESPN use a minimal palette,
whilst the EPL app is far more vivid in it’s colour use.
Academy Xi - Presentation
out, do just that
The app has a menu selector at the
in highlighting specific states a user
The app has a consistent menu,
top of the app at all times,
would be familiar with
making navigation through the app
allowing the user to switch
The comparison tool for players, I
quite easy
between sports.
think is a key feature. As it is a
Consistent ‘back’ and ‘home’
The app uses submenus to help
fantasy sports app and you choose
buttons to help the user get back to
organise content efficiently
your players, this is very important
where they were.
The app uses clear icons to
The app is very stats driven, and the
differentiate each sport
way they are presented are very
Clear filter system to search within
clear. Whitespace is used to its full
players and stats.
potential Clear filter system to search within players and stats Most of the content is ordered in a list fashion, which is easily accessible to users.
Discover
Survey & Interview The second task was to conduct a survey with current users of the product.
Utilising Twitter, I reached out to the SuperCoach community to gain insights. 47 users responded to the survey, as well as one interview conducted via zoom.
Academy Xi - Presentation
Discover
Research Key Findings
47% of respondants prefer the browser version of the product, instead of the app.
5.6/10 was the averaging rating of the app given by the respondants of the survey.
Trading players was the task that was the most challenging to users.
Academy Xi - Presentation
Define Academy Xi - Presentation
Define
Affinity Map
After conducting the research, the data was analysed and sorted through an affinity map. Using an open sorting process, feedback was sorted in intial clusters to form themes. Additionally within these themes, smaller clusters appeared, narrowing down specific pain points users had with the products current experience.
Key takeaways
Overall it felt like users were only using the app as a last resort before the round starts. It was there second preference. Simple tasks are difficult to perform, and whilst there is alot of information and stats, users ‘just have to find it’ was a common thread.
Academy Xi - Presentation
Define
User Persona
Bio
Behaviours
Sam is working professional who is passionate about AFL and follows the Richmond Football club. He has full time job, which takes up most of his time, so the apps he uses, must be beneficial. He is an experienced player of the SuperCoach game as he has been playing for over 7 years.
Sam is often spending alot of his spare time refining his team during each week of the season. He is subscribed to the subscription model provided, but is often referring to other websites and apps to get his information. He is wondering whether its worth the price. His preference is to use the Desktop version of the product, as tasks are easier to complete on that platform. But when he can’t get to a computer, he uses the app to perform ‘finishing touches’ to his team.
Goals/Needs Sam’s goals include:
Name Sam
Occupation Working Professional
Age 32
Academy Xi - Presentation
An easier trading and navigation structure within the ap Doing relevant research in the offseason and during the season to help improve his team Sam would like an app that is more efficient and doesn’t take up too much of his time performing tasks that are simple on the other platforms To have the best SuperCoach team and win the $50,000 prizemoney
Motivations/Gains Sam is usually involved in a league with his friends. There are bragging rights on the line, so to have the best fantasy team at the end of the season is a real motivator for him. Sam wants to gain further knowledge about specific players so he knows which ones are best to improve his team. He wants the ability to compare players and view their stats easily. It’s important that Sam has an app that can keep up with him.
Frustrations Sam is finding core tasks a struggle to complete on the current app like trading and player research, and often reverts back to other platforms to complete these tasks. Due to his lifestyle mostly being ‘on the go’, this is frustrating as he would like the app to be more user friendly on the smaller screen.
He also feels that he could be getting more out of his fantasy team, but the way news, stats and his team are displayed is limiting his progress. To be able to see his whole team whilst using the app seems a no-brainer to him.
Customer Journey Map
Academy Xi - Presentation
Define
Design Principles
Keep it efficient
Tasks should be completed with confidence.
Simplify the structure
Prioritise elements so they are always accessible.
Make it predictable
Alleviate confusion when it comes to information.
Academy Xi - Presentation
Define
How Might We.... How might we improve the trading system for SuperCoach users so that they can perform trades on the app, rather than resort to the desktop platform?
How might we simplify the layout for SuperCoach users so that they can easily scan the information when it’s presented?
Academy Xi - Presentation
Develop Academy Xi - Presentation
Develop
Crazy 8s Now that we have moved into the second half of the double diamond, it was time to turn all of the research and data into ideas to see how the experience could be improved. First task was with Crazy 8s.
This allowed me to identify 8 ideas, quickly, to help solve the ‘How Might We’ questions.
Key takeaways
From the Crazy 8s, there were three ideas that I was drawn to, to further develop:
Simplified Dashboard, Players your trading always visible, Full Field view.
Academy Xi - Presentation
Develop
MVP After developing ideas, it was time to workout which ideas would be our MVP. The best way to decide this was through a MVP Matrix.
This was conducted to better decide what should be the main MVP for the product, but also any quick wins that could be had along the way.
Academy Xi - Presentation
MVP Fixing the trading experience New Feature??
Quick Wins Redesigned Dashboard
Full Field view of your team
General UI Update
Develop
User Flow
For the user flow, the trading experience was the main focus. How can we make this more efficient and easier to use for the user?
By adding the MVP solution within the flow, we could potentially cut the time it takes to trade a player significantly, but also help newer players to the game by adding this assistive feature.
Smart Trader
Using the apps data in the backend, let’s develop a feature where the app will suggest trades for you, based on underperforming players you have or injured players.
This feature has the potential to save the user a considerable amount of time when completing this task, as seen in the user flow to the right.
Academy Xi - Presentation
Develop
Wireframes The next task was to develop low fidelity wireframes, bringing the user flow to life.
Firstly, I started with pen and paper to quickly note down my ideas, then moved to figma.
Dashboard
Key stats (Player Quick View)
Dashboard
(Smart Trade Suggestion)
My Team (Full View)
My Team (Player Quick View)
Smart Trade Suggestor
Trading flow
For the main trading player flow, when you get to the stage of selecting a new player, this was where users were finding it difficult to trade multiple players or see their team and potential new players at the same time. Instead of having the user cycle through 3 seperate screens to complete this task, the idea is to have a pull up tab to view the player they are trading and their team as a whole in the same experience. Academy Xi - Presentation
Trading - Select a new player
View your Trades
View your Trades - Make an additional trade
Review Trade
Trade Complete
Deliver
Academy Xi - Presentation
Deliver
Prototype & User Testing For the prototype, I choose to use figma to create it as close as I could to the current product.
The prototype allows the user to explore the dashboard, the My Team area, and also the tasks of making a trade, and testing out the new Smart Trader flow.
User Testing Tasks
User testing tasks included the following Explore the Dashboard screen (Featured stats, Round Recap Complete a trade using the Smart Trader section on the Dashboar Navigate to ‘My Team’ and select I.Heeney to trade out for B.Dale, utilising the trading players flow.
Academy Xi - Presentation
View Prototype here
Deliver
Outcomes From the user testing, overall the prototype and UX solutions were well recieved. The updated design of the UI was positive, aswell as the trading screen functionality.
Feedback about the dashboard was varied. Some users found the tab menu at the top intuitive, while others felt the news articles should be kept on the main dashboard screen.
MVP
Quick wins
KFC Smart Trader
Full Field view
Ability to see your players your trading
Updated UI
My MVP feature, The Smart Trader, was a positive in the user testing. The two avid SC users found that this feature would dramatically saved them time, as long as the AI behind the feature only suggested relative players. Users did wonder however whether it should be more prominent on the dashboard, and also whether it should be included when your on the My Team screen. Another pain point for users was not having the ability of seeing your team and the players you were trading without having to go back and forth in the flow. This was a sticking point as alot of users in my research got a bit lost.
My solution is was to design a pull up tab at the bottom of the trading players screen, for users to bring up when they wanted to see the current trade they were makng, but also see if there were any other team moves they wanted to make at the same time.
Out of the research, not being able to see your team in full was a real pain point for users. I was able to redesign this so all players on field were visible. And with the utilisation of sideway scroll, the user could easily scroll left to right on each positional line to view the bench players for that position.
For the UI, this was redesigned to have a more contemporary feel. Changing the font to a thicker font helped with readability, whilst updating the colour palette used for key items, allowed the interface to pass AA Accessibility. Most notably the green colour for positive pricing was updated, whilst font sizes for player labels was enlarged slightly for greater legibility.
Featured stats
Out of the research, not all the information about your players was said to be easily accessible. So one of the additions on the dashboard is to a featured stats section. This outlines which of your players are performing or not performing, and can help back up the Smart Trader suggestion, or just generally help you decide if you want to tinker with your team. Academy Xi - Presentation
Thank you
Brock McConnell - Academy Xi - Presentation