Group Chat and Group Watch are theoretical social features for the NBA mobile app that enable users to experience everything the NBA app has to offer together.

Product
A social feature for the NBA app
Services
Product Design
UX/UI Design
UX Research
Context
This project’s brief was to create a new feature for the NBA mobile app, adhering to the specific constraints of it being a social feature geared toward fostering business growth.
The Challenge
NBA fans routinely engage with fellow fans in their social circles and find those interactions to be a valuable part of the fan experience. However, with no way to engage their NBA community on the app, they have turned to other platforms to meet their need to share in the experience with others.
The Solution
A high-impact social feature that allows NBA fans to experience the NBA with their fellow fans inside the app.

Foundational
Research

Foundational research revealed that users consider communication and live game-watching with their dedicated social groups as integral to the fan experience. This uncovers a significant opportunity for a impactful social feature aimed at meeting these user needs. A design enabling users to connect, watch, share, and collectively experience all aspects of the NBA app could enhance user satisfaction and engagement. This, in turn, has the potential to boost the app's user base and increase conversions from free accounts to League Pass subscriptions.
Here is how I reached these conclusions:
  • Immersing myself in the subject to understand the product and its priorities.
  • Conducting interviews to grasp the motivations and goals of its users.
  • Performing a competitor analysis in order to gain insights into the product landscape.

Subject Immersion

Understand the business & its priorities
I kicked off my research during the NBA’s inaugural in-season tournament final four, which proved to be an ideal time to gain a sense of the NBA’s marketing priorities. Over the tournament’s weekend I was exposed to dozens of ads for the NBA app. Through this exposure I was able to think through how I might align the personas for whom I would be designing as well as confirm the app’s push to gain new users.

During this time I also performed an audit of the app - making note of layout, information architecture, user journeys, and existing task flows. Additionally, I made sure all of my notifications were on to ensure I was gathering as much information as possible for how the app seeks to interact with its users.

User Interviews

I compiled all user feedback into an affinity map.
Here are my key findings
Users aren't just watching the games
Checking out the stats, browsing the conversation on social media, and texting with friends - users aren’t just watching games, they’re multitasking.
Sports fans communicate with each other frequently
Many users have specific friends or a dedicated group chat where they’re frequently participating in engaged conversation about their favorite sports and teams.
Fans aren’t interested in engaging with people they don’t know
Users that I spoke to said they don’t have an interest in engaging about sports with people they don’t know online, valuing communicating with people they are familiar with.
The communal watching experience is valuable
Fans like to watch games with each other, even if it’s hard to regularly do it together in person.

Competitive Analysis

What is the opportunity for impact?
Other major North American sports
The mobile apps for each of the four major sports leagues in North America share many similarities. When individually assessed, distinguishing major differences beyond their content is challenging. However, the NBA does stand out in some design and tone respects, incorporating UI elements like that of social media platforms. This suggests the app aims to foster an active user base, aspiring to be more than a library of league-related content.
NFL App
Video livesream
Social features
Group watch
MLB App
Video livesream
Social features
Group watch
NHL App
Video livesream
Social features
Group watch
Playback
Playback is an app that allows users to stream live sporting events together. I found inspiration in Playback’s designs and how the app seeks to meet user’s needs of watching live games together, but because these communal watching experiences exist outside of the NBA app, they do not contribute to an increase in league pass subscriptions and are ultimately not serving the NBA app’s business goals.

Persona

Understanding who I'm designing for
Kaleb
Kaleb is a engaged and devoted commissioner of a competitive fantasy basketball league among close friends. Known for his passion for the sport and his knack for nurturing a sense of community within the league, Kaleb takes the reins to ensure a season filled not just with intense competition, but also with memorable moments of shared enjoyment. Kaleb is on a quest to discover fresh avenues for collective engagement, seeking ways to unite the group through lively discussions and shared experiences.
Goals
Kaleb is the commissioner of a fantasy basketball league with his friends and is looking for ways to make the season more engaging so the league has more fun.
Quote
"My vision is to turn competition into connection and make every play count towards creating unforgettable moments together. It’s tricky to do that when we don’t see each other often."
Challenges
  • It’s difficult to get people together to watch games.
  • Not everyone in the group may have league pass.

Define & Design

I took what I had discovered during the foundational research phase and began ideating on potential solutions, ensuring that my designs prioritize user goals as well as adhere to any technical considerations and product constraints.

It was important to design user flows in a way that made sense within the existing hierarchy of the NBA app, seamlessly harmonizing with UI patterns while still standing out as something new, exciting, and important.
Problem Statement
NBA fans routinely engage with fellow fans in their social circles and find those interactions to be a valuable part of the fan experience. However, with no way to engage their NBA community on the app, they have turned to other platforms to meet their need to share in the experience with others.
POV
I would like to explore ways to help fans experience the NBA with their fellow fans inside the app because fan interaction is a valuable part of the fan experience.
HMW
How might we help users engage with one another on the app so that they can experience the NBA together?

Key Features

The Solutions

Group Chat

The Group Chat is the central hub of social activity on the app where users can invite their friends to join in on the conversation.

All interview subjects shared that they are active participants in sports-dedicated group chats, which ultimately is the type of community this feature aims to facilitate inside the app.

The interface design of the chat is standard and recognizable for a wide range of users, including common functions such as reactions and a viewable member status.

Free Access

In theory, any NBA app user with a free NBA ID should have the ability to create and join Groups, which creates the potential to attract new users as existing users invite their social circles to join them in the group without the hurdle of a cost of entry.

User Flow

I prioritized giving users the ability to access existing and create new Groups without going deep into the app and in as few steps as possible. If this was to be something that users might use in place of an external group chat, easy access and simplicity would be key.

In addition to prime visibility on the home screen, I identified several places within each of the nav locations where users could find and use Groups intuitively.
View Flow Diagram

Group Watch

The core of the NBA app content, and the NBA product as a whole, are the live games. Fans tune in night-to-night to watch their favorite teams and the league’s top stars. What the Group Watch feature seeks to do is give fans a space to experience live games together without leaving the app.

Group Watch is a potent alignment of business and user goals. Insights from user interviews revealed that fans see watching live games together as a foundational part of the fan experience and is something they don’t get to do often as going to games and aligning schedules within their social groups aren’t common occurrences and frequently logistically impossible.

Keeping What's Important

A highlight of watching a live game on the NBA app is the easy access to live stats, game information, and top highlights. Based on feedback from user interviews, it was deemed critical to keep this access in any new designs. When a user creates or enters an active Group Watch, a new tab is created that contains a new, game-specific group chat. This is where members within the Group Watch can converse and react to the game together.

A section is added above the quick tabs that highlights members who are present and active in the Group Watch, and also gives users a clear path to exit the Watch and go back to the Group Chat. Users can access additional viewing preferences through the more button on the right side of the interface.

User Flow

By starting the flow for creating a Group Watch inside of the live game UI, users are able to quickly and intuitively set up a watch party within their group of choice. Inspired by the group Facetime feature on IOS, users can enter and leave the group watch from within the group chat. Group Chat members who do not have a league pass membership will be prompted to sign up in order to access the Group Watch, creating an opportunity where users who are not premium members are presented with immediate benefits and hopefully encouraged to take immediate action.
View Flow Diagram

Sharing Content

The Group Chat presents an opportunity for users to seamlessly share NBA-related content with their fellow fans, an action that users are already frequently taking using tools outside of the app.

From highlights to breaking news, the NBA app is full of content that users can engage with together. By making all of that content easily shareable to a Group Chat with just a few clicks, we’re encouraging users to continue to stay engaged with the league beyond just the live games.

Usability Testing

Key task flows were designed into a clickable prototype
See Prototype
Task Completion
5/5 users tested were able to complete the assigned task flows efficiently and without error.
Positive feedback
Users described the designs and flows as “intuitive” and “simple to use.” Participants appreciated how the flows were straight forward in design and not overloaded with 
too many options or buttons.

5/5 testing participants said they would find this feature useful for experiencing the NBA with other fans.
Design Integration
5/5 users tested said they found the visual design to be consistent across screens.

Usability Testing

Iterations
What did I change?
Several new screens were designed into the prototype flow, all of which are accessible from the home screen and give users access to Groups or to create a Group Watch.
Why did I make this change?
Prototype flows did not account for all of the different ways that a user might move through the app starting from the home screen. While I tried to design easy and noticeable points of entry, several users’ first instinct was to ignore those initially and first try the bottom navigation and the NBA’s story feature, which is at the very top of the home screen. These flows were then designed in to an updated version of the prototype.

Lessons Learned & Next Steps

Aligning business goals & user goals
The project brief for this assignment introduced several constraints that I needed to adhere to in my designs and process: compliance with existing branding and UI patterns, the project must be completed in under 75 hours, and the final product must be a social feature that helps the business grow.

To design this feature I needed to really understand both the business’ goals as well as the goals of its current and potential users. Aligning the goals of both is what gave me confidence in the direction of my designs.
Given more time I would:
  • Design for other screens.
  • Explore direct messaging between users.
  • Expand the Group Watch to include recorded and classic games.

Next Up

Bocca Bilingual