MORE VFX Shader Techniques ft. Godot

Поділитися
Вставка
  • Опубліковано 25 чер 2024
  • More shaders that I use (or want to use more) when I make VFX :) A project containing all my samples is available over at my patreon for free :D
    First Shader Video:
    • Common VFX Shader Tech...
    Patreon:
    / onetupthree
    00:00 - 00:31 Intro
    00:31 - 03:22 Camera Offset
    03:22 - 04:40 Vertex Offset
    04:40 - 06:40 Backface Colors
    06:40 - 08:08 Texture Packing
    08:08 - 08:43 Outro
    #godot #godot4 #vfx #shaders #gamedev #realtimevfx #gaming #visualeffects #tutorial #indie
    BGM
    Artist: KevinMacleod (Incompetech)
    Tracks:
    - Too Cool
    - Jazz Brunch
    - Crinoline Dreams
    - Awesome Call
  • Ігри

КОМЕНТАРІ • 84

  • @giorgimaisuradze2711
    @giorgimaisuradze2711 7 місяців тому +42

    You don't even know how much you doing for godot community by making godot shader tutorials, me and probably many other godot devs are really thankful for you.
    Thanks a lot!❤

    • @onetupthree
      @onetupthree  7 місяців тому +2

      thank you so much 😭 glad i could help!

  • @LeftAreola
    @LeftAreola 7 місяців тому +9

    These videos are incredible! Thanks for taking the time to make them

    • @onetupthree
      @onetupthree  7 місяців тому

      thank you so much 🙇‍♂

  • @centigames
    @centigames 7 місяців тому +1

    Wow, this is an awesome tutorial. Nice examples. graphics, explained everything well! Amazing work! You definitely earned a sub/bell

    • @onetupthree
      @onetupthree  7 місяців тому

      thank you so much 🙇‍♂

  • @Garvep
    @Garvep 7 місяців тому +1

    Great video! Can`t wait for more

  • @BlueOctopusDev
    @BlueOctopusDev 7 місяців тому

    YEEE A TUTORIAL i love your videos

    • @onetupthree
      @onetupthree  7 місяців тому

      thank you so much 😭🙏

  • @daniridao
    @daniridao 7 місяців тому

    Very nice, hope to see a lot more of these

  • @0HHC
    @0HHC 23 дні тому

    0:22 I laughed so hard 😂

  • @user-tc5yk4zd5k
    @user-tc5yk4zd5k 7 місяців тому

    thank you!

  • @purplepixeleater
    @purplepixeleater 3 місяці тому

    when yu said "something..." that made me realize the power of that + sdf in compute shader lol

  • @archyevaldes1421
    @archyevaldes1421 4 дні тому

    So cool

  • @magnuspedersen5751
    @magnuspedersen5751 6 місяців тому

    this is so awesome

    • @onetupthree
      @onetupthree  6 місяців тому

      glad to hear it ! 🙇‍♂

  • @zzzzzzzzzzzzzzzzzzzzzzzzzzzz__
    @zzzzzzzzzzzzzzzzzzzzzzzzzzzz__ 7 місяців тому

    Praise be, vfx bruther

  • @rrpdev1004
    @rrpdev1004 7 місяців тому

    You are amazing 🤩

  • @millerbyte5579
    @millerbyte5579 4 місяці тому

    Hey. Hey you. I appreciate you, thanks for making these videos.

  • @agriasoaks6721
    @agriasoaks6721 7 місяців тому

    Wohoo, yes!

  • @molgeraxproductions6671
    @molgeraxproductions6671 5 місяців тому +1

    This might be a little late, but you can just use a boolean in a shader as an integer with value 0 or 1, so you dont have to jump through the hoop of all that extra calculation. So:
    finalCol = lerp(backCol, frontCol, FRONT_FACING); would do the trick. Otherwise, why would Godot supply us with the value FRONT_FACING if we weren't allowed to use it? ;)
    On another note, using if statements in shaders is frowned upon, yes, because they conflict with the parallel nature of shaders. But that usually means that all paths an if-statement could take will be computed for all pixels, which is where the big performance spike would happen. If the if-statement only assigns two different values, like in this case right here, then it shouldn't have any large impact on performance at all.

  • @kuzuru
    @kuzuru 7 місяців тому

    You. Are. Amazing. ♥

  • @teo2805
    @teo2805 7 місяців тому

    More please!

  • @flamelizard
    @flamelizard 7 місяців тому +9

    A good alternative to Substance Designer is Material Maker 👍🏻 you can do the texture packing there too. Otherwise Gimp is your friend

    • @onetupthree
      @onetupthree  7 місяців тому +5

      oh right 😳cant believe i forgot to mention that
      thanks !

  • @morgan0
    @morgan0 7 місяців тому +2

    for packing 3 grayscale textures into one rgb in affinity (and i assume photoshop), in 3 groups, multiply with a pure single channel rectangle, then set each group to add blend mode over a black background.
    also affinity photo’s procedural texture effect (which kinda is made worse by not having easy ways to save equations) can generate textures with 1, 2, or 3 colors from pure math. supposedly it should be able to define functions and variables to split it up into multiple statements but i couldn’t get that to work so i put it in one statement per channel. i used it to create some channel packed gradient and random sines i used in a muzzle flash effect, although from what i used, i could’ve just exported one grayscale image.

    • @onetupthree
      @onetupthree  7 місяців тому +1

      this is awesome ! thanks for the info 🙏🙏

    • @morgan0
      @morgan0 7 місяців тому

      @@onetupthree no problem

  • @RushedYT
    @RushedYT 7 місяців тому

    ive only used godot for a week but is it possible to make shaders like this for 2D scenes/projects?

    • @onetupthree
      @onetupthree  7 місяців тому

      hi ! yes but i think my other video is more applicable to 2D since this one relies on vertices and backfaces :O
      i linked the other video in the description now too if you want to check it out :D
      the main difference with working with 2D is that the shader type is canvas_item rather than spatial 👌 but most effects can be translated

    • @RushedYT
      @RushedYT 7 місяців тому

      thank you! ill take a look :)

  • @qwfp
    @qwfp 7 місяців тому +3

    Thanks for sharing the secret knowledge with us!
    For backface colors, wouldn't it be easier to just do "float(FRONT_FACING)"? I'd assume that this internal conversion is more efficient that an if statement or the calculations done in the video.

    • @onetupthree
      @onetupthree  7 місяців тому +1

      ngl i did NOT know u could do that 😭 couldve saved some time 🤣 thanks for the tip!!

    • @diamon_darms
      @diamon_darms 5 місяців тому

      nice

  • @Fusionfalls10
    @Fusionfalls10 7 місяців тому

    Hi first time I arrived to your channel and was amazed at some of the techniques shown such as back face coloring (given I've more commonly seen back face culling).
    Was wondering though if you'll make a tutorial on the slash effect used on the night elf scythe slash (not the banana wave, the slash from swinging the scythe)?

    • @onetupthree
      @onetupthree  7 місяців тому

      glad to hear it ! :D
      and you're in luck bc the night elf scythe breakdown is my next video 😎

    • @Fusionfalls10
      @Fusionfalls10 7 місяців тому

      ​@@onetupthreelet's goooo! That slash effect is by far the coolest one I ever saw so I look forward to it.

  • @waffleawt6570
    @waffleawt6570 7 місяців тому +1

    Guess who's back

  • @99JasonKim
    @99JasonKim 7 місяців тому

    wizard!!!

  • @Relivino
    @Relivino 7 місяців тому +1

    How did you make the Glow in #4? Did you use the WorldEnvironment?

    • @onetupthree
      @onetupthree  7 місяців тому +1

      yup! bloom and everythin 👌 im making a vid about my personal vfx scene setup soon

    • @Relivino
      @Relivino 7 місяців тому

      @@onetupthree Awesome, thank you for the amazing work you're doing!

  • @simonw.1223
    @simonw.1223 6 місяців тому +1

    How do I kn9w all off these effects

  • @sigitsatriap6505
    @sigitsatriap6505 7 місяців тому

    more videos pls !

  • @ivensauro
    @ivensauro 7 місяців тому +2

    can you make a video making a effect from the start? making the texture and putting all together on godot?

    • @onetupthree
      @onetupthree  7 місяців тому

      ill think about it but that feels more fitting for something like a stream than a video 🤔

  • @tinyctr7433
    @tinyctr7433 7 місяців тому

    太牛了

  • @hanadasongs9142
    @hanadasongs9142 7 місяців тому

    I don't understand nothing of vfx, by the way it's fun watching everything and following your content

    • @onetupthree
      @onetupthree  7 місяців тому

      i appreciate you dropping by still 🙏 thank you!

  • @OgrandeJunio14
    @OgrandeJunio14 7 місяців тому

    mais vídeos desse por favor

  • @Fireinthedarkness666
    @Fireinthedarkness666 7 місяців тому

    Wow, I'm early

  • @my2cents795
    @my2cents795 7 місяців тому

    Hello ! Can you make a tutorial for a custom post processing effect for a screen reading shader ? All I've found online so far is shaders using "hint_screen_texture" which doesn't contain transparent objects :( So they don't work for any game that has semi transparent sprites, objects ...

    • @onetupthree
      @onetupthree  7 місяців тому

      hi ! tried doing the same for my mech explosion effect impact frame but unfortunately no luck with the hint_screen_texture method :'( if i do find a way tho i'll let you know ! :)

    • @my2cents795
      @my2cents795 7 місяців тому

      @@onetupthree Thanks! I really appreciate it !

    • @qwfp
      @qwfp 7 місяців тому

      I think that you could achieve what you're looking for with viewports. I.e., have the world in a viewport and then add custom shader to the viewport

    • @my2cents795
      @my2cents795 7 місяців тому

      @@qwfp I did try that with no luck. I couldn't pass the viewport texture as a sampler2D to replace the hint_screen_texture no matter what I tried so I just gave up. If you know a demo project somewhere, please point me to it, I'd appreciate it. Anyway, apparently, some stuff are in the pipeline for Godot 4.3 that will make this possible.

  • @luskarian4055
    @luskarian4055 7 місяців тому

    I love you even more now

  • @Siberiius
    @Siberiius 7 місяців тому

    Very Noyce 😍

  • @renatocesar9972
    @renatocesar9972 4 місяці тому

    could you give the code for it? I really wanna see some examples

    • @onetupthree
      @onetupthree  4 місяці тому

      hi ! the source files for this one is on my patreon for free 🙇‍♂

  • @americoperez810
    @americoperez810 7 місяців тому

    First!!

  • @zataritamods7499
    @zataritamods7499 22 дні тому

    Are you really not supposed to use if statements in shader code? Is it like regular programming where it tries to use branch prediction? If that's the case you could use some tricks from branchless programming, completely drop the vertex part of the shader, and simplify the front facing calculation it to the following
    vec4 color_tex = mix(
    texture(texture_color_back, vec2(0.0)),
    texture(texture_color_front, vec2(0.0)),
    float(FRONT_FACING)
    );
    basically float(FRONT_FACING) will return 1.0 if front facing and 0.0 if back facing. This will then be used for the weight in the mix function to pick which texture to use. Greatly reducing the amount of function calls needed while also not using your "cringe if statements".
    Not trying to undermine you, love the video 🥺👉👈 it might just be a bit easier and more efficient c:

    • @onetupthree
      @onetupthree  22 дні тому

      hi ! the if statement thing being inefficient i've been told is a bit outdated 🤔 so your method is completely valid :D (someone else a while back suggested the same thing)
      and no worries about correcting/suggesting better methods 😤🙏 it's always great to learn new things and I'm glad people care enough to do so

  • @simonw.1223
    @simonw.1223 6 місяців тому

    But how do I know?

    • @onetupthree
      @onetupthree  6 місяців тому

      sorry can you elaborate on your question? 🙇‍♂️

    • @simonw.1223
      @simonw.1223 6 місяців тому

      @@onetupthree how fo I know all pataneters for the vertex shader

    • @onetupthree
      @onetupthree  6 місяців тому

      @@simonw.1223 if you mean all the built-ins you have access to, they're all in the documentation :D
      docs.godotengine.org/en/stable/tutorials/shaders/shader_reference/spatial_shader.html

    • @simonw.1223
      @simonw.1223 6 місяців тому

      @@onetupthree thanks I am already reading the docs

  • @Relivino
    @Relivino 6 місяців тому

    So why the if statements are cringe in shaders? Could be worth doing a video tutorial on that!

    • @onetupthree
      @onetupthree  6 місяців тому

      not sure if I'm the best person to talk about shaders at that level 🤔😭 a lot of the answers for this are 'it depends' (as with most game dev problems) and I did that transition in the video more as a way to explain how someone /could/ implement backface colors if the engine they're working with doesn't have the FRONT_FACING option
      that said tho the link below is a pretty good explanation re: the if statement question
      stackoverflow.com/questions/37827216/do-conditional-statements-slow-down-shaders/37837060#37837060

  • @AlexanderWC
    @AlexanderWC 6 днів тому

    (please pay $0.20 to view comment)