update! WhtLotus (discord: whtlotus) very kindly made a visual shader version of the project from this video 🥳 It's also up for free in my latest Patreon post (along with some life updates) Cheers everyone! 🥂
Great info! Thank you for the video, if I may ask, in a future video can the background music be less distracting? Made it hard to focus on the voice/explanation in some parts, otherwise great video ^^ thanks again.
Polar coordinates is a bit unintuituve until you know atan is a function used for everything, if you want to get the direction of your joystick controller, you use atan(2) as well. However the erosion shader is quite unintuituve, feels like those off by one errors when programing, and I don't think if programing languages arrays started at 1 would be easier either, sadly
Could you implement an open ocio lut as a shader? I use Linear values for film vfx. If my sprites were 16k Lin images could a shader act as a 2D lut on the whole screen?
I think you finally got VFX shaders to click for me. I haven't come across anything where people broke it down into atomic effects before so it makes a lot more sense.
havent tried making that but I imagine it has something to do with screen-space UVs 🤔 you can search it up on google images to see what i mean sample with screen-space UVs on a separate scene with your galaxy environment
hi ! you can add a -0.5 to the float noise_tex i showed in the video 👌this just remaps the noise value from (0 -> 1) to (-0.5 -> 0.5) code: float noise_tex = texture(noise, noise_uv).r - 0.5;
thank you so much ! 🥳 i do have a couple more shaders i use but I want to understand them enough first before i can make a video about those the next videos will be breakdowns of the last 2 godot vfx i made 🙇♂
so I basically need to add techniques on top of techniques?... for example, to make a 2d top-down clouds shaders I just adds erosion on top of tilling a nois texture?
yes :D i haven't tried personally but that could be one way to do it ! you could also even try layering noises on top of each other with different offset speeds so it doesn't look too uniform 🤔
@@onetupthree Thanks for the insight! Your videos got me into shaders, but I found it quite difficult to glue math with visuals, but one day I'll wrap my head around it :)
I did not get what the fuck is happening in distortion. I could make it work but how exactly is the noise defining the uv coordinates in the main texture
yo let's calm down a bit 😭 the base UVs are laid out as values that go from 0 to 1 from the upper left to the bottom right (as seen in 3:40) adding noise to the base UVs will offset our 0 to 1 values (and everything in between) by a little bit so when our texture is mapped to the modified UVs, it'll appear distorted if it still isn't clear you can DM me on twt and i can explain further with pictures :O
@@onetupthree hey bro, thank u. After some tweaking I could kinda of figure this out! Yet it is kinda strange at first. Your explanation now is nice to close it all too, thanks!
hi ! thanks for the kind words 🙇♂ for 2D sprites it should be around the same but you're working with the 'canvas_item' shader_type as opposed to the 'spatial' type ALBEDO built_in would be replaced with COLOR and to access the texture you set in the Sprite2D Inspector, you use TEXTURE using the tiling and offset as example --- A. spatial uniform sampler2D your_custom_texture; uniform vec2 tiling; uniform vec2 offset; void vertex() { UV = UV * tiling + offset; } void fragment() { ALBEDO = texture(your_custom_texture, UV); } B. canvas_item uniform vec2 tiling; uniform vec2 offset; void vertex() { UV = UV * tiling + offset; } void fragment() { COLOR = texture(TEXTURE, UV); // TEXTURE from inspector value } --- there might be some mistakes in the code here but hopefully gets the point across ! :D hope this helps
hi ! if you mean the polar coordinates, if you follow the steps to get the polar UVs it should also work for CanvasItem shaders 🤔 can you try this line after calculating for polar_uv? COLOR = texture(TEXTURE, polar_uv); TEXTURE is the dedicated texture variable for canvas items when a texture is assigned in a control node :D make sure to set Repeat as Enabled 👌 hope this helps !
@@onetupthree sorry for not being clear. For the first demo you showed, I wanted just an offset animation with a sprite with no tiling for cavas item. Thanks
@@ThisIsFez normal offset will also work for CanvasItem :O with the same COLOR = texture(TEXTURE, base_uv) if that still isn't what you need, might be better if we talk on discord if you want :D you can shoot me an email of your username so I can add you :)
You've saved my life thank you so much! I'll need to do some tooling around with this info to suit what I'm trying to do but this has been incredibly helpful.
Thank you, but I still can't solve certain problems. In 2D with tilemap I would like to use clip children but it doesn't work. Would you like to create a shader?@@onetupthree
@@simonw.1223 it's short for OpenGL Shading Language :D can't say much about it tho because I haven't used it outside of Godot and VFX so I learn about it on the fly im sure there are lots of tutorials about there about it 🤔
update!
WhtLotus (discord: whtlotus) very kindly made a visual shader version of the project from this video 🥳 It's also up for free in my latest Patreon post (along with some life updates)
Cheers everyone! 🥂
Community definitely needs more great VFX/Shader centric content like this! Great stuff!! ^^
thank you so much! 🙇♂🙌
Absolute banger of a video !! I learned a lot and it made shader programming not as scary as it used to be !!
thank you ! 🙇♂ i hated writing shaders in unity 😭 godot's is way easier to approach + so well documented it's crazy
This channel is a hidden gem. I hope this knowledge reaches a large audience!
thank you so much 🙇♂
i wonder if you can make video about basic shader work. like how to work/calculate uv and vertex
Great video, but i think the distortion part was kinda rushed, but well i am a begginer in shaders
This is an amazing video, thanks for sharing.
thank you ! :D
Great info! Thank you for the video, if I may ask, in a future video can the background music be less distracting? Made it hard to focus on the voice/explanation in some parts, otherwise great video ^^ thanks again.
thank you ! and gotcha on the background music 👌
Cool to see we share the same passion about shaders, keep it up!
thanks ! 🙇♂️
Thank you, this is very helpful!
thank you! im glad to hear that 🙌
Cool video!
At the time I’m watching this video upload time says “3d ago”. I thought that was cool. Just wanted to share.
that IS cool 👀
1:40 you can also write UV.x and UV.y which would be more semantically accurate
yes 🤔
Polar coordinates is a bit unintuituve until you know atan is a function used for everything, if you want to get the direction of your joystick controller, you use atan(2) as well.
However the erosion shader is quite unintuituve, feels like those off by one errors when programing, and I don't think if programing languages arrays started at 1 would be easier either, sadly
Could you implement an open ocio lut as a shader? I use Linear values for film vfx. If my sprites were 16k Lin images could a shader act as a 2D lut on the whole screen?
ah finaly godot 🎉
godot is pog
I think you finally got VFX shaders to click for me. I haven't come across anything where people broke it down into atomic effects before so it makes a lot more sense.
that's great to hear ! good luck w/your VFX 🥳
thanks
thank u 😎
is it just me or is this video above average good? Edit: you just earned a subscriber
i appreciate it a lot 🙏
Do you know if there is a way to do an effect similar to the galaxy skin from fortnite (idk how else to explain it lmao)
havent tried making that but I imagine it has something to do with screen-space UVs 🤔 you can search it up on google images to see what i mean
sample with screen-space UVs on a separate scene with your galaxy environment
to add to the last part i imagine you put the galaxy on something like unity's render texture and sample from that
Great video! We definitely need more Godot VFX tutorials!
thank you so much!
For the Distortion shader, is there a way to make it so that increasing distortion_intensity doesn't move the albedo_tex away from the center?
hi ! you can add a -0.5 to the float noise_tex i showed in the video 👌this just remaps the noise value from (0 -> 1) to (-0.5 -> 0.5)
code:
float noise_tex = texture(noise, noise_uv).r - 0.5;
@@onetupthree That fixed it, thanks!
this video is very good if you can make things from theory into something real, sadly its not me
heyy we all learn differently and that's ok! i believe in you :D
wow this is great content!
would be awesome if your turn this into a series.
Liked and subscribed!
thank you so much ! 🥳 i do have a couple more shaders i use but I want to understand them enough first before i can make a video about those
the next videos will be breakdowns of the last 2 godot vfx i made 🙇♂
so I basically need to add techniques on top of techniques?...
for example, to make a 2d top-down clouds shaders I just adds erosion on top of tilling a nois texture?
yes :D i haven't tried personally but that could be one way to do it !
you could also even try layering noises on top of each other with different offset speeds so it doesn't look too uniform 🤔
@@onetupthree Thanks for the insight! Your videos got me into shaders, but I found it quite difficult to glue math with visuals, but one day I'll wrap my head around it :)
@@viniciusantonio2253 you got this 😤🙏 if you have any questions feel free to ask here !
banger video made me switch to godot
eyy i appreciate it man 😭🙏
I did not get what the fuck is happening in distortion. I could make it work but how exactly is the noise defining the uv coordinates in the main texture
yo let's calm down a bit 😭
the base UVs are laid out as values that go from 0 to 1 from the upper left to the bottom right (as seen in 3:40)
adding noise to the base UVs will offset our 0 to 1 values (and everything in between) by a little bit so when our texture is mapped to the modified UVs, it'll appear distorted
if it still isn't clear you can DM me on twt and i can explain further with pictures :O
@@onetupthree hey bro, thank u. After some tweaking I could kinda of figure this out! Yet it is kinda strange at first. Your explanation now is nice to close it all too, thanks!
@@veecks no problem ! that's great to hear :D
Can these shaders be applied on a color rect?
yes but you need to adjust them for the CanvasItem shader type :) the math should be about the same
Bro writes 20 lines of code, talks about 2 and leaves us completely lost lol
bro writes a comment like this and expects me to know how to help 💀💀💀
@@onetupthreenice tutorial, but how do you do erosion in particle effects?
wow wow wow, stop for a second. What is this channel and why didn't I know of it already? FOLLOWED!
very kind of you to say 🙇♂️
thank you!
how to put it to 2D Sprite or MeshInstance2D? that is sooo cool !! Thank for your toturial!
hi ! thanks for the kind words 🙇♂
for 2D sprites it should be around the same but you're working with the 'canvas_item' shader_type as opposed to the 'spatial' type
ALBEDO built_in would be replaced with COLOR and to access the texture you set in the Sprite2D Inspector, you use TEXTURE
using the tiling and offset as example
---
A. spatial
uniform sampler2D your_custom_texture;
uniform vec2 tiling;
uniform vec2 offset;
void vertex() {
UV = UV * tiling + offset;
}
void fragment() {
ALBEDO = texture(your_custom_texture, UV);
}
B. canvas_item
uniform vec2 tiling;
uniform vec2 offset;
void vertex() {
UV = UV * tiling + offset;
}
void fragment() {
COLOR = texture(TEXTURE, UV); // TEXTURE from inspector value
}
---
there might be some mistakes in the code here but hopefully gets the point across ! :D hope this helps
@@onetupthree Thank you!!!it's making my life easier ,your toturial is so useful,Thank again!
@@sinlee6064 no prob ! glad i could help 😤👌
I learned a lot with this! Thank you :3
im glad it helped ! 🙌
please how do i make this work for canvas and not spatial. specifically the diagonal offset animation. total noob here
hi ! if you mean the polar coordinates, if you follow the steps to get the polar UVs it should also work for CanvasItem shaders 🤔
can you try this line after calculating for polar_uv?
COLOR = texture(TEXTURE, polar_uv);
TEXTURE is the dedicated texture variable for canvas items when a texture is assigned in a control node :D make sure to set Repeat as Enabled 👌
hope this helps !
@@onetupthree sorry for not being clear. For the first demo you showed, I wanted just an offset animation with a sprite with no tiling for cavas item. Thanks
@@ThisIsFez normal offset will also work for CanvasItem :O with the same
COLOR = texture(TEXTURE, base_uv)
if that still isn't what you need, might be better if we talk on discord if you want :D you can shoot me an email of your username so I can add you :)
Take my subscription! Damn that was well explained. You made some stuff click that I have been trying to understand for a while now.
thank you so much ! glad i could help out 🥳
Finnally, some VFX on Godot...
all thanks to a certain other engine's shenanigans 👀
epic!
I am addicted to Godot videos lol
Very well explained good sir! You've earned yourself another sub :)
thank you so much ! 🙌
I can see the channel exploding in views in the future, videos like this are bangers, keep it up.
thank you so much for the kind words ! 🙏
You've saved my life thank you so much! I'll need to do some tooling around with this info to suit what I'm trying to do but this has been incredibly helpful.
that's awesome ! good luck with the tooling 👌
u need to make a bigger video man
i try to keep my videos brief 🙇♂️
I love this, thanks for the video!
thank you so much ! im glad you liked it 🥳
what is texture_albedo for "mask" shader ?
hi! :) that's just a sampler2d
in the video, it was the godot logo
@@onetupthree The code still doesn't work, what declaration for ALBEDO & albedo & ALPHA? in godo 4
@@mistouluf8518 the source code is up in my patreon for free if you want to check it out :)
Thank you, but I still can't solve certain problems. In 2D with tilemap I would like to use clip children but it doesn't work. Would you like to create a shader?@@onetupthree
Excellent information. No jazz please.
thank you 🙌 but i do be liking some kind of music in the background 🤔
These tips are really useful
glad they were helpful ! :D
How is the visual shader editor in Gadot?
haven't tried it so im afraid I can't help with that one yet 😰
Could you please make a tutorial on how to do cloud shadows with a shader? For a 2D pixel art game as well as 3D.
not sure what you mean exactly but if you're talking about raymarching then cant help much bc I also gotta learn that 🤣😰
@@onetupthree Cloud shadows shader is the one where the clouds cast moving shadows on the ground. Another very needed shader is the god rays shader.
Wow, this's exactly what I need！
glad to hear it ! 🥳
I love you so much
glad i could help 🙇♂
YES! Been looking for high quality Godot VFX content. Very appreciated!
thank you for the kind words ! 🙌
Really good and easy to understand! Kudos!!!!
thank you :D glad it was helpful !
insanely informative video!
thank you ! im glad it was helpful 🙌
Whoah!
We need more things like this, Sensei! ☝️
i'll do my best 🙇♂
MOOOOREEEEE
hopefully soon 🙌
thx for the subtitles i appreciate it
of course! 👀 we gotta have em 👌
That was pretty good ^^
thank you so much ! :D
This was fantastic - thanks!
thank you ! 😄
How do I know all the different stuff
sorry not sure what you meant by that :O which other stuff?
@@onetupthree like the whole shader language.
@@simonw.1223 im afraid you won't find em here 😰 Godot uses GLSL if I remember correctly
@@onetupthree what is GLSL?
@@simonw.1223 it's short for OpenGL Shading Language :D can't say much about it tho because I haven't used it outside of Godot and VFX so I learn about it on the fly
im sure there are lots of tutorials about there about it 🤔
Amazing tutorial bro!
eyy thank you ! 🙌
Great examples!
thank you so much ! :D
very good video
thank you! 🙌
awesome
thank you ! :D
Super Tut in Shader
thank you! 🙏
thanks a lot!
glad to help ! 🙇♂
Please do not stop making videos
and i'll do my best 😤👌