Role: UX & UI Designer
Time Frame: February 2019 – September 2019
Engine: Unity
Platform: Mobile
Overview
For Disney’s Mirrorverse, developed by Kabam, my core responsibilities included:
- Creating UXDDs and UIDDs for the Questboard feature
- Working with Game Design to determine feature goals
- Creating user journeys to help guide design
- Creating UIDDs and UI assets based on established style guide
- Integrating assets and maintaining atlases
- Animating screens in-engine using internal tools and NGUI
- Creating optimization tools and shaders with help from Engineering.
- Creating interaction and screen transition mocks using Protopie
LUT Shader
The LUT Shader allows us to recolour assets (UI or textures) using a LUT or gradient map.
This will allow us to:
● Recolour a single UI/texture asset
● Add more depth than a simple tint (gradients with several colour stops)
● Reduce Atlas size
● Improve optimization
Quest Select Menu & UI Redesign
Following discussions with the client, we were asked to provide potential redesign to help mature and modernize the UI, and bring an element of “high fantasy”. We pulled back the detail, saturation, shading, and chunkiness of the UI assets to help push the maturity. Minimalizing the use of colour helped us push key information and create a clearer hierarchy.
The menu uses a consistent primary navigation, toggling between Modes, Acts, and Chapters respectively. Using scrolling pagination helped us fully utilize the small screen real estate, along with giving the user a “page turning” effect that felt true to the IP and gameplay style.
Questboard
Overview
The Questboard is one of the core features for Mirrorverse. Largely based off of Contest of Champions, it is a node-based map with a predetermined layout, enemies, and a final boss. Working with Game Desig, I helped look for areas of improvement within the old system, and to help integrate new features into the design.
Questboard Info Panel
The Questboard Info Panel is a screen that appears upon tapping any questboard component. It provides context about components, rewards, and is where a user may choose to move to the next node from.
Fractured Towers
Fractured Towers serve as checkpoints throughout the Questboard.
Player Level Up
Player can level up at any point in the core loop. As such, it was important to make a system that highlighted but did not fully interrupt a user. We opted to keep the animated reveals snappy and short, and call attention to any rewards, then providing a contextual breadcrumb/pip to help lead a user to new content at their leisure.
Store Intro Animation
The Store intro needed to be bouncy, fun, and enticing. I prepared a mock for the screen animations in Protopie.
Madi Calvert 