Project Overview

Role

UX Designer

Responsibilities

user research, competitive analysis, prototyping, A/B testing

Timeline

November - December 2020

Teammates

Heidi Hernandez, Brittney Kim, Natasha Supangkat

What I Did

• Conduct user research and interviews, A/B testing
• Work within and build upon existing design system's UI
• Cycle through prototype iterations based on user testing

Problem Space

Streaming services have gained increased popularity since the COVID-19 pandemic hit, but several, if not all services, require payment to enjoy their content, making it less accessible to those with financial burdens. Our team chose to focus on Peacock, a fairly new streaming service owned by NBC, to redesign since it's primarily a free streaming service. With the option to upgrade to premium to view more content, Peacock is more accessible in comparison to its competitors.

The Challenge

Based on user interviews and usability testing, Peacock's watchlist feature was difficult for users to locate and lacked distinguishing visual indicators to inform users about changes made to the watchlist.

The Solution

A redesigned watchlist user journey that improves user engagement and experience by increasing feature visibility and status feedback.    

— How might we personalize the streaming experience for Peacock users to help reduce the time spent searching for
content to watch?

My Design Process

User Interviews

Due to the limited interaction with others because of the pandemic, we had to conduct our interviews on housemates and family members. Our team conducted interviews (n = 6) targeting users ages 15-25 who had prior experience using streaming services. Users were given a series of tasks that explored different features of the app which helped our team determine the pain points of the app.
Our main objective of the user interviews was to determine the top usability errors in order to narrow down on a component to focus on for our redesign.

Top Usability Errors

One thing that our team noticed that was repeatedly apparent in our usability testing was that ALL of our users struggled to locate and interact with the watchlist feature.Our participants either grew impatient in their attempt to find the watchlist after adding a show as part of their interview task or even failed to find it completely. Recognizing this pain point led to us redesigning the watchlist component.

What is a Watchlist Feature?

Most streaming platforms have their own version of a 'watchlist' feature which is a personalized way for individuals to organize and keep track of their streaming content by adding tv shows or movies they're interested in viewing. Think of the watchlist as a 'bookmark' so individuals can refer back to at any time they want.

The watchlist feature allows individuals to both personalize and streamline their own streaming experience. When individuals have the freedom to organize their own content, it's more likely that they will return back to the streaming service that gives them the most convenience when choosing their interests.

Common User Journey with Peacock's Current Design

Competitive Analysis

Peacock’s Top 3 Competitors:
1 Netflix
2 Hulu
3 Disney Plus

To get a better understanding of the watchlist component, our team did a competitive analysis of Peacock's competitors. Each of us went through each streaming service and checked out the user journey to getting to their version of a watchlist. By individually evaluating each service, we kept in mind what worked and what didn't. From our usability testing of Peacock's features, our interviewees have expressed comparisons to other streaming apps regarding the watchlist component.

Sketches

After analyzing our findings and the comparing our competitors' user journey, we moved onto the ideation phase of the design process. Each team member sketched a version of the watchlist feature inspired by our competitors, while keeping users’ needs the main focus of our iterations.

Two Redesigns

Splitting into groups of two, our team combined features from all of our sketches that best addressed our users' needs and frustrations. Our team created two different prototype iterations; I worked on iteration #2.

While both designs’ priority was alleviating the frustration in the watchlist user journey, we also decided to make small minor improvements to other parts of the app which was addressed in our user interviews.

Some minor improvements that we made include:
Search Bar Accessibility
• Fixed User Profile
• Downloads Accessibility
• Landing Page

Iteration #1

The most distinct change in this iteration is the integration of the watchlist into the main tabs. Its location is clear and easy to find as it no longer is hidden within the ‘Featured' screen. Users can browse through content on the landing screen while maintaining access to the watchlist at any point in time.

Landing page: Featured screen is now the new landing page, introducing users to the content they are looking for right from the start.
Empty Watchlist: A call-to-action button directs the user to 'Start Browsing', invites the user to engage with the content and watchlist feature.
Filled Watchlist: Users are able to add more content straight from the page boosting watchlist interaction.
Search Bar: Search bar is more accessible to users as its fixed at the top of the screen. Movie suggestions are added to the search bar to increase engagement.

Iteration #2

For the second iteration, we integrated the watchlist feature in the bottom navigation bar so that it would easily stand out and quick to access regardless of where in the app users are. Users can also now add channels to the watchlist as well, therefore making the watchlist a universal feature in the app.

Landing page: Featured screen is now the new landing page, introducing users to the content they are looking for right from the start. Watchlist is implemented at the bottom.
Empty Watchlist: Users are greeted by UX copy and are able to add content directly into this page by pressing the "+" button.
Filled Watchlist: Content is organized into categories (movies, tv shows, channels) making it easier for users to find desired content.
Search Bar: Search option is implemented in the bottom nav bar so it's more accessible to users.

Usability Testing & Results

To gain further insight on which redesign iteration best addressed user concerns and increased engagement within the app, our team conducted usability testing between the two versions. Some questions we kept in mind as we conducted the testing were:

  • Was the redesign enough to improve user experience without seeming too unfamiliar?
  • Did minor tweaks improve the usability of other features such as the redesign of the search bar or the user profile?
  • Did we address user frustrations and needs in the best possible manner?
  • Most importantly, what can we remove, modify, or add to improve our current designs?

Design Decisions

After conducting the usability testing, I decided to make a final iteration that combines all the feedback that we received. Below are some screens that are a result of design decisions backed by a culmination of user feedback.

Measuring Success

Results from our user testing showed that designing for accessibility such as providing an editable watchlist led users to feel a greater sense of personalization with Peacock. Creating a unique streaming experience makes users feel more catered-to and recognized. Therefore, Peacock could consequently increase user retention and loyalty by creating a more customized and seamless streaming experience through improving features like the watchlist.

For our next steps, our team would expand our user testing base so that our feedback represents a larger pool of current and new Peacock users. From there, we would like to quantify the impact of our redesign by tracking user engagement with the watchlist.

Some possible metrics for success include:

  • Amount of content viewed from watchlist
  • Amount of content added to watchlist
  • Number of users interacting with watchlist (monthly/daily basis)

What I Learned

One lesson learned from this redesign is the consequences of undermining smaller features and how they affect the overall quality of the product experience for the user. Initially, we felt the watchlist task was perhaps too small and not a significant enough feature to redesign. However, our user testing eliminated our doubts as users emphasized that they felt more inclined to navigate through the app and browse through the various TV shows and movies all because of the watchlist redesign.

By including new components such as ‘Start Browsing!’ to the watchlist, users stated they felt a stronger need to engage with the app and find content to add to their list. They wanted to use the app to enjoy their favorite content now and not just because the app was free to use. In short, features that appear small can either significantly elevate or ruin a user’s overall experience and perception of a product.