NETFLIX

Improving the browsing experience on the Netflix mobile Application

BRIEF

Netflix’s primary business is its subscription-based streaming service which offers online streaming of a library of films and television programs, including those produced in-house. The vast collection of content, the intuitive UI, and flexible subscription models have made Netflix a sought-after video provider in not only the US but across the globe. It was among the first online video streaming services and has an ever-expanding quantum of originals and licensed collection. 

With the increase in the number of streaming services entering the market, Netflix wants to stay ahead of the game. A new study reveals that Netflix users spend 17.8 minutes browsing for what to watch on Netflix. A lot of surveys have revealed that users find a hard time choosing videos to watch.

To help improve the browsing experience of the daily user, Netflix seeks to introduce features that can help assist the user search for content faster and produce a more satisfactory search result. 

NOTE: This is a fictional project and not officially associated with Netflix

GOALS AND OBJECTIVES

Design features such that embed within the current Netflix platform for an iPhone. Make sure it embeds well and smoothly with the rest of the app. 


Design features within the application will assist the user make a quick and informed decision about selecting the show to watch.


Explore features like ‘advanced filters’, in-built reviews/ratings, and others that assist the user in narrowing the search options. 


Design additional features that might arise through user interviews and incorporate them within the app.

ROLE                 UX Research, UX/UI Design

COMPANY        NETFLIX

TOOLS              Figma  |  Miro

TIMELINE          4 Weeks

How might we make the overall browsing experience of a Netflix user more efficient and satisfactory?

EMPATHIZE

Research Goals
Research Methods and Findings
Insights for Innovation
Research Analysis

DEFINE

Feature Roadmap

Sitemap

User and Task Flows

IDEATE

Low and Mid - Fidelity Wireframes

Design Systems

PROTOTYPE

High - Fidelity Wireframes

Prototyping

TEST

Usability Testing

ITERATE

Repeat the process - Ideate, Prototype and Test

EMPATHIZE

 

USER RESEARCH

RESEARCH GOALS

Identify the pain points and frustrations of the existing Netflix subscribers while they search for and decide what content to view. 

01

Identify the features the user have a problem using, the features they enjoy using, and the features they desire, specifically while browsing for content, navigating through app until beginning to view a show.

03

Understand what features currently assist them to explore and land on a particular show. 


   - What motivates them to watch a show when browsing (i.e., is it the imagery, description, etc.)? 
   - What external factors assist them in decision-making (i.e., friends recommendations, reviews/ ratings?)

05

Assess the features offered by Netflix to its subscribers, Netflix mobile app UI elements, and compare it to its competitors. 

02

Identify if the users face any other challenges while using Netflix mobile app. 

04

RESEARCH METHODOLOGIES

PRIMARY RESEARCH

Based on the analysis from the secondary research:

 

Assumption:

"The average user takes more time to search for content to view with not a very satisfactory result. He/she is looking for features that will make the browsing experience more efficient with a more acceptable result."


The user interviews concluded that 60% of users spent a lot of time searching for content to view and end up being frustrated through this process.

A few interesting takeaways: 

  • The user wanted the ability to filter out content using multiple parameters and search results that are closer to viewers interests.

  • The user wanted these features to be optional, which they could use only when unsure of what to view. 

  • The user wants to have control over which search input can be blocked/allowed to influence future Netflix recommendations.

  • Users with limited time in hand had a higher desire to use these features. The younger users did not mind spending more time to explore.

INSIGHTS FOR INNOVATION

After conducting user interviews, contextual inquiry and analyzing the gathered data, four common insights emerged.

CONVENIENCE

The ability to filter out content based on multiple parameters, on the viewing platform itself, reduces the user’s need to navigate across different websites and thus helps to reduce the search time

EFFICIENCY 

Understanding the user better in varying scenarios, settings, and moods, helps suggest content better and indirectly increases user satisfaction

CONFIDENCE

The user likes to make an informed decision by viewing reviews and ratings of a particular content before investing the time to view it 

RESEARCH ANALYSIS

Based on the secondary and primary research findings, the results were used to create a persona to better understand and empathize with our users. 

Sarah - represents a certain portion of Netflix's user base who is extremely busy juggling between her work and family responsibilities, but sees watching films and shows as a way to unwind, relax, and learn.

USER PERSONA

USER JOURNEY MAP

DEFINE

 

SITEMAP

A sitemap was created to show the relationship between the content on the app. Using the product Roadmap as the reference I started visualizing the content, its hierarchy, and its placement.

USER AND TASK FLOWS

Created User Flows helped visualize how Sarah, and eventually the target user audience, might interact with the application to complete various tasks based on different scenarios.

IDEATE

 

At this point in the design process, I began creating low-fidelity to mid-fidelity wireframes for the additional screens to be incorporated into the existing Netflix app - primarily 'additional filters' and a 'Help Me decide' feature.

UI KIT

Once the wireframes were created it was then time to create the UI kit for the Netflix mobile application. Keeping the existing Netflix UI elements as the base, I created a few new elements that would blend well into the design systems fo the existing app.

 

PROTOTYPE

HIGH-FIDELITY WIREFRAMES AND PROTOTYPES

After creating high - fidelity wireframes, I create a prototype in Figma for the user to accomplish a defined task.

Scenario: Sarah has an evening free for herself. She has to drop her kids to a birthday party and John has a few meetings scheduled with global teams. Juggling between work, home, and kids, Sarah rarely gets some time for herself. She decided to spend 2 hours watching a movie and unwind. She wants to watch a comedy movie that is relatively new. She is not very satisfied with the search results, hence uses the 'help me decide' feature. 

Features to make the browsing experience of a Netflix user more efficient and satisfactory

Advanced Filters

Help Me Decide

 

TEST

USABILITY TESTING

Once the interactive prototype was designed, we conducted usability testing to study how people respond and interact with the design. 

TEST GOALS:

To see how users react to the additional features in the mobile app

01

To spot the features on the app that create confusion and whether or not the users are able to predict the upcoming steps

03

To monitor the pattern the users follow while searching for a particular show to watch and finally decide on one specific show

02

To observe users interaction pattern with the filters and the ‘help me decide’ feature

04

TEST RESULTS

Individual data points gathered were categorized as seen in the image. Based on the insights gathered from the affinity map, the highest priority revisions were incorporated in the prototype attached above.

80% of the participants used the search function from the homepage itself. They would prefer to have advanced filters/search functionality active from the first screen itself. 

01

60% of the participants struggled with finding the ‘Help Me Decide’ button. They needed assistance in locating it while navigating through the prototype.

03

A participant wanted to select 4 of the 6 ‘help me decide’ options. She suggested enabling the button after the user selects one show.

05

A participant suggested adding an indication on the screen after the ‘help me decide’ tool, which would indicate that the tool has already been used. 

02

The ratings scale, when selecting 6, indicated that the results will show 0-6. Which is not the correct assessment. The indication needs to be modified to indicate 6-10.

04

The range for a few of the advanced filters was not very easily predictable by some of the participants. There needs to be a better UI design that helps indicate the ranges better. 

06

NEXT STEPS

The next steps would be to conduct a second round of usability tests and create responsive designs adaptable to TV, laptop, and tablet devices. ​