Helping fans find anime and manga

Japanese cartoon and comics, also known as anime and manga, are billion-dollar industries in the United States. Award-winning Viz Media is one of the largest players in the industry, offering hundreds of series to countries around the world. Mule Design created a modular and fully-reponsive website to showcase Viz's vast offerings and connect fans to the series they love.

Project

My Contributions

  • UX Design
  • Copywriting

Lead Designer

The lead designer created a flexible homepage that allowed Viz to highlight a particular series.

A Modular Design System

Spearheaded by the lead designer, we developed a modular design system that allowed visitors to easily differentiate between products and information, anime and manga. This system made it easy for the Viz team to maintain and scale the design as needed, without requiring new code to be produced.

Showcasing the Collection

Our redesign sought to showcase the beautiful artwork anime and manga is known for and make it easy to browse through the many volumes and series. To serve these two goals, we introduce multiple views that users could toggle between. To help users differentiate between anime and manga, our design system required manga always appear on a white background and anime always on black.

The Release Calendar is sortable, filterable and offers two views: grid and list.

Connecting with Users

As luck would have it, I was a subject matter expert for this project: the majority of my childhood had been spent watching and reading Japanese comics and shows. This, along with the research done by our discovery team, allowed me to find opportunities to spice up the UI with references and inside jokes. In our user tests, we found these little tweaks resonated with users, building a connection with them through shared cultural understanding.

The Profile section included references to anime and manga in the form field placeholder text, as well as an anime-style default avatar.

It's live!

In May 2016, Viz launched a portion of the new website. Have a look!

Read Next

Detecting eyeball defects. 2015 — Android app — UX Lead