Objective
The idea for this project was to try out diegetic UI in Unreal Engine.
You play as an archaeological robot analyzing medieval objects, which made it really fun to integrate the UI into 3D space and make it interactive.
I also created a fully functional HUD (that’s diegetic too since you’re playing as a robot).
This was my first time working on a full UI project like this, from the UI mockup to the final integration.
Animations and effects
I also used this project to add some cool animations, like screen transitions, 3D spritesheet animations, and ones you can trigger.
I also wanted to add some effects, so I worked on shaders like HUD curvature, UI Parallax, Chromatic aberration, and experimented with Niagara for the scan effect.
For more complex effects, such as the screen glitch, I recreated it by porting a Shadertoy GLSL shader into Unreal Engine’s material editor.
Coding
Besides coding the character’s movement and animation, as well as the scanning object, I also aimed to make the HUD fully functional.
I ended up creating a compass with points of interest and a working minimap.
The objective display updates as the player scans objects, and the energy bars refresh in real-time.
I also set up the settings screen so you can customize the HUD to your liking.
Video
Here’s a complete video where I showcase all aspects of the HUD, UI, and everything else I’ve worked on.
UI Art
Here are some behind-the-scenes images of my UI artwork, from the mockups to the final version, so you can see how the design came together step by step.
