How to Make a Screen Fade to Black! [ đŸŸ© , 3/10 difficulty]

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!

8 Likes

tutorial Is unused because all Community Made Guides should be tutorials

1 Like

Nice guide, but it is definitely not 4/10, probably a 3/10

1 Like

Noice guide @CAPRISUNS

Simple yet helpful

3 Likes

Solid guide, CAPRISUNS. Nice job.

1 Like

Very cool!

(Cough cough a bit similar to my guide, but who cares? still a amazing guide.)

1 Like

oh crap i searched for guides like this and none came up, thats why i made it. so sorry if you already have one, can i have the link??

1 Like

nah, I don’t really care. It’s a bit different, it’s like transitioning cutscenes, so its so different from the names, I understand lol.

Don’t really care if someone copies my guide, even if doesn’t have credits, I jsut think its cool someone else is covering it.

Link: dont care that you covered the same topic lol

1 Like

ah that explains why it didnt popup then. thanks for being chill about it, ima go check out ur guide now

1 Like

Alright, thanks, lol. I dont understand why to fuss about it anyway, if it’s a human error, then so be it. It’s fine. Plus it was really obscure

1 Like

Bumping this a day earlier bc why not

2 Likes