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

THE PROBLEM

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.

THE SOLUTION

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.

QUEUE LIST

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.

The Process

RESEARCH

Synthesizing secondary and primary research

To identify underlying problems I conducted secondary and primary research to examine common pain points, market trends and competitors.

Main insights

A UI update

• Survey responders commented that the current layout is "old" compared to other platforms such as Netflix.

Dark mode

• 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.

Competitive Analysis

I researched direct and indirect competitors to see how they approached their streaming experience.

USERFLOW

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

"Easier to use than what Crunchyroll has right now."

- Tester feedback



"Smoother. Feels like Hulu."

- Tester feedback

CONCLUSION

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.

If you like my work, let's chat!

I'm currently open to potential Product Design opportunities.
Connect on Linkedin