Tower Defense Tutorial – Brackeys – Ep. 24

March 4, 2019

Tower Defense Tutorial

Episode 24 – Fading

Youtube – How to make a Tower Defense Game (E24 FADING) – Unity Tutorial

By: Brackeys
Ep. 24

This tutorial focuses on creating an overall fading effect for the game.

We created an empty gameObject, SceneFader, and added a UI Canvas to that, which we then added a UI image to that is just a black image.

Then we added a SceneFader script to our SceneFader object to handle the fade effects. We used IEnumerators to handle the fading methods. We used the IEnumerator for its ability to wait certain amounts of time. The IEnumerator FadeIn uses a yield return 0; line in its while loop so that it updates at the same rate as update (every frame). Yield return 0 basically tells it to wait a frame.

We created a variable of type AnimationCurve, which gives us access to a curve we can manipulate by changing its shape or adding/removing points to control how a value fluctuates. We used this to control the FadeIn IEnumerator. We then duplicated this IEnumerator to create a FadeOut version as well (just swapped the values in the while loop to run the other way to make the rest of the code consistent). FadeOut was then added to a public method, FadeTo. The both receive a string variable that corresponds to the scene name of what scene they should be fading to.

We then just went to all of the scripts/menus where we move between scenes and added this FadeTo call from the SceneFader. This included the pause menu, game over menu, and main menu. This also included making sure to drag our SceneFader into the reference for all of these scripts since they did not want to use FindGameobjectOfType for computer processing reasons.

My thoughts on why an IEnumerator was used here is that they seem to be good with dealing with something you want to happen over time, and they can run while other actions are running/processing. Since we just wanted a fade effect, it’s helpful to let everything else continue to run as opposed to interrupting something to finish this effect. The time element basically lets us have a pseudo”Update” method that only runs for a certain amount of time and then never needs to check again.

SUMMARY

  • If you want a UI element to cover everything (including other UI elements) make sure to check the Sorting Order
  • I still need to look into IEnumerators to get a better grasp on their specific uses