CBS Sports Fantasy
Redesigning the new league creation experience for the popular fantasy sports product.
CBS Sports has the most awarded Fantasy Sports product and it offers users a variety of league packages including free leagues, paid leagues and prize leagues across all major American sports.
Players can manage, track, and get advice for their fantasy teams all in one place.
CBS Sports Fantasy was looking to update it's design to maintain its authority in the Fantasy Sports arena amongst popular competitors like ESPN and Yahoo Sports.
The first step of the redesigned League Setup Guide experience on mobile—pick your sport
Purpose
As part of the larger effort to redesign the Fantasy Sports product from the ground up, this portfolio piece specifically highlights the new league creation redesign.
Fixing a Leak of Users Dropping Off During Onboarding
Working on the product design team, I helped redesign all of the major components that made up this data-centric, robust, web and mobile apps.
Redesigned features include:
- League Home Page: Quick snapshots and access to player news, transactions, league standings, and the feed
- Draft Room: An experience that allows all team managers to draft their players in real-time
- Gametracker: Get play-by-play updates on players from your roster as they compete against your opponents
- Team Manager: Compare player stats side-by-side to draft an all-star roster
- Real-time Chat: Communicate with other team managers using the built-in league chat
...to name a few.
The team was also tasked with creating a more engaging and intuitive experience for creating new leagues, with the goal to decrease drop-offs, and reach our goal of growing active leagues on the platform.
To get this done, I collaborated with business intelligence to gather data, with product owners to set and meet requirements, with design to gather feedback and make iterations, and with engineering to understand technical requirements and offer design guidance during implementation.
- Research & Discovery
- UX / UI Design
- Design Standards Mentorship
- Cross-platform Design
- Cross-team Collaboration
Process
A lot goes into setting up and managing a season-long fantasy sports league, so it was important that we considered every (re)design decision to create the most elegant onboarding experience possible for new league managers.
Phase 1: Figuring out Why CBS Sports was Experiencing Drop-offs During New League Creation
Two things stood out to us as we considered redesigning the new league creation process:
- Data and user feedback indicated that our competitors had a less cumbersome onboarding experience (we were losing users to our competition)
- Drop-offs during setup indicated that the league creation process was too long. It required a deep commitment to getting the league set up—in its entirety—before being able to proceed to the league home page (where the fun began)
Before the REdesign
Let's consider the new league creation process prior to the redesign:
The league manager sets up the high-level settings of the league, customizes each detail of the league, and reviews changes before entering their league for the first time
For the most customizable fantasy sports product in the industry, this is how this experience translated into UI—and this is only a part of it...
The league manager names their league, customizes each setting, and reviews all changes before being able to enter their league for the first time
And, that's not all...
Once inside their leagues, the manager was tasked with inviting their friends to join their league, setting a draft date, and paying for their league.
The existing onboarding process was overwhelming, quickly led to fatigue, and required a massive commitment to complete—all before even allowing players to enter into their league home page to see the value that CBS Sports provides to their Fantasy players.
Phase 2: Let's Update the Userflows to Reduce Cognitive Load
One of the suggestions we made after reviewing the current onboarding process was to break up the league creation into multiple steps—ie. collect initial inputs to get the league started, then deferring setup until after the league managers enters the league home page.
The team also had the foresight to look into the most commonly used settings for leagues and pre-set these settings for the league managers, so they didn't have to customize each little setting. This drastically decreased the setup time and left players with only the most important settings, such as inviting their friends, setting the draft date, and paying for their league.
Redesigned Userflow
Note just how much faster league managers were able to step into their leagues and become immersed into the CBS Sports Fantasy Sports platform...
Pre-setting each league with the most commonly used settings allows league managers to get straight to the fun stuff
Phase 3: UI Design (Mobile & Desktop)
To create the league, the manager names his league and selects a few options—the platform handles the rest.
Redesigned UI Walkthrough
This is what the redesigned experience looked like...
With a few selections and no more than a minute's time, access is granted to the league for next steps
Only once inside their league—to create a sense of immersion and ownership—the design introduces a simple 4-step process to finish setting up the league:
- Invite Your Friends: Sending a quick link through a text message or email, the league manager can quickly invite their friends and track their setup progress
- Schedule Draft: Set the time for the team owners to get together and draft their players using the Draft Room experience
- Review Scoring Settings: Make changes to the type of scoring system that will be used to track points in the season, if desired
- Pay for Your League: Once the league is ready to go, just pay to activate the league and you're good to go
Step 1 of the Redesigned League Creation Process
Choose Your Fantasy Sport
Marketing page for the CBS Sports' Fantasy Baseball product on desktop and mobile
Step 2 of the Redesigned League Creation Process
Name Your League and Select Basic Settings
User experience on desktop and mobile for the initial steps for setting up your league
Step 3 of the Redesigned League Creation Process
Welcome to Your League! We've Done All the Heavy Lifting for You
And just like that, you're in your league! The league settings have been pre-configured based on most commonly used settings. Mobile & desktop
Step 4 of the Redesigned League Creation Process
You'Re All Set. Invite Your Friends, Pay for Your League, and Have Fun!
Right away, league managers get to experience the value provided by the CBS Sports Fantasy product. Mobile & desktop
Outcome
Our CBS Sports Fantasy redesign in whole increased user retention by 10%, revenue per visit by 11%, and the amount of active leagues over a year.
Before this redesign, it was up to league managers to set all of these settings up before being able to access their league to see the massive value CBS Sports delivered to their Fantasy players.
It was an outdated, fatiguing experience which led to drop-off from users who preferred a simpler approach from our competitors.
Once the league creation process was transformed to a much simpler, more digestible experience, we were no longer losing users, and reaching our desired goal of increasing the amount of active leagues on the platform.
The redesigned League Setup Guide on mobile & desktop. Photo taken at the CBS Sports Studio in Ft. Lauderdale, FL
"Vitaliy is always looking to improve the way we do things. His work on the CBS Sports Fantasy redesign was incredibly important to our corporate portfolio in many ways."
"Vitaliy brings a high level of intelligence to the table. If I had to create a SEAL team 6 of 'THE BEST', he'd be tapped as part of that team."
"Vitaliy is a problem solver and has a keen eye for design. He led design on one of the more demanding projects in the building without missing a beat."
