Project Overview 👀
HBO Max is a new streaming service owned by Warner Bros. The streaming service launched in 2020, and contains media content of HBO, Warner Bros, Cartoon Network, and other related brands. When I wanted to rewatch a specific episode of Insecure from my mobile phone, I found it hard to identify the episode I was looking for. For this case study, I have conducted user research and created redesign solutions using Figma to improve the user experience.
*Disclaimer: I am not affiliated with HBO in any capacity.
Role: UX/UI Designer
Duration: 2 weeks
Motivation & Goals for Redesign 🎯
Motivation: Improve the overall user experience by creating a more efficient interface.
Personal Goal: Improve my UI skills and familiarize myself with Figma
Original Interface 📱
On the original interface, when you choose a series to watch, it gives a list of the episodes with only the thumbnail of the episode. This made it hard to identify which episode I wanted because there is no episode description on the initial page. Instead, users are directed to another screen that shows the episode description. Prolonging the user experience of enjoying the episode.
Usability Testing 👩🏾💻
To ensure that I was not the only one with this user issue, I conducted five user test sessions. Each session was timed to evaluate the efficiency of the current interface design.
Scenario: During your lunch break, you decide to watch an episode of "Insecure" on your phone
Task: On the HBOMax app, locate "Insecure" and find the episode where Issa explores casual relationships; Molly learns some new truths; Lawrence stumbles on news
Results: The average time for the users to complete the task was 4 minutes and 12 seconds. I noticed that the participants clicked on each episode and read the description to complete the task. The current design prolongs users from finding the specific episode they are looking for and causes frustration at a time of relaxation.
HBOMax Usability Testing
HBOMax Usability Testing
Proposed Solution✨
Using Figma, I created a redesign solution that will improve the user experience of the HBOMax mobile app.
Adding the episode description on the initial page will reduce the time it takes for users to find the episode they want, thus creating a more efficient user experience.
💥 This design includes an episode description on the initial page💥
Self-Reflection 🫶🏾
With this being my first case study, I was able to grow as a designer. This case study allowed me to sharpen my UI skills and familiarize myself with Figma. Since the Case Study, I have shown many HBOMax users my proposed solution and all were very satisfied with my design.
