Redesigning the way we socialize — A Netflix Party case study
Redesign of the current Netflix Party chrome extension
Design Interactive Spring ’20 Cohort Project.
Background
Netflix Party first came to our attention because of the traction it was gaining from COVID-19. Due to a lot of people having to stay home, Netflix Party gained popularity as users try to find a way to still stay connected.
Over the course of 6 weeks, our team redesigned this chrome extension to be more user friendly. We presented our final product to a panel of industry professionals during Design Interactive‘s first-ever Final Presentation Day.
Awarded: Best Visual Design, Most Customer-Centric Experience, and runner up for the Audience Choice Award.
Who are we?
The Challenge
The Chrome extension Netflix Party is a social essential during COVID-19. Despite its growing popularity and user base, it has a rating of fewer than 3 stars, with many users expressing their frustration with the overall experience. Our team wanted to break this down — how can Netflix Party be improved to create a better user experience?
The Solution
Our version of Netflix Party was re-designed to expand on the current features and add additional ones that we thought were fitting, based on the research that we conducted. We have observed that Netflix Party has many reviews from users who struggle with the user experience, so we wanted to implement more features and expand on current ones to create a more interactive and user-centric experience.
Overview of the Current Netflix Party Experience
Netflix Party is a Google Chrome extension that allows Netflix users to watch Netflix movies/shows in sync with their friends while chatting.
Design Sprint Timeline
User Research
Surveys
We created and sent out surveys to better understand our users — questions ranged from their age and current life stage, to who they usually use Netflix Party with, to any additional features they would like to see. Of the 50 responses we received, a large majority consisted of college students. We used the survey responses, as well as the context from our user interviews, to guide our affinity mapping.
Individual Interviews
We conducted a total of 8 user interviews. During these interviews, we asked the users to show the process of using the extension from starting a party in order to replicate the use of Netflix Party and their behaviors and instincts in a realistic setting. Aside from this user testing, we also asked questions that ranged from general questions like why they use Netflix Party, to specific ones that addressed how they felt about certain features. From these interviews, we found that users appreciated reaction emojis and wanted additional features that the current version wasn’t providing.
We conducted a total of 8 user interviews. We broke down our interviews into:
- General questions about their use of Netflix Party, from their motivations to the way Netflix Party fits into their overall experience and user goals.
- Observational user testing, where we asked the users to replicate the process of starting a party to the end, allowing us to observe their behaviors and instincts in a realistic setting.
- Follow up questions about that process and insights about their experience, as well as address how they feel about certain features.
From our interviews, we were able to uncover multiple insights about the user experience and how it could be improved.
- Video Chat + Audio: Users wanted a personal experience to interact with friends amidst social distancing orders.
Users appreciated seeing and listening to friends face-to-face for an instantaneous interaction. They desired a more meaningful interaction among friends to communicate through the extension.
“I don’t like that you can’t video chat so I might as well use messenger or messages, or rather watch a movie through zoom call. It’s annoying to keep texting while watching a movie.”
“I don’t like that you can’t video chat so I might as well use messenger or messages, or rather watch a movie through zoom call. It’s annoying to keep texting while watching a movie.”
- Pause Alert: Users wanted a caution statement before pausing their screens to avoid having all other screens paused, leading to potential confusion and embarrassment.
Often times while watching a movie or show, it is common for users to pause the show (e.g. take a bathroom break). However, on a shared streaming platform like Netflix Party, it can cause confusion on one end, and embarrassment on the other, if a user pauses the show for everybody. This can be avoided with a simple warning that the user views before pausing the screen on all ends.
“It makes sense that when one person pauses, it pauses for everyone. But I could have used a warning because I accidentally stopped the lecture for my entire class and I felt really bad and embarrassed.”
- Navigation: Users wanted the ability to be able to view screens in different sizes according to their likings.
Users found the responsiveness for Netflix Party to be confusing. They expressed frustration that the chat bar reduced the size of the video screen and that there was no clear option to view the show in full-screen or minimize the chatroom.
“The screen setup isn’t the best. It reduces screen size for the actual content by a lot.”
“There is no way to minimize the Netflix Party chat window and it’s very annoying especially if you have limited screen space.”
- Profile Change: Users wanted a more personalized profile with their own pictures.
The current options that Netflix Party offers for profile pictures are minimal and generic. Users wished for the option to use their own pictures instead to have the ability to customize their experience.
“I wish I could add my own profile picture instead of having to choose between the ones Netflix Party has.”
- Reactions: Users wanted a quick and easy way to express themselves.
While watching a movie, it is instinctive for users to have reactions to different scenes. However, because the scenes are fleeting, it is not convenient or realistic for users to convey all of these expressions. Users wanted a quick way to express their feelings about what was happening in the movie/show and continue on with the movie without having to dedicate time and getting distracted.
“I wish Netflix Party would implement emojis or reactions so that its quick instead of having to type in chat.”
“I want to see other people’s reactions over the extension but if you could have like Facebook implements when you’re steaming live with reactions.”
- Starting a Party: Users wanted a clearer way to create a party link and join a party.
Users currently find it confusing to navigate this extension when they are unable to start and join a party efficiently — a multi-click process has proven to be difficult for efficient functionality. Introducing a centralized homepage where users can navigate to create and join parties using links allows users to find their options clearly and join from within the app, rather than from their bro.
“When someone sends you the link to start a Netflix Party, it isn’t clear that you have to click on the NP icon first to be able to join.”
Literature Review
During our user interviews and survey responses, we found that a lot of users wanted a reaction feature. Before diving into the creation of this feature, we conducted and explored the research behind existing versions of the reaction feature.
We reviewed past case studies and literature reviews on Facebook’s reaction feature (one of the interviewees mentioned that they appreciated the option, and she specifically referred to Facebook’s — Facebook’s reactions itself was a big hit, and had a lot of existing research about it). We specifically referred to these articles from Buffer Blog and Hootsuite:
From diving into the Facebook reaction studies, we found that reactions are new ways to measure sentiment and to gain a better understanding of users. Additionally, in order to be effective, reactions should be universally understood, widely used, and expressive. To better understand which reactions should be used, we researched into what the universal emotions were, and found 7 — happiness, sadness, disgust, fear, anger, contempt, surprise. We wanted our reaction emoticons to capture all aspects of these universal emotions, and ended up creating these:
User Persona
After collecting data from our survey and interviews, we chose to make our persona a female college student, around the age of 18–22, who uses Netflix party to socialize. We chose TikTok as one of the brands and influencers because multiple people mentioned that they found out about Netflix Party through social media platforms.
Ideation
Affinity Mapping
After gathering user insights, we brainstormed solutions through affinity mapping on Figma by individually writing down all of our findings into virtual ‘post-its’. We then consolidated our ideas, categorized them, and reorganized any repeated or redundant post-its. After spending time discussing each category we ‘voted’ on key features by adding green stickers.
Points of Improvement
After closer analysis of the pain points in our affinity mapping, we identified six features to redesign or add to improve the experience of the existing product.
- Starting a party → Redesign how to start a party for a more user friendly and personalized experience.
- Profile Picture → Allow users to have more options including uploading their own images.
- Pause Alert → Integrate a warning for users when pausing the video for all parties.
- Live Reaction → Allow users to quickly express their feelings during their party.
- Minimize Chat → Create a clear way for users to minimize sidebar options to display different features.
- Video Calling → Allow users to have a live-time experience through video calling with mute options.
Sketches
During the second week we each made rough sketches based off of the features we highlighted from our affinity map. Here are our sketches (in order) Cheryl, Ying, Maysnow, and Alekhya.
Lo/Mid Fi
After forming a clear idea about the features we wanted to include, we laid out all our ideas and were able to work through the technicalities. The following week we started finalizing edits and refining the features.
We used these mid-fidelity screens to conduct user tests. We each reached out to 1–2 people and interviewed them with our newly implemented features.
Design System
Since the Netflix design system is not publicly available we retrieved colors and recreated icons and components from Netflix and Netflix Party’s existing UI.
Solutions
1. Starting a Party
We simplified the steps and created a more user friendly experience. In the redesign, the link sharing page serves as the landing page. After a user test, we decided to add a preview button that allows users to have a glimpse at what they are watching and how large their party is.
2. Profile Change
Profile icons and nickname changes were redesigned to minimize the two step process into one step for ease and efficiency. Users can also upload their own profile pictures.
3. 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 once users feel more comfortable with the extension.
4. Live Reaction
To better understand reactions to implement, we did a literature review and explored universal emotions and Facebook’s reactions. We custom designed our own reactions in Adobe Illustrator.
5. Custom Sidebar + 6. Video Calling
We designed quite a few micro interactions as part of customizing the sidebar. The users would now be able to minimize and expand the chat box and video call to fit their needs. Through our research, we also found that users’ greatest pain point was not being able to have a more personal interaction. We conceptualized and implemented a video chat feature so that users can physically see and speak with their friends while simultaneously streaming videos. We utilized the space at the top of the screen for chat notifications and users video preview when the sidebar is minimized. We included personal video and mute buttons for customization. This project is prototyped for a 2 way video but we decided to keep the max video screens to 4 people to maximize functionality.
Minimize Chat & Video → We discovered that the 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 Fullscreen Mode → Currently, Netflix Party has an option to hide the chat through the initial steps of activating the party, however, it is drastically overlooked by many users. We redesigned to incorporate a minimize sidebar icon in Netflix itself. Once minimized, it would prompt to show notifications and the user’s personal video on the black bar above the movie.
Takeaways
- Prototyping & Figma
- Holistic understanding of design sprint and design process
- Working collaboratively while remote
- Having different strengths
Future Steps
- Include a user on-boarding process for new users to understand the features
- Expanding to other streaming platforms
- Mobile app
