Hello everybody! Today Iâm going to be showing you how to make a screen fade to black in your game.
CHAPTERS
INTRODUCTION
Hello everybody, and welcome to the guide! Have you ever wanted to make a screen fade to black, in a dramatic and cinematic way? Because if so, this is the guide for you! And if youâre still not sold on the idea, screens fading to black are a great way to segway into cutscenes, timeskip, and other storytelling and gameplay elements. Enjoy the guide!
DISCLAIMERS
Now, the thing about this guide is a lot of the elements are very customizable. For example, you can:
- Make the screen fade to a different color thats not black
- Make the fade seamless and tedious, or make it choppy and simple
- Make the fade fast or slow
Below, under each step will be ways you can customize things, however for a nice in between of everything you can stick to the settings I use.
Additionally, this guide is not intended for platformer.
MATERIALS
- 1 Teleporter
- 1 Button
- 1 Camera View
- 4 Barriers
- 7 Blackboards (customizable, more blackboards = more work and smoother fade)
- 5 Triggers (customizable, same principle as blackboards)
STEP 1
First, place down a button. Then, go into the buttons settings and under
âWhen button pressed, transmit onâ and type a new channel name of your choice. In this guide I will be using the channel TELE1 for the button to transmit on.
The other settings, such as the interactive time and the button interaction name doesnt matter and is your choice.
STEP 2
Place a teleporter in a blank area of your map, and place a camera view in a similar place. Adjust the camera view so its as small as it can possibly be and the teleporter is roughly in the center of it. Now, enter the teleporterâs settings and in channels set âTeleport here when recieving onâ to your buttons output channel.
STEP 3
Next, insert a blackboard and change its appearance color to black (or any other color you want the screen to fade into). Then, size it to a little bigger than the size of the camera view.
Now, enter the blackboards settings and under availability set âShow on game startâ to no, and set âShow prop when recieving onâ to the buttons channnel from step 1. In my case, this would be set to TELE1.
STEP 4
Now place a trigger and set its trigger delay to 0.15 (or any amount of your choice, the lower the quicker the fade). Then in âTrigger when recieving onâ type your original buttons channel. In âWhen triggered, transmit onâ enter a new channel name of your choice. For me, this will be FADE1.
STEP 5
Grab another blackboard and insert in on top of the first one at a similar size. Set this blackboardâs opacity to 0.15 more than the firstâs, meaning in this case it would be set to 0.30. Change the color to black and set âShow on game startâ to no, and set âShow when recieving onâ to your triggers outout channel. In my case, this would be FADE1.
Also place another trigger and under âTrigger when recieving onâ, set the first triggers output again. Then, set âWhen triggered transmit onâ to another unused channel name of your choice. Mine will be FADE2.
STEP 6
Repeat the previous steps, adding a blackboard and setting the color to black, the opacity to 0.15 more than the previous blackboards, the âShow on game startâ to no, and finally the âShow when recieving onâ to the previous triggers output channel.
Add a trigger as well with a 0.15 second delay, the âWhen triggered, transmit onâ set to a new channel of your choice, and the âTrigger when recieving onâ as the previous triggers output channel.
Repeat these steps until you have reached a 1.00+ opacity and have a layout similar to the one shown below.
STEP 7
Lastly, add one barrier at each edge of your pile of blackboards. Set the color to black and make sure they cover the whole length of one side.
STEP 8
And ta-da, youre done! Now, whenever you click the button you placed you should be teleported to the teleporter and have your screen fade to black!
CONCLUSION
And there you have it, how to make a relatively simple fade to black system for your game! Note that you should roughly follow the guide but, as said in the disclamers section, a lot of the numbers are highly customizable and you can mess around with them!
Tell me if you have any issues or questions, and enjoy this simple system!