Disney+ Watch Party Redesign
Shifted the focus of the Disney+ watch party feature from being show-centric to community-centric.
Duration: February 2021 - March 2021
My role: UX/UI Researcher + Designer
Category: Team Project Case Study
Team: Rickie Chen (me), Andrew Caballero, Kyle Burick, & Jorge Mendoza
Overview
In this project, we wanted to tackle the question of how we can innovate more ways to lead a creative social life amidst the pandemic. Watch parties for movies and TV shows have risen in popularity recently. However, we often find ourselves utilizing other third-party software to connect with our peers when using watch parties. We believed that the Disney+ watch party feature could be improved in a way where we can eliminate the use of other third-party software and foster a community from within the platform.
Below is a timeline of the project:
Problem
Throughout our personal experience and research, we found that there is a lack of community from within the Disney+ platform. For instance, there is no way to chat with other people in your watch party lobby and effectively coordinate what to watch next from within the platform. The experience is usually confusing and choppy, as users need to perform awkward transitions between different platforms just to use Disney+ with friends. From this, we deduced a problem statement that encompasses our goal:
Solution
Through extensive user research, interviews, A/B testing, competitive analysis & more...we concluded that to address the mission statement above, we are going to have to create a brand new sector of the Disney+ app called the watch party feature. It will be its separate entity where community building is encouraged, the focus will be on the user's watch party experience rather than having it only be catered around specific shows.
Below is a features overview of how our watch party feature will be integrated into the current Disney+ UI:
Research
I started this project off by doing preliminary research on platforms with watch party features. I focused on the user's experience with each respective watch party by gaging multiple online outlets, such as forums, reviews, and blog posts. On top of engaging with the community surrounding watch parties on the internet, I have also conducted primary research through interviews with who we believe are stakeholders of our product.
Competitive Analysis
Through our competitive analysis, I identified direct competitors of our product such as Amazon Prime Video, Netflix, and Hulu who all are big streaming platforms that offer group watch features in their respective ways. I noted down key criteria and did extensive secondary research with each company. You can find the preliminary notes we compiled for this competitive analysis here.
Primary Research: Stakeholder Interviews
After doing secondary research around the market for watch parties, we still need to know the primary users of our product and understand their needs & pain points. To do this, I drafted up an interview guide and conducted interviews on people who we deem are potential stakeholders. I made sure to follow UX interview standards by providing adequate task lists, avoiding asking leading questions, and prompting follow ups to questions with short answers. I tried to record the interviews down with as much detail as possible, noting important quotes and patterns amongst the interviewees, you can find the interview responses here.
Research Insights
Through our interviews, I collected many insights regarding how the current and potential users feel towards watch parties features on their streaming platforms.
1. Who is our stakeholders?
From our interview data, 5/12 interviewees stated that they are regular users of watch parties. 4/5 of those users are high school/college age students. 1 out of the 5 was a parent who connects with her son who is in college through watch parties. From there, I deduced our primary stakeholder being college age students and secondary stakeholder being parents of said students.
2. Would people be interested in an interactive mobile watch party?
I asked if people stream content on their mobile device and 6/12 said they do. Given the option, 7/12 of the interviewees are interested in some form of mobile watch party. This research insight was crucial in our design decision because it showed us that people were interested in some form of mobile watch party, which in turn influenced us to focus more in that direction.
3. What other platforms do you use in conjunction with watch parties?
Throughout the interviews, I discovered that most people were shocked that the current watch party system within the Disney plus UI did not support a chat feature. 6 interviewees indicated that they would like to see chat in some form within the platform. 4/12 interviewees uses discord to communicate with their peers, 2/12 interviewees uses zoom, and 5/12 interviewees uses other platforms to connect with their friends to schedule watch parties.
4. Other issues with watch parties in general?
An issue that came up overwhelmingly throughout the interviews was that people who had experience with watch parties all had syncing issues during the stream. 8/12 interviewees who had some sort of watch party experience in the past all indicated that there were times where they were out of sync with the rest of their party.
From these research insights, we were to able to determine who exactly we are designing for and their pain points. We developed a greater sense of user empathy and started to brainstorm solutions to their problem.
Personas
I created a main persona that is a college student in his early twenties who wants to stay connected with his friends amidst the pandemic. The reason why I made this main persona was because it was most common to an average stakeholder we interviewed. I created a secondary persona who is a mom that wants to stay connected with her children but struggles to figure out the functionality of watch parties throughout different platforms. This persona is based on 2 interviewees who fit this demographic. These personas serve as guides throughout our design iteration process as they are references to the user's goals and needs.
Storyboarding
We wanted to list out and understand potential use cases of our feature better so we drafted up storyboards to tell the user's journey. I noted different scenarios and pain points that would be solved with our feature. In this specific example, the user is comfortable in bed but also wants to connect with his friend easier with his mobile device. Our watch party feature could solve that by allowing him to watch the movie and communicate with his friend within the same platform.
Wireframe
I created multiple wireframes that showcased possible blueprints to solutions that could solve our stakeholder's needs. We settled with the wireframe displayed on the right as it incorporates the watch party feature to the Disney+ app in an organic way but also allows it to have individuality. The sub-features within this watch party design includes:
• Waiting lobby with chat before the movie
• Customizable settings page for communication
• Ability to invite people to the party
• Movie/TV show suggestions
• Vote casting system in the party lobby for the next movie
• Friends list
• Manual sync feature that allows people to catch up with one another
Low Fidelity Design
From there, we put together rough mockups that translates our wireframes into design sketches that showcases where the components of our feature will generally be positioned. By visually displaying the user flow of our feature, we were able to conduct user testing before further iteration to get a better sense of the functionality of our interface.
Low Fidelity Prototype
On top of designing screens that shows us where the placement of features will be, we also linked up the design to give us a more comprehensive look regarding how the interaction will look like. This allows us to conduct user testing on the interaction of the interface.
Low Fidelity User Testing
After prototyping our new screens, we reached back out to a few stakeholders that we interviewed who expressed interest in giving us feedback on design iterations. From there, we gathered key insights for our high fidelity iteration.
Feedback
• The navbar icons were a bit confusing, as some testers did not know what some of the symbols mean.
• Most users did not like the flow of having to go through the settings screen first before accessing the lobby.
• The voting system in the lobby was not made clear.
Solution
• Completely revamped the navbar with better signifiers and matched it to the current Disney plus design systems.
• Created a settings button, the main flow leads directly to an empty watch party lobby where users could schedule watch parties.
• Have better iconography and placement of the voting system in the lobby.
Style Guide
As we transitioned to Hi-fi, we spent a great deal of time compiling all the design system components that match the current Disney plus UI. This included having consistent colors schemes, buttons, typefaces, icons, and styling so our group watch feature could be better integrated within the already existing infrastructure. We completely revamped the current navbar and also included new features of our own, such as the mute/unmute button and the chat.
High Fidelity Design + Prototype
With our high fidelity designs, we transitioned our lo-fi iteration based on the feedback we got from our user testing and implemented all the style changes to match to the current Disney plus UI.
Feature 1: Group Watch Navbar
We shifted the current placement of the profile page button from the navbar to the standard top right corner of the screen. We replaced that with the group watch feature, which when clicked will lead you to an empty watch party lobby.
Feature 2: Schedule Watch Party
The schedule a watch party feature allows the users to schedule a session in advance and invite their friends with a shareable link. Once a friend accepts the invite, the scheduled stream will be saved in the lobbies tab and it will notify members of the party when the scheduled stream is about to start.
Feature 3: Join Watch Party Lobbies
You can browse through multiple watch party lobbies that you have been invited to and click the join button to enter a specific lobby. The lobby tab is located at the top of the screen and it will drop down a scrollable window.
Feature 4: Watch Party Lobby
Once you are in the lobby, you can either use text or voice chat to communicate with your friends in the lobby. You can also suggest a movie and the party can vote on which movies or tv-shows they want to watch. To vote, they can press either the thumbs up or down button on the movie posters, however, the host of the party ultimately has the power to choose which movie to stream.
Feature 5: Streaming Sync
A big user pain point from our research was the inconsistent sync of the watch party streams, people often find themselves being at different points of the show from their friends. To solve this, we created the sync button where the users can manually sync up with the rest of the party if the indicator on the bottom of the screen show that they are out of sync with the rest of the group.
High-Fidelity User and A/B Testing
Once again after our High-fi design and prototype, we reached back out to our stakeholders and did another round of testing with the completed interface. We conducted a series of tasks for the users to complete so we can test the intuitiveness of our interface. We also performed a round of A/B testing by showcasing different iterations of the same feature to the user.
A/B Testing: different ways to gamify the experience
One feature that warranted much debate was the voting mechanic within the watch party lobby. Was the thumbs down button intuitive? Where should the voting buttons be placed? Should there be a confirm movie button before the host decides to start the stream? These were all questions we wanted to answer for the A/B testing. After testing with the stakeholders, we found the most intuitive interface with it having an overwhelming amount of positive feedback. Some features in the final iteration includes:• Crown signifier indicating the most popular vote.
•Thumbs up and down button which gamifies the experience.
• Play button for the host to start the stream.
Hi-fi User Testing (quality of life changes)
With our interface being almost done at this point, we conducted one last user testing with certain tasks they needed to complete. From this testing session, the majority of the feedback we got was positive. However, some users did point out some quality of life changes we could implement. These include better signifiers to exit the chat feature and a pop up message telling the user that their invite link was copied.
In Conclusion...
Looking back at the entirety of this project: I learned to not only design for my personal pain points, but to also put myself into other users' shoes. The final iteration of the project would not have been for what it is if it wasn't for the multiple user testing session we had conducted and the valuable feedback we received from it.
Some key takeaways include:
• Detach from my own biases and design for the user.
• Take constructive criticism and feedback from stakeholders.
• Don't need to re-invent the wheel for everything (e.g styling).
• Gamifying the experience and fostering community engagement is the core of our redesign.
What would I do differently?
Overall, I am very happy with how this project turned out and grateful for my amazing teammates throughout this entire design process. If I had more time with this project, I would:
• Widen our reach with user testing and research.
• Scaling this feature to not only be a part of Disney plus.
• Look into more inclusive accessibility options for users with disabilities.
Final Prototype
