Context: Cross-platform VR experience created to promote the Justice League film and Gillette partnership, deployed across mobile VR, Oculus, HTC Vive
Role: Sr. UX / UI VR Game Designer
Timeline: May 2017 – Sep 2017
Justice League VR
Designing Justice League VR: A cross-platform immersive game experience
The Justice League VR project required building a unified gameplay and UX system that worked across dramatically different hardware capabilities. As the lead UX designer, I designed core interaction models, spatial menus, HUD systems, and hero-specific game flows — ensuring players had a cohesive and intuitive experience whether using Cardboard, console VR, or full room-scale systems.
I collaborated on the integration of varied wearables such as Oculus, Google Cardboard, Sony VR, HTC Vive, and IMAX.
I played a key role in ideating gameplay elements, defining powers and points systems, refining UI elements, crafting compelling narratives, orchestrating audio cues, and scripting engaging interactions between heroes.
01
Kickoff & align
Understanding the Challenge
Fragmented Hardware Landscape — Each device had different inputs, tracking capabilities, and interaction constraints, requiring a flexible, device-agnostic UX foundation.
Unclear Interaction Standards — VR references were limited at the time, so we needed to define new patterns for movement, targeting, feedback, and progression.
Brand & Narrative Requirements — Warner Bros. needed the experience to align with the film’s marketing narrative while supporting unique abilities for each hero.
Rapid Production Timeline — A four-month schedule demanded tight scoping, fast iteration, and quick decision-making across design, engineering, and cinematic teams.
Production Limitations Infographic
Google Cardboard Pre-game UI States
Gameplay Ergonomics
IA Health Meters
Google Cardboard UI Flow
Oculus UI Flow
Full IA Game Flow
UI Flow
02
Discovery & foundation
Establishing the Core Foundation
Gameplay Inputs & Tracking — Compared device-level constraints (Cardboard → IMAX) to define a shared control model that scaled across tracking and button limitations.
Hero Identity & Player Flow — Created user flows for each hero, defining the core loop, abilities, scoring, and feedback needed to reinforce their unique strengths.
Visual Interaction Cues — Prototyped reticles, gaze-based triggers, wall-slot menu systems, and color states to teach players how to interact without tutorials.
Audience Insights — Synthesized research from social metrics, user stories, and demographic data to shape difficulty, pacing, and usability expectations.
03
Systems & Prototyping
Designing Cross-Platform VR Mechanics
Core Interaction Model — Designed a universal system for movement, aiming, and action triggers that worked consistently across all six VR platforms.
HUD & Feedback Systems — Built spatial HUD elements, damage feedback, health states, and enemy indicators that remained readable without blocking gameplay.
Device-Specific UI Adaptations — Created alternate UI states for mobile, Cardboard, console VR, and room-scale configurations while preserving narrative continuity.
Hero Selection & Game States — Developed multiple hero-selection prototypes (reticle, wall-slot, punch-to-select) to find the most intuitive and universally supported system.
2D wireframes for Unity VR Greyboxing
04
Production & final delivery
Bringing the Experience to Launch
Cross-Platform Wireframes — Delivered hundreds of wireframes mapping gameplay loops, scoring systems, menus, and hero flows across all supported devices.
High-Fidelity Interaction Screens — Created polished UI, spatial menus, and HUD elements built to align with Warner Bros.’ visual direction and cinematic branding.
Technical Playbooks — Provided detailed UX specifications outlining control schemes, affordances, timing, transitions, and device-specific UX guidelines.
Launch Support — Collaborated with engineering and production teams through final integration and tuning to ensure a consistent experience across all platforms.
Outcome: The experience launched across six major VR platforms ahead of the film’s release as part of a global promotional partnership with Gillette and Warner Bros. It drove strong social engagement, widespread press coverage, and industry discussion as one of the first cross-platform VR entertainment experiences.
Batmobile Health Meter End result in Unity
Credits Screen
Cyborg Life Meter Z Axis Test 1
Wonder Woman Damage Perimeter Visual Cue
Cyborg Reticle Weapon Z Axis Test
Batmobile Health Meter Test 1
Batmobile Health Meter Test 2
Cyborg Perimeter Damage Visual Cue
Cyborg Arm Weapon Powerdown Placement Z Axis
Cyborg Arm Weapon Powerdown Placement Z Axis 2
Cyborg Weapon Z Axis Test