Stylized Rendering Landscape

Choose your OS:

StylizedTerrain.png

The landscape is one of the more prominent level features in this example. This is primarily because of its very cartoon-like shading, which is being handled by way of the Landscape Material. For information on the setup and creation of Landscapes, please see the Landscape documentation .

The Material applied to this Landscape is fairly technical. Beginner users may find it a bit overwhelming.

Most of the Materials created for this scene are actually applied via a Material Instance Constant . This allows for rapid property adjustments and tweaks without having to wait for the Material to recompile.

First, you will want to open the Material in the Material Editor so that you can get a look at the Material Expressions being used. To do so, follow these steps:

  1. In the Content Browser, search for and locate the M_Terrain_Gound_A Material. You will need to make sure you are looking in the Game folder in the Asset Tree. It may also help to filter to Materials only.

    M_Terrain_GroundCB.png

  2. Double-click this Material to open it in the Material Editor.

You will immediately notice the Material is broken up into an arrangement of Comment Blocks, such as this one:

DistanceColorizeComment.png

These are designed to help show what key areas of the Material expression network are doing. Here is a breakdown:

  • Rock and Grass Diffuse - This handles the blending between the rock and grass textures and how they are placed on the Landscape surface.

  • Controls height blend of Rock Diffuse - This section performs the angle check for the surface, which is how we can have grassy flat areas and rocky texture at the slopes.

  • Path Diffuse - This overlays a texture for walking paths on top of the Landscape.

  • Beach color and Mask - This is responsible for helping designate the beach areas where water meets the land.

  • Splotches - This area takes in a mask texture and retiles it channel-by-channel, then uses it to create randomized spots of color along the terrain.

  • Distance Colorize - You may have noticed that the terrain becomes a single dark, foggy color as you move away from it. This section of the Material creates this transition.

Rock and Grass Blending

This Material blends between two final looks based on the angle of the terrain surface when it has been sculpted. This means that flatter areas will be covered in a painterly grass texture and all surfaces that have a slope will have a rock cliff texture. The texture results are shown below.

GrassColor.png

RockCliff.png

GrassBlendResult.png

Grass

Cliff

Result

The key to this blend mechanism sits within the World_Aligned_Blend Material Functions, which you will find in the Material within the Controls height blend comment box. This function takes in a vector and compares it against a world space surface normal. The function provides a 0-1 alpha output where 0 represents perpendicular vectors and 1 represents parallel vectors. Put another way, when using the Z-Axis (0,0,1) as your In World Vector value, it outputs a black and white texture where white represents flat and black represents slope. This value can be biased and sharpened to get a clean line between the alpha values.

In the example below, we use World Aligned Blend to interpolate between red and blue. You can see the Material network, along with a breakdown of how the blend takes place. Note that a bit of sharpening has been added to make the results more apparent.

WorldAlignedBlendNetwork.png

InWorldVector.png

SurfaceComparison.png

Result.png

In World Vector

World Surface Normal - Alpha output in yellow

Result

You may also notice that there is an outline between the rock and grass that helps define the division between the surfaces. This is created by doing two World_Aligned_Blend operations, one with a tighter bias. The first blends between the stone texture and the brown color used for the outline. The second one blends between the result of the first and the grass color.

OutlineExample.png

Below is a simplified example where we blend from red, to green, to blue to create a similar outline.

OutlineBlendResult.png

Result

Network (Click to enlarge)

Landscape Splines

The pathways and the beachlines across the water are created with Landscape Splines. Landscape Splines serve as a great way to create roads and trails on a Landscape, as well as any other type of asset that needs to conform to the landscape surface.

Walkway.png

For more information, please see the Landscape Splines documentation.