Making Effects with Godot Visual Shaders

Godot is capable of some amazing visual effects through the use of shaders, including Visual Shaders, which are Godot's answer to Unity Shader Graph. In this video, I create dissolve, hologram, and hull outline shaders to explore the strengths and shortcomings of Godot's graphical offerings.
------------------------------------------------------------------------
👇 Download the project on GitHub: github.com/daniel-ilett/shade...
📰 Read this tutorial in article format instead: danielilett.com/2024-02-06-tu...
------------------------------------------------------------------------
📚 Get a copy of my shader book here (affiliate): www.dpbolvw.net/click-10074214...
✨ Grab my Hologram Shaders Pro package here (affiliate): assetstore.unity.com/packages...
✨ Grab my Snapshot Shaders Pro package here (affiliate): assetstore.unity.com/packages...
------------------------------------------------------------------------
💬 Join the Discord: / discord
💖 Support me on Patreon: www.patreon.com/danielilett?f...
☕ Or throw me a one-off coffee on Ko-fi: ko-fi.com/danielilett
------------------------------------------------------------------------

[@amirosman8797]

This is absolutely amazing! Please make more videos on shaders and VFX for Godot 3D, there isn't much of them on KZbin

[@danielilett]

It's definitely something I'm exploring! We'll see if there's lots of demand for this video - and if so, maybe the next Godot video will be out a bit quicker!

[@luckyknot]

As a total noob, even if this is yet complex for me, your explanations are very clear and easy to follow, thanks a lot for pulling this out!

[@Battan1337]

More if this please! :) I want to know how to do post FX using vuisual shaders

[@blackcoffeerider]

Thank you for creating this video - learned some new things to look into. For everything that may be better and more convenient to do in unity... There is a superpower in godot that unity doesn't have: you can make a feature or a pull request to improve it and the devs might actually listen to you. If we get more of your videos with less "Unity" in it I am willing to write the feature requests for you and link to this video....

[@talols]

Thanks big D, keep up the good work.

[@joelcreatesgames7148]

Great video, would really like to see a pt2 with the voroni and a focus on 2D shaders!

[@BarcelonaMove]

Love it! Keep it up!

[@JeffThePoustman]

Very helpful. Thank you.

[@ieatthighs]

Great tutorial, thanks

[@jupiterbjy]

About godot's overall difference from unity or unreal with how it's node & tree, scene system, etc - I like to think it as how Blender is different from 3DS Max or else, with it's unique workflow that involve cursor and heavy reliance on keyboard - or python with it's unique move on heavy reliance on asynchronous & generator concept unlike any other languages which development was driven by cooperates. Open sources projects - regardless of what type it is - tends to differ from what commercial market does in many ways. I think that's what unrestricted free people can come up with, unlike in corporations where company can't take risky move of trying new things as it has too many responsibilities to take. So yeah, to people from unity or other engines might feel awkward and weird - when project's design philosophy finally 'clicks in' it it feels really straightforward and natural - like how we eventually utilize cursor a lot in blender, or how we utilize full potential out of python, thinking it's natural thing. Believe me, I also started as C lang, unity, 3ds max yet here I am, using blender, python, godot which I literally HATED, DESPISED all that 3 early on!

[@Bfahome]

Here's another vote for the voronoi shaders tutorial!

[@user-lz5pq1qb5k]

thnkU, this tutorial make my game better

[@ASTROBOXSD]

please make more Godot based videos thank you!

[@masterjo98]

thanks a lot

[@jupiterbjy]

About that bug that's actually shader compile error. After you save the shader, in `Material -> Shader`, right click the assigned VisualShader then you can get the code of it in Godot Shading language. Make two shader code one with Vector to color interpretation, one with VectorDecompose. And you'll notice that there's error on one without VectorDecompose in fragment shader. (in fragment) // VaryingGetter:5 vec3 n_out5p0 = WorldPos; float n_out5p2 = n_out5p0.g; // Output:0 ALPHA = n_out5p2.x; // ^^^ error(37): Invalid member in 'float' expression: '.x' (This error is also logged in debugger with message "set_code: Shader compilation failed") Which is why it didn't work - because float doesn't have member x. If we fix this to: ALPHA = n_out5p2; Then this do work. Have you searched issue page about this? Wonder if this should be reported or not, looks like somewhat weird considering we can't output color at Expression Node anyway, so there can't be color-only type either.

[@jupiterbjy]

Looking down into this rabbit hole further, saw many QnA about shader in godot 3 are just using VectorDecompose despite node can be expanded to use XY, XYZ, RGB, RG(in uv) - Maybe using explicit conversion rather than non-implicit conversion is not a designed or desired philosophy of godot, kinda interesting

[@jovlem]

Great stuff! How costly is the 3d perlin noise? As it is a procederal effect that it's need to re-calculate every frame, right? The scanlines texture at 12:04 could also be done with using the height position in a "sine" function. Much cheaper but nearly the same effect.

[@danielilett]

The 3D Perlin noise is decently expensive. I haven't profiled this, but as you say, it's recalculated each frame and I imagine it involves a lot of GPU instructions. If you really wanted to optimise this effect, you can use a pre-generated Perlin noise texture and just sample that. In this video, I wanted to talk about the custom node features of Godot though! If you're planning on ever using animated/scolling Perlin noise then a basic texture probably won't cut it, either. You are also correct that you can achieve the scanlines in other ways! I do like the texture approach as it gives you a lot of flexibility to define the thickness and shape of the scanlines (you can interlace thick and thin scanlines for example, which is probably harder to do with pure math in the shader). I probably could have picked a better texture to emphasize that, but alas.

[@dibaterman]

Coming from unity shader graph going to godot scripted shaders I learned so much more. I think shader graphs in my case were harmful to my learning and development. Folks can really take for granted how much can be taken away from coding it from the ground up. With that said, yes there are some things that become redundant and likely should have predefined nodes to handle the back end. I mean programmers do that all the time with Static methods and functions.

[@danielilett]

Yeah, people learn differently but sometimes it's nice to just do everything from the absolute basics rather than relying on Shader Graph doing the heavy lifting for you! Like I think I mentioned in the video, Godot visual shaders is a bit closer to how you write things in code so I'm glad it's helped you!

[@user-ym7qj2iz5h]

thanks

[@Jubsworth]

For your second sphere (scanlines) I can't seem to change the initial sphere from white after getting the scanlines working? Any tips?

[@antoineberkani9747]

Sorry, but could you explain what alpha scissor threshold does? Does it turn any value below 0.5 transparent? Why not just use alpha?

[@danielilett]

When you set an alpha scissor threshold, Godot will compare that value with the alpha value. If the alpha is above the threshold, it will render that pixel with full opacity. If alpha is below the threshold, it will not render it. There's different ways that game engines render objects. To simplify, completely opaque objects (which don't use alpha scissor threshold) are the quickest to draw, while transparent objects (which use alpha blending) are expensive. "Alpha clipped" objects, as I will call them, are normally somewhere in the middle in terms of expensiveness. If you don't actually want your object to be displayed semi-transparent, but you do want to cut out some parts of the object, then you can use alpha scissor threshold. I hope that clarifies things a bit!

[@antoineberkani9747]

@@danielilett Incredibly clear explanation, thank you so much!

[@michalfeher1177]

this too hard for me. Inside blender much easier

[@UnTamedStArBlOb]

why not just use local space for these shaders

[@danielilett]

You can use local space if you want! Whatever space is most useful for the effect you're making. If you wanted objects to dissolve away when they fall below a certain y-level, for instance, it might be easier to use world space for that.