Realistic Water Colour in ShaderGraph

hi guys in this tutorial we'll create this water Shader focusing on the watercolor a water Shader can consist of a lot of different effects transparency color absorption caustics reflectiveness aeration movement of this aeration Etc in this tutorial we will do the watercolor based on the concept of absorption so we're gonna work in urp and here we have a plane I have used the unity terrain to Dent it a bit so it looks like a pond and now let's just create a new Shader and a material and attach it to our plane [Music] to start with water is transparent we won't use the alpha output in the Shader to do this instead we will access what's on the screen before we render our object with the node called scene color so the scene color note provides information about what's already rendered on the screen before we are to render our water plane and to be able to do this we need to Mark our Shader as transparent foreign [Music] color straight away we get this transparency effect and if we're to go back and set a property for the watercolor and multiply the same color by our color we now have some naive transparency [Music] foreign [Music] Works in real life is related to light absorption when light hits the surface of an object some of it is reflected straight away that's called specular reflection and the rest enters the object bounces around some of it is absorbed in some of it escapes the light that escapes is called diffused reflection and the diffuse reflection is what we perceive as color for a simplified example I read Apple in sunlight absorbs all the wavelengths apart from red and only the red light escapes so we perceive it as red for the same reason a blue object in red light would appear almost black there's no blue light to be reflected and the red light is absorbed so the same happens with blue water [Music] so to implement this we need a color to be absorbed and absorption value how much of this color should be observed now what's an absorption coefficient it's measurement of how far can light go through material before it's fully absorbed this is different for different wavelengths and different materials we have the following formula where Alpha is the absorption coefficient a is the percentage of light being absorbed and X is the thickness of the material so just to try this let's set a property for the thickness of the material even though we will eventually have this based on the depth of the water let's take that formula and turn it into notes [Music] foreign [Music] foreign [Music] so we can either group this like that or turn into a sub graph depending on how we want this organized I'm going to leave it as a group so we can keep looking at it now let's multiply that absorption value by the absorption color so we can think of this absorption coefficient as the percentage of color we want to see and that's why we're multiplying here [Music] and here we no longer want to be multiplying by multiplying where it themed in and we want to remove the color that has been absorbed so we want to subtract foreign [Music] next we probably don't want to be selecting the color to be absorbed but rather we want to select our watercolor as we did earlier [Music] so instead of absorb color let's do one minus watercolor which would give us the absorption color based on the end color we want [Music] this works best with less saturation and you can decide which parameter makes more sense to you select an absorption color or watercolor directly next we want the watercolor to change based on the depth of the water we want the absorption value to be controlled by the depth the deeper the water it is the more color is absorbed we would need to calculate the depth based on our point of view or in other words the camera position essentially we're asking ourselves how much water am I looking through to calculate this we need to understand two nodes the first one is seen that this provides the camera depth buffer before our object is rendered the object that the Shader is applied to in our case the water plane it has a few options and if we select the i-coordinate system it will be transformed in such a way that the camera or eye is sitting at zero zero zero to understand this better here is a quick overview of the rendering process at first our object is at local space coordinate system then that's converted to World space then to view space or eye space then clip space then screen space the local coordinates are the obsess coordinates relative to its origin these are then transformed to World coordinates relative to the world's organ and then these are transformed to i-coordinates relative to the camera this is what the eye option in syndep gives us essentially tells us how far from the camera the object is the second note we need is screen position to understand this note we need to continue looking at the rendering pipeline after we have calculated the view coordinates we then calculate the clip space coordinates that transforms the coordinates to fit in a box from -1 minus one minus one to one one everything that's outside this box gets clipped this coordinates transformation is different depending on the type of projection we use in perspective orthographic what is in the camera frustum stays and everything else gets clicked the last step is to transform this to screen space to do this we need to know how far is the camera from the projection plane in Game Dev quite often the 3D coordinates are represented not by three but four values the fourth being W which stands for weight this fourth value allows us to do more about giving us more data usually at this point of the chord and Transformations you will be left with just X and Y represented the screen position but selecting the option also allows for the Z and W to be carried over so if you don't select the Z and W are going to be zero and if you do the values from the previous stage get carried over in this case the W is the distance from the camera to the water at each vertex so if we subtract the screen position from the scene depth we get the distance we're looking for and that corresponds to the X in our absorption formula [Music] thank you [Music] thank you foreign [Music] thank you so let's plug that in and we have our final result [Music] foreign [Music] thank you very much for watching and I hope you enjoyed it [Music]

Channel: eleonora

Views: 6,248

Keywords:

Id: S4RrVKBEaDw

Length: 11min 42sec (702 seconds)

Published: Wed Sep 06 2023