Ecosystem Adaptive UI
A modern and modular UI kit for the metaverse age with significantly less memory cost.
My role: Group Director, UXUI & Brand Design—I led the conversation on component restructuring and creative direction on the UI
A live-service game is not for the faint of heart.
Fortnite launched in 2017 and hasn’t let up on the gas since: adding new modes, infinite partnerships, a LEGO game, a proprietary engine for creator-made content, and much more.
The downside: tech and design debt were piling up, and continually punted to be dealt with later.
Five years in, Fortnite’s UI was visually consistent (albeit dated), but wildly inefficient to maintain: every button was a standalone instance. We also knew that by the end of 2023 we’d have several different UI paradigms to support, and needed to overhaul the system both aesthetically and for scale.
Fortnite went from this in 2017
To this in 2020
To needing to be something like this in 2023
First things first.
Aligning with engineering and exec leadership.
Working with Fortnite’s UI kit in UMG (Unreal Motion Graphics UI Designer) was increasingly problematic, even for a team sitting next to the team making Unreal Engine. Everything was bespoke and required significant learned domain experience. While consolidating a component library was perpetually on the roadmap, this was consistently deprioritized in favor of anything required to ship the next season.
While the problem statement and goals were well understood, we needed to arrive at an approach. Quickly. The actual gameplay UI was too baked into the logic of the game to be addressable, but that was also a red herring. The game’s ‘front end’—lobby, discovery, social, notifications, menus—was far more important to delivering the promise of a multi-product ecosystem experience.
The problem. And the solution.
Setting the bar high.
Defining the visual language for one of the world’s biggest interactive entertainment platforms.
Fortnite had been rapidly evolving into something more than a game, more akin to your PS5 platform experience than to a Call of Duty game. While we were still designing to deliver personality and premium-polished interactions, we also needed it to be easily scannable and promote lasting twitch-level memorization that would translate across a growing catalog of content.
Further, these changes needed to feel like an evolution to Fortnite’s core audience as to not suddenly feel like it had lost its soul to corporate expansion—respecting that love for Fortnite was critical to our success.
Style Tiles
Motion Prototypes
Where we're going, we don't need roads.
Codifying adaptive UI.
As we were defining these visual systems against the live game, we were also preparing them for the changing IA, optimizing for an ecosystem that would be be very aesthetically diverse but anchored by a common journey and foundational UX. The ecosystem UI may change colors and tone based on content, but the UX would remain consistent. Creators would have access to the white label UI kit to expedite completely customizing their own in-game experience.
The core IA provides structure to every player’s experience
Reinforced with consistent foundational UX
The Results
Fortnite successfully launched several new tentpole game modes and a new discovery experience that supported infinitely scalable content, powered by this adaptive UI system and a significantly reduced stack of components. The memory savings were imperative given the new content scaling, and speed of UI development was more than cut in half. We built and maintained robust documentation to provide creators along with the new UI kit, allowing for faster development and more UX consistency across new games published to the ecosystem.
The metaverse may be trippy, but it doesn’t need to be confusing—or worse, look bad.
Case Studies
Epic Games
2020-2025
Fortnite UI
Creator Portal
Shop & Subscriptions
Electronic Arts
2014-2020
Cross-Platform Play
The Archives
2006-2014
Code School: Course Creation
LACMTA: Trip Planner