Past work · Method Studios · VR game UX

Justice League VR

Designing a unified immersive game experience for Gillette × Warner Bros.—six platforms, one coherent UX.

Context
Justice League VR across 6 platforms
Role
Sr. UX / UI VR game designer
Timeline
2017
Personal note

Designing Justice League VR meant building a unified gameplay and UX system across dramatically different hardware capabilities. As lead UX designer, I owned core interaction models, spatial menus, HUD systems, and hero-specific game flows—so players had a cohesive, intuitive read whether they were on Cardboard, console VR, or full room-scale.

I partnered with engineering and cinematic teams on gameplay ideation, powers and points systems, UI refinement, narrative beats, audio cues, and hero-to-hero interactions—always against a tight promotional calendar.

  • Wearables & venues — Integrated UX across Oculus, Google Cardboard, Sony VR, HTC Vive, and IMAX-scale presentations.
  • Beyond screens — Contributed to powers and scoring logic, spatial menu literacy, franchise-aligned narrative beats, and audio-driven feedback loops for hero fantasy.

01

Kickoff & align

Understanding the challenge

  • Fragmented hardware landscape — Each device introduced unique inputs, tracking fidelity, and interaction constraints, forcing a flexible, device-agnostic UX foundation.
  • Unclear interaction standards — VR references were still scarce, so we authored patterns for movement, targeting, feedback, and progression.
  • Brand & narrative requirements — Warner Bros. needed film-era marketing continuity while giving every hero a distinct ability fantasy.
  • Rapid production timeline — Four months required ruthless scoping, fast iteration, and decisive alignment across design, engineering, and cinematic partners.

North star — Ship one coherent Justice League fantasy across mobile, console, and room-scale VR without watering down hero identity or partner branding.

Designing across variable inputs

Different wearables introduced different tracking fidelity, inputs, and performance ceilings—so we landed tailored interaction solutions per system while preserving one coherent Justice League fantasy end-to-end.

Google Cardboard
HTC Vive
PlayStation VR
Six-platform comparison

UI wireframing — core beats

Select hero, menus, controls, calibration, settings, loading instructions, and scoring.

Select a Hero

Menu selection

Controls & inputs

Calibrating headset

Adjusting settings

Hero instructions / loading

Scoring

1 of 7

HUD stack, rulesets & hero entry

IA explorations tying HUD hierarchy to gameplay rules and early hero-entry hypotheses.

HUD IA
Gaming rulesets
Hero entry exploration

02

Discovery & foundation

Establishing the core foundation

  • Gameplay inputs & tracking — Compared Cardboard-to-IMAX constraints to define a shared control model that scaled with tracking quality and button availability.
  • Hero identity & player flow — Diagrammed hero-specific loops, abilities, scoring, and feedback so each character felt unmistakable in headset.
  • Visual interaction cues — Prototyped reticles, gaze triggers, wall-slot menus, and chromatic states that taught interaction without heavy tutorials.
  • Audience insights — Synthesized social metrics, qual interviews, and demographic snapshots to tune difficulty, pacing, and usability targets.

Foundation thesis — If the controls read clearly at the lowest-common denominator device, we could progressively enhance—not redesign—for premium headsets.

Information architecture — player journeys

Flow diagrams for core loops, hero selection, Cardboard constraints, and the full session arc.

Full loop flow

Google Cardboard flow

Hero core loop

Hero selection flow

1 of 4

03

Systems & prototyping

Designing cross-platform VR mechanics

  • Core interaction model — Authored a universal movement, aiming, and action-trigger grammar that stayed consistent across all six VR platforms.
  • HUD & feedback systems — Built spatial HUD elements, damage feedback, health states, and enemy indicators that stayed readable without occluding the hero fantasy.
  • Device-specific UI adaptations — Produced alternate UI states for mobile, Cardboard, console VR, and room-scale setups while preserving narrative continuity.
  • Hero selection & game states — Explored reticle, wall-slot, and punch-to-select prototypes to land the most intuitive, broadly supported flow.

Batmobile & Cyborg HUD — readability iterations

In-headset placement studies for two different beats: Batmobile health chrome and Cyborg HUD treatment. Each went through exploration passes before we locked final positions—the same systems craft as the wireframes earlier in the case, now validated where motion, scale, and stereoscopy matter most.

Placement goal: Keep health meters within peripheral line of sight without anchoring them in the focal cone where combat and navigation live—glanceable when you need them, easy to tune out when you stay locked on the action.

Batmobile — exploration A
Batmobile — exploration B
Batmobile — locked placement
Cyborg — exploration A
Cyborg — exploration B
Cyborg — locked placement

04

Production & final delivery

Bringing the experience to launch

  • Cross-platform wireframes — Delivered hundreds of frames mapping gameplay loops, scoring systems, menus, and hero flows for every supported device.
  • High-fidelity interaction screens — Crafted polished UI, spatial menus, and HUD treatments aligned with Warner Bros. cinematic branding.
  • Technical playbooks — Documented control schemes, affordances, timing, transitions, and device-specific UX guardrails for engineering partners.
  • Launch support — Stayed embedded through integration and tuning so readability, comfort, and narrative beats held up on each SKU.

Partnership velocity — Gillette and Warner Bros. needed a headline VR proof point—documentation volume mattered as much as hero polish so studios could parallelize.

Outcome: The experience shipped on six major VR platforms ahead of the film’s premiere as part of a global Gillette × Warner Bros. promotional campaign. It fueled social conversation, broad press coverage, and industry chatter as one of the first polished, cross-platform VR entertainment pushes tied to a theatrical tentpole.

Partnership creative