Boutique Character UI

Keep the flare of heavily themed UI updated with focused design rules and information clarity

Objective
Design UI system around a dynamic game element, unique to each character.
My Role
Research
Dynamic Prototyping
Illustration
Unreal Implementation
Tools
Figma
Illustrator
Photoshop
Unreal Engine
Team
Myself
UI Artist
UI Programmer
Duration
Started July 2024
Launched Sept 2024
The Challenge
The amount of data each design was suppose to convey wasn't always intuitive
These small 80x80 elements were at times tasked to show many different timers as well as active/inactive states.
Another issue were these characters already had unique UIs that were implemented in Smite 1. So there was an internal and external bias to old designs.
Additionally, the ability design was in flux even once I was passed a final design doc. I had to stay on my toes and active in playtests to catch feedback that would probably change my own workload.
Confusion
Design documents would get changed without being communicated to me

Expectation Bias
Changing things can always result in unhappy users already adapted to the old design

Result
Design these in basic shapes first to test information clarity. Then brainstorm with the UI artist to find visual assets that expanded the clarity
The Solution
While I implemented in UE5 I would prioritize any ability hooks that were unique to a characters design. Once those were identified and a programmer assigned to give me data hooks I'd guide my very talented artist to render out the basic concept.
I also developed a flow where I actively would reach out to the character designer to assure abilities hadn't changed.

Jing Wei
Jing Wei Mockups:



Jing Wei Final Art:








Nu Wa

NuWa Mockups:



NuWa Final Art:






Meter filled, next attack buffed indicator
