Get a Health Bar in Just 5 Minutes with Unreal Engine 5.5!

This is Rambod and today we build a simple health bar system with a clean UI in Unreal Engine 5.5. We will set up a widget, add health logic, and connect it to gameplay so damage reduces the bar in real time.

1) Prepare the health icon

• Download a health icon (any PNG works).
• Make sure its alpha is set to zero and body color is white.
• Import it into your project by dragging it into the Content Drawer.
• Save the asset.

2) Create the health bar widget

• Right click in the Content Drawer → User Interface → Widget Blueprint.
• Name it WBP_UI or HUD.
• Open it and add a Canvas Panel.
• Inside it, add a Progress Bar.
• Set size (around 100×100 or 150×150).
• For the Background Image, pick the health icon and set it to Draw As: Image.
• For the Fill Image, use the same icon and tint it red to represent health.
• Set the progress percentage to 1.0 to preview.
• Configure the bar to fill from bottom to top.
• Compile and save.

3) Show the widget in the game

• Open your Third Person Character Blueprint.
• In Event Begin Play, create a Create Widget node.
• Select the WBP_UI class.
• Add an Add to Viewport node.
• Now when you play, the health bar appears on screen.

4) Add the health variable

• In the character blueprint, create a float variable named Health.
• Set default value to 200.
• Compile and save.

5) Handle damage

• Add an Event Any Damage node.
• Subtract the damage value from the Health variable.
• This updates health whenever damage is applied.

6) Create a damage trigger

• Create a new Blueprint Actor called BP_Damage.
• Add a Box Collision (size ~200×200×200).
• In the Event Graph, add On Component Begin Overlap.
• Cast the overlapping actor to your character.
• If valid, call Apply Damage with a value of 10.
• Place this actor in the level to test.

7) Bind health to the progress bar

• Open the widget.
• Select the progress bar and create a Binding for percentage.
• In the binding function:
  • Get Player Character → Cast to your character.
  • Access the Health variable.
  • Divide health by 100 to normalize between 0 and 1.
  • Return the result.
• The bar now updates automatically with gameplay.

Wrap up

When you step into the damage box, the player loses health and the bar decreases in real time. This is a clean and functional health system with UI in under 5 minutes. Perfect for beginners and a solid base to expand on.

For more Unreal Engine tutorials, visit rambod.net, subscribe on YouTube, or watch this tutorial here: Watch on YouTube.