Crunchyroll

Crunchyroll brings anime fans the content they love—anytime, anywhere. With an extensive library and immersive experiences, Crunchyroll takes anime beyond the screen, connecting fans and creators on a global scale. As a joint venture between Sony Pictures Entertainment and Japan-based Aniplex, Crunchyroll unites the world of anime under one vibrant platform.

Screenshot of the Crunchyroll website displayed on an gray monitor. The featured content highlights the anime 'Honey Lemon Soda,' showcasing a warm and heartfelt scene between two characters in a sunlit classroom. The page includes options to 'Start Watching,' along with personalized recommendations in the 'Top Picks for You' section below, offering a glimpse into Crunchyroll's engaging and user-friendly interface.
Technologies
Storyblok
Services
Design, Development, Web Content Strategy
Industry
Video Streaming
Awards

List, List

Live Site

Results

Engaging a Truly Global Community

The resulting Crunchyroll News site is light years ahead of where it started.

Content creators and editors have the power to leverage best practices in SEO, syndication, content discovery, and navigation to attract, engage, and convert anime fans from around the world.

Site visitors now enjoy a truly mobile-first experience, with intuitive navigation, easy ways to find and interact with the content they want on any screen or device, and seamless crossover into the rest of the Crunchyroll ecosystem.

To ensure the experience is uninterrupted, the site is geo-adaptive to display content, searches, and RSS feeds in each users’ preferred language. And users can customize their experience further with the option to toggle between dark-mode and light-mode versions of the site.

In the midst of an enterprise-scale site redesign, Crunchyroll has made the most of their opportunity, establishing Crunchyroll News as the go-to source for anime news, exploration, and engagement.

Responsive design of the Crunchyroll News website displayed across multiple devices, including a tablet, smartphone, and laptop, showcasing a cohesive layout featuring Latest News, Spotlight, Features, and Top Stories sections with vibrant anime visuals and headlines.
Screenshot of the Investments & Wealth Institute membership comparison table, outlining features for Basic, Signature, and Elite membership tiers. The table highlights benefits such as access to publications, newsletters, continuing education, and discounts on courses and webinars.

BizStream has been able to do more for us in 2 months than our other partners were able to do in a year—and they’ve become a key strategic partner for our organization. Their pragmatic approach, responsiveness to our requests, and guidance on marketing strategy has made them an invaluable resource for Investments & Wealth Institute.

Jamie Lewis
Director of Business Application Solutions, IWI

Challenges

Poised for Dramatic Improvement

It’s not unusual for very large corporate enterprises to have multi-layered websites comprising hundreds—even thousands—of pages.

But media organizations—such as the hugely popular anime streaming site Crunchyroll—house hundreds of thousands of pages and articles. Crunchyroll News, which is just one facet of the organization’s digital presence, provides continuous news and insights to tens of millions of subscribers and freemium members.

The company was working on the release of new corporate branding and a full site redesign, which included integrating the Crunchyroll News site into their ecosystem of videos, manga, games, and merchandise.

Requirements

Migrating the more than 230,000 multimedia news articles—in nearly a dozen languages—was a monumental task that needed to be completed in tandem with their larger website redesign.

In addition, the migration was a unique opportunity to make dramatic improvements in user experience, organic traffic, engagement, and ultimately, subscriptions. The Crunchyroll team knew that the news site had been neglected, and they were ready to modernize it.

Requirements that were critical to the news site’s success included:

It was a tremendous chance to make a meaningful difference for both internal and external users.

Choosing the Right CMS Partner

Coordination and Project Management with Storyblok Experts

To ensure the news site migration met both their timeline and their requirements, Crunchyroll’s technical team decided to bring an outside developer team into the project to work alongside their in-house developers. But they didn’t want just any provider; they needed a fully dedicated dev team with specific knowledge of user experience (UX) design, information architecture design, and their chosen CMS: Storyblok.

Storyblok Certified Partner logo

As a certified Storyblok partner, BizStream was uniquely positioned to take on their migration, providing experienced Storyblok developers dedicated to completing the news site. And because we are a full-service agency, we also understand the importance of elevating UX design, SEO, and site usability along with tailored CMS configuration and deployment.

But for Crunchyroll, the deciding factor was discovering BizStream’s expertise in creating tailored CMS environments that empower content editors—now and over the long term.

Most developer teams have the ability to configure in-the-box features and enable basic functionality. But Crunchyroll’s news editorial team is an outside-the-box group. They have a large core team and hundreds of contributors publishing in nearly a dozen languages from countries around the world. Their Storyblok configuration needed to be highly adaptable—empowering editors to tell an endless variety of stories, using every kind of media—within an intuitive content structure and defined branding.

Because BizStream specializes in that kind of nuanced focus on content editor usability, we became Crunchyroll’s top choice.

Solution

A Flexible Framework

Storyblok Is a Natural Fit

Our experienced dev team provided recommendations to help Crunchyroll make the most of Storyblok’s features.

Crunchyroll News website showcasing the 'Anime Quizzes' section with featured fan-voted content like 'Top Anime Openings of 2024' and quizzes such as 'Your Top Anime Crushes of 2024 Revealed!' Below, the 'Interviews' section highlights exclusive articles with creators and musicians, including topics like anime inspiration and cultural reflections.
Crunchyroll's navigation menu showcasing browsing options, including categories like Popular, New, Alphabetical, and Simulcast Season, as well as genres such as Action, Comedy, Fantasy, and Thriller, displayed above a grid of anime titles with subtitles and dubs.

Enterprise-Level Project Management

BizStream’s team is adaptable to any project scope.

Before beginning our work with Crunchyroll, we put in place a project management structure that would enable true partnership with their internal team.

The sheer size of the full ecosystem migration demanded that effort be divided between our teams. However, that also meant that for the quarter-million-article News site that was our focus, we needed to establish an even greater level of oversight than in projects we manage independently.

We established shared communication channels, using their team’s familiar collaboration tools and systems.

To maintain momentum and stay aligned, we:

—all while executing all design and technical priorities.

Above and Beyond

With these available framework basics, we applied our experience over a phased process to creatively solve Crunchyroll’s complex requirements.

Phase 1: Content Audit and Modeling

To ensure that we’d start on firm footing, we performed a deep content audit. Because of the volume of content involved—and because the original site was not responsive—we knew moving text and images into Storyblok would not be straightforward.

We wrote custom tools for this audit, which informed our content modeling exercises.

Then, we created multiple content models, presenting each to the Crunchyroll team and refining each iteration to ensure the final model would provide the editing experience their teams required.

Storyblok Visual Editor interface showcasing collaborative editing on a webpage with a hero section, including a discussion panel for real-time feedback, customizable content blocks, and tools for managing text, background images, and call-to-action buttons.
Crunchyroll webpage in Portuguese promoting free anime available to watch in February, featuring series like 'A Couple of Cuckoos,' 'A Sign of Affection,' and 'Alya Sometimes Hides Her Feelings in Russian,' with subtitles and dubbed options. The page also highlights 'Novos Lançamentos' (New Releases) with detailed schedules for episodes released today.

Phase 2: Wireframing and Design

Our UX design experts leveraged Crunchyroll’s brand design system and specifications to create a set of high-fidelity wireframes, a critical time- and cost-saving step for complex sites.

Multiple Variants

We created pixel-perfect responsive designs for mobile and desktop, with variants for light and dark modes.

ADA Compliance

We vetted a full range of ADA-compliant colors for their design system, ensuring both light and dark modes meet the AA standard of Web Content Accessibility Guidelines (WCAG).

Take a Closer Look

The News site supports content in 11 languages, including Arabic, which reads right-to-left. We created the completely flipped page design shown here to ensure RTL balance and readability.

Phase 3: Storyblok Implementation and Component Creation

As we moved into technical development, our team set up the Storyblok space for Crunchyroll News.

We applied the content structure, built a set of core pages for reuse across content categories, and created reusable block components to empower editors to customize new pages.

With these customized, composable components, Crunchyroll’s team can tell any kind of story, incorporating any kind of content—all within their approved publishing workflow and adhering to their brand guidelines.

Crunchyroll homepage displayed on a monitor, featuring the anime 'Honey Lemon Soda' with a highlighted synopsis describing a high school romance and a 'Start Watching' button. Below, the interface showcases 'Top Picks for You,' with a curated selection of anime thumbnails.
Crunchyroll News website showcasing the 'Anime Quizzes' section with featured fan-voted content like 'Top Anime Openings of 2024' and quizzes such as 'Your Top Anime Crushes of 2024 Revealed!' Below, the 'Interviews' section highlights exclusive articles with creators and musicians, including topics like anime inspiration and cultural reflections.

Phase 4: Migration Scripting, Testing, Execution, and QA

In the final phase of technical development, we created a comprehensive migration script that handled the transposition of raw HTML-based posts into structured JSON.

This complex phase required:

Before attempting the full migration, we segmented a sample set of article pages and ran them through a complete testing process.

A detailed quality assurance check revealed any stray issues ahead of the full migration. From there, we ran the scripts on the live environment and coordinated with the internal development team so they could finish their work before launching the new website.

Collection of Crunchyroll interface mockups displayed across various devices, highlighting features like the Latest News, Spotlight, and Features sections, anime recommendations, and the Game Vault promoting anime-themed mobile games. The designs emphasize responsive layouts optimized for tablets and smartphones.

Our Storyblok Success Stories

American Society for Nondestructive Testing

Branding // Design // Development // Discovery and Roadmap // Web Accelerator for Storyblok // Web Content Strategy

Investments & Wealth Institute

Design // Development // Discovery and Roadmap // Integration // Web Accelerator for Storyblok // Web Content Strategy

Big I Illinois

Design // Development // Discovery and Roadmap // Integration // Web Accelerator for Storyblok // Web Content Strategy

Subscribe to Our Blog

Stay up to date on what BizStream is doing and keep in the loop on the latest in marketing & technology.