CASE STUDY
Fubo Sportsbook
MY ROLES
- UX/UI Design
- Design Management
- User Research
- Product Strategy
- Production
PROJECT INFO
FuboTV is a streaming TV service that markets itself to sports fans because of their strong lineup of sports channels and programming. In order to increase revenue and offset carrier costs, FuboTV imagined a companion sportsbook that TV users could organically discover and place wagers on while viewing the event on fuboTV. With a crowded sportsbook marketplace, the challenge was to develop and design features of the sportsbook to make it unique to FuboTV, and approachable for first time bettors.
Differentiating Fubo Sportsbook
The blueprint for success was creating a sportsbook that would be customized and special for fuboTV users. Through user research interviews and technical feasibility studies there were some key features users would value, and data points we could glean from a fuboTV user to customize the sportsbook including favorite teams, what they are currently watching, and geolocation, since wagering on local teams is a big chunk of sportsbook activity industry wide.
"If I switch from FanDuel it's because I've found a book that makes it much easier to find a game I might be interested in wagering on."
-Tim B. - fuboTV User Interview
Onboarding
Once a user installs the app, there were a few key objectives we wanted a first time experience to provide.
Promote the benefits of Fubo Sportsbook
With many sportsbooks in the market, we created a walkthrough explaining the sync with what you’re watching feature, customized bet matchups delivered to you based on your fuboTV viewing habits, and rewards you could earn for using both fuboTV and Fubo Sportsbook.
Make concept of one login for TV & Sportsbook obvious.
Since the main benefit for a fuboTV user on sportsbook is to sync with your favorite teams and watch history, making sure fuboTV users did not create a separate login is paramount.
Educate on state availability and identification of user location.
The sportsbook could only be used in select states where fubo was licensed to operate. Through the use of both geo identification, and backing that up with the user manually choosing their state, we created opportunities to ensure no users were signing up for a product they couldn’t use.
User Verification
A necessary step of onboarding is KYC (Know Your Customer) to ensure you are who you say who are. This is required by state gaming commisions in order to wager. Through competitive analysis and user testing, we broke down the process into small, non-intimidating steps, indicated with a stepper. Since the information entered is cross-referenced with government databases, accuracy is crucial. The birth date entry was an interesting component to design. Through market research and testing we split out the entry into three dropdowns to reduce input error while still being easy to enter. For birth year, we defaulted to an 18 year old's birth year, to reduce navigation within the year drop down.
For address entry, we purchased a license for Google Address Validation API which allowed type ahead address population. This eliminated potential errors with street names and zip code formatting.
One of the final pieces of personal info we requested was the last four digits of SSN, required by law. When asking for sensitive info we took time to briefly explain why this is being asked for, and reassuring the user this information was travelling over an encrypted connection.
Depositing
100% of users will have to make a deposit in order to to place wagers on the sportsbook. The design goals for this Interface was to instill trust, and the ability to make deposits with just a couple clicks.
In terms of Fubo business interests, the preferred deposit method was with a bank transfer through our provider, Trustly. It provided a better fee structure for Fubo, and more features to encourage future deposits, such as remembering a previously used account.
To reduce clicks, we defaulted to a default deposit amount, based off average past deposits and research on ideal deposit amount. When performing design QA, we spent extra time with engineering to build this as clean as possible. Transactional pages are not a place for a user to see any poor implementation or visual messiness.
Watch & Wager - The “Killer Feature”
Watch & Wager was our first “killer” feature to get users and investors excited about Fubo Sportsbook and the integration with fuboTV. Using the fuboTV user API I outlined previously, the app could detect games being watched on FuboTV, and display on a modal in the app with some quick wager options to bet on the event you’re viewing.
In order to keep this experience light touch and approachable, we presented a simple initial bet like who will win the game, with a link to dive into more options for that game. We extended this to other sports like golf, where we presented the top 3 players on the leaderboard to pick from, or a link to drill down further and select other players you think will win.
Working closely with the fuboTV design team, the artwork we used for each event was 1:1 with the program tiles on fuboTV, so there was a consistency and synergy between the two experiences.
Design Process & Technicals
Figma was used as our primary design tool. Since much of the app was comprised of bet market modules for a tremendous number of different sports and statefulness, I employed the team to utilize components and variants to develop these modules. Upon completion, a designer could drop a bet market module on a page and change the sport, teams, live or upcoming state with the Figma variant controls, which made producing pages very rapid.
We also set aside time to create a teams and leagues component file. This file contained all team logos and primary and secondary colors for each team so they were universal and consistent throughout the designs. This also saved the team time vs. going out to the web each time searching for team logos.
The team also developed a type ramp for both our web and native app products, with an emphasis on limiting the number of faces and sizes used.