Enemy Explosion VFX in Unity!
This is going to be another exciting topic to discuss today — VFX (Visual Effects)! It is going to be similar to how we created PowerUp Animations, but more in-depth. Ok, let’s get started!
1. Creating Enemy Explosion Animation
This step is going to be pretty similar to what we have done for PowerUps (*You will need to have a series of Enemy explosion frames ready to be used)
- Select Enemy Prefab → go to Window → Animation → Animation
- When the Animation Window pops up, click ‘Create’ and ‘save’ it into the Unity folder.
- Click on the record button, then drag and drop in your series of Enemy explosion frames into the animation window.
4. It’s looking amazing when test-played!
2. Uncheck ‘Loop Time’ in Animation
If you try to play the game, what happens? As soon as the enemies are spawned, they start to explode and explode again continuously, don’t they? Before we figure out how to trigger this animation to start correctly, we can first deal with this looping animation issue.
In order to stop the animation looping, we need to click on the Enemy Explosion animation that we created above. In the Inspector window, you will see a text called ‘Loop Time’. We need to uncheck this.
Now, the animation will only play once.
3. Create a new state that will bridge between ‘Entry’ & ‘Enemy Explosion Animation’
We need to create an empty state that will do nothing when the game started instead of playing the animation instantly. In order to do this,
- Select Enemy Prefab → Go to Animator Window.
- You will notice there are 3 text boxes included (Any State, Entry, and the animation that you created (In my case, it is ‘Enemy_Destroyed’))
- Currently, the Enemy explosion animation is being called out automatically. We need to create a new state (Empty/Null) that will run first, then runs Enemy Explosion.
- Sequence: Entry → Empty → Enemy_Destroyed
4. Click on the arrow between Empty and Enemy_Destroyed. Then, in the Inspector window, uncheck ‘Has Exit Time’.
- This ‘Has Exit Time’ will cause a slight delay when the animation needs to be played. So, in order to play immediately, let’s uncheck this.
4. Parameters in Animator
There are parameters (float, int, trigger, and bool) that we can set in Animator. Then, we can use them to have better control of the animation. In our case, we can use a trigger type parameter that will create a condition and can be called out in our Enemy script.
- Go to Parameter window in Animator → Click on ‘+’ → select ‘Trigger’ → Rename it as ‘OnEnemyDeath’
2. Now, let’s click on the transition arrow between Empty and Enemy_Destroyed again. Then, in the Inspector window, under Conditions, click on ‘+’ sign → add ‘OnEnemyDeath’.
Awesome! Now, we just need to work on the script that will call this ‘OnEnemyDeath’ parameter out.
5. In Enemy script
Here is our last step. Let’s go into our Enemy script. When do you think this animation should be triggered? I think the Enemy Explosion animation should play when the enemy was either hit by the laser that the player shot or by the player game object. Then, under OnTriggerEnter2D(), when the enemy collides with the player or the laser, we need to get this animation played BEFORE we destroy the enemy gameobject.
In order to start the animation, we need to get “OnEnemyDeath” condition called out. That means we need to get the Animator component at the start.
Now, we can say _enemyVFX.SetTrigger(“OnEnemyDeath”) to get the animation played BEFORE the Enemy gameobject is being destroyed.
- IMPORTANT: we need to wait few seconds before we destroy the Enemy in order to play the animation fully. We can add 3 seconds by writing Destroy(this.gameObject, 3f);
Let’s check out if it’s working properly.
Hmmm… We shot the enemy and the animation is playing properly, HOWEVER, the enemy can still move forward at the same speed and collides with the player that causes the player to lose 1 health point.
I think it would make much more sense if
- The enemy’s speed would reduce down when explodes.
- The enemy can no longer collide with the player when explodes.
In order to achieve 2 statements above, we need to
- Create a bool variable _isEnemyDying which will be false at start.
- Add if statement if (_isEnemyDying == false) so that OnTriggerEnter2D() will run only when it is false.
- We will turn _isEnemyDying = true when the enemy collides with either the laser or the player.
- We will also write _enemySpeed = 2f; to reduce the enemy’s speed.
Let’s see if it’s working better.
Cool! When the enemy collides with the laser, the speed is reduced & no longer collides with the player!
Thank you so much for reading!