Netflix Party case study
User-centered design approach for an interactive and personal experience
Type
Role
Time
Team
Tools
Methods
UX Design Associate
Lead UX research, UI/UX design, Web design
6 weeks (May-Jun 2020)
Me, 3 Designers
Figma, Google suite
User survey, Semi-structured user interview, User persona, Competitive analysis, Affinity diagram, Mockups, Usability test, Prototype
Background
Davis Design Interactive is the University of California, Davis’s first human-centered UX design consultancy organization. I was 1 of the 25 associates of the very first cohort in 2020, which has now grown to 1 of the largest student-run organizations on campus with 300+ students. As a cohort member, myself and 3 other designers formed a team to complete an exploratory case study where we conducted research on the Netflix Party chrome extension and redesigned it to be more user-friendly.
Impact
We exercised a 6-week design sprint and presented our designs to a panel of industry professionals during our final Presentation Day, where our designs were awarded Best Visual Design, Most Customer-Centric Experience, and the runner-up for Audience Choice Award.
Design process timeline
Context
Due to the COVID-19 pandemic, the world began operating virtually—the Chrome extension Netflix Party (now named Teleparty) came to our attention because of the traction it was gaining from people attempting to maintain social interactions while sheltering in place. The platform facilitates virtual social interaction by allowing its users to share a connected experience via chat while watching Netflix together.
🔎 Challenge
Despite its growing popularity and user base, Netflix Party has a rating of fewer than 3 stars. Many online users expressed frustration with the overall user experience, so our goal was to research into what additional features we could implement while expanding on current ones to create a more interactive and user-centric experience.
💡 Solutions
Through the course of our 6-week design sprint, our team received 50 user survey responses, conducted semi-structured user interviews with 8 of the survey respondents, created user personas to consolidate our target audience's needs, goals, and behavior, analyzed competitor features, collaboratively built affinity diagrams, designed and conducted usability tests with 8 users, and integrated our findings into a cohesive design prototype. We then presented this to a panel of industry professionals during our cohort’s final Presentation Day.
💭 How might we improve the platform to create a more engaging user experience?
The current experience
Netflix Party is a Google Chrome extension that allows Netflix users to watch movies/shows in sync with their friends while chatting. The current ratings highlight a need for user-centered design solutions.
Understanding users
First, to gain a general understanding of our users, we created and distributed user surveys and received a total of 50 responses. Our survey covered the following topics: Demographics, Netflix Party usage, Additional requested features, Likert scale answers.
From our results, we found that a majority (77%) of our respondents feel the need for additional features for an enjoyable experience. In addition, 90% of our respondents found the pause feature useful, while 72% found the chat feature to be useful. Nearly all respondents used it as a way to maintain their social lives.
Diving deeper
We then conducted semi-structured individual user interviews with 8 of our survey respondents to dive deeper into the previous questions. Our interview protocol covered:
- Usage and motivations
- E.g. Why do you use Netflix Party? Who do you usually use it with?
- Observing the user flow
- E.g. Could you share your screen and show me how you would usually begin a party?
- Specific features and follow ups
- E.g. Is there any way that Netflix Party isn't currently satisfying your needs? If so, in what aspect and why?
Key findings
From our interviews, we uncovered multiple insights about the user experience, how it could be improved, and feelings about certain features and aspects of Netflix Party.
- Video Chat + Audio: “I don’t like that you can’t video chat so I might as well use messenger, or watch a movie through Zoom call. It’s annoying to keep texting while watching a movie."
- Pause Alert: “... I could have used a warning because I accidentally stopped the lecture for my entire class and I felt really bad and embarrassed.”
- Navigation: “There is no way to minimize the chat window and it is very annoying, especially if you have limited screen space."
- Profile Change: “I wish I could add my own profile picture instead of choosing between the ones Netflix Party has.”
- Reactions: “I wish Netflix Party would implement emojis or reactions so it's quick instead of having to type in chat.”
Starting a Party: “When someone sends you a link to start a party, it isn’t clear that you have to click on the NP icon first."
Consolidating user research
We created user personas to consolidate our target audience's needs, goals, and behavior based on what we observed from the previous surveys and interviews.
Analyzing competitors
In the previous steps, we found that many users wanted a reaction feature. One of our interview participants mentioned the idea of the feature, specifically referring to Facebook’s reactions. Before creating this, we read articles from Buffer Blog and Wired on Facebook’s feature.
Further research into competitor platforms relayed that reactions are new ways to measure sentiment and to gain a better understanding of users. To be effective, reactions should be universally understood, widely used, and expressive. We found there to be 7 universal emotions— happiness, sadness, disgust, fear, anger, contempt, and surprise.
Facebook's feature
Affinity diagrams
We then brainstormed solutions by individually writing our findings into virtual ‘post-its’ and removing redundant ones. After discussing each category, we selected the recurring features to proceed with. Time was our biggest constraint that we kept in mind when choosing.
Points of improvement
Analysis of our users’ pain points led us to identify 6 overarching themes, and we brainstormed ideas for targeting each theme.
Theme
- Lacking a video chat setting
- No warnings or alerts before pausing
- Unresponsive interface
- No options for profile customization
- No quick and intuitive ways of expression
- Confusion surrounding how to create and join a party
Opportunities
- Video chat feature, Personal video and mute buttons
- Warning when pausing , ‘don’t show again’ option
- Minimize/Expand the chatbox and video call as needed, Visible chatroom features, Minimize sidebar icon
- Profile image uploads, Simplify the process
- Emoticons or reactions
- Clarify the steps, Link-sharing page as the landing page, Preview button
Bringing our findings to life
We individually made sketches based on the features highlighted from our affinity diagram and discussed, as a group, on what to move forward with. Then, we designed the first few iterations and reached out to 8 people to conduct usability tests.
Usability testing
Our user tests confirmed that most of our design choices were intuitive. However, we discovered that we should add a preview button that allows users to have a glimpse at what they are watching and how large their party is.
Design solutions
Starting a party
We simplified the steps and created a more user-friendly experience. In the redesign (right), the link-sharing page is the landing page.
Profile change
Profile icons and nickname changes were redesigned (right) to reduce the process. Users can also upload their own profile pictures.
Pause alert
When the user pauses, a reminder appears with options to close the box and continue or pause the video. A ‘don’t show again’ option is available.
Live reaction
We custom designed our own reactions in Adobe Illustrator and made them accessible through an icon at the bottom.
Custom sidebar + video calling
We designed a few micro-interactions as part of customizing the sidebar. This following is prototyped for a 2-way video but we decided to keep the max video screens to 4 people to maximize functionality.
- Implemented a video chat feature for users to see and speak with their friends while streaming videos
- Utilized the top of the screen space for chat notifications and users' video preview when the sidebar is minimized
- Included personal video and mute button options.
Minimize chat & video
We discovered that users struggled with finding the show chat feature so we redesigned the chatroom feature to be visibly available. We also expanded the videos to compensate for the extra space.
Hide sidebar to full screen mode
Currently, Netflix Party has an option to hide the chat through the initial steps of activating the party. However, it's drastically overlooked by many users. We redesigned it to incorporate a minimize sidebar icon in Netflix itself. Once minimized, it would show notifications and the user’s personal video on the black bar above the movie.
Design system
Since Netflix and Netflix Party both don't have their design system available to the public, we had to recreate the color scheme, icons, and other components from the existing user interface. Creating new features meant sticking to the layout of the design system, so that was an interesting challenge as well.
Personal Takeaways
This project was the first time I used Figma as a collaborative tool, so I learned a lot about its properties — properly using auto layout, when components should be used, and familiarizing myself with its prototyping features. Having a heavier research background, I guided my team in our research aspects while learning more about UI design concepts.
This project taught me that instead of being so focused on each feature, I should opt for a user-centric mindset that would naturally guide me in knowing which features to improve on. I also learned the importance of having a design system to expedite the design process and maintain consistency. Overall, I gained a more holistic understanding of the holistic design process, particularly in a remote setting. It was an honor to be involved as a cohort member, and later serve in a leadership position, of UC Davis' very first UX organization!