This is the testing Godot forums! All forum posts unique to this forum will be deleted! Please use the main forums here for any posts you want to keep. All forum rules still apply.

Texture tricks

DschoonmakerDschoonmaker Posts: 216Member

This is just some miscellaneous shader tricks I found, mostly using texture().

First, if you need a circle without adding extra mesh detail, you can do that in a shader:

ALPHA = 1.0-distance(UV,vec2(0.5));
ALPHA_SCISSOR = 0.5;

or if you need alpha:

ALPHA = step(distance(UV,vec2(0.5)),0.5);

This is just a simple quad, but appears to be a circle. Plus, unlike a texture, it has endless detail. The circle is calculated per screen pixel.

If you've ever used a noise texture as a normal map, you might notice some artifacts:

You can smooth out the noise by using textureLod() instead of texture():

NORMALMAP = textureLod(noiseNormal,UV,lod).xyz;

The larger lod is, the smoother(and blurrier) the noise will look.

Masks are great for some things. If you need some noise without edges, you can multiply the circle mask by noise.

float mask = 1.0-distance(UV,vec2(0.5));
float noise = textureLod(noise1,UV,noiseLod).r;
ALPHA = mask*noise;

That could be useful for water/spray particles.

And using a more complicated mask with scrolling noise, you can get some nice fire:

(The fire doesn't look very good in the GIF, though)

Comments

  • SIsilicon28SIsilicon28 Posts: 693Moderator

    That is some very clever shader work. Good job! 👍🏽

  • cyberealitycybereality Posts: 928Moderator

    Nice tricks!

  • DschoonmakerDschoonmaker Posts: 216Member

    A big one I forgot: use alpha scissor with noise to make a dissolve effect. Plenty of people know this one, but it looks really nice, especially for stylized games.

  • DschoonmakerDschoonmaker Posts: 216Member

    Combining noise with circular UVs can make a ripple effect:

    These UVs are simple to make:

    • Make a cylinder(with UVs)
    • Scale the top vertices in
    • Scale down to zero on the Y/Z(whichever is up) axis
  • eyeEmotioneyeEmotion Posts: 83Member

    Do you have a video-tutorial of that flame effect?

  • DschoonmakerDschoonmaker Posts: 216Member

    I don't have any tutorials on the flame effect, but I suppose I could make one.

  • DschoonmakerDschoonmaker Posts: 216Member
    edited May 2020

    I will make a tutorial on the flames soon, I just want to refine them a little before I do. Right now, the fire is a flat plane, and I also want to add some little touches like heat waves.

    Edit: I'm almost done, now the fire can be viewed from all angles and has impostor support. I really just need to change a few things and add heat waves now.

  • cyberealitycybereality Posts: 928Moderator

    Very nice.

  • DschoonmakerDschoonmaker Posts: 216Member

    I liked that too, glad I found it.

    Another one:

    float fresnel = sqrt(1.0-dot(NORMAL,VIEW));
    

    taken from https://docs.godotengine.org/en/stable/tutorials/shading/your_first_shader/your_second_spatial_shader.html, but it's a little bit obscure.

    In the same example, fresnel is added to albedo and multiplied by roughness:

    ROUGHNESS = 0.01 * (1.0 - fresnel);
    ALBEDO = vec3(0.1, 0.3, 0.5) + (0.1 * fresnel);
    

    Although there are other ways fresnel can be used.

Sign In or Register to comment.