Devlog 61: Adding better damage visuals to our UE game

In this post I’ve started to add some better damage visuals in my game.

After checking several assets that can help with this in the UE Marketplace, I decided to go with this one:

Custom Damage and Status Text in Blueprints – UE Marketplace (unrealengine.com)

The price seemed reasonable and the effects looked nice for what I was after.

There are multiple alternatives and of-course you could create something like this from scratch, but it seemed like a good spend to me.

Explicit damage events

In order to start using this asset, I needed to get myself explicit events for damage received. This will look differently for many developers, I will show how I designed mine.

If you followed my previous post, I introduced a new framework for receiving and processing events from my custom server.

Devlog 60: How to handle MMO style motion with UE and custom server over UDP – Unreal MMO Development with Yaz (unreal-mmo-dev.com)

I used it to process motion events and in this post, I will create components for handling damage received events.

As you can see its parent is the connected component. If you wish to learn more how that works, check the previous post which focused on motion updates.

Next I process the damage update.

NotifyOnServer doesn’t do anything yet, its connected to a dispatcher but is unlinked – I will link it to mob AI in near future, to cause it to aggro the mobs.

SpawnDamageForClient is a key function which triggers the event to spawn the actual damage.

Note that I wasn’t able to spawn the damage directly from the component class, so I needed to get the Owner and spawn it from there.

Adding the DamageDisplay component on actor

My ActorBaseBP class is a shared class which I use for my players and my mobs. This blueprint refactors common logic which is shared between them and this includes this damage component.

As you can see, I have my DamageDsiplay component added here.

I then create a function to SpawnDamage, it’s a relatively long function so let’s break it down into small pieces:

The first thing that I do here is iterate over each damage instance and get the damage type, which is a key.

So my damage received is not just a number, but its a Map<String, Float>.

The key refers to damage type. I will decide later whether to have it simple generic categories or sub categories. For example I may have something like:

• magic
  • fire
  • ice
  • lightning
• physical
  • piercing
  • slashing
  • bludgeoning

I may go into the sub-categories so that I can add some interesting effects, such as fire damage reductions or piercing damage resistance, etc.

Get icon for damage type

For getting the icon, I used the data tables.

For the structure, I created one with only reference for a texture.

And I simply populated some damage types to their corresponding icons:

This simply allows me to get a icon representing the damage type.

Display damage: Damage values

Now you can see we got the damage icon into the SkillIcon variable. Next we’re getting the damage value from the Map of data, ensuring that the value is not 0. It can be positive, which means damage taken or negative, which means its healing the actor.

You can see I check if the damage is positive, I assign it a pre-computed red color and if damage is negative, I assign green color.

I also evaluate where my actor is, via Get Component Bounds and I provide a random offset to it so that it doesn’t always appear in same places.

I then simply spawn the dynamic text at world, which is part of documentation from asset:

Custom Damage and Status Text Documentation – Google Docs

Small bug in animation playback with asset

So there was a small bug detected in the asset, which I think was introduced in UE5+.

The root of the problem is with widgets and animations, it appears that if you create a widget and try to play animation on the same frame, there will be issues with playing animations.

So, weirdly, you need to add a delay in, even for time of 0, which makes the animation play on the next frame.

I don’t remember where I first saw this fix referenced in UE forums, but this looks relevant/similar: Widget Animation only playing after a short Delay? – Development / Character & Animation – Epic Developer Community Forums (unrealengine.com)

Results

Now I have different color text for damage/heals and the icons representing different effects.

Red font used for damage and all damage is associated to damage category icon. Heals are green and will also have relevant icon drawn up. See some results below.