Role: UX Researcher, Product Designer

Duration: 80 hours

Tools: Figma, Sketch, Adobe Illustrator

Final Prototype: View Here

When thinking about how to make Netflix more engaging for users, I decided that adding a social feature would be a great new direction for the product. For this project, I developed a new feature for Netflix to make list creation and sharing recommendations easy and seamless. For this project, I acted as an end-to-end product designer, conducting research, creating a new feature for the web application, and prototyping and testing the new features. This project took 80 hours to complete. 

Empathize

During the empathize phase, I completed a competitor analysis, conducted user interviews, created a persona based on a typical group of users, and created an empathy map for that persona.

Competitor Analysis

A competitor analysis was conducted upon both streaming service competitors as well as video platforms with social features. This study found the strengths and weaknesses of our competitors and provided insights into how we should develop our new social features. I gained a lot of inspiration from the social features in TikTok, specifically the ease of use of their video sharing feature.

Customer Interviews

I conducted user interviews with 6 participants aged 25-29, all of whom watch Netflix frequently. I asked them questions about their streaming service usage, what their experience is like with using the application, what motivates them to watch new shows or movies, what their pain points are, and what their thoughts and feelings are about potential social features being added to the app.

Participant Information

6 participants, 3 male, 3 female Ages 25-29

Key Findings

• Most participants rely on friends’ recommendations for new shows and movies to watch, some are influenced by Netflix’s featured shows and previews

• Two participants noted that they don’t understand the Netflix match percentage for a show (recommendation percentage) and don’t know how they get that number or what it implies - they don’t value this as a source of recommendations

• All participants except for one were interested in having social features added, specifically the ability to share and recommend shows to friends, and have a profile where they can add shows to custom lists

• Half of the participants were fine with having their watch history available for other users to view on their profiles, where as the other half preferred to have control over their watch lists

Provisional Persona

A provisional persona was created based on the competitor analysis and customer research. Some of the main goals for this persona were to be able to find relevant new shows or movies to watch, be able to connect with friends and share recommendations, and have a seamless and intuitive experience with utilizing any new features within the Netflix app.

Empathy Map

An empathy map was created to dive deeper into the motivations and influences of the provisional persona.

Define

Project Goals

After conducting research on competitors and users, I used this information and the project brief to outline business goals and user goals, and determine where those goals intersect. This helped me to see which of the goals were the most important to address from both a business and user standpoint. The most important goals were to make this new feature fit seamlessly with Netflix’s current UI, and to make the experience intuitive for users.

Feature Roadmap

My project goals allowed me to outline the necessary features and prioritize which needed to be addressed first and which could be addressed with further iterations of the product. Since Netflix currently doesn’t include any social features, it was important to determine the best way to begin to incorporate such features without overwhelming users or totally reworking their already excellent user experience. I decided to mainly focus on creating the profile, list, and share video feature, with additional social features to be rolled out in subsequent updates.

Ideate

During this phase, hand-drawn sketches were produced, user flows were outlined, and wire-frames were created for the new features. Finally, branding and fidelity were added to create the final UI for these new features.

Sketches

I created sketches of the new Netflix features to get a visual idea of how the features would work. I mapped out two of the necessary features I wanted to add - a profile with customizable lists, and a button with a drop-down to share a video with a friend. I also changed the current “Add to list” button to include a drop-down so that users could add it to any of their existing or new lists. These features will help users organize their favorites, show their curated lists to their friends, and also share a specific show or movie to a specific friend.

It was important to determine how to seamlessly transition into including social features within Netflix so that it doesn’t take away from or disrupt their current product goals or user experience. I decided to include these features as a means to begin to develop a more comprehensive social experience without overwhelming users with too many options to begin with.

User Flow

It was then important to determine different decision points users might go through on their interaction journey with the new features. I outlined three potential user flows with paths for how they would interact with the features and the different decision points involved.

Low Fidelity Wireframes

With all the research and defining complete, I was now ready to move on to low-fidelity wireframes. I determined the layouts for the new features and explored different options, such as sharing from a video. I spent a lot of time figuring out the optimal way to be able to seamless incorporate these features into the existing Netflix UI. I decided to add buttons and features within the show preview function on the homepage as to make this new feature feel native to the Netflix platform. I also designed some new screens for a profile and friend search that still fit in with the overall look and style of the Netflix UI.

In my first versions of wireframes, I also added a share video feature at the end of each video. Upon further reflection, I realized that it was clunky to try to add this feature to the end screen of a video because it disrupts the main user flow at the end of watching a video, which is to prompt the user to immediately watch the next video. Adding a share feature at that point takes away from Netflix’s main goal of influencing users to continue to view more content.

Style Tile

I conducted research on the current UI for the Netflix product. I compiled the common elements, typography, iconography and colors, to better inform my design of the new features and how to add fidelity to my wireframes.

High Fidelity Designs

Using all of my branding elements, I added fidelity to my wireframes. This involved adding the additional feature elements to the existing Netflix UI, including setting up overlays to add to the current design of the Netflix app. It consisted of adding additional imagery, iconography, and branding elements. Again, an overarching goal was to make these features feel completely native to the Netflix UI so I relied heavily on the current layout and branding of the Netflix product.

UI Kit

Once the high fidelity designs were completed, I compiled all of the new key elements into a UI kit to ease the transition of passing off the design to developers.

Prototype

Figma Prototype

I created four tasks for my prototype: 1. Add Arrested Development to your list “Quirky TV Shows,” 2. Share Arrested Development with your friend Sarah Smith, 3. Visit your profile and change the privacy setting of “Quirky TV Shows” to “Only Me,” 4. Add a friend named Julia Barnett with whom you have 6 mutual friends.

Test

Usability Test

Using Figma, I selected four users in my target demographic and had them test out the new features: add a show to a custom list, share a show with a friend, change the privacy setting for a list on their profile, and search for and add a new friend.

Test Results

Task Completion Rate

• 100% task completion among 4 participants

• All participants were able to complete all 4 tasks

Errors

A few participants encountered minor errors:

• Trevor and Amanda - tried to click the + button to add a show to the list before expanding the show description

• Matt was confused about the arrow icon denoting the share feature

Wins

• All participants found the features to be easy to navigate and intuitive

• Three out of four participants said they would use the features if built into Netflix

• Two participants mentioned that they would

Improvements

• Two participants wanted to be able to add a show to a list before pressing the down arrow to expand the show description

This project allowed me to work with a fully-functional existing application and design a feature to bring additional value to the product. This gave me the opportunity to explore how to make a new feature feel seamless and intuitive with an existing UI and brand. I also had to make high level decisions, based on research and the existing product, about what these new features should entail - specifically how in depth the social features should be given that the current product has zero social capabilities. This project also gave me the opportunity to explore more of the Figma prototyping capabilities and create a more complex prototype which features multiple sequences of overlays.