# Godot Shaders: How to Make Animated 2D Fog (Procedural)

https://i.ytimg.com/vi/QEaTsz_0o44/hqdefault.jpg

Godot Shaders: How to Make Animated 2D Fog (Procedural)

Timestamps:
Step 0 – Setting Up: 1:39
Step 1 – Making Random Numbers: 4:49
Step 2 – Making Perlin Noise: 8:31
Step 3 – Fractal Brownian Motion: 15:39
Step 4 – Distortions, Moving Distortions: 19:15

Music: Soul & Mind by E’s Jammy Jam

Thanks for watching…

godot 3 2 shader procedural game make fog animated dynamic cloud noise texture glsl opengl directx unity unreal cryengine blender 3d cycles render tutorial im just adding random keywords in for seo

Gonk

source

### 25 thoughts on “Godot Shaders: How to Make Animated 2D Fog (Procedural)”

• May 12, 2019 at 17:17

It looks epic and better. But the problem with this is that it may consume a lot of memory since it runs behind constantly. There may be another way to do it. I have it in my mind. Thinking like in photoshop.

• May 12, 2019 at 17:17

This is quite a calculation heavy shader though. Be careful to use it sparingly

• May 12, 2019 at 17:17

So if we want to implement this shader in a game, we have to attach it to the camera object?

• May 12, 2019 at 17:17

Awesome tutorial, I really don't have any knowledge in shaders, but you made it really easy to follow, thanks!

• May 12, 2019 at 17:17

Wow, this is amazing! Following your example, one can make lots of neat effects with shaders. Thank you for sharing!

• May 12, 2019 at 17:17

Awesome video!
I would just like to point out that you said that the floor function would return the integral part of the float, but actually floor rounds a number towards negative infinity. floor(1.5) is 1 but floor(-1.5)is -2. To really get the Integral part one should truncate the number, which is the trunc() function

• May 12, 2019 at 17:17

Small tip how to make color of the fog easily changeable in Editor:
1. Replace
uniform vec3 color = vec3(0.35, 0.48, 0.95);
with
uniform vec4 color : hint_color;
2. Replace
COLOR = vec4(color, final);
with
COLOR = vec4(color.rgb, final);
Now you can set your fog color right in Editor! ๐

• May 12, 2019 at 17:17

Wow! You really have a great future making tutorials, if you wish. I see that you celebrated 1k subs and that means that you want to grow your channel. You have the kind of the style and depth as this other guy Traversy Media. Check him out. He has over 500k subs and has made udemy too. He gets around 40k views on each video and posts 3 or 4 times a week and around 700k+ views a mouth. I think you can be that guy for Godot and push it to the heights of Unity and Unreal. This community needs someone like you. Thanks.

• May 12, 2019 at 17:17

This is so cool bro, you need to keep doing these tutorials
, Like and subscribe ๐ (Y)

• May 12, 2019 at 17:17

Thanks for this, love your style! Keep it up, you're going somewhere ๐

• May 12, 2019 at 17:17

I guess you can using vscode with autosave functionality ๐

extremely useful tutorial btw, parametric stuff is always much appreciable !

• May 12, 2019 at 17:17

I was having a problem with your fog shader code. I was getting an error on line 10

return fract(sin(dot(coord, vec2(56, 78)) * 1000.0) * 1000.0);

I changed the vec2 values to floats by adding .0 at the end, it fixed the problem.

• May 12, 2019 at 17:17

Great explanation-skills and a fine outcome as well. You woke my curiosity in experimenting with shaders. Thank you.

• May 12, 2019 at 17:17