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.
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.
List, List
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.
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.
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.
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.
It was a tremendous chance to make a meaningful difference for both internal and external users.
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.
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.
Our experienced dev team provided recommendations to help Crunchyroll make the most of Storyblok’s features.
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.
—all while executing all design and technical priorities.
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.
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.
We created pixel-perfect responsive designs for mobile and desktop, with variants for light and dark modes.
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).
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.
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.
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.
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.
We love to make cool things with cool people. Have a project you’d like to collaborate on? Let’s chat!
Stay up to date on what BizStream is doing and keep in the loop on the latest in marketing & technology.