Week 2: Creating a Health Bar in UE5

-

This week, to prepare for my DE4402 essay, I wrote a summary of the assignment, followed practitioners on LinkedIn, ArtStation and Instagram, and wrote a blog post of potential practitioners I could interview. For my practice module, I created a functional health bar in UE5, over the course of a few days, using as little direction as possible to try to learn through trial and error rather than just following tutorials step by step. I also challenged myself to use Blender for the first time without using any tutorials to create a 3D model of a lantern to import in to Unreal Engine and use within my level. 


The Process: 

In the level, the player must travel through a dark cave using rocks, wooden planks and moving platforms to avoid the lava and reach the finish line. 


To create the effect of jagged rocks, I distorted the shape of static mesh cubes by activating modelling mode, adding edge loops and using PolyGroup Edit to move, rotate and scale the faces, edges and vertices of the cubes' meshes. 

To make the environment look more like a cave, I created a material with a light grey base colour, a specular value of 0.5 and a roughness value of 0.5 to apply to the rocks. I also created a material for the lava using an orange base colour, specular value of 0.5, roughness value of 0.2 and an emissive colour of a pale orange to further light the level alongside the existing directional light.  




In the level blueprint, I added background sound effects of a cave environment using Event BeginPlay and Play Sound 2D. 




To create moving platforms, I firstly created an actor class blueprint and added a cube and an InterpToMovement component. With the InterpToMovement component selected, in the details panel, I set the duration and control point values and changed the behavior type to Ping Pong to make the platform continuously move between two points.  






Since the level was quite dark, I created a simple lantern model in Blender and then imported the model into Unreal Engine and created a black material and a glass material to apply to the two material slots in the static mesh editor. 




I then created a new actor class blueprint and added the updated lantern static mesh, a point light and two cubes to create an arm for the lantern. I then added this blueprint into my level and duplicated it multiple times to place lanterns along the cave walls to better light the level. 




In Adobe Illustrator, I created a simple pixel-style health bar and imported the full and empty versions of the health bar design to the content drawer in Unreal Engine. 




Within a user widget I added a canvas panel and a progress bar. With the progress bar selected, in the details panel I added my background image and fill image and changed the size X and size Y values to match the scale of my png files. I then positioned the health bar in the bottom left corner of the canvas panel and moved the anchor on top of the health bar. In the details panel, under progress, I set the the percent of the progress bar to 100%.




 
In the third person character blueprint I added a float variable and named it health and set its default value to 100. Next I went back to the health bar widget and pressed bind in the details panel to create blueprints that connect the health value to the widget.  




To show the health bar widget within the game, I created a script off of the existing Event BeginPlay node within the third person character blueprint. 





In the third person character blueprint, I created a damage system using Event AnyDamage. I also created a sound cue which randomly plays one of two sound clips when the player receives damage.




I created a new actor class blueprint containing a box collision to surround the lava. When this box collision is overlapped by the player they receive damage. 




To move the player to safety once they have made contact with the lava, I added an empty actor into the level above a rock and created a blueprint which teleported the player to the location of the empty actor once they had overlapped the trigger box surrounding the lava. 

Playtest: 




Week 3 + 4 Plans: 



Location: Preston, UK

Comments

Post a Comment

Popular posts from this blog

Sem 3 Submission

-
Image
Semester 3 Learning Agreement: : Western Project (UI Design) Research + Development Blog Posts: Week 1: Planning the Looting System Week 2: Design Characteristics of the Western Genre Week 3 + 4: Collecting Inspiration Week 5 + 6: Initial Concepts Week 7: Creating the Western Prototype in UE5 (Part 1) Week 8: Creating the Western Prototype in UE5 (Part 2) Week 9: Creating the Western Prototype in UE5 (Part 3) Week 10: Creating Loot Icons Week 11: Adding Pop-Up UI Elements Week 12 + 13: Creating Mission Passed/Failed UI Week 14: Improving the Lighting + Final Touches Knight Light (UX Design) Research + Development 
Read more

Semester 2 Submission

-
Image
At the start of semester 2, I had no prior experience with Unreal Engine 5. To broaden my skillset, I set a goal to learn the fundamentals of the engine and create functional UI elements within the engine, each with a unique design style. I initially planned to create a health bar, speedometer, and item collection counter; however, as I became more confident using Unreal Engine 5, I shifted my focus towards creating more complex UI prototypes tailored to three distinct game concepts, each with unique genres, themes, and gameplay. To achieve this, I dedicated most of semester 2 to learning about Blueprint scripting within Unreal Engine 5 in preparation for creating my 3 UI prototypes in semester 3.  Learning UE5: Throughout semester 2, I used tutorials and courses to learn the fundamentals of Unreal Engine, and then applied this knowledge by creating a variety of systems within Unreal Engine, such as health bars, door animations, item pickups, and more. Creating a book of common nod...
Read more

Week 7: Creating the Western Prototype in UE5 (Part 1)

-
Image
Creating a New Level I created a new level and called it 'my_saloon', and then I imported the following assets that I will use to build the environment: Saloon Interior ,  Old West VOL.1 - Interior Furniture ,  Old West - VOL 2 - Tradesmen Tools and Props ,  Old West VOL.3 - Travel Supplies and Goods ,  Old West - VOL 4 - Goods and Supplies ,  Old West - VOL 5 - Town Props and  Old West VOL. 6 - Town and Industrial . I then used the modular wall meshes from  Saloon Interior  to start building the layout of the saloon.  Creating the HUD I created a simple crosshair widget by adding a small white box and aligning it to the centre of the canvas panel. In the character blueprint, I used a 'Create Widget' and 'Add to Viewport' node to make the crosshair visible at the start of play. I promoted the return value to a variable so I can reference the HUD widget later. Creating a Working Door To enable the player to pass through an open door, I had to...
Read more