Damage VFX using Animated Sprites in Unity

On the previous article, I tried to demonstrate the way to enable the expolsion effect within a game object. We can also use visual effects separately as game objects in our game and instantiate them in the runtime.

Have a quick look how our game looks like without any VFX:

Without VFX

To begin adding visual effects to our game, we simply create a new game object and add the desired animation to the game it. To illustrate the process, I will use Explosion game object which will be activated if we got shot or shoot a particular thing in the game.

The explosion game object is provided below.

Since it does only make sense to play the explosion animation only once, we should make sure that it does not stand still in the scene. We need to make sure that explosion game object will be destroyed. The line below is the only command that exists in the Explosion script. Make sure you prefabbed it.

Where and when do we need this prefab? Easy, we want them at the position of the object that is being destroyed at that time. For instance, if our player ship runs out of lives, we can use this explosion.

First, we need to reference to the explosion prefab and attach the prefab to the player game object from the inspector.

[SerializeField] private GameObject _explosion;

All left to do is just adding the appropriate instantiate command to the right place: just before we destroy the player.

Instantiate(_explosion, transform.position, Quaternion.identity);

We can also use some additional effects on the player ship to demonstrate that it has been hit before and now we are playing as damaged. We are going to use a fire effect both ends of the wings for this demonstration, and led them create a “got hit” perception one by one. In order to make sure that they will be at the exact place on the wings, we need them to be child of the player ship. Just by making them a child of the parent and dragging them at the appropriate places on the player, we are ready to go. Only thing left is to animate the sprites (If you do not know how to do it, just click here for the tutorial). Just prepare one of them and duplicate it for the other wing. Don’t forget to prefab.

As you can see, a thruster is also placed as a child object for the player, using the same logic.

Just like we have done with the Shield power-up, we are going to activate and deactivate these fire game objects in game, once we are shot. But first, we need to give a reference to them from the inspector.

[SerializeField] private GameObject _rightFire, _leftFire;

The latest status of the switch statement is provided below:

We’re all set. Here is a preview from the game with visual effects:

As you can observe. The thruster makes us to feel like our ship is actually going forward in the space. We can see the asteroid and enemies being exploded once we shoot them. And if we get the damage, we can observe the fire coming out of the wings.

With the visual effects, our game feels like more realistic than ever.