Recommendation Feature for Hulu
Adding a feature to a streaming app
Project Overview
Background
During the pandemic I have spent a shameful amount of time watching Netflix, Hulu and other streaming services. Hulu has always impressed me with the beautiful artwork, gradients and of course - they have The Handmaid's Tale.
With so many shows and movies available for streaming it has become overwhelming to chose what I want to watch tonight. I run a list in the Notes app on my phone with things I hear about that are worth watching. I thought - why not try and better the content discovery experience on Hulu by adding a recommendation feature to the app. That way me and my friends can recommend shows to each other within the app.
Objectives
- Add a recommendation feature that allows users to receive and send recommendations within the app
- Increase user engagement by offering content that is more likely to be watched.
PROJECT
Adding a feature to the app,
Concept UX case study for Designlab
ROLE
UX / UI Designer
TOOLS
Figma, Adobe Photoshop, Notion, Miro
TIMEFRAME
August 2021
TEAM
Self-directed, with feedback from mentor and peers
Problem
- "The paradox of choice" - too many shows to chose from, users get overhelmed
- Lack of social interaction during the pandemic
- No place within the app to effectively store all the recommendations that you receive
Solution
- Create a recommendation system that will allow users to see what their peers recommend to watch
- Create playlists where users can gather their favorite shows and share within the app
What is Hulu?
Hulu is the premium streaming service offering live and on-demand TV and movies. Hulu is the only service that offers viewers instant access to current shows from all the major U.S. broadcast networks, libraries of hit TV films and series, and acclaimed Hulu Originals, like the Handmaid's Tale, The Act, Little Fires Everywhere and others.
Design Process
01 .Research
Secondary Research
Streaming services industry is driven by data. For my secondary research I dove deep into the reports by industry thought leaders like PricewaterhouseCoopers (I used to be an intern there!), Nielsen and various articles on the topic.
All of the streaming platforms spend much time and effort perfecting the machine-learning and recommendation algorithm. However, my sources have highlighted the importance of human recommendation.
Recommendations by friends and family has been cited as the second largest factor influencing viewer’s choices (Nielsen, Total Audience Report, 2018).
Competitive Analysis: Social Features
Most of Hulu competitors are actively implementing various ways of boosting user engagement, however nobody has implemented the personal recommendation system or playlist creation feature just yet!
Netflix Teleparty (former Netlfix Watch Party) was a first co-viewing feature and an answer to the pandemic isolation that so many users had to experience.
HBO Max Mini is a co-viewing feature allowing users to stream the pilots of select series with up to 63 other Snapchatters.
Dinsey + Group Watch has rolled out in September 2020 and allows for up to 7 Disney plus subscribers to simultaneously view and react to a show.
Sharing has only recently become a feature on Disney Plus.
Prime Video Watch Party has rolled out in June 2020. It is included at no extra cost with a Prime membership.
User Interviews
"It was great when my friend made me a Spotify playlist for the plane, it would be cool to have something like that for shows."
Participants
- 6 participants, 25-32 y.o
- New York, Los Angeles, Orange County, Chicago
Main Pain Points
- Users hate that Hulu deletes the episodes or skips over entire seasons
- Half of the users finds recommendations to be not relevant
- Too much content to chose from, even keeping up with just several shows is overwhelming
Key Research Insights
- Word of mouth or friends recommendation is one of the most popular ways of learning about shows to watch
- Most people use HULU to keep track of their favorite shows from broadcast networks (Scrubs, Bob’s Burgers)
- A third of the interviewees like putting some old show on or a show with no real story (trivia or reality) as a background noise
- About 60% of the time users already know what they want to watch when turn HULU on, 30% of the time - they browse looking for something to catch their eye, often turning to something already familiar in the end
User Persona
After empathizing with my users I created a persona for Mary - animator and an aspiring software engineer. She spends a lot of time at home and loves to rewatch old shows.
02 .Strategy
How Might We Statements
- How might we boost user engagement through the app?
- How might we offer better suggestions by connecting users to their community?
Product Roadmap
I decided to introduce two features that seem to be answering HULU's needs: a recommendations feature and a playlist creation feature.
These two social features would be available to anyone who decided to connect with fellow users through the app.
Site Map
I decided to integrate these two features into the Hulu app site map in the most smooth way possible. The Recommended by Friends will be on the home page amongst other categories and Playlists will be in the My Stuff, where the user already gets to personalize their experience.
See the full Site Map03 .Design
Wireframes
When making wireframes, I made sure to use the existing Hulu information architecture. Hulu is already an established brand , so my job was to make sure my ideas fit in well.
Feature 1. Making a Recommendation
Feature 2. Creating and Recommending a Playlist
The Designs
Here are some of the main screens I created: for the recommendation system and for the playlist creation. I tried to fit it in the HULU UI so that it is seamless . It involved studying the current designs and thinking of the best way to fit the new flow in.
Recommend a Show
Create a Plalist
Style Tile & UI Kit
HULU has a brand typeface - Graphik. However, it's an expensive typeface, so I chose the free alternative closest to it - Work Sans.
Style Tile
UI Kit
I had to create certain components that didn't exist within the Hulu design system: autofill suggestions and input fields, as well as update the already existing bottom sheet.
04 .Prototype
Usability Test
Tasks
- Find the show Homeland and recommend it to Lisa Smith
Questions
- How easy was it to recommend a show?
- How likely is it that you would recommend a show to your firends through the app?
- Would you like to see what your friends are watching on the app?
Participants
- 5 participants
- Method: Maze
Key Outcomes
- Easy navigation, 80% of users were able to complete both tasks
- For 80% of the users it was relatively easy to recommend the show, however some quick adjustments could be made to make it even easier
- Most users are very likely to recommend the show to their friends through the app
- 60% of the users want to see on the app what their friends are watching
Final Prototype
I analyzed the heat maps on the Maze report and came to a conclusion that one major adjustment needs to be made at this time is on the Show Details page. User testing showed that it wasn't clear where to find the Recommend a Show CTA.
Hulu app already has a Share icon, so users kept clicking either on that or on the "Jane Gregory and 5 others recommend this to you" copy.
Before
First Version
Final Version
The final version showed much better results during the final round of testing. It showed no misclicks compared to 80% misclicks that were reported before.
Key Takeaways
User Testing is invaluable! I'm glad I put aside enough time to be able to implement at least some changes before submitting final prototype. The user feedback was loud, clear and made my project better.
Thank you for reading the Hulu case study!
