As a part of the Capstone project for the University of Michigan's User Experience Research and Design Specialization through Coursera, I designed a streaming service app that creates a custom browsing dashboard for the various streaming services a user has access to. As a part of the project, I conducted user interviews, created personas, sketched out solutions, and developed user-tested prototypes.
Coursera Project
5 Weeks
UX Research, UX Design, UI Design
The average household in the US is signed up for 4 streaming services, with 10% signed up for 5 or more. With services such as Netflix having upwards of 5,000 content titles, it can be overwhelming to find the right content. The process of finding a new show or movie often involves toggling between several different streaming services apps, pulling up reviews on their phone, watching trailers, and returning to their TVs to continue scrolling. This convoluted process takes time away that the user could be putting towards binge-watching the first season of their newly discovered show.
The goal of this project was to develop an application where users can input the streaming services they have access to, and be able to browse all of the content conveniently from their phone. The app will have information on ratings, cast, trailers, and more to fully optimize this tool as a content discovery resource. Users will be able to add shows to their watch list at varying degrees of priority to help stream the decision process, track what they’ve watched, and keep a list of their favorite content for go-to recommendations.
To gain insights into the landscape and needs of the prospective users, over the course of 5 weeks, I conducted an iterative research and design process to rapidly understand user needs and develop concepts for testing. This involved conducting research to understand the competitive landscape, assessing the needs of perspective users, developing personas and storyboards to help empathize with the users, and finally translating those needs into solutions at varying levels of fidelity which were iteratively assessed using methods such as heuristic evaluations and user tests.
For this research phase, I opted to conduct user interviews in order to identify the unmet needs of streaming customers. In addition, I conducted a competitive analysis of the different apps or services where people are currently getting streaming content information. Personas and storyboards were also created to empathize with the users and further understand their needs.
The goals of these user interviews was to uncover how users who are signed up for multiple streaming services browse for new shows or movies across multiple platforms, the problems they face trying to accomplish this task, and the tools, constraints, or external resources they use.
The needs finding assessment uncovered several key findings that proved useful to the development of this app. Overall, the current process for content discovery is quite convoluted, but users are used to their workflows. The barriers of entry were identified as a potential hurdle, so the more optimization the app can have, the better. With users having a variety of touchpoints and platforms that they need to shift between, there is a market for streamlining and consolidating this process.
How do users with 2 or more streaming services currently browse for new shows or movies across multiple platforms?
How do you typically decide what new show or movie to watch?
What sort of devices would you typically use to search for new shows or movies?
I’d like you to think back to the most recent time when you were browsing for a new show. Tell me about that experience and how is went?
What were you looking for? Did you have any criteria to narrow down the search?
What did you end up watching and why?
Overall were you satisfied with this experience?
2*
25–30
5-20 hours per week
2 or more
*Due to time constraints, only 2 participants were able to be interviewed for this project. I recognize that this is not a sufficient sample size to gain meaningful insights, but decided to continue with the process and use these interviews as directional findings for the first prototype.
A competitive analysis was conducted to gain insights into the landscape of what potential platforms or resources users are utilizing. This analysis was helpful in uncovering best practices as well as break down the advantages and drawbacks of each platform.
The user interviews and the findings from the discovery phase were used to extract several user needs that would set the foundational flows of the early prototypes.
Users want an optimized cataloging system
List of content users have/want to watch
Automatic consolidation of lists from multiple platforms
Users want a grid view instead of a single row scroll to browse faster
Add priority feature to movies to know what content is more important and help users decide what to watch next
Users want more detailed filters
Ability to sort by type of content, priority, mood/genre, rating, reviews, runtime, etc.
Accelerate the process to spend less time browsing and more time watching content
Users want more detailed content information
Information on any major awards the content has won
General discourse such as reputation, historical significance, cult classic, cinematic significance, etc.
Based on the user interviews, 2 personas were created to encompass the potential core users of this app. These users were categorized by Peter, the cinephile, and Gwen, the casual user. While I recognize that 2 interviews are not sufficient to develop well-rounded personas, this was a part of the capstone assignment and could be used as directional pieces to help develop the initial prototype.
Storyboards were created to help illustrate potential use cases for the app as well as help empathize with the users.
Based on the user needs assessments and competitive analysis, several areas of opportunity were identified to establish the key tasks of this app.
Browse
First and foremost, this is a content browsing tool. The main problem this app is trying to solve is the consolidation of streaming services. With this app, users will be able to search all available content from one location, so the home screen of the app should function similarly to popular streaming services. With even more content at their fingertips, more dialed-in filtering options will be important.
Streaming Service Identification
With the consolidation of content, the app will need to make it clear which content belongs to which streaming services. Since users have described pausing or subscribing to certain services at different times, the app should easily allow users to add or pause different services.
Watchlist
The ultimate goal of this app is to cut down on browsing time to allow users to spend more time watching content. Watchlists are an important part of this goal as they allow users to jump straight to a personalized list of content they want to watch. This app will further enhance this feature by adding levels of priority to the users' watchlists.
Content Details
Based on a survey of potential users, when asked about the most important factor to you when starting a new show or movie, the second most registered answer was how it looks based on posters, trailers, cast, etc. This information is important to have to mitigate the need for users to jump to other sites and apps such as youtube or IMDb.
Content Cateloging
Once users mark that they have ‘seen’ a show or movie, the app will automatically remove the content from your watchlist. By adding a few more cataloging features such as adding reviews, notes, and favorites, allows the users to document their cinema journey.
After sketching out a variety of ideas, I was ready to dive into developing key wireframes in Figma based on the design goals and tasks.
After sketching out a variety of ideas, I was ready to dive into developing key wireframes in Figma based on the design goals and tasks.
Two rounds of user testing were conducted in which users were prompted to complete some of the following tasks:
Two rounds of user testing were conducted in which users were prompted to complete a series of tasks. Below are some of the main tasks that the prototype supports:
Filter
"You are looking for a new movie to watch tonight. Find a thriller movie that was released in the last 2 years, that is available on Netflix."
Search + Watchlist
"Your friend just told you about how much they enjoyed Spider-Man: No Way Home and how you need to watch it ASAP. Search for the movie, and add it to your watchlist at the highest priority. To be sure it worked, check your watchlist to make sure that it's there."
cataloging
"You’ve watched Spider-Man: No Way Home and want to mark it in your catalog. Mark that you’ve watched the movie, rate it 4/5, and add a review. To be sure that it's there, find the review in your profile."
Services
"You’ve just purchased a subscription to Prime Video. Add this service to your list so you can view content from that platform as well."
Reviews
"You typically look at Rotten Tomatoes for reviews. Find the Audience and 'Tomoatoer' scores on Rotten Tomatoes for Spider-Man: No Way Home."
Favorites
"Your friend is looking for a new recommendation. Go to your liked content to find a show to recommend them."
From the med-fi prototype, a heuristic evaluation was conducted using Jakob Nielson's 10 heuristics. The evaluation was conducted using notes on the Figma prototype which was then translated into a matrix with the most sever violations pulled out as the key finding.
The design system set the foundation for the user interface of the app, streamlined the design process, and created consistency with color, typography, and UI elements. With a variety of colors and graphics from the movie thumbnails, it was important to keep the colors and typography clean and simple.
Midnight
#1f232f
AAA 15.67
White
#FFFFFF
AAA 18.72
Black
#101218
AAA 18.72
Green
#31DEA0
AAA 10.77
This high-fidelity prototype supports the majority of the primary tasks established from the design goals and contains all of the main pages users would potentially interact with. Scan the QR Code to open the prototype in Figma on your phone.
Looking back through this project, while I am proud of the outcomes, learnings, and skills I gained throughout the process, I recognize that there were certain constraints. Time and resources were a constant hurdle. When it came to user interviews and testing, I called upon my social circle which potentially created bias among my recruiting on top of already having a low sample size. I also recognize that UX design is an iterative process that needs constant feedback and analysis. While I've concluded with a high-fidelity prototype that captures several key user flows, in reality, this product is far from a minimum viable product. From onboarding to error states, there are several other features and flows that need to be iterated on, tested, and evaluated for the next steps of this process.
