Unreal Stylized Landscape and Grass Materials

hello everyone so today we are going to implement this uh kind of fortnite styled uh stylized landscape uh with this uh landscape cross output so now as you can see here this grass output is taking the color from the ground and so it is blending nicely so here also this area is kind of yellow and the landscape is also a yellow vision here this is the dirt layer in the dirt layer you don't have any we don't have any grasses but as it blends with the grass or green layer you can see the grass appears and also closer to the dirt layer the grass is more brown closer to the dirt color so this is the this is what we are going to work on today so the goal is to create somewhat similar to grass to fortnite grass shading and a landscape and this episode is sponsored by this generous patron thank you very much for your support okay so this is just a blank map i have created in unreal nothing else all right so let's get started with our landscape first i'm gonna delete this one and i don't need this tool right let's go to mods landscape and here with these default settings i'll create a landscape like this right now as you can see there are some lines that's because this we are using stationary lights i'll make it movable um and i'll increase the intensity to six because uh because i kind of like that level of lighting okay and yeah this is wait okay so this is our landscape uh now i'll let's go ahead and do some sculpting well actually not that important i just want to have some shapes otherwise it looks boring okay i guess this would be enough let's set some erosion too okay this is better good enough all right now let's create a mat area i have this materials folder if you don't have one you can create one that's not right click new folder and material i'll call it hemlandscape okay then open this so all i need is some landscape landscape with couple of layers so how can we do this okay for the base color i will blend this landscape layer blend node and here i'll define [Music] full as right one is i'll call cross and the next one i'll call dirt and the next one i'll call rock i think that would be enough yeah we don't need three layers for now at least okay now let's promote this to a vector parameter truss color duplicate it with ctrl w and name that one dirt collar duplicate that again let's call it rock color all right so connect it like this okay well since i'm referencing fortnite landscape as a reference let's use this image actually any image would do yeah let's use the previous image i used as a reference so for that i drag and drop it here cool now i need to set the colors so for the grass color i'll use this eyedropper tool and click somewhere like this how is that the color okay i think that color would do actually it's kind of a blend so maybe not exactly that color but that's okay we can change it later because these are parameters so for the dirt similarly i'll pick this color for the rock i'll pick whatever the color here okay all right apply now let's drag and drop this uh no let's create no no need to create a material instance let's use this landscape material for the landscape okay so it's black so that's because here as the preview weight i'll put i have put zero for all the layers so i'll set one for the grass layer let me save this map tonight okay but it's still still this is black right let's go to the landscape and paint all right so here we need to create layer info files so i'll add a little bit blended layer info for each layer okay now you can see the color is coming to the landscape okay but everywhere is green as expected so yeah actually that's because we haven't painted any other colors so here i'm not going to do something like a slow paced layer blending or anything because i'm gonna keep using uh i'm gonna rely on painting so actually i need to show how to get the look not really concerned about the painting so for example let me change the brush settings to fall off let's set it to two and with the brackets i can reduce the radius so let's draw something like a road oh wait we need to select so i'll select dirt so this is something like a road wait what was the total strength i'll set it one okay here we have a rod a very simple one and also let's have some rock i'll set the fall off to six actually rocks are not required they look ugly so i'll remove it for now but you know how to paint them okay so what's next yeah also we can see some lighter grass areas too so for that well actually we can use the same to achieve that effect the same dirt layer with let's say 0.2 strength like this i can paint some random areas to get that look actually it doesn't really give the look as needed but that will do for now all we need is some different color changes noises okay so yeah so the next thing is add in grass so how do we cross let me see first right um let's go here cross our foot landscape crossover here we can sample layer landscape layer sample okay so here i'm gonna sample cross color sorry not grass color the grass the layer name is just cross yeah and then from that i'm gonna subtract another sample dirt i'll use that as the input for the grass type now as the grass type we need to assign one but we don't have anything but i have already imported a grass mesh i haven't created the material yet so here let's create under foliage landscape truss type here let's add a new one and as the grass mesh i'll give this grass mesh i have here okay default settings would do now we can assign the landscape cross type let's see compiling okay now we have the grass and yeah okay now for now let's create a new material for the grass oh sorry let's create it in the materials folder m cross so for the grass i have imported this texture kind of a stylized looking texture uh so i'll just drag and drop it here actually this is not going to be the final color i'll set the blend mode to mask and connect alpha layer like this and let's assign this material for the grass okay it looks bad i know also it looks shiny let me promote these two parameters i'll set a specular 2.2 and roughness to 0.8 okay so now the next step is i want so as you can see they are not really blending with the ground but in fortnite you can see actually the grass has almost the same color as the landscape hmm see almost the same color of the landscape so how do we get that defect okay so for that first i'll go to m landscape no so we need a way to sample the landscape color so for that let's go to the top view right so here we can actually here we can generate a texture to sample the landscape color but yeah but usually if you are using something like houdini or world machine or something to generate these color maps you can generate the color map from that so software itself but here i'm not going to use i'm not using any of those so i'm just going to take a screenshot like this so here i'll hide the grid i don't need it and yeah make sure you are in you're in unlead mode because if you're unlit mode there should be some color changes based on the lighting but lighting is going to affect the grass mesh anyway therefore it's better to get the screenshot in our lid mode so i'll take a screenshot like this if you don't know how to take a screenshot uh press the console button uh in the top left under the ac and i press short here you can use one it represents like a resolution multiplier now click here so it will open the folder where you the screenshot is saved now go to photoshop or any other photo editing software you have no and create a new file i'm gonna use yeah is this enough let's create a 4k texture maybe not required no 2k texture right now drag and drop this texture you just tear took a screenshot okay now select only the green area and delete the rest oh what's this i'm not sure what that is but it wouldn't matter it would be a far point in the landscape so i'll just leave it okay now make sure it fits the whole texture exactly otherwise you will have changes differences in between the color of the grass and the color of the land now save this uh save this as a png i'll call it and skip color map okay now go to the folder where you saved that and import it to the project now go back to perspective mode let's import it here right so how do we get the same color for the grass as the landscape okay so for that step let's again go to the grass material so here drag and drop this landscape color map so we are going to sample the location of the of this of particular grass mesh instance location in the world space using this texture so for that we can get absolute no world position so this will give the position in the world space of the particular pixel that we are going to render and from this actually we only this is a 2d texture so we only need two dimensional x and y so we can mask this and yeah by default you get r and g so [Music] okay so i think uh zero zero means here and one no not c yeah one one means here as i remember yeah let's see okay now uh here in the middle actually that is the middle of the landscape but if you select the landscape you can see this this corner is the origin of the landscape it is in the location of this minus 25200 so for the sampling process we have to consider that part so we have to subtract it [Music] constant two vector twenty five thousand two hundred that's the value right yeah okay now we [Music] considered the offset and then so this texture should uh be core should overlap should be mapped into the complete uh breadth of the landscape so for that when we consider the world position we have to divide this by the size of the landscape so this is this is this uh left top left and not the top left so this is this corner so from zero to here we have this size minus twenty five thousand two hundred so the complete height width uh this length and this length is double this amount so that means scale that may promote this to a variable so actually we don't have to change it unless we are changing the landscape so the scale is doubled twenty five thousand two hundred that means twenty five fifty thousand 400 okay so so now we have the uv coordinate of this texture we need to sample so for now i'll just directly connect this rgb value instead of the base color we got from this texture and apply okay now let's go here right it already starting to look good but as you can see we can clearly see the edge of the grass and we have this difference in color that's because of the uh face that is facing the sun the light is more lit and the back face is more dark so should we get rid of that if i got rid of that we should be able to minimize see in this margin okay there is a simple trick to do that here when you select the main node okay there is an option called user tangent space normal over space normal as an input so i'll disable this and i'll promote this number to a vector parameter it should be normal and here i'll set it to 0 0 1 that means normal is facing upward so it's same as the landscape is facing upwards so it should have the same lighting see now you don't really see the the difference this difference comes from the shadows and it kind of looks odd do we have shadows in fortnite grass i'm not sure i don't think they have shadows yeah yeah yeah so we can disable shadows in here now we barely see the grass because of disabled shadows okay so how do we improve but you can see the grass color is nicely blended with the landscape actually it's really hard to see in some cases it is visible only when we have some shadows let's add some objects to the sea so we can see the effect nicely okay what's here i don't know okay see in the dark areas we can see the grass nicely okay so what else we can do to improve the look of the grass is the scale correct right uh we can do one more thing here and cross we can blend with this texture like this we can look linearly interpolate this color this texture color and the result color of this sampling so this alpha so for the lower part i need to have the ground color and as i go up i need to increase uh the percentage coming from this texture so for that we can use texture coordinate and here i only need the vertical vertical value of the coordinate so we can do a component mask so since this is a 2d texture i get only r and g that means x and y so here i only need the vertical part that means y and if i just connect it like this you will see a linear change from this color to this color as the uh this color to this color as the texture goes from here to here if i apply it you can see see now the base has the ground color and upper part has the texture color okay i think i should have some random yellow patches of grass too because only this this part this third part is not enough so shall we add another layer before that let's add some wind simple cross width as the additional world position of set argue just connect some value no it's alpha actually i don't know i don't think let's see how it looks and decide intensity let's try 0.1 wind weight also 0.1 and wind speed apply do you see the moment i don't see any movement what values we should use let's try 0.2 and for the wind weight 0.2 and for the wind speed also 0.2 all right now we can see this is moving okay i think that's enough a subtle moment oh one more thing i think it would be better to have more from the ground color and less from the grass color so instead of a line here blending we can have an exponential bending blending so we can use a power node here and as the exponential let's promote these two parameter let's use something like if it is 0 it will always have the ground color see if it is one it will be like this if it is 1.5 okay like this let's try this value and see how it looks okay i think that's better shall we make the grass a little taller let's reduce to 300 and scale is it oh it's uniform let's try to ah minimum one point six maximum two so we can have some randomization yeah i think that's better okay so for some yeah now let's see how to add some [Music] yellow grass patches so for that i think we need another landscape layer or we can just go here and paint too but let's do it the landscape let's add another layer let's call it um dead grass and i change this to date grass color let's change this to yellow right now it's sample did cross layer two and add to this right now here we will let's paint the red grass layer for that why it's not showing up here do i have to refresh or something okay let's try reloading the lever all right now we have the layer so for the dead grass i'll add another weight blended layer oh i can't have spaces okay so for now i disabled the grass because i need to be able to see the land underneath okay let's paint some yellow patches randomly like this and i'll hide these cylinders let's again go to the top view unlit hide the grid ah that this was the one visible before okay okay high res shot go to the folder i guess it was this select only the landscape hide this part okay save again as the landscape color map and since we have already imported the color map we can just re-import it so it will have the updated one with the yellow parts like this okay now just go here and set it back to 300 c and also make this visible now we have this yellow grass patches also over there see we have the color variation we wanted okay so i think we can stop this episode right here so we have a nice looking stylized cross okay right that's all so maybe later on we can add some do some stuff like adding some textures to this dirt layer and to the ground layer grass layer add some textures and make it look more detailed but i'm not going to do that here so as always project files will be available for the download through patreon page link would be in the description below and thanks for watching see you in another episode goodbye

Channel: CodeLikeMe

Views: 36,830

Keywords: unreal fortnite landscape, unreal fortnite grass shader, unreal fortnite landscape shader, unreal fortnite grass material, unreal stylized grass material, unreal stylized landscape material, unreal fortnite grass, ue4 fortnite landscape, ue4 fortnite grass shader, ue4 fortnite landscape shader, ue4 fortnite grass material, ue4 stylized grass material, ue4 stylized landscape material, ue4 fortnite grass, ue4 stylized landscape, unreal engine stylized landscape

Id: I0S0Aufq5Ko

Length: 45min 4sec (2704 seconds)

Published: Mon Nov 02 2020

Reddit Comments

[u/AutoModerator]

This post appears to be a direct link to a video.

As a reminder, please note that posting footage of a game in a standalone thread to request feedback or show off your work is against the rules of /r/gamedev. That content would be more appropriate as a comment in the next Screenshot Saturday (or a more fitting weekly thread), where you'll have the opportunity to share 2-way feedback with others.

/r/gamedev puts an emphasis on knowledge sharing. If you want to make a standalone post about your game, make sure it's informative and geared specifically towards other developers.

Please check out the following resources for more information:

Weekly Threads 101: Making Good Use of /r/gamedev

Posting about your projects on /r/gamedev (Guide)

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.