Raj Rao – March Madness

TEAM

CBS Sports – Mobile App

ROLE

Senior Product Designer

DELIVERABLE

High Fidelity iOS + Android Experience

SUMMARY

Redesigned the CBS Sports March Madness Bracket experience for its return in 2021.

Overview

In the midst of a full app rebrand, CBS Sports needed its March Madness experience, untouched since 2019, redesigned to match the rebrand’s visual style and to overhaul an outdated flow. For this project, I worked alongside a Product Manager and another Senior Product Designer.

For those unfamiliar with March Madness or Bracket games, this experience involves correctly predicting the outcomes of the NCAA Men’s College Basketball national tournament games.

In the midst of a full app rebrand, CBS Sports needed its March Madness experience, untouched since 2019, redesigned to match the rebrand’s visual style and to overhaul an outdated flow. For this project, I worked alongside a Product Manager and another Senior Product Designer.

For those unfamiliar with March Madness or Bracket games, this experience involves correctly predicting the outcomes of the NCAA Men’s College Basketball national tournament games.

Product Goals + User Goals

Considering this was a large visual and functional overhaul of the previous experience, the overall product goals were quite broad — to allow users to organize and play March Madness Bracket games without alienating our current and potential users in a Brackets experience.

Narrowing the product goals to more discrete user goals, we reached: successfully allow users to create brackets, fill out brackets (worked on by my teammate Sal Chávez), and check pools + standings.

Considering this was a large visual and functional overhaul of the previous experience, the overall product goals were quite broad — to allow users to organize and play March Madness Bracket games without alienating our current and potential users in a Brackets experience.

Narrowing the product goals to more discrete user goals, we reached: successfully allow users to create brackets, fill out brackets (worked on by my teammate Sal Chávez), and check pools + standings.

States + User Flows

Understanding the different states of Brackets — Pre-Selection Sunday, Post-Selection Sunday, and In-Tourney — was crucial in keeping the experience seamless for the user.

During Pre-Selection Sunday, users were only able to create new pools (of users to play against) and add users to their pools.

Once Post-Selection Sunday began, users had the ability to fill out their bracket and choose the winners of each game; users could still create pools and add members to them at this point.

The In-Tourney state began once the first game of the tournament was underway — at this point, brackets could no longer be edited and existed in a view-only state.

Working closely alongside the Product Manager, we used this deliverable to align the team on requirements and necessary designs for our experience.

Understanding the different states of Brackets — Pre-Selection Sunday, Post-Selection Sunday, and In-Tourney — was crucial in keeping the experience seamless for the user.

During Pre-Selection Sunday, users were only able to create new pools (of users to play against) and add users to their pools.

Once Post-Selection Sunday began, users had the ability to fill out their bracket and choose the winners of each game; users could still create pools and add members to them at this point.

The In-Tourney state began once the first game of the tournament was underway — at this point, brackets could no longer be edited and existed in a view-only state.

Working closely alongside the Product Manager, we used this deliverable to align the team on requirements and necessary designs for our experience.

Design System

Once the flows and required screens were agreed upon, I began thinking about the components necessary to build out the experience.

I utilized the existing CBS Sports design system, preferring iOS native UI and previously existing components when possible. In creating new components, I used the bold and functional feel of the CBS Sports brand as well as inspiration from existing components to keep the continuity of the system intact.

Once the flows and required screens were agreed upon, I began thinking about the components necessary to build out the experience.

I utilized the existing CBS Sports design system, preferring iOS native UI and previously existing components when possible. In creating new components, I used the bold and functional feel of the CBS Sports brand as well as inspiration from existing components to keep the continuity of the system intact.

Product Design

Lobby

The “home” for the Brackets experience is the Lobby — here the user can create a new pool, enter their bracket nationally, view an existing pool / view standings, and manage notifications. As mentioned earlier, depending on the stage of the tournament and the user’s progress, this screen will change accordingly.

Create Pool

One of the key user goals is to create a new private pool of users to compete against. The shortest version of the flow takes just one step to set up and begin sharing with friends. The flow shown uses custom rules and still takes only one extra step. Giving power users the freedom to set up finer points of the pool kept our passionate cohort of users in mind.

View Members / Standings

Viewing members in the Pool Home, before or after the tournament starts, is crucial for the user. In the pre-tournament states, they can view who’s registered for the pool already. Once the brackets have been set, users are free to fill their brackets. When the tournament officially starts, the Pool Home turns into a list of standings where users can view each other’s brackets and compare scores.

Retrospective + Next Steps

Based on data from our analytics team, our total user base for Bracket Games slightly decreased from its previous iteration. We also saw a vast majority of users successfully create pools and maintain engagement throughout the stages of the tournament. Considering this is the first time our product has been used since the last time the tournament was held in 2019, it was still a success for our team.

Direct feedback from users was overwhelmingly positive, with only some minor grievances. Users found the pool creation process to be painless but also offered the right amount of customization, if they wished. Most users found the lobby and pool home to function well, but some users found the visual design of the pages in their empty states a bit lacking, which I definitely agreed with.

The project’s tight timeline and reliance on the design system led to the current state of design but for the next iteration of the product, more design exploration can be done. Also because of the short timeline, I also did not have the opportunity to do user testing further than ad hoc testing with coworkers or friends.

Based on data from our analytics team, our total user base for Bracket Games slightly decreased from its previous iteration. We also saw a vast majority of users successfully create pools and maintain engagement throughout the stages of the tournament. Considering this is the first time our product has been used since the last time the tournament was held in 2019, it was still a success for our team.

Direct feedback from users was overwhelmingly positive, with only some minor grievances. Users found the pool creation process to be painless but also offered the right amount of customization, if they wished. Most users found the lobby and pool home to function well, but some users found the visual design of the pages in their empty states a bit lacking, which I definitely agreed with.

The project’s tight timeline and reliance on the design system led to the current state of design but for the next iteration of the product, more design exploration can be done. Also because of the short timeline, I also did not have the opportunity to do user testing further than ad hoc testing with coworkers or friends.