Blend Objects with Terrains in Godot 3.3/4.0

hello in this tutorial i want to show how i created this terrain mesh blending effect since the response on my twitter post was way more than i expected we will recreate this effect in godot 3.3 but the same workflow also applies to godot version 4 as you can see in the background and as a little disclaimer the effect works at best on flat terrain since i didn't find a procedural solution for complex environments like caves or mountains so let's get started so in this scene we have three different rocks and to explain things the rock on the right has snow blending the rock in the middle here has a blending depending on the uv map under of the rock and the left rock has a tri-planar blending and to make it a bit more visible i make it unshaded and if we take a closer look at the rock on the right we see we have very hard edges at the end of the rock and to fix this we blend the sand texture with the rock as you can see here but also here the illusion breaks off if you look closely you can also notice the seam and to fix this i found a solution that you can use a tri-planar map so that the texture coordinates are not depending on the uv map but on the global position in the world environment and if i move the rock a little bit you can see that the texture is always is staying the same depending on the position in the editor i build up a little scene with an environment node and a light node and there i added a new mesh instance and under mesh i add a new plane mesh and i will scale the plane up to 40 by 40 and to create our tri-planar material we create a new material and it's a shader and on the shader we will create a new shader and try planar shader isn't supported by google free natively so we will shortly go to guru 4. there we will select any object and we will create a new standard material and for demonstration i will load in the sample texture in the battle channel which will be a brick texture and what you can see now is the brick texture depending on the uv map but we want to have it try planar so we go to the uv tab and enable it and now we have a toy planar map which is in local space but we want our triplanar map to be in global space so we will enable word trial planner on the top there which is missing in the guru version 3 and that's why we're in guru version 4. and if i move the cube now you can see that the texture is depending on the world coordinates and also if i for instance rotate the cube the pattern of the texture stays the same and to get the shader we select our shader standard material and convert it to a shader material and there we have our whole shader and we will copy it and paste it in our godo version free and there we need to change a few things like in the albedo and the metallic sampler 2d variables and there we have it and now i go to the shadow parameters and set the albedo to white set the roughness to 1 the metallic texture channel to 1 on the x component i set the uv blend sharpness to one this is important and i set the uv scale to one for the uv one and two and for a better texture i will load in a grass texture and as you can see now we have the same effect as in gulo 4 and since we ported the shader to guru 3. i will also put the shader code in the description along with the project file if you are interested to take a look at it yourself and right now i scale the uv a little bit down so that we don't have too much tiling in your grass texture now we will load our mesh in our scene i decided to use the store frame which i made for sand fire and i move it a little bit back so we can see it a little bit better and on the material we will create a new shader material and there we will create a new shader and firstly we define the shader type as spatial since we are in 3d space and then we will create our first variable from type vector3 and i name it n since this is the normal vector of the xc level or plane and this will be important for our distance calculation for the blending later on then we create three new variables from typefloat the first one is the triplanar scale and i will set it to 0.05 and this value should be the same as in your grass shader do you in the uv scale and the next variable is the blend size i set one and the blend offset is zero now we will create our first sampler2d variable which will contain the texture for the door frame and in this case i will name it main albedo since it's the main texture and we do exactly the same for the blend texture and i name it in this case blend albedo and this will be our grass texture and to improve the transition a little bit we will also um create a transition mask sampler to develop verb to improve the blending effect then we go to our grass shader and we will look for these three variables right here and we will copy them and we will paste them back to our other shader and these are bearing variables the first one stores the trial planar position the second one is is the blend sharpness and we will initialize it with one and the third one is the uv power normal and this will decide later which uv set to use for our toy planar texture and then we will copy the vertex and the triplanar texture function from the grass shader and paste it back to our other shader and what's happening here is firstly we remove the uv offset variable in line 29 and we will change the uv scale variable to our tri-planar scale variable in the vertex function we need to recalculate the tangent and the binomial because normally they drive along with the uv but since we are now using well coordinates we have to recalculate them we also calculate the variable for the power normal and for the triplanar position in the trial planar texture function we have three parameters and what we basically do here is we sample a texture from the front the side and the top and depending on the weights we will have a tri-planar texture in the end now we will create our void fragment function and in there we will create our first variable it's a vector3 and i named it p and this will be our camera matrix multiplied with a vector4 which will contain our vertices and one and from this we need x y and z components um and with this we can now calculate the distance therefore we create a new variable from typefloat and our distance is the dot product between the already the created p variable and our n and n was the normal vector of the xc plane and then we take this distance and we will clamp it between the blend offset and the blend size then we will create a vector3 for our main color and there we will sample our main texture in the uv and we can do the same for our blend texture and if we do this like this we have our blend texture dependent on the uv of the object but in our case we want to use the tri-planar space so we use our triplanar texture function and sample our texture in there and use the uv power normal for the third second parameter and the dry planar pose for the third parameter now we can create our battle output and there we can mix our blend color with our main color and the mix value will be our distance and now under the shadow parameters i assign the concrete texture to the main albedo and the grass texture to the blend albedo and then i play a bit with the blend offset and the blend size to get a nice looking result and as you can see we have now the possibility to blend our mesh with the ground and at last i want to create the blending effect therefore i sampled our transition mask texture which we created above and there from this we take the red value and then we create a new variable named blend and there we use a function named overlay and we will use our distance and last mask for this and we will change and i'll better output the mix value with the blend and then i just copy in the overlay function which will create the blending between the main texture and the blend texture and if we for instance use a noise texture as a transition mask you can see depending on the parameters and the different results you can achieve with it and now i added a little low poly stone and we can do exactly the same we will copy our code and paste it in there and the only thing we have to do is to set the parameters correct for our mesh for guru 4 we use basically the same workflow as you can see in the shader parameters i added some other texture and as you can see here i also sample those textures and put those textures in the corresponding outputs so for the normals i put it in the normal map output and so on and what is also important is that you have to be careful with your lighting lightning if you don't want to break the illusion if i for instance set up a little point light here and if i move it for instance up a little bit above the stone you can see that sometimes um there is still uh somewhat hard edge appearing and yeah therefore you have to be like in this like you can see right now you have to be very careful with your lighting lightning setup and maybe you should also be a bit careful about ambient occlusion because ambient occlusion does darken the edges and therefore you should be a bit careful with your setup in order to keep the illusion since it's not perfect at the moment so but that is everything for this video thank you very much for watching and have a nice day

Channel: Kmitt 91

Views: 2,405

Keywords: Godot, Godot 4, Tutorial, 3D, Godot 3D, Godot Tutorial, Terrain Blending, Blend Objects with Terrain, Mesh Blending, Triplanar Mapping, Shader

Id: yaxNGUf1FUs

Length: 14min 23sec (863 seconds)

Published: Sat Oct 02 2021