Talent Pun

Marvel Realm of Champions

¶ UI and UX Design
¶ 2019 to 2021

MCOC UI/UX Team: Talent Pun (Senior/Lead) Elaine Teh (Lead), Jon Beals, Stephanie Louie, Justin Baker, Gary Li, Wynne Leung, Aline Paffaro

I began working on Marvel Realm of Champions in 2019, joining the team as a senior designer. As a designer, I was largely responsible for taking over the customization and gear system, and redesigning the core loop.

In March 2020, and months away from soft launch, I stepped into the Lead UX Design role — just as COVID turned society upside-down. As the Lead UX Designer, I was largely responsible for training and rebuilding the UX team remotely; managing stakeholders, juggling features, and filling any gaps in the UX and UI that I could.

It was a tumultuous project built during a turbulent time. As with many projects, some of the best work was never fully realized. But I’m still greatly for the opportunity and support I received at Kabam.

RE-IMAGINING THE CORELOOP

When I joined Marvel Realm of Champions, the project was already in full production, with too many features and not enough time to build them.

The core loop was especially problematic; and originally based around an elaborate meta-feature that had to be cancelled. As a result, players had now way of knowing what mode to play, or it’s benefits. Players would have navigate six screens just to start a match!

I worked with the team to redesign the core loop of the game as quickly as possible. I lead the UX process, running two workshops, and prototyping and mocking up the revision over the course of two sprints.

The revised flow simplified the core loop into five steps: Home, Prefight, Combat, Results and Rewards. We refocused the game on getting players into gameplay as quickly possible, while making it easier to compare the attributes of their champion/team’s loadout against the challenge they’re about to face.

Mode selection and character customization would be still be easy to access from the home page and before a fight.

CLICKTHROUGH PROTOTYPES

One of the things we wanted to preserve was the setting of the game, Battleworld. Different modes take place at different arenas, at different locations on the map. The hazards and enemies players would encounter would depend on the territory a player was fighting in.

Another we wanted to improve was the accessibility of the gear system from the mode selection screen. Our hope was that players would upgrade their gear often, based on the obstacles they were about to face. This prototype displays a player’s strongest gear as soon as they enter the customization screen.

Storyboards of the first time user experience; depicting how a short combat cutscene could lead directly into combat.

Sketches of gameplay — how one champions abilities could compliment another.