XDefiant — Lobby Redesign Case Study
This redesign was self-initiated after long-standing dissatisfaction with the visual clarity, hierarchy, and interaction patterns of the existing XDefiant lobby. Although the lobby graph was engineering-heavy and difficult to modify, I explored new UX directions emphasizing modularity, scalability, reduced cognitive load, and cleaner feature growth.
All behind-the-scenes content is post-sunset reconstruction and remains compliant with the NDA.
The Problem
- Existing lobby was visually dense, inconsistent, and difficult to extend.
- Feature growth required constant patchwork instead of structured modular additions.
- Navigation patterns lacked predictability and required unnecessary player effort.
- Engineering limitations (especially on the lobby graph) made redesigns expensive.
- Stakeholders wanted clarity, extensibility, and improved player onboarding.
Redesign Goals
- Create a fully modular lobby framework—every piece should be swappable or rearrangeable.
- Reduce long-term engineering cost through repeatable UI patterns and shared states.
- Minimize flyouts and avoid overwhelming the lobby graph.
- Create flexible containers that support new features without requiring layout rewrites.
- Make visual hierarchy cleaner and more intuitive.
Lo-Fi UX Exploration
The low-fidelity wireframes were designed to analyze engineering feasibility, especially regarding how many flyouts and interactive panels we could support realistically. These wireframes focus entirely on structural layout, navigation pathways, and modularity testing—not final aesthetics.
Focus States & Navigation Logic
Because XDefiant supports both controller and mouse navigation, I created multiple focus-state explorations to determine predictable, intuitive movement between panels. Each module has its own focus logic and fallback behavior.
Hi-Fi Modular Redesign
Once modularity was validated, I produced hi-fi concepts showing how the lobby could look with upgraded visual hierarchy, stronger hero character presence, simplified nav, and dedicated information zones—all while remaining modular.
New UX Opportunities (If Engineering Constraints Were Lifted)
- Dedicated event panels with live updating content
- Expandable match queue panel with preview information
- Integrated store hooks and cosmetic surfaces
- Modular "stackable" content areas for future features
- A larger hero character space with contextual callouts
These additions were explored in hi-fi but not implemented due to engineering limitations. Even so, demonstrating modularity opened conversations across UI, UX, gameplay, and engineering about future lobby extensibility.
Key Takeaways
- Modularity dramatically reduces long-term UI maintenance cost.
- Engineering constraints should be visualized early to prevent iteration waste.
- System-level thinking (not screen-level) leads to more extensible UX.
- Even unprompted redesign explorations can shape future development discussions.
Lo-Fi to Hi-Fi Lobby Evolution
XDefiant: Ability Select Restriction
I designed the UX that prevents players from picking duplicate abilities during pre-match setup. My work focused on clarity, error states, and making the restriction feel clean and readable inside a very fast-paced flow.
XDefiant: Store UX
I worked on the UX for the in-game store, reorganizing layouts and simplifying the browsing experience. I focused on navigation, item hierarchy, and localization-ready components that could scale with new content drops.
Xdefiant: Daily Login
I designed a daily-login reward feature to support retention. I mapped the flow, built the UX, and coordinated with art and MTX to make it fit cleanly into the existing system.
Coming Soon
XDefiant: Prestige