Видео

VERY good video !

How would you do this for an animated sprite though ?

Please forgive me for this really noobish question, why does multiplying the offset by UV.y and 2 flip the image? My math isn't really that good and I'm struggling to really understand that part.

Could you upload the godot project to download?

this thing work on godot 4?

Sabes es de los pocos tutoriales, que sin escuchar tu voz, entiendo perfectamente lo que estas haciendo en todo momento. Es una perfecta forma de explicar, hasta para una persona sorda. Felicidades gran tutorial 😅 saludos

Can you do a tutorial on space distortion with physics maybe just like in geometry wars game where you throw a projectile and the lines behind warps?

Absolutely phenomenal, thank you.

This does not work well in version 4, there is an illustrated bug: ruclips.net/video/5DJKV5FyKNc/видео.html If you can help me?

Can it be added to a 3d scene? Apparently not, I've been trying for days now.

It seems that when it runs with + TIME, my noise texture simply "runs off" elsewhere, leaving a completely smooth surface behind. The noise distortion texture seems to run to the left, being clipped m the sprite's boundaries. In other words, it doesn't loop. Help. :c Here's my code(in godot 4) shader_type canvas_item; uniform sampler2D SCREEN_TEXTURE : hint_screen_texture, filter_linear_mipmap; uniform float y_zoom; uniform vec2 scale; uniform vec4 water_color: source_color; uniform vec2 distortion_scale; uniform float intensity; uniform float speed; uniform sampler2D noise; void fragment() { float distortion = texture(noise, UV * scale * distortion_scale + TIME * speed).x ; distortion -= 0.5; float uv_height = SCREEN_PIXEL_SIZE.y / TEXTURE_PIXEL_SIZE.y; vec2 reflected_screenuv = vec2(SCREEN_UV.x - distortion * intensity * y_zoom, SCREEN_UV.y - uv_height * UV.y *scale.y * y_zoom * 2.0); vec4 reflection = texture(SCREEN_TEXTURE, reflected_screenuv); COLOR.rgb = mix(reflection.rgb, water_color.rgb, water_color.a); }

The code here doesn't work 1:1 anymore due to some stuff being changed from Godot 3 to 4; here's the GDscript that I've got working for my project that you can copy/paste. Replace $"../Player Character" with the node you want to look at your mouse. func _physics_process(delta): var space_state = get_world_3d().direct_space_state var mouse_position = get_viewport().get_mouse_position() rayOrigin = camera.project_ray_origin(mouse_position) # set the ray orign rayEnd = rayOrigin + camera.project_ray_normal(mouse_position) * 2000 # set the ray end point var player = $"../Player Character" var exclude = [player] var query = PhysicsRayQueryParameters3D.create(rayOrigin, rayEnd, 0xFFFFFFFF, exclude); var intersection = space_state.intersect_ray(query) if len(intersection) != 0: # if there is a proper ray hit get its position an rotate towards it var pos = intersection.position player.look_at(Vector3(pos.x, player.position.y, pos.z), Vector3(0, 1, 0))

bug on canvas_view Y (pan move or in game... -_-)

Thank you for this! Great tutorial.

I've made it + I added a few wavy into the water, but there seems to be a problem for me when i move to the right, the left part of the water is laggy when going out of screen or entering screen (not the right one .. ? ) Does anyone have hints to resolve this issue ? here is the code : shader_type canvas_item; group_uniforms screen; uniform sampler2D screen_texture : hint_screen_texture, filter_linear_mipmap; uniform vec2 scale; uniform float y_zoom; group_uniforms display; uniform float reflect_scale_y = 1.13; uniform vec4 water_color : source_color; group_uniforms distortion; uniform sampler2D distortion_noise: repeat_enable; uniform vec2 distortion_scale = vec2(0.03, 0.06); uniform float distortion_intensity = 0.04; uniform float distortion_speed = 0.015 ; group_uniforms waves; uniform sampler2D wave_1_noise: repeat_enable; uniform float wave_1_speed; uniform float waves_min_intensity = 1.22; uniform float waves_hdr_value = 3.3; uniform float waves_smoothness = 0.12; group_uniforms top_wave; uniform float top_wave_amplitude = 0.02; uniform float top_wave_speed = 0.09; uniform float top_wave_period = 0.185; //float remap(float val, float in1, float in2, float out1, float out2) //{ //return out1 + (val - in1) * (out2 - out1) / (in2 - in1); //} void fragment() { vec2 uv = vec2( UV.x, UV.y * reflect_scale_y); float waves = uv.y * scale.y +sin(uv.x * scale.x / top_wave_period + TIME * top_wave_speed) * cos( 0.2 * uv.x * scale.x/top_wave_period - TIME - top_wave_speed) * top_wave_amplitude - top_wave_amplitude; float distortion_1 = texture(distortion_noise, uv * scale * distortion_scale + TIME * distortion_speed).x; float distortion_2 = texture(wave_1_noise, uv * scale * distortion_scale + TIME * wave_1_speed).x; float distortion = distortion_1 + 1.0 - distortion_2; distortion -= 0.5; float waves_intensity = smoothstep(waves_min_intensity - waves_smoothness, waves_min_intensity, distortion) * waves_hdr_value; float uv_height = SCREEN_PIXEL_SIZE.y / TEXTURE_PIXEL_SIZE.y; vec2 reflected_screen_uv = vec2(SCREEN_UV.x - distortion * distortion_intensity * y_zoom, SCREEN_UV.y - uv_height * uv.y * y_zoom * scale.y * 2.0); vec4 reflection = texture(screen_texture, reflected_screen_uv); vec3 reflected_water = mix(reflection.rgb, water_color.rgb, water_color.a); COLOR.rgb = reflected_water + vec3(waves_intensity); COLOR.a = smoothstep( 0.1, 0.35, clamp(waves, 0, 1) ); }

It doesn't work and it doesn't give me an error: ///VAR: onready var camara = $CameraPlayer var linea_origen = Vector3() var linea_final = Vector3() ///CODE: //FUNC _PHYSICS_PROCESS(DELTA): var space_state = get_world().direct_space_state var mouse_position = get_viewport().get_mouse_position() linea_origen = camara.project_ray_origin(mouse_position) linea_final = linea_origen + camara.project_local_ray_normal(mouse_position) * 2000 var interseccion = space_state.intersect_ray(linea_origen, linea_final) if not interseccion.empty(): var pos = interseccion.position $ModelPlayer/Look.look_at(Vector3(pos.x, translation.y, pos.z), Vector3(0,1,0)) -HELP ME

For some reason my dude keeps looking at the opposite direction even if I rotate every possible thing in the player scene 180 degrees. Edit: okay it seems to work if I make look_at from the video for the parent, and the child is turned around 180 degrees. Maybe this is wrong though, idk yet. Thank you anyways!

Hi! I don't know why but my character faces the opposite way from the mouse, does anyone know how to fix this?

Couple more Godot 4 notes: `tool` needs to be `@tool` SCREEN_TEXTURE is deprecated, but the error in the editor explains how to fix it :) Thank you for this tutorial!

For anyone trying to do this on godot 4 there are a few things you have to do differently: First you need to create a new variable called 'query' "var query = PhysicsRayQueryParameters3D.create(rayOrigin, rayEnd)" then you have to replace the var intersection shown in the video with "var intersection = space_state.intersect_ray(query)" (thanks to @rhevoramirez7969 for this) if this doesn't work or if you're getting an error that goes like "Nonexistent Function '...' in '...' " then I have no clue why but removing the rayOrigin and rayEnd variables and add "var" at the start of the rayOrigin and rayEnd In the _physics_procress() function works, and finally you have to replace "interesection.empty()" with "intersection.is_empty()"

for the color picker in godot 4 uniform vec4 water_color : source_color;

Thank you so much for these two great videos. Implemented it in Godot 4.1.1 and got most of it working. Only did not find out how to use your gradient material. So, if someone here knows, would be super happy if you could post an update here in the comments or somewhere. Many thanks ❤

in godot 4 SCREEN_TEXTURE is replace by just normal TEXTURE

Newbie question: I wanna create a collision for this, to make it I need to create a collision that changes it's shape (e.g: radius) over the time, or shaders also support smt like it? I believe that they only support "visual" stuffs

First of all thank you. For (yet) unknown reasons the scale curve does not scale the particle at all. I'm using Godot 4.1.2 and up to the point where the scale curve is added, everything aligned well with your video. But the scale curve does not modify anything no matter what value I tweak. Any idea?

Very nice video. I especially like the way you explain everything from the basics. I'm looking forward to more tutorials. 😎

Very well explained.

Cool that u coded this shader effect by urself :)!

Really good

Thnx so much this tutorial was exactly what i was trying to find for a long while but for some reason its not in the center and its elliptical idk why?

amazing video man, I'm using godot 4.0.3 and your tutorial works, didn't even run into a single problem! I'm curious though, the waves at the start of the video have like a white blanket on top of them, how did you do that? edit: nvm, got it myself, forgot that you mentioned it at the end of the video lol :D

Thank you lad!

Thanks for taking the time to upload this man. This would have taken years off my life to implement and decades off my life to animate by hand.

How do you get the white line on top?

SquidVille has enlightened me

Hey, I'm having real problems implementing this in 4.0. Anyone else had any luck?

Жаль, что это для 2д( Да, база для 3д та же, но.. Как бы, сложнее Интересно как делать такое в 3д-пространстве вокруг бегущего персонажа..

Thanks!

Thanks!

Hi i'm super new to shaders. Is there a way to make this spawn on specific objects and have it be relative to that object instead of the screen? Or how woul dI have the shader follow an object?

What a great explanation. Great job.

great tutorial. would love more skill based shaders, think of diablo and poe! i have created some skills like frozen orb and whatnot, but warcry is pretty hard. not just in shaders, but for the effect. i use other nodes as well

Thanks, i use individual nodes to make multiples ripples on screen (explosions), not the optimal way but it works for me.

Very well made tutorials. Some things are a bit different in Godot 4, but it still works great. Thanks so much.

yes yes yes yes the perfect shader to make dios the world just need a simple one to make black and white after the efect and perfect

thank you very much i was very tired of using diffrent methods and my brain eas going to explode you saved my life you are the best

I like that you don't just made the tutorial, but also gave some homework for us :)

Would this work in Godot 4?

Note: in Godot 4 its necessary to construct the query to call as argument for the intersection: var query = PhysicsRayQueryParameters3D.create(RayOrigin, RayEnd); var Intersection = SpaceState.intersect_ray(query), otherwise itwill not work ;)