UI / UX Design
MI Studios
Scene created for backgrounds in UE4
At MI Studios, my role as UI / UX Designer had me involved with creating and implementing visual designs that improve gameplay experiences throughout the game.
I used a combination of Figma and Photoshop to create the designs, then implemented them into the Unreal Engine 4 project.
'Redaction' came about after a major pivot from the original title 'FASTR'.
FASTR started out as a FPS PvP game, however down the line we needed to change drastically to improve gameplay experience. As a result of that decision, we re-evaluated what makes the game fun and recycled some of that project to make Redaction, a FPS co-op PvE game.
I'll be detailing a bit of what I've done with FASTR before showcasing my work with Redaction.
FASTR
FASTR is about teams of enhanced operators competing against other teams in the blood sports arena. There is different modes with different win criteria, either fighting to gain the most kills or another mode was defusing/setting off the bomb.
FASTR underwent a change in art styles from looking more industrial/military-sims to futuristic.
Here is one of the initial designs and old logo that I created before the shift in art styles.
Splash screen with logo before art style changes
With the art style shift to be more futuristic, here are the designs created and mostly implemented before the major pivot into Redaction.
Latest FASTR logo design
FASTR UI reference sheet
FASTR main menu design showing default and hover state interactions
FASTR layout designs
FASTR HUD mock up
Redaction
Redaction is a 1-4 player cooperative peer-to-peer action FPS, where you or your team of specialists has been tasked with hunting down mutated bugs which had escaped containment.
Mission objective - Progress through the map, killing monstrous bugs and the area boss/queen to stop the infestation.
Redaction UI references (left), colours & font guide (right)
Redaction icons
Redaction main menu
Redaction current loadout
Redaction settings showing default and hover states
Loading screen backgrounds:
Redaction HUD
Redaction in-game recording with latest HUD implementation
Reflections
From the beginning of project FASTR to Redaction in it's current state, it has been a rewarding journey with a lot of new skills and programs learnt.
I am very appreciative of MI Studios for giving me time to learn Unreal Engine 4. It meant that I can now help with creating layouts in UMG and was even able to implement some effects myself - that curved HUD was one result of my various experimentations in Unreal Engine.
Thank you for reading!