Water Depth Shader - UE4 Materials 101 - Episode 24
HTML-код
- Опубликовано: 20 окт 2024
- In this video, we learn how to calculate the opacity of water. The opacity is based on both depth and viewing angle. We compute depth using the world space position, the camera postion, and the Scene Depth and Pixel Depth nodes. For viewing angle, we use the Fresnel node. And finally we add a DepthFade node to blend the edges of the water. Next week we'll add reflection and refraction to our water and have a complete water material.
------------------------------
Learn more!!
Other videos like this one:
• Water Surface Overview...
• Translucent Water Deta...
• #3 How to Create Water...
Web Resources
www.unrealengi...
forums.unreale...
Shader Book Recommendations
www.bencloward...
------------------------------
Learn to write shaders in HLSL:
• HLSL Shader Creation 1...
• HLSL Shader Creation 2...
• HLSL Shader Creation 3...
------------------------------
Theme Music
Peace in the Circuitry - TeknoAXE
teknoaxe.com/Li...
Background Music
Speo - Still Young
• Still Young
![Single Layer Water | 5-Minute Materials [UE4/UE5]](http://i.ytimg.com/vi/KLl3PZeupFM/mqdefault.jpg)
![FNAF vs TF2 - Episode 2 [SFM]](http://i.ytimg.com/vi/z5b3V2-VLb0/mqdefault.jpg)
Man you're incredible. So much stuff packed into 1 tutorial. Hands down the best water tutorial I have ever seen
Glad you like it!
I agree that such a precise explanation on every node used is pure gold
had to come back to ue4 to get a good water shader tutorial.... may the HLSL gods bless this man
Far better than what I've learned on Udemy.... thank you..
I can't even - I don't even know what to say, man. I feel like I should PAY you for your time. Thank you so very, very much! I am SO very thankful for your tutorials!
You're way more helpful and informative than the tutorial videos on the actual Unreal Academy website! And nowhere NEAR as boring! Your excitement makes me feel excited!
This is the first channel where I hit the Notification-Bell. One of the best Tutorials I have watched so far.
Great tutorial as usual! One improvement I thought of would be using the Object Position node and masking the Z component instead of the constant for the height of the water plane, that way you don't have to adjust the material if you're using it on multiple different surfaces. Looking forward for the next episode!
That's a fantastic idea, Kalle. Thank you!
@@BenCloward By chance could it also work using the World Position node instead of Object Position?
Yes, using world position would work fine.
Can someone explain this a little more clearly please? I'm trying to swap out the vector for the object position just so that this water can be used anywhere without having to constantly creative instances to change the water level.
You take object position and mask R and G through the append node?
@@OpenMawProductions Sorry, I think my comment wasn't too clear. What you need to do is make an Object Position node, plug it into a component mask and select only the B (which represents Z) value, then use that instead of the constant value (which is set to 70 in the video) and plug that into the append node where the constant was plugged in. Hope this helps!
Best shader tutorial series ever. Very grateful for your work!
instead of using constant height, we can use object position! and thank you Ben! love you
I don't know what goes in to getting on LinkedIn Learning, but your content is sorely needed!
Once again, your tutorials are saving me!
You should definitely look into publishing these on FlippedNormals! I used this video in conjunction with one of FlippedNormals' paid water tutorials and the way you explain things covers so many more bases than a lot of the professional instructors on there.
Amazing video!
You are awesome! Thank you for your work!
Thanks for sharing your wisdom Ben! I follow your tutorial series to lern ue4 as a new hobby. I really enjoy creating beautiful things out of math and logic! I always liked vector and matrix calculations and now I use colors for math, so cool! This was the best video until now and I am very excited about all the things to come!
I just used the original small opacity setup you did then used a distance fade so it goes to totally opaque with large flowing normals at a large distance.. My ocean now looks "fabulous" from any distance. Thanks for the idea. :)
Hello! Thanks for the great tutorials, very helpful! For this one you could actually simplify the Depth calculations by simply subtracting the WorldPos from the CameraPos. Let's call "Depth" the result of the Append node:
(WorldPos - Depth) - (CamPos - Depth) = WorldPos - CamPos
Saves two simple subtract operations, nothing that makes the material more efficient, but makes the graph a bit more straightforward!
Incredible tutorial. I love the way you present this stuff. It's so easy to understand. If I can suggest topic, what about wind shader that bend trees from specific point (like grenade, helicopter, etc.)?
Thanks for your hardwork!
Nice series :) Just a hint to make shader building little bit easier and better: Since 4.26 there are 2 new nodes for converting sRGB to linear and back (sRGBToLinear and LinearTosRGB). So from now on, you just can use those two for the Gamma adjustments. Also, those two nodes are functions, which you can copy all their nodes to older versions, to make it work there too, even without those nodes being integrated there ^.^
You are amayzing!! Thank you for your work!
you are a genius! Thanks for sharing these tutorials!
Awesome tutorial, clear and wide informative. Keep it up!
Hi Ben,
first of all thanks for the tutorials, I'm learning a lot!
I can't understand the math behind what you did with the SceneDepth and the PixelDepth, why did you divide between them and then multiply that by the vector from the camera to the surface? I tried to play around with the algebra but I can't figure out how we get the water height at this location, I would really appreciate if you could elaborate or direct me to a tutorial that covers this technique. thx :)
I learned so much from this. But if I'm following correctly, your second diagram is wrong. Shouldn't the depth line go from the point of intersection with the rock directly up to the surface of the water there? Also, imperative that the floor be at world Z zero.
In the end, since the amount of water you're looking through should affect the color (just like fog really) I think the first simpler approach may be superior. This whole series is fantastic.
thank you! I struggeled in the beginning a bit because instead of white translucent, my material was almost pitch black, I thought I was doing something wrong, but after continuing it became much better. I only need to adjust some settings so I get the material I want
Thank you for sharing your expertise!
Thanks a lot Ben Cloward !
I have an issue, because I need to be in translucency as rayTrace in my postProcess, but it seems that it cannot works untils I am in "raster".
Do you know any adjustment to get this working in "raytrace" ?
Thanks a lot
Hi,I have the same problem. Have you solved it yet?
The final color of the different depth values reminds me of the water of The Witcher 3: Wild Hunt, which is really similar, just different colors.Beautiful !
I'm so glad I found you! Very informative, clear, and results are excellent. Instant subbed ;)
One thing though, maybe you are able to answer to this, my viewport graphics are less quality than yours, but when I press play then it looks like yours. It's just annoying that I have to press play everytime. Do you know if there's a checkbox somewhere that I need to check, or something?
Hi Ben! I'm following along, and I deeply appreciate this tutorial you've been making. I have a question you might be able to answer. I'm making a larger ocean using this material, however, when it comes to having a darker color depth, all I am seeing the same shallow color I have set throughout the plane. I've tried changing the constant that determines at what depth the water becomes completely shallow, as well as the height of the water constant, but I'm having no luck.
I even tried removing the fresnel, based on how it is meant to function, and again, everything is still very opaque no matter the camera angle. Any idea on what might be causing it?
Ben curious if you are using ray tracing for the scene you are building your water shader in?
Nope. Nothing in any of my tutorials uses ray tracing until episode 38 when I started the ray tracing series. The reflections use screen space ray tracing (SSR) - which is definitely not the same thing.
I am really enjoying the videos that you do - they have taught me so much, especially after I've constructed the materials, I go through and try to annotate what I think it's doing (and if I can't explain it to myself in notes, it's a good hint to go back and dig into it). This is quite an elegant way using fairly simple nodes to generate something that isn't as simple as it 'feels it should be'. However, I have to admit being a little confused. Are SceneDepth and PixelDepth normalised - or are they in WS? The UE4 documentation are unclear - but I assumed that it was distance in WS units. So my derivation of the shader function had the outcome of the ComponentMask (B) as equalling -depth. So inverting to me would be simply multiplying by -1. I don't understand (I'm sure I'm missing something) how a (1-X) node inverts an unbound real number.
(EDIT - I'm an idiot - I was confused by the use of "inversion" - I now understand that for larger numbers (1-X) is very close to (-X)...so I'm assuming that this doesn't assume a 0 to 1 input.)
Finally - the way I understand the vector maths (which may be I am wrong) this assumes the depth of water is the same at the rays point of intersection at the water (lets call it point W) and the intersection with the scene (call it point S). I think it's unclear whether the 'depth' is actually the depth from W to the projection onto the underlying scene; or from S projected up to the overlaying water plane. That's because my derivation assumed two flat parallel planes. After all the Z coord is taken from W, but the height of the scene is taken from S. I realise this isn't a big deal, as shaders are often as much about 'optimisation' as anything else, so it doesn't need to be mathematically correct. I'm more curious than anything, as it affects how to try and adjust for a non-horizontal plane. Sorry for asking very boring questions... and given how long ago this video was, I'm sure you have better things to do.
No Amount of money or courses can buy you this amount of knowledge.
Hi, dunno if 4,26 changed something but i have to made a custom cartoon water, the depth effect works only in unlit mode, if i go to Lit, it goes all transparent without depth fade, do you know why? Thanks =)
oh wow i solved the mistery, i have a post process toon shader that is calculating transparencies in a different way then normal, i must figure what feature makes doing that and turning it off.
nice tutorial, deep and expend
Should this work using ue5, all i'm getting is a gray surface with no penetration. Help someone please.
Hi Ben, thanks for the great tutorial! I'm confused about how you calculate the depth from @10:24 . (Transform camera position into water's space and other stuff) Is any change that you can elaborate on it more? Thank you.
Answer my own question. with UE 4.25 there's a node called "WorldPoistionBehindTranslucency" that does a good job. forums.unrealengine.com/development-discussion/rendering/1787950-water-shader-water-depth-calculations-why-does-it-need-water-height
@@aboutvenice Care to elaborate how to use WorldPoistionBehindTranslucency node? I've looked into fourm following link, couldn't find any sufficent info.
Thank you!
the math you used to calculate a vector , its z component is the depth , is there any place i can learn this math ?
thanks for the tutorial
Hi Ben, thanks for wonderful series. Question though: from scene depth and pixel depth you have transparency that is deep when you look at 90 degrees and shallower when you look at oblique angles. Then you add true depth to get it constant, and then add Fresnel to make it deep when you look at 90 degrees and shallower when you look at oblique angles again. What makes all this overhead worth it?
It's possible that the Fresnel may not be needed, but I would need to do some more experimenting. I'm open to suggestions!
Amazing video!!
Hi, awesome video, the problem I have is that I want to apply it to an ocean I'm creating in a very big terrain, the depth is immense and unfortunately the world center on the z is not zero, is a negative number in the thousands, so my surface is completely white and I'm not getting anything not even in the shallow areas near the shore, I'm stuck at the depth calculation part, please help.
Thank you for this awesome tutorial! You don't happen to know how we could convert this to Unity's shader graph by chance? I have most of it working, however I don't see any pixel depth nodes.
I haven’t used Unity unfortunately. Sometimes it’s called Z depth or depth buffer. I don’t know if it’s available in Unity - but that’s a couple of things you could look for.
@@BenCloward I have a look, thanks!
At 22:30 I got lost at what you were bringing in? What kind of node is generating these colors?
Nevermind. I figured it out. Constant3Vector. This was the only hiccup I had. Great tutorial.
I didn’t quite get what’s going on when you’re computing the ‘real’ depth (straight down vector) but super interesting.
Same for me. I can't get why it works better with the SceneDepth/PixelDepth ratio. I would be glad if someone can add further details on this part.
I found this video (ruclips.net/video/-XyeFXdKi08/видео.html) is using the exact same method but with few details.
By the way, this youtube channel is absolutely awesome and for me the best about unreal ! Thank you !
@@alb7255 If your water plane isn't horizontal, you will get incorrect depth because the vector will still go straight down in world space. To get correct results, the vector would need to be perpendicular to the water plane regardless of the water plane rotation
Virtual texture node helps getting the height of your water surface in 4.25
so at the end what is the constant value to change to control the depth of the transparency of the water?
can anyone tell me why we are dividing scene depth with pixel depth and also what the mutiply node is doing after the divide node
thank you , but what about cheap caustic effect , under water ?
Thank you for the suggestion!
Hi Ben..I'm following your tutorial for a lake ..problem is that the waves and texture are really small..any idea how make it larger? Cheers!
Before sampling your ripple textures, multiply the texture coordinates by a small number - something less than one.
couldn't you take objectpositionWS taking the Z value instead of finding your z value and plugging it in to each individual object? I feel that may work for rivers as well, considering the objects are planes tied together on a spline.
Hello Ben, first of all, thanks a lot for this helpful tutorial series. I'm very new to UE and this series is helping me a lot. But I'm having some issues with the repetitive tiling effect of the water. It would be very kind of you if you can help me how to rectify this.
Hello, nice tutorial but can"t we convert some of constant in parameters and change the values in a material instance for more manual control on it ?
Of course! Feel free to expose any parameters you want. Those are the kinds of finishing details I do at the very end of the process of making a shader for my team to use, and I often don’t show them in my videos. My assumption is that my viewers will take the core concepts I’m sharing and customize them to suit their needs.
thx for this tutorials but pls upload somwere this material becouse nothing work like should be, i check everything 100 times and still not fix
What are the differences of this and the single layer water material?
Thank you for your very nice Tutorials, May I ask you, the water mesh is a plane or a cube? and why?
Thank you again!
The water mesh is a plane. We’re only concerned with the appearance of the water surface, so for that we only need the top. If our water was in a glass container where you could see the sides and/or bottom, we would use a cube in that case.
at 21:00 my result is a very contrasted depth , by moving the camera the objects starts to be from white to very black , not alot of grey between that
My deep water is black instead of white
also my water plane is not centered at 0 in the vertical axis but its like at -200
How to do this water depth with raytracing? this work on Raster Transculecy type but not on Ray Tracing
I haven't tried to do water with ray tracing yet, so I don't have the answer for you. It might help to watch my series on ray tracing though. I have videos specifically on reflection and refraction:
ruclips.net/video/airQR0BstNA/видео.html
ruclips.net/video/SNrnLzJe3cc/видео.html
How do you do this in unity
I followed the same steps, with the same values, and I had a complete different result. I have black lines instead of having the water lines on the video
14:48 for me, it is still solid! anyone to solve this?
subtracting height from both worldPos and cameraPos cancels each other and we are left with cameraPos-worldPos
Ben, you are amazing. I still consider myself a beginner in terms of knowledge of materials. However, I'm studying hard. I didn't understand when it divide Scene Depht / Pixel Depht. Why??
I asked myself the same question. Note that this is the first tutorial i replicated and the first thing i ever did with materials and i am a complete beginner too, but this problem is more about math than just connecting some notes.
So here is how i understand the calculations he does from 10:50 to 13:35: (please correct me if i misunderstood anything).
Basically, if we knew that blue vector he drew in 9:52, we could just use the z value of that vector, but as scene depth and pixel depht are not vectors but numbers, we cant use those. So there has to be another way:
As another comment already said, subtracting that water plane height vector from the absolute world position and the camera position and then subtracting those values gets you the same value as substracting the absolute world position and the camera position directly i.e. "(WorldPos - WaterPlaneHeight) - (CamPos - WaterPlaneHeight) = WorldPos - CamPos" (i replaced "depth" by "WaterPlaneHeight" because i think "depth" sounds a bit misleading). BUT: we will need a part of this equation later.
Anyway, this gives us the actual *Vector* between the pixel on the water surface and the camera. So for simplicity you could kinda say that this is the same as PixelDepth, but as vector.
So, by dividing scene depht by pixel deph (which are both single values) you get a number that represents how many times pixel deph fits into the scene deph. When you then multiply that number with that "manually calculated pixel deph vector" , you basically get the scene depth again, but as vector, i.e. (SceneDepth / PixelDepth) * PixelDepth = SceneDepth, but keep in mind: that second pixel depth is a vector, so it should look more like this: (SceneDepth / PixelDepth) * PixelDepthVector = SceneDepthVector.
The "SceneDepthVector" is the red line you see in 10:52 but this time it is actually a vector and not a value.
But we dont want the vector between the camera and the ground, but the vector between the water surface and the ground.
To do this, we need to substract from this SceneDepthVector the vector between the camera and the water surface, so we come back to this part: "(WorldPos - WaterPlaneHeight) - (CamPos - WaterPlaneHeight) = WorldPos - CamPos", but we only need (CamPos - WaterPlaneHeight). If we substract that vector from the "SceneDepthVector" we finally get the vector between the water surface and the ground and we can use the z value (or "B-Value" as in RGB) to get the "real depth". But, as Ben said, this only works under the assumption that the water plane is flat.
I hope this helps, and if anything is still unclear, i suggest to draw a rough scetch like ben did, but include all those vectors that are used in this calculation, or just ask again.
@@batrox9219 your explaination is very easy to understand but Im curious about the last part: since you said " If we substract that vector from the "SceneDepthVector" we finally get the vector between the water surface and the ground" and I am thinking the same way but what Ben actually is "adding" the vector. Do you know way?
@@GaranCanaan subtracting sounds more intuitive because we kinda want to "remove the part between camera and surface out of the whole scene depth", but adding is actually the right way to go.
If you look at the sketch at 9:52 imagine a vector from the water surface to the camera. That vector goes up, so when we add that vector to the peak of the red scenedepth vector, we land somewhere in the middle of the water, and we essentially get a vector between the camera and some seemingly arbitrary point in the water, or maybe even in the air, which seems wrong. BUT: this vector happens to be the vector between the surface and the ground. Depending on your sketch program, you might just move that vector a little bit downwards and you'll see it fits perfectly between the water surface and the ground.
It's a bit hard to explain without drawing it, but yeah, i was confused at the exact same part until i drew it.
@@batrox9219 thanks for the reply. But why is the vector from the water surface goes up? Since the function is "world position - Camera Position" I thought the vector from the water goes down towards ground. Is it different between the node caculation and the normal math caculation or just I misunderstanding something?
are these for use with ue4's water system??
No, I made these before the water system was released. Currently, they're a good alternative if you just want some simple water and don't want to use the water system.
@@BenCloward I want to use the water system, but i can't find anything on how to get it to have foam, caustics, etc.
ooo... being able too see water line when you're looking between the ocean and the world
I guess the cheaper depth approximation would work fine if your water gets nice and reflective at steeper view angles anyways :)
Yep, very true!
My neck hurts from putting my nose at the screen just to see some texts on the video... but thanks
Thank you for the feedback. I’ll work on that for future videos.
优秀的老师
谢谢！
Starts out making a water material @23:21 we end up computing death haha :P
The color node of blue color name ??
I found that
Btw great tutorials
Hi Ben, Really enjoy all your videos and thanks for sharing these. I saw this topic from Formus forums.unrealengine.com/development-discussion/rendering/1787950-water-shader-water-depth-calculations-why-does-it-need-water-height, I am actually have same problem with this guy, confusing with the math behind the material. Is that possible to give some tutorials on this part, or any suggested tutorials I can start with this part( the math calculation)? I've searched a lot, but haven't found properly tutorial yet, Looking forward for your reply!
Since I made this video, I have learned that it's much easier to use the B component of the absolute world position - just like the forum post suggests - so I'd definitely recommend doing that.
@@BenCloward Got it! Thanks for your reply!
Following along but dang this is an extremely expensive water shader , and its just the 2nd part. Only usefull for ArchVis shots.
Of course you're welcome to simplify it to use just the features you need. My intent is to show lots of different things that can be done so that people can pick and choose. If you have some techniques that give similar results but without the expense, please share!
I would like to call the material tutorial is " Materials Holy bible " thanks Sir
omg your video for water Depth its good thank you man for help me ok can you have video how to make vehicle like pubg game? bcs i need make game like pubg my problame i need how to make vehicle like pubg or gta for thirdperson no firstperson ty and soory for bad eng
My channel is mostly focused on shaders and materials - so I don't cover the vehicle creation process. I'm sure that you can find other sources to help you with that though.
THANK I LOVE YOUR CHANNEL
Uh. These vector calculations finally lost me. Will need to rewatch in slomo
Thank you for your very nice Tutorials, but please this music is very distractive :)
Thanks for the feedback! I'll try to tone it down a bit in future videos.
@@BenCloward may I ask you something else please, at 11:55 you set a constant value to 70 because the water plane is 70 cm above the world origin. If my plane is at 0 or beneath (-70) should I set the respective number?
Thank you again.
Yes, that's correct - although someone else pointed out that it would be easier to just use the Z component of the ObjectPositionWS node. That would give you the same thing without you needing to type it in yourself.
@@BenCloward that's very nice!
So masking the Object Position and selecting only the B channel?
Yes