World Of X: Mapping the mutant universe to create an uncanny experience.

Platform Web
Role Brand / Design / Code
Year 2015

All work was designed with Sketch and Photoshop. The fully responsive site (including a full-screen big picture mode) was built using JavaScript and Sass on the Meteor.js platform with Marvel API and Google Maps API integrations.

A childhood love for the X-Men inspired World of X, an interactive map that uses the Marvel and Google Maps APIs to explore astonishing locations from the classic and long-running comics with imagery, descriptions, and issue references.

Animated loading and transitions lead to a fully interactive map allowing visitors to explore iconic locations from across the entire X-Men comic universe.
Browser controls in the top left Browser controls in the top right

Details

An extraordinary guide to the X-Men's world.

Growing up, the mutant outcast heroes of Marvel Comics known as the X-Men struck a personal chord with me, leading to immense collections of trading cards, action figures, and comic books (not to mention a probably unhealthy Saturday morning cartoon addiction just to catch up with the latest adventures of Professor X, Wolverine, Cyclops, and friends). When Marvel announced an API with references to their entire history of publishing, it was time to turn that childhood obsession into something amazing.

Initially conceived as a quick experiment to combine the Marvel API, the Google Maps API, and the Meteor JavaScript platform, World Of X quickly became an expansive and comprehensive guide to almost every location in which the X-Men have lived and battled. A fully interactive map, the site allows visitors to explore these locations with large comic book imagery, a full description of the location and its relevance to the X-Men, and a link to read every comic series in which the location has played a part.

Each location features a large hero image pulled right from the comics, with a full description and a library of references to comic series that the location was featured in. Each reference links to the Marvel website, allowing visitors to read them all on Marvel Unlimited, Marvel's comic subscription service.
Browser controls in the top left Browser controls in the top right

Related Work