Tutorial: Expression Enhancement Course #3 – Using Shaders

ACTION GAME MAKER OfficialTutorial/チュートリアル
,
2

Let’s Create a Blur Shader

  1. Open the game_scene tab and select the Sprite2D node.
    ![image|529x254]
  2. In the Inspector, go to CanvasItem > Material > empty, and select New ShaderMaterial.
    ![image|445x500]
  3. Click it again to expand the menu, then create a new Shader.
    ![image|433x392]
  4. Since it’s a blur shader, name it blur.gdshader when saving.
    ![image|383x355]
  5. Click on blur.gdshader. The panel will switch to a code editor for shader scripts.
    ![image|690x234]
  6. Copy and paste the following code to overwrite everything in the shader:
shader_type canvas_item;

uniform float blur_radius : hint_range(0.0, 10.0); // blur strength

void fragment() {
    vec2 size = vec2(textureSize(TEXTURE, 0));
    vec2 uv = UV;

    vec4 sum = vec4(0.0);
    int blur_size = int(blur_radius);

    for (int x = -blur_size; x <= blur_size; x++) {
        for (int y = -blur_size; y <= blur_size; y++) {
            vec2 offset = vec2(float(x), float(y)) / size;
            sum += texture(TEXTURE, uv + offset);
        }
    }

    float samples = pow(float(blur_size * 2 + 1), 2.0);
    COLOR = sum / samples;
}
  1. In the Material > Shader Parameters, you’ll now see a new parameter called Blur Radius. Adjust the value to see the background become blurry.
    ![image|432x459]

For Those Who Say “I Can’t Write Scripts!”

Godot uses its own shading language called GDSL, and shaders must be written in code.
However, many creators have already made a wide variety of shaders. You might find one that suits your needs by searching online or visiting sites like:

:globe_with_meridians: https://godotshaders.com/

Working with the AnimationPlayer

The blur_radius shader parameter can also be animated using the AnimationPlayer.
This makes it very easy to create animated effects using shaders—great for teleportation effects, battle transitions, and more.

This concludes the Visual Effects Course.
If you’re interested in other tutorials:

1. Graphics Course
For those who want to animate their own original characters.

2. Scripting Course
For those who are fine using default characters but want to build various mechanics and systems.