NETFLIX SOCIAL

UX Design Capstone Project

CHALLENGE

Netflix was founded in 1997 as a DVD delivery service. Today it now has over 139 million subscribers worldwide and acts as a leading streaming service that allows its customers to watch a wide variety of award-winning TV shows, movies, documentaries, and more on thousands of internet-connected devices.

Though personal recommendations and word of mouth are often a big factor in choosing what to watch, and word of mouth is a huge source of business for Netflix, the company has no robust social features at this time. To help improve engagement and retention in the app, Netflix seeks to expand their social capabilities.
NOTE: This is a fictional project and not officially associated with Netflix

Solution

Design a new social feature that embeds within the current Netflix desktop site.

Overview

Client: Netflix
Project type: UX/UI
Timeline: 80 hours
My Role: User Research, Strategy, Interaction Design, UI Design, Prototyping, Usability Testing
Tools Used: Sketch, InVision, Photoshop

design process

Research

REsearch goals

I began the process with research goals to: understand how people choose what to watch, understand the current role that social connections play with people's use of Netflix, as well as understand any areas that may need improvement, pain points and needs that are not addressed in the current Netflix app

RESEARCH COMPONENTS

  • Market research
  • Competitor analysis
  • User surveys
  • User interviews

Research Plan

The Research Plan was created in order to help define the target market and to discover their behaviors and views towards online video streaming services and video sharing.

Research

SECONDARY RESEARcH

First, I conducted secondary research to better understand Netflix's history and goals, the target market, the existing product and the market space.
Research plan and competitor analysis
Click to enlarge the research plan

MARKET RESEARCH

Though many of us are familiar with Netflix, it was important to get a better idea of the overall video streaming industry and Netflix's competitors, as well as gather some statistical data to better understand who is using Netflix and how they are using it. A small selection of the findings can be found below.

To further understand where Netflix stands in the market, along with its strengths and weaknesses, I conducted a competitive analysis. I spent some time looking into four other services commonly used to stream video content: Amazon Prime Video, HBONow, Hulu, and Youtube, and piracy (in general, not specific to a certain website or service). In looking at these services, I sought to identify the strengths and weaknesses of other video streaming services. Netflix’s biggest direct competitors, Prime Video and Hulu, also do not have any robust social features as of 2019; however, Youtube, the top video streaming service by time spent worldwide, has strong social elements.

Primary Research

To better understand the pain points and goals of those who use Netflix, and other parts of my research questions that the secondary research was unable to answer, I developed an interview script and conducted user interviews with participants. Interviews were done in-person and over the phone. I asked each subject some questions about regarding TV/video watching in general, with most questions focused on the Netflix viewing experience.
“If I enjoy a show, I want other people to enjoy it also. Why? Because I love when people appreciate things I do and we can then discuss it. Also, it validates my taste in TV shows that others like it.”
“I don’t know how the [recommended] algorithm works but I don’t feel that it’s tailored towards me. If I’m looking for something to watch, and they send me these shows, it’s frustrating when they are so not something I’d like.”
“I would love to be able to recommend or receive recommendations to people through the app.”
I also created and distributed a questionnaire to 29 participants via social media networks (Slack, Facebook, Whatsapp).

QUALITATIVE TAKEAWAYS from questionnaire and interviews

  • Overall, research findings showed that the majority of streaming service and Netflix users decide what to watch based on friends’ and families' recommendations.
  • Though users vary on whether they watch alone or socially, most report that their choice of selection has to do with recommendations from friends
  • Across the research, users expressed a frustration the inaccuracy of recommendation that the app's algorithm develops for them.

Define

Empathy and PERSONA DEVELOPMENT

After going through my interview transcripts and identifying behavior and need patterns, research was synthesized into a set of deliverables, to guide me in keeping the users as a priority in the  design process.

In order to understand my key users better, I created a persona, empathy map, and user journey map.

I created the persona, Jen, using my research, namely that from the 1:1 interviews. She represents the large portion of Netflix’s user base who are subscribed to a few different video streaming services, who sees watching films and shows as a time to enjoy and relax, and as something to talk about with friends as well.

To further explore relationships and develop the persona that emerged from the data I’d gathered and mapped, I created an empathy map made up of observations and statements from my user interviews and diving deeper into Fred's mindset.  This helped me further understand the emotional state of the user.

These deliverables served as a continuous reminder of the characteristics of the kind of people who use Netflix throughout the design process and made it especially helpful for designing with a "real user" in mind.
Click to enlarge the persona, empathy map and user journey map

POINT OF VIEW Statements and How Might We Questions

Now that I had a better understanding of Netflix users and really honed in on the specific pain points, it was time to focus on creating solutions. From my insights and needs, I rephrased these into a point of view (POV) statement and reframed each these as a “how might we?” (HMW) question, in order to start working towards solution-focused designs.
  • How might we help users send and receive recommendations with their friends?
  • How might we give users recommendations that better match their interests and mood?
  • How might we provide a way to display videos that users are more likely to continue with?
  • How might we redesign the categorization so that users spend less time on browsing whilst making the “right-for-them” choice?
I then used these HMW questions to begin brainstorming solutions. I did this by writing down each of the HMW questions, spending 2 minutes writing solutions for each, coming up with a feature roadmap and landed on several features that would solve the narration and concentration challenges:

Ideate

SITE MAP AND TasK flow

After identifying user behavior and need patterns, research was synthesized into a set of deliverables, which would guide me in keeping the users as a priority throughout the design process.

I developed a simple site map to solidify the organization of pages within the site.
Using the sitemap, research findings and developed persona, I was then able to chart a task flow. The task flows below show three main paths for a user: from their entry point to the final end goal of reading reviews of a video, removing a video from the Continue Watching list, and viewing a user's social profile.

WIREFRAMES

I began to wireframe key pages informed by my task flows. I took to pen and paper to start with some free-sketching.
Click to enlarge the low-fi sketches
I then moved to Sketch to create mid-fidelity wireframe key pages informed by my user flow. This set of wireframes shows the site pages that a user would encounter as they progress from entering the site on the home page, browse videos to watch, remove a video from their continue watching feed and view their own and other users' profiles using the added Social page.
I created a mid-fidelity desktop prototype of the main user flow using Invision. This enabled me to visualize the early designs more concretely and see how the interactions flowed (or didn't).
In both my lo-fi and mid-fi sketches, I had initially included side social feeds in the social feature of the page, but in keeping Netflix's business goals and visual design and my primary research in mind, along with preliminary user feedback, I quickly discovered that it did not flow as well as I had envisioned and made notes of this for further development.

I also referred back to my secondary and primary research, being reminded of what had failed in Netflix’s own attempt in having social features, and privacy was a big concern (and still remains one) for its users. So, I knew that in continuing forward with the design this was something I would have to be aware of and update in my designs.

VISUAL DESIGN

UI KIT
Although I was not creating any new branding for this project, it was still useful to assemble the UI design elements for Netflix to further ensure design consistency. I began this process by assembling a UI kit for Netflix’s desktop site, based on both the original app and my added features's designs.

Prototype

MOCKUPS

I incorporated the branding and UI into the wireframes and made significant revisions based on feedback and testing. Due to the timeline of the project, I focused on the desktop and mobile screens.
Samples of the updated/new screens can be explored further via the prototype, in the next subsection, below.

PROTOTYPE

I created a high-fidelity desktop prototype of the main user flow using Invision. This enabled me to put my designs to life, seeing how the interactions flowed in real time, allowing the new features to really come to life.
IDEATE

Test

USABILITY TESTING

overview & Goals
I tested the usability of the main user flow using the high-fidelity desktop prototype.  My main goals were to:
Through a variety of methods including in-person usability tests and remote tests with Google Hangouts screen share, I was able to assess the user experience according to my test goals.

I tested the prototype on a total number of five participants. The task was for each user to
locate how to remove a video from “Continue Watching” list, read through reviews for a video, locate personalized Lists page and explore the new Social page via viewing their inbox and following a user and their activity feed. The test was done remotely for three users (using screen-shares via Google Hangouts and Skype, and in-person for two (using my laptop). You can see the full usability test plan here.
KEY FINDINGS
Overall, users were able to navigate the site smoothly and complete the supplied task. Users expressed that these features were ones they wish Netflix would incorporate.

Overall impressions: Intuitive, innovative, fit seamlessly with current app

There was common feedback and confusion over the icon choice and guided action wording for removing a video from the Continue Watching list. This feedback (and others) was taken into account for iterations on the project.

I compiled all of the usability test data into an affinity map to visually represent successes, points for improvement and recommendations.

NEXT STEPS

Because of the short time frame and scope of the project, I designed only the key pages for the desktop version of the site. Next steps would be to develop finding users via the search bar, showing the flow of how to create and share lists, and implementing all of this for the mobile and tablet versions of the app.

Reflections & Looking Ahead

I found this project one that truly challenged my flexibility in coming up with solutions for users' needs and desires, while simultaneously adhering to the existing brand's UI and business goals. Adding features seamlessly into the Netflix app was great practice for me in terms of the discipline it takes to consistently ensure that the new screens added adhere to the preset visual design standards along with the company's business goals, while also ensuring that the screens and added features were the most usable for the users.

see more of my work

MIRROR

An e-commerce site

TAL TOURS

A redesign for a boutique travel agency

Bhuku

Designing an  iOS app for book lovers