Case study, UX/UI
HBO Max
.png){kind=small}
Redesigned the HBO Max Kids design system across all platforms, and helped establish a visual brand language and identity for it
Type
Graduate Project, Visual Design Strategy, Product Thinking
My Role
UX/Interaction Designer, Visual Designer
Tools
Figma
Time
6-Weeks (2021)
Privacy Setting and Onboarding
-
Using elements like colors and forms that aligned with the parents’ nostalgia to bring more viewers alongside the kids
-
Instill the sense of childhood in the interface and bring this sense to the parents when they are watching and interacting with HBO MAX Kids
Final Solutions to Increase Sign up family plan
Home Screen
Focus on simplicity, use sharper colors and move away from dark themes and backgrounds to make the interactions enjoyable and memorable
Onboarding
Add more motion in the onboarding process to make the experience more fun, and make better parental controls and TV programming interface
Research to Further Investigate Problems & Opportunities
Currently, the app is highly rated, but it is underutilized by the general public compared to YouTube kids. To find out why this might be the case, I analyzed their mission statement and found out the current app design and services do not fully reflect their mission statement of including “young and diverse audiences”.
Also, based on the competitive analysis I noticed Google is a great example that has a brand Identity that applies to different products including Youtube kids, you can see this identity lay down in different contexts and still maintain the brand language. In HBO max kids we can’t see this. The lack of identity in this system is noticeable. You can not differentiate the kid’s design system from the general audience design system.
When further investigating, I found out from reviews that 80% of the users are willing to use YouTube kids instead of HBO Max kid, because it has privacy settings for different age groups.
These findings state that while the app is resourceful for users, it falls short of reaching its target audience.
Define MVP
For the MVP, I decided to Redesign the kid’s design system to leverage that on all different platforms and help HBO max kids to have and keep their visual language brand identity. To apply it to different platforms across connected devices mobile and web.
User Persona
Based on the insights from research, I synthesized and developed a user profile highlighting user needs and goals and created user stories to understand major scenarios.
.png)
Jimmy's Family
"Love to watch with our kids"
Goals:
Having the quality of time together when watching TV together.
Pain Points:
-
Parents are worried about privacy settings based on different age group
-
Parents want to feel nostalgic when watching kids' movies.
-
They don't feel connected
Problem Statement
Every streaming company has two versions of the design system, the general audience design system and the kid’s design system. How might we
help HBO MAX KID establish a visual brand language and identity?
Business Goals
Considering both our target user, Jimmy's family, and the business side of the app currently underutilized by the general public, I identified 3 goals:
-
Amplify the brand’s visuals to increase the adult audience’s curiosity.
-
Enhance ease of use with simplified content to bring more viewers alongside the kids.
-
Increase user engagement with improved features.
Moodboard for New Visual Strategy
Keeping my first goal in mind, amplifying the brand’s visuals to increase the young audience’s curiosity. I deliberately chose colors and graphic elements that help create stronger stylistic choices as a way to amplify the brand’s visuals and interactivity.
.png)
Final Moodboard
Style Guide
Final Design
Other Execution for Future App Development
To add business value to the company I thought healthy popcorn would be a good match while kids are watching TV.
Lesson Learned
-
An effective way to build a design strategy by understanding the business objectives and user goals and translating these needs into meaningful design solutions.
-
How to create a cohesive Design Language across multiple media types
-
How to analyze and critique design work across multiple media types.