Buzzer
The quest to reinvent live sports for Gen Z
Year
2023
Client
Buzzer
Role
Product Designer, User Researcher
Tasks
UX, UI, Strategy, Prototyping
Buzzer
The quest to reinvent live sports for Gen Z
Year
2023
Client
Buzzer
Role
Product Designer, User Researcher
Tasks
UX, UI, Strategy, Prototyping
Overview
Buzzer is a sports streaming tech company that aims to reinvent how fans consume live sports. By aggregating sports rights, the mobile platform sends personalized notifications to make it easy to pop into live games when the excitement starts to heat up.
After a successful close of a $20M Series A financing backed by Michael Jordan, Patrick Mahomes, Naomi Osaka, and other leaders in the sports industry, we directed our focus on redesigning our mobile app.
Our goal was fairly simple: complement the live sports experience by integrating storylines, game context, and stats to the app to encourage users to watch more live sports.
My Role
I was the solo product designer and researcher for this 6 month long app redesign. I collaborated with product managers, data scientists and members from our mobile engineering team throughout this project.
Problem
After a successful MVP user experience launch backed by data analytics and extensive research conducted over the past year, we identified the following core issues:
Defining the problem
“How might we improve the fan experience on Buzzer to complement current sports consumption habits and boost live sports viewership in app?”
Goals
Increase engagement and user sessions
Strengthen the value proposition of core capabilities
Increase moments watched per user
Provide a seamless and consistent consumer experience
Process
We released our new redesign in phases. The following research studies were conducted throughout the duration of this project to identify user problems to solve and validate hypotheses.
Post Launch User Survey
Furthermore, by surveying cohorts of Buzzer users, we aimed to assess app usability, navigation, ease of purchase, and identify obstacles that may be impeding users from watching moments. Heading into the strategic planning of our redesign, the findings from this survey would help us determine how to best prioritize the release of our new features.
Remote Design Sprint
Following the release of our initial timeline, I planned and facilitated a remote design sprint to stimulate functional collaboration across departments. Product managers, engineers, the business development team, and brand creatives all contributed their fresh ideas throughout the 3-day sprint. The purpose of the sprint was to align everyone on the same goal: Complement fans current sports consumption habits while boosting live sports viewership in app.
Early designs
You tab
We wanted to keep the home interface simple and personalized to each user. The designs below were used for initial user testing but did not make the timeline MVP. We simplified our initial release to text only to ship our first phase quicker. Any text displayed in primary blue color indicates that users can tap to follow interests from their timeline and each of the buttons represent different actions users can take after tapping.
Today tab
A place to explore today’s scores so users can stay in the know with how their favorites are performing. This early iteration doesn't showcase past and future games which we discovered during user testing are very essential for any fans favorite sports app.
Follow page
These designs went through multiple rounds of usability testing and consistent collaboration with our data science team to ensure we were producing relevant recommendations to each user based on their following graph. The simplicity of following interests on Buzzer is important for us to populate a captivating, personalized timeline for users.
Usability Testing
To validate our early designs, I performed several phases of usability testing involving users who have previously used Buzzer. I specifically conducted testing on our new personalized timeline, revamped onboarding, and our new dynamic recommendation engine. The testing was conducted remotely, with a moderator present to gather qualitative insights efficiently. After designing an interactive prototype using Figma, we gathered data from different 10 fans to ensure a diverse range of users with varying levels of engagement with Buzzer were represented in our findings. The figma prototype for our first round of usability testing and revamped onboarding can be accessed here: New Redesign & Onboarding prototype.
For more insight on how we evaluated the usability of our dynamic recommendation engine, you can read more about my testing process here: Dynamic recommendation engine: User Testing.
Redesign 1.0 - Shipped
Before redesigning Buzzer, the app felt bare and users quickly lost interest because there wasn't much to do outside of watching moments. Now, Buzzer has a refreshed look and feel that showcases relevant moments, storylines, and stats for each user. In an attempt to improve our brand and product perception we named our two tabs Moments and Beats. The moments tab shows live game status and scores from your favorite teams and the beats tab is our timeline for users to interact and engage with.
Global Pattern Library
This is the beginning of our scalable design system that is intended to save time and reduce technical debt for engineers. The screenshot below shows defined typography styles, icons, colors, and partner and team assets. The app uses these components to give the user a unified, consistent and robust UI. Designing at a startup allowed me to gain immeasurable skills in creating components, patterns, and styles from scratch. However, it also illuminated the difficulty in maintaining a design system when the product frequently iterates and shipped new changes. Looking ahead, I'm excited about the opportunity to work on a larger scaled design system in the future.
Redesign 2.0
Personalized Home
Home is personalized for users with a simple swipe over to view trending content. We learned during testing that users want to enjoy our app while doing the least amount of work possible. Many users scroll through social media while watching games, so pinning scores to the top of the timeline both provides updates to game status and encourages users to tune in to watch more sports. We plan to keep the interests page with recommendations of who to follow, but subtly integrating follows onto the timeline helps users receive more notifications and allows us to increase our average number of follows per active user.
Watch: Designed for discovery
Initially, we only displayed games to users on the platform if the players and teams they followed were currently playing live. While this provided less clutter for the users when they opened the app, it also gave the impression that there wasn't much content available to watch. Thus, we developed a new watch tab designed for discovery where the players and teams a user doesn’t follow are shown while still emphasizing the content most important to each fan.
Enhanced Stats and Scores
Phase 2 was set to release during the middle of the NBA and MLB season. Fans of both of those leagues are smart and frequently use data/stats to decipher how ongoing games played out or predict eventual outcomes. It was imperative that our new scores section had no shortage of data and stats, especially seeing as though +40% of our users participated in some sort of betting & fantasy sports.
Learnings
Test, Ship, Learn and Repeat
The most advantageous way to design the best solutions is to ship frequently, fix bugs, learn from data, and try again. I pride myself and the team on sticking to our process that would afford quick learnings to frequently iterate and ship.
Adding bottom navigation
During usability testing we learned that our initial two tab Moments + Beats approach was not intuitive for users. They didn't know what “Beats” meant and some had no idea that they could even switch between tabs. Therefore, we ditched the tabs approach and designed a bottom nav bar that fans of any sport are accustomed to. I'm a strong believer that creating simple design solutions also means reusing common patterns that people are already accustomed to.
Don't get too attached to your initial vision
It's important to stay flexible throughout the process– what you believe to be true or what users say they'll do is not always the case. In fact, in most instances it is definitely not the case. This thought process helped me adapt to new insights and product directions.
Work hand in hand with your users
User Centered design is a frequently discussed principle, but the key lies in connecting with users as often as possible. I relied on feedback from our discord group often and shared early sketches and lo-fi designs with the group. I found tremendous value in the rapport that I was able to establish with each participant. The connections served as extensions of me conducting research because oftentimes any ideas they came across, would eventually be shared to the group and discussed. It’s difficult to imagine successfully shipping so many features from this project without the help of our research cohort!
Future
Unfortunately in June of 2023, Buzzer formally shut down all operations. Recent fundraising developments and market dynamics informed this outcome, despite the team's very best efforts to continue building Buzzer. This also means we were unable to ship the designs from Redesign 2.0. However, leading this project from start to finish was my proudest contribution at Buzzer. I couldn't have done so without the amazing product and engineering team. Major shoutout to the data science, QA and brand marketing team as well.
Thanks for the read, I hope you enjoyed learning more about my design process!
Overview
Buzzer is a sports streaming tech company that aims to reinvent how fans consume live sports. By aggregating sports rights, the mobile platform sends personalized notifications to make it easy to pop into live games when the excitement starts to heat up.
After a successful close of a $20M Series A financing backed by Michael Jordan, Patrick Mahomes, Naomi Osaka, and other leaders in the sports industry, we directed our focus on redesigning our mobile app.
Our goal was fairly simple: complement the live sports experience by integrating storylines, game context, and stats to the app to encourage users to watch more live sports.
My Role
I was the solo product designer and researcher for this 6 month long app redesign. I collaborated with product managers, data scientists and members from our mobile engineering team throughout this project.
Problem
After a successful MVP user experience launch backed by data analytics and extensive research conducted over the past year, we identified the following core issues:
Defining the problem
“How might we improve the fan experience on Buzzer to complement current sports consumption habits and boost live sports viewership in app?”
Goals
Increase engagement and user sessions
Strengthen the value proposition of core capabilities
Increase moments watched per user
Provide a seamless and consistent consumer experience
Process
We released our new redesign in phases. The following research studies were conducted throughout the duration of this project to identify user problems to solve and validate hypotheses.
Post Launch User Survey
Furthermore, by surveying cohorts of Buzzer users, we aimed to assess app usability, navigation, ease of purchase, and identify obstacles that may be impeding users from watching moments. Heading into the strategic planning of our redesign, the findings from this survey would help us determine how to best prioritize the release of our new features.
Remote Design Sprint
Following the release of our initial timeline, I planned and facilitated a remote design sprint to stimulate functional collaboration across departments. Product managers, engineers, the business development team, and brand creatives all contributed their fresh ideas throughout the 3-day sprint. The purpose of the sprint was to align everyone on the same goal: Complement fans current sports consumption habits while boosting live sports viewership in app.
Early designs
You tab
We wanted to keep the home interface simple and personalized to each user. The designs below were used for initial user testing but did not make the timeline MVP. We simplified our initial release to text only to ship our first phase quicker. Any text displayed in primary blue color indicates that users can tap to follow interests from their timeline and each of the buttons represent different actions users can take after tapping.
Today tab
A place to explore today’s scores so users can stay in the know with how their favorites are performing. This early iteration doesn't showcase past and future games which we discovered during user testing are very essential for any fans favorite sports app.
Follow page
These designs went through multiple rounds of usability testing and consistent collaboration with our data science team to ensure we were producing relevant recommendations to each user based on their following graph. The simplicity of following interests on Buzzer is important for us to populate a captivating, personalized timeline for users.
Usability Testing
To validate our early designs, I performed several phases of usability testing involving users who have previously used Buzzer. I specifically conducted testing on our new personalized timeline, revamped onboarding, and our new dynamic recommendation engine. The testing was conducted remotely, with a moderator present to gather qualitative insights efficiently. After designing an interactive prototype using Figma, we gathered data from different 10 fans to ensure a diverse range of users with varying levels of engagement with Buzzer were represented in our findings. The figma prototype for our first round of usability testing and revamped onboarding can be accessed here: New Redesign & Onboarding prototype.
For more insight on how we evaluated the usability of our dynamic recommendation engine, you can read more about my testing process here: Dynamic recommendation engine: User Testing.
Redesign 1.0 - Shipped
Before redesigning Buzzer, the app felt bare and users quickly lost interest because there wasn't much to do outside of watching moments. Now, Buzzer has a refreshed look and feel that showcases relevant moments, storylines, and stats for each user. In an attempt to improve our brand and product perception we named our two tabs Moments and Beats. The moments tab shows live game status and scores from your favorite teams and the beats tab is our timeline for users to interact and engage with.
Global Pattern Library
This is the beginning of our scalable design system that is intended to save time and reduce technical debt for engineers. The screenshot below shows defined typography styles, icons, colors, and partner and team assets. The app uses these components to give the user a unified, consistent and robust UI. Designing at a startup allowed me to gain immeasurable skills in creating components, patterns, and styles from scratch. However, it also illuminated the difficulty in maintaining a design system when the product frequently iterates and shipped new changes. Looking ahead, I'm excited about the opportunity to work on a larger scaled design system in the future.
Redesign 2.0
Personalized Home
Home is personalized for users with a simple swipe over to view trending content. We learned during testing that users want to enjoy our app while doing the least amount of work possible. Many users scroll through social media while watching games, so pinning scores to the top of the timeline both provides updates to game status and encourages users to tune in to watch more sports. We plan to keep the interests page with recommendations of who to follow, but subtly integrating follows onto the timeline helps users receive more notifications and allows us to increase our average number of follows per active user.
Watch: Designed for discovery
Initially, we only displayed games to users on the platform if the players and teams they followed were currently playing live. While this provided less clutter for the users when they opened the app, it also gave the impression that there wasn't much content available to watch. Thus, we developed a new watch tab designed for discovery where the players and teams a user doesn’t follow are shown while still emphasizing the content most important to each fan.
Enhanced Stats and Scores
Phase 2 was set to release during the middle of the NBA and MLB season. Fans of both of those leagues are smart and frequently use data/stats to decipher how ongoing games played out or predict eventual outcomes. It was imperative that our new scores section had no shortage of data and stats, especially seeing as though +40% of our users participated in some sort of betting & fantasy sports.
Learnings
Test, Ship, Learn and Repeat
The most advantageous way to design the best solutions is to ship frequently, fix bugs, learn from data, and try again. I pride myself and the team on sticking to our process that would afford quick learnings to frequently iterate and ship.
Adding bottom navigation
During usability testing we learned that our initial two tab Moments + Beats approach was not intuitive for users. They didn't know what “Beats” meant and some had no idea that they could even switch between tabs. Therefore, we ditched the tabs approach and designed a bottom nav bar that fans of any sport are accustomed to. I'm a strong believer that creating simple design solutions also means reusing common patterns that people are already accustomed to.
Don't get too attached to your initial vision
It's important to stay flexible throughout the process– what you believe to be true or what users say they'll do is not always the case. In fact, in most instances it is definitely not the case. This thought process helped me adapt to new insights and product directions.
Work hand in hand with your users
User Centered design is a frequently discussed principle, but the key lies in connecting with users as often as possible. I relied on feedback from our discord group often and shared early sketches and lo-fi designs with the group. I found tremendous value in the rapport that I was able to establish with each participant. The connections served as extensions of me conducting research because oftentimes any ideas they came across, would eventually be shared to the group and discussed. It’s difficult to imagine successfully shipping so many features from this project without the help of our research cohort!
Future
Unfortunately in June of 2023, Buzzer formally shut down all operations. Recent fundraising developments and market dynamics informed this outcome, despite the team's very best efforts to continue building Buzzer. This also means we were unable to ship the designs from Redesign 2.0. However, leading this project from start to finish was my proudest contribution at Buzzer. I couldn't have done so without the amazing product and engineering team. Major shoutout to the data science, QA and brand marketing team as well.
Thanks for the read, I hope you enjoyed learning more about my design process!