Prioritizing the needs of Crunchyroll users
More and more people each year are turning to content streaming as a main form of home entertainment.
In addition, the COVID-19 pandemic has given people, especially western audiences, more time exploring new
content to enjoy from Korean dramas and even Japanese Anime.
I spent one week examining the west’s leading Anime streaming platform, Crunchyroll, and identifying existing problems
that’s currently producing a poor user experience. By the end of this redesign, I prodcued design solutions that could increase user satisfaction and
potentially benefit the business.
Project: Content streaming
Team: I’m alone 😔
Timeline: 1 week | August, 2020
Role: UX/UI, Strategy
Tech: Figma, Adobe Photoshop
Crunchyroll users have no control over their content playlists and are unsatisfied with the outdated UI.
Crunchyroll is not up-to-date with current design trends, compared to other content competitors, such as Netflix. In addition, users can’t
organize their favorited content into playlists and are often confused with unspecified content titles.
An updated layout following current design trends and a customizable playlist feature.
MODERN DESIGN LAYOUT
Modern and eye-catching home page.
The home page was updated to current design trends for content platforms. In addition, it highlights various Crunchyroll features,
from viewing Anime content to visiting their merchandise store. With an updated design, in theory, users are more inclined to use Crunchyroll
more due to eye-catching visuals and a sense of trust towards the platform.
Have full-control over your playlists.
The new and updated playlist feature allows users to take command of their favorited content through customizable playlists.
It’s now easier to create new playlists for specific content. Want to make a playlist that houses all your favorite tear-jerking romantics? Done.
SERIES INFO PAGE
Pick up where you left off.
In addition, to provide the highest quality content service, the shows page not only features clean visual design, but it’s also intuitive for optimal user experience.
Synthesizing secondary and primary research
To identify underlying problems I conducted secondary and primary research to examine common pain points,
market trends and competitors.
A UI update
• Survey responders commented that the current layout is "old" compared to other platforms such as Netflix.
• Survey responders mentioned they preferred dark mode to watch Anime as it's easier on their eyes.
Users want a way to organize their queue lists
• 81% of survery responders complained that they can't control their playlists. In addition, the current functionality is
confusing and the copywriting of episodes misleads users into thinking they saved the wrong episode.
I researched direct and indirect competitors to see how they approached their streaming experience.
Ideating the experience
With all the data I gathered from my research, I mapped out Crunchyroll’s current architecture and identified specific pages that directly affect the user experience.
Crunchyroll’s current information architecture.
Identifying the pain points
The home page is the user’s first impression of a product. My interview results mentioned this page is one of the reasons why the website “feels old.”
The queue list indicated user frustration due to its lack of usability. Based off from the image above, content is saved based on the what was last favorited.
In addition, content titles are misleading as it only mentions the name of an Anime and its episode.
For example, Sword Art Online has multiple seasons and each have seperate titles, yet it just says the general name and the episode number. Users are forced to
“think” about what season is episode 15 corresponding too.
With UX problems found in this feature, I knew I had to redesign it to provide context for users and give control over their playlists.
Finally, the shows page could have a touch up on its hierarchy. While the video is the first thing users will look at and there are clear call-to-actions, all visual elements feel
contained inside a box. I needed to give it a modern look and provide breathing room between design elements.
Designing the wireframes
During the wireframing stage, I kept in mind to keep the experience intuitive and all of the visual elements modern.
Final direction of the hero section of the home page.
Final direction of the queue list, focusing on the user experience of keeping content alphabetically organized and included options of creating playlists and filters.
Final direction of the shows page layout. I enhanced the hierarchy by giving space between design elements and giving it a modern layout.
PROTOTYPE & TEST
Putting my solutions to the test
To validate my research and designs, I tested with 4 participants. I prepared a short task to test the navigation experience. In addition, I asked for their
feedback on the new queue list and the overall UI layout.
View the prototype
Overall task completion rate
"Easier to use than what Crunchyroll has right now."
- Tester feedback
"Smoother. Feels like Hulu."
- Tester feedback
Reflection & Learnings
As one of my first UX projects, this opportunity leveled up my UI design skills for web applications and my understanding of the UX process, especially UX research.
If I could go back, I would do more usability testing to maximize feedback on the proposed solutions.