PROJECT OVERVIEW
Client
GamingFrog lets players bet against each other in head-to-head esports competition, with a current focus on the football game FIFA. GamingFrog is dissatisfied with the churn rate of their app, and wants to redesign their experience to get people playing quickly, and keep playing. I was tasked with examining the onboarding portion of the app, specifically.
Tools
Figma
Miro
Otter.ai
Useberry
Duration
2 weeks
Problems
Our players are cautious because they will be gambling their money using our product.
Players are frustrated by over-long sign up processes.
A lack of interest, caused by long waits, or even the perception of long waits, is turning users away from our app.
Solution
The final prototype’s main features are storyboarded animations designed to excite users, and a minimal number of screens, meant to speed users to the part of the app they are meant to enjoy, and that generates value for GamingFrog.
Research
Secondary Research & Competitive Feature Analysis
GamingFrog is similarly featured in comparison to other betting apps, but currently supports only one game, where their two main competitors are generalists.
Market Positioning Chart
I believe that if GamingFrog improves the appeal and user base of their app, they could create the definitive meeting place for players of FIFA, and that narrow focus could become an advantage, allowing them to make the best experience for those specific players.
User Survey
GamingFrog assisted me, distributing a survey to its users via newsletter, so that I could learn what users currently feel about the app, and FIFA. For example, this survey made me realize that any player who would bet money on FIFA is likely to be a hardcore (frequent) player.
User Interviews
I interviewed players and staff to pick their brains as to what needs to be addressed in regards to the app’s onboarding process. I got the feeling that the churn rate was annoying the most loyal players. It seems that they prefer GamingFrog’s customer service to other apps, but are having trouble quickly finding matches.
User Journey Map
This user journey map presents the scenario of how a user would move through onboarding. This details both what they need to do, and how they feel while they do it. This helped me identify potential areas of improvement.
Design
Ideation
The problems identified both by my research and the brief are relevant to the whole app. I limited the focus of my brainstorming to solutions that could be implemented in the onboarding phase, the portion of the app that I was tasked with improving.
Feature Prioritization
I arranged my brainstormed ideas into this matrix, a MoSCoW method chart, which splits up the ideas into “must-haves”, “should-haves”, “could-haves”, and “won’t-haves”, based on their feasibility and potential value.
Minimum Viable Product
Having winnowed down the ideas to just the ones I’m most confident in, I can start to describe the product:
In a limited amount of screens, users will be quickly acquainted with the functions of the app, and signed up (with options to sign up via, Facebook, Twitter, etc). After being excited by the animation, copy, and user testimony, players will be dropped into the matchmaking portion of the app, ready to have their first game.
Job To Be Done
When making a bet, a player wants to have trust in the app, so that they can can expect quick games and payouts, which makes them feel excited.
User Flow
Before prototyping, I created a flow describing what I want and expect users to do. This way, I know what screens I intend to prototype and what kind. For example, I let the first introductory screen be both expansive, or, optionally, brief by using slides.
User Interface
Lo-Fi Prototype
I started working on paper, drawing out the screens and buttons. Most of the testing for this and the subsequent prototype was brief. I know the appeal and value of the design would have to lie in the visual and copy, but it was important to confirm that potential users knew how to interact with the design.
Mid-Fi Prototype
For the next prototype, I brought it into digital and conducted tests over the web. These tests exposed that I had not included a way to navigate backwards from the signup and log in screens, which was corrected in the next version.
Brand Attributes
Between my own research, and a conversation with a GamingFrog co-founder, I chose the following attributes as my goal for how my design ought to feel:
-Exciting
-Animated
-Informal
-Trustworthy
GamingFrog Design System
In addition to brand attributes, the other guide for my visual design process was the existing GamingFrog design documentation. I used these pattern libraries to execute the design that was consistent with their brand.
Hi-Fi Prototype
The final prototype’s main features are storyboarded animations designed to excite users, and a minimal number of screens, meant to speed users to the part of the app they are meant to enjoy, and that generates value for GamingFrog.
Success Metrics
Increase Daily Active Users
Decrease Churn
Decrease time on Task
Increase the amount of bets/matches
Next Steps
Finish Animations
A/B Testing Animations, copywriting
Desirability testing for adherence to brand attributes