How to get a nice Glow effect in Godot ( + Post-Processing & World Environment Node )

welcome to another godot tutorial today we look into the world environment note glow and a bit into hdr colors i already set up a simple example scene and added a world environment node in this node let's add a new environment now we need to go to background and set mode to canvas otherwise it won't work at all there are a lot of options but not all work in 2d so first we're gonna take a look at adjustments here we can adjust the overall brightness contrast and saturation of the scene [Music] we can also set up a color correction which i usually like to set to a gradient and inside this gradient we can set a color correction to the whole scene with the default black and white gradient everything looks as normal if we change the colors you can see that the colors in the scene get remapped to those new values [Music] and like this you can quickly change the overall look of a scene you can also load different gradients for different scenes to just make everything more interesting you could also introduce different gradients for different parts of your game world let's disable the adjustments and let's check out glow my most favorite thing here if you enable the glow you can already see what it does although it looks a bit strange and you can see a lot of artifacts at the edges you can see even more artifacts with very small glow areas as on this duplicated particle emitter [Music] it has very small dots so you can see those artifacts appearing and disappearing which is really not very beautiful first let's fix those strange edges by turning big cubic upscale on now it looks much smoother before we fix the flickering let's have a look at the blend mode the default mode is soft light but i like screen much more as it gives a more intense effect that we can turn down later but the overall result is something that i enjoy more than soft mode you can also choose additive which in my opinion also looks good but sometimes it's a bit too much so most of the time i set it to screen [Music] you can also choose replace mode this only shows the result of the glow is good to debug or to just play around with settings and see what happens now let's fix the flickering on the small pixel or small glow areas open up the levels drop down it took me quite a while to find this i find it a bit hidden but you can turn on and off the different levels of the glow with increasing level the glow is bigger and bigger as you can see as i turn them on and off in replace mode the smaller the level the smaller the glow so if you enable level 1 you can see it's a very small glow to get a nice glow even on small elements i like to enable levels 1 to 4. very often i also enable level 5 and sometimes i even enable level 6. that's a really huge glow so you just have to see if it fits your project let's turn blend mode back to screen it looks much better now but still too intense to fix that we need to lower the intensity to 0.1 and now it looks really cool and like a neon light next setting we're looking into will be bloom to see what we're doing i disabled most of the levels and set the blend mode to replace and now you can see if i turn up the bloom handle also the layers that are below the hdr threshold will be taken into consideration and it will look a bit more soft overall the next setting is a very important one it's the hdr threshold what does it do in my example scene the letters that you can see have a certain hdr intensity or rgba overall intensity the p 1.0 is just normal white p 0.9 is a very bright grey the hdr threshold is basically the limit when the glow starts affecting the scene if the hdr threshold is below 1 even nodes that are darker than white will be taken into consideration that can be useful when using gles2 because there you don't have any hdr colors the hdr luminance cap is basically the maximum value of hdr color that is taken into consideration for the glow if you lower this you glows with a very high amount of hdr color will be a bit less intense as you can see in the example you can leave that at the default setting or you can set it to 4 however you like i found out it mostly depends on your scene and how much hdr elements you use now if we enable and disable it you can see the difference right away and now with the glow setup let's go into some detail on how to make the best use of this glow in this example particle system i set the color to be 4 0 0 so it's an hdr value the red is over 1 so if we turn it up to 10 you can see the glow gets a bit more intense but not by much why is that so you can see something interesting happening if we enter a very low value into these other two color fields so let's add some green and you can observe the result changed quite slightly and if we enter some blue value into this color you can see it also changed the appearance by quite a lot even if it's a small value compared to the red if you have a pure color glow it can never go too white because it's only one color of the three channels if you add just a little bit to the other channels it can reach much brighter colors overall because it can theoretically go to pure white so you can see if i take this red and just add 0.5 to the green and 0.5 to the blue channel overall it's a much more intense glow color now if we play with the values a little bit like adding a bit less to the blue channel then to the green channel you can see it looks a bit more fiery this is the effect that i'm usually going for making interesting and strong colors i often like to set up very strong hdr colors with a slight shift to one channel like this fiery red here with a very strong red channel and i'll save it as a preset so if i need a very strong hdr color later at another spot i can just use the preset and then play with the slider here to get some really nice glowing colors that look great with the glow i quickly added a sprite and set it to additive and now i can show you on a large scale what i mean it's just a white sprite but if i add this hdr color i get this nice color shifting gradient and it's because the colors add up the gradient basically starts with the most intense color so the red in this case if i lower the alpha you can even see it gives a very very nice glow you can use this for some surroundings or just to make another effect a bit more intense and give it a bigger glow and it works really nice even if you change the color you can see if i play around with the used slider here i get some really nice colors and effects also keep in mind that colors are multiplied even hdr colors so if you have a strong glow like on this particle system and we set up the color in the gradient as something maybe a bit complementary or at least very different from the original color you can create some really interesting effects and get some nice color shifts let's have a quick look how it looks with and without the glow and you can see especially on the small particles glow really improves the effect let's go back and have one more look to the adjustments property of the environment by turning it on and off now you can really see what it does but color correction is not the only thing the adjustment property can do you'll also find the settings for brightness contrast and saturation like i showed you in the beginning what's important to know is that these effects are linear they don't use hdr values and do flat adjustments only if you want to do hdr adjustments check out the tone map settings in there you can change the exposure which respects the hdr values also check out the other modes and see which one fits best for your game so much for that topic as always you'll find all the files on github and i'll put a link in the description i really hope this video was any help and if it was leave a like and subscribe to the channel for any further updates and new videos until then enjoy making your game see you soon bye

Channel: picster

Views: 6,316

Keywords: Godot, Godot Engine, Game Engine, Engine, Tutorial, How To, Glow, Post Process, Dreamy, Post Processing, Adjustment, Color Grading, Color, HDR, Fire, Particles

Id: p15HiC69vPE

Length: 9min 13sec (553 seconds)

Published: Fri May 28 2021

Reddit Comments

[u/RPicster]

I get these questions so often about my projects - How I get such a nice glow effect.
The default settings of the glow property of a new Environment / WorldEnvironment are not so perfect - So in this video I show the settings that I usually run with.

I also give some tips on choosing the right HDR colors that work well with the glow.

I hope it helps!

[u/golddotasksquestions]

That's exactly how I use WE in 2D as well. Great video!

The Glow question comes up quite often in the community channels, this video is a great reference I will share often, thanks!

[u/Goache]

Is the WorldEnvironment node always required for these pretty glow effects in 2D? I wonder if it's possible to apply a glow effect on a per sprite basis.