Legend of the Five Rings. Illustration from the Legend of the Five Rings universe: a samurai in a Rokugan setting, used as the project cover.

Legend of the Five Rings

Client
Asmodee
Ezperanza Studio
Service
Custom WordPress development
Team
Design: Ezperanza Studio
Development and motion design: Eric Huguenin
Awwwards & Mentions
Website of the Day
Honorable Mention

Challenge

Legend of the Five Rings tells the story of Rokugan, an imaginary empire where seven samurai clans vie for power. Since 1995, Asmodee has extended the license into a card game, a roleplaying game, novels, board games and video games. The publisher wanted a single entry point, serving the day-one player as well as someone discovering the universe through a novel. The difficulty lay in the whole: thirty years of lore and five product lines to structure without turning the site into a catalog.

Legend of the Five Rings. Collage of pages from the Legend of the Five Rings website: the homepage, the overview of the great clans, a lore page and the product list.
Legend of the Five Rings. Homepage on desktop: the Rokugan illustration fills the screen, with the franchise title laid over it.

Approach

Ezperanza handled the design, Asmodee held the universe, and we had to make both work on screen. We started with an inventory: every content type, every product line, every lore page, to derive a set of reusable templates. Motion came next, once the structure was locked, so we wouldn’t animate pages twice while they were still under construction.


Legend of the Five Rings. Clan overview on mobile: the clan's crest, name and motto on an illustrated background.
Legend of the Five Rings. Lore page on mobile: an illustrated, paginated chapter of Rokugan's history.
Legend of the Five Rings. Product list on mobile: card game, roleplaying game and novels follow one another as thumbnails.
Legend of the Five Rings. News page on mobile: the franchise's latest releases, dated and illustrated.

Key solutions

Custom WordPress theme, developed from Ezperanza’s design. The presentation of the seven great clans is its centerpiece. The motion relies on a scroll-synced sprite: the browser plays content reveals, page transitions and entrances frame by frame, without video. The movement stays hand-drawn, in keeping with the license’s woodblock-print style, and the site stays light to load. Asmodee’s teams manage the rest, from products to news.

Legend of the Five Rings. Selection of the seven great clans on desktop: each crest expands on hover.
Legend of the Five Rings. Product page on desktop: a product line from the franchise, with its description and visuals.
Legend of the Five Rings. Full-width illustration from the Legend of the Five Rings universe, used as a divider on the site.

more of our work

01

Ozone Light

Ozone Light. Ozone's Luxembourg chandelier seen from below: a wide ring of white light suspended by three black arms from an ornate ceiling rose.

02

Hebras Avocats

Hebras Avocats. The Hebras firm's spiral staircase seen from below, lit by a cloud of suspended glowing globes.

03

Un Jour Un Dessin

Un Jour Un Dessin. Ink drawing of Wolverine by Matthieu Bolufer, used as the project cover.

04

Halley&Co

Halley&Co. Mood photograph from a Halley&Co project, used as the cover.