custom-cover-arrow

Project Foxhound

Lead designer for Crunchyroll's brand new home feed management tool.

TLDR

  • Lead designer within the foxhound tiger team.

  • Created wireframes, prototypes, and high fidelity assets for developers.
  • Worked within a four month timespan to get a working prototype of foxhound, which then turned into the final product.

Background

In 2019, we revamped our entire Crunchyroll design experience from the ground up. From that hard work, we developed a brand new homefeed. This homefeed showcases both dynamic and curated video content, along with other collections like news, events, or games.

homefeed-old

Crunchyroll 2.0 homefeed

Project Goals

  • Reduce the time required for CAPS team to create a new home feed from 1h to 15-20 min.
  • Improve the quality of content recommendations by leveraging ThinkAnalytics (TA) across collections as well as homepage performance.
  • Support a higher degree of flexibility and personalization in our user experience as well as A/B testing capabilities.
  • Increase confidence and job satisfaction of the CAP (Content and Programming) team.
  • Provide a new, engaging, and unique experience for fans.
  • Quantify goals and metrics from a performance perspective (e.g., speed, efficiency, clickthrough rate).

What is Foxhound

  • Foxhound is our page building tool that replaces Crunchyroll's old management tool called the FMS portal.
  • Foxhound is a WYSIWYG editor that describes high level platform agnostic recursive component structure. This allows for backend services to control the layout and behavior of all client presentations.
  • Foxhound publishes a recursive schema in JSON to S3.
Component-Library

Foxhound is a WYSIWYG editor that allows for quick home feed creation.

FMS Admin

The FMS admin portal was a collection of tools that allowed teams to create various Crunchyroll home feeds around the world. However, due to its unintuitive nature, it failed to deliver a fast and efficient way for teams to build home feeds.

Video above shows the steps taken to make a Crunchyroll home feed, using FMS portal. 

How it all works

Foxhound in action.

With Crunchyroll 3.0, we introduced full bleed hero art on the website. This allowed for the display of richer, more vibrant images and logos. We also introduced better show descriptions and genre links inside the new hero art. All of this is now possible because of the work we did within Foxhound. Foxhound enables us to:

  • Add new interactive components (e.g., music collections, hero banners, dynamic collections).
  • Automatically pull catalog information and series descriptions.
  • Provide "up next" information for seamless viewing.
  • Add collections to show pages and reflect different show states (e.g., seasons, coming soon).
  • Explore potential future features like meter or ratings targeting.
  • Fully integrate ThinkAnalytics for improved content recommendations.

Output

With Foxhound being a relatively new tool, we've outlined plans for enhancements over the next year. These include features such as a more robust calendar view, enabling users to track when new home feeds go live. Additionally, we aim to enhance integration with Media Valet to streamline asset discovery, making assets much easier to locate. These improvements are slated to roll out later this year.

1

Editing information in the new Crunchyroll 3.0 hero carousel is quick and easy.

2

When making new home feeds, our internal team has the ability create region specific home feeds if they so desire.

3

The Foxhound editor works a lot like Figma, in that you're able to drill into layers, and edit specific components if needed.

LinkedIn_icon-1

2024

Back to top Arrow