Terrain tutorial - Part 4
Tutorials in this series:
- Terrain tutorial: Creating a heightmap, modifying brush patterns and shapes, using terrain limiters, using the level tool to create ramps and mesas
- Terrain tutorial - Part 2: Colorizing terrain, importing unique brush patterns
- Terrain tutorial - Part 3: Creating multiple heightmaps at once, dealing with overlaps
- Terrain tutorial - Part 4: Modifying terrain with textures, adding dynamic details
- Terrain tutorial - Part 5: Erasing and Cloning terrain details, exporting terrain for modeling reference, texture tweaking
Texture tutorial setup
- For best results, this section of the tutorial should be accomplished in a test area of the Hero's Journey Reference world, since there are specific textures there which can be used in this tutorial.
- Configure HeroBlade so that you can see the following panels:
- It is definitely possible to work through this tutorial by swapping back and forth between the above panels, but it will be much easier if you can see both at once. For details on how to do this, see Docking HeroBlade panels.
Applying terrain textures
Each heightmap node can have four texture Layers. The layers determine the order in which the textures are rendered (drawn on the screen). Textures in the lowest layer, Layer 1, are rendered first, Layer 2 second, and so on. This allows you to create (for example) a grass texture with a road texture on top of it, leaves on top of the road, and sticks on top of the leaves:
- Layer 4: Sticks
- Layer 3: Leaves
- Layer 2: Road
- Layer 1: Grass
The more Layers in an area, however, the more rendering time a heightmap "costs", so these Layers should be used with care.
Each layer can also have up to 256 textures, but again, each texture has overhead, so they should be used carefully.
Assign a base texture to the heightmap
- This section of the tutorial can probably only be accomplished in a Hero's Journey Reference world, because it uses specific textures.
When created, a heightmap has a default texture on Layer 1. In a completely new area, this will probably be a checkerboard pattern, but might also have been configured to be something else.
To change the default texture for heightmaps in your area:
- On the Terrain panel, click on the Texture tool.
- In the texture subpanel, select the leftmost texture in Layer 1 (this texture is usually selected by default).
- In a lower section of the subpanel, the texture will be displayed in two larger boxes, labeled "Diffuse" and "Bump + Spec".
- Click on the "Change" button under the Diffuse box
- In the selector menu that pops up, choose a different texture, such as leafy_grass01_d.dds or dirt_grass01_d.dds. Click "OK", and all heightmaps which use the default texture in your area should switch to the new texture.
- If you do not see the texture in the default directory, try navigating to one of the following:
- If you do not see the texture in the default directory, try navigating to one of the following:
- Click on the "Create Heightmap" button, to observe that new heightmaps have this default texture as well.
- If it's not already there, change the default texture back to leafy_grass01_d.dds with the above method.
- Drag the "UV Scale" slider, and note how this affects the texture pattern on the heightmap, making it smaller and larger. End with a value around 2.5.
Add another layer
- Click on the leftmost texture box in the "Layer 2" section (you may need to scroll down below Layer 1 to see these boxes)
- If the box was empty, clicking on "Add" should open the file selector. If it was not empty, then click on the "Change" button again.
- Choose a texture for a road, such as Generic/Paths_Roads/cobblestone_01_d.dds
- Ensure that the heightmap is selected.
- Choose a solid brush shape.
- Using CTRL-wheel, create a high-intensity brush strength
- Using just the mouse wheel, create a brush size of about 10%
- Paint the road texture on a heightmap, like to place a road from one side of the heightmap to the other, with some gentle curves.
- Drag the UV slider on the terrain panel, and note how this changes the size of the cobblestones.
- Move your viewpoint closer to the new texture and drag the UV slider again. Note how the grass between the gaps of the cobblestones, comes from the Layer1 texture, and is not part of the cobblestone texture itself. This is because the areas in between cobblestones on the texture have a low Alpha setting, which makes them more transparent.
If the textures were swapped between layers (and you may wish to try this later for practice), the default texture of the heightmap would be cobblestones, and the grass "path" would appear on top of the cobblestones.
Adding a bump texture
Next, we'll add some bumpiness to the texture, so that it reacts to angled light. The current texture is known as a "Diffuse" texture, which is how it appears. But a second texture can be added to adjust its "bumpiness", and this is called a "Bump+Spec" textures. The Diffuse and Bump+Spec textures are generally created in coordinated pairs by your artists, with similar names and just different suffixes.
- Diffuse textures are distinguished with a "_d.dds" suffix
- Bump+Spec textures are distinguished with a "_n.dds" suffix (n stands for "normal map")
First, let's turn on angled light.
- Open the environment panel
- Select the checkbox that says Use Dynamic Sky
- Drag the "Time of Day" slider back and forth. Right now, the light should affect all the textures in pretty much the same way.
To add a bumpiness to the cobblestones:
- On the Terrain Panel, the cobblestone texture should be the currently selected texture in the "Diffuse" box of the Textures subpanel.
- The box to the right of the Diffuse box is labeled "Bump + Spec", and is probably empty right now (with a large red X in the box).
- Click the "Add" link in the "Bump+Spec" box
- If there's already a texture there, click the "Change" button instead.
- Navigate to cobblestone_01_n.dds, and click "OK"
- Be sure to choose the "_n.dds" texture, not the "_d.dds" texture
- Drag the Bump slider back and forth. The visual changes at this point may or may not be obvious, but end with the Bump slider at the far right (value of 1).
- Switch back to the Environment panel, and drag the Time of Day slider back and forth. The lighting changes on the cobblestones should be much more obvious now. End with a bright light setting.
- Switch back to the Terrain panel, and drag the Specular slider back and forth. This allows you to modify the reflectivity or shininess of the bump texture. End with a value of about 0.5.
- Drag the UV Scale slider again. Note that the UV scales for both the Diffuse texture and the Bump+Spec texture are locked together. This is the default, since usually when one is modified, you want the other to stay in sync.
- To unsync them, click on the Locked button, which will allow you to modify the sliders individually.
- Drag the UV Scale (Bump + Spec) slider back and forth, to see what it looks like to modify the bumpiness without keeping the graphics in sync
- To re-sync the two textures, click on the "Free" button, to change it back to "Locked"
Add more levels of textures
- In the "Layer 3" section, click "Add" on the leftmost box
- Choose a texture that that has lots of alpha (transparency) in it, such as: World/LiveContent/Terrain/Maps/Detail/twigs_detail_01_d.dds
- Paint on top of the road (you may need to move your viewpoint closer to see the texture).
- Add a second texture to layer 3, and choose the twigs again
- For the second texture, we'll also choose a different density. Drag the UV Scale slider to a completely different setting.
- Click the first texture in Layer 3, and anywhere that texture is used, will flash briefly.
- Click the second texture on Layer 3, and it will flash as well. This technique can be used for any texture on a layer, so you can tell where exactly it is being used.
Dynamic details allow you to add things such as grass which blows in the wind, flowers, and other kinds of foliage or ground clutter.
- Choose the Dynamic Detail tool
- Note that in the Dynamic Details subpanel, there are two tabs: Billboards, and Meshes. Stick with the Billboards for now.
- Each box on the billboards tab represents a different channel, with the top left one being "Channel 0".
- Click in channel 0.
- In the file selector box, choose tall_summer_grass.dds. This is a four-part detail, to add some randomness to the effect.
- Click the "Four-way" button in the subpanel, to indicate that this is a four-part texture.
- Paint a swath. Don't worry if you don't see anything yet.
- In the "Channel 0 settings" subpanel, drag the transparency slider to the left, and the details should appear.
- Transparency is best used to make minor adjustments, depending on the alpha channel of the texture, to ensure that billboards render cleanly and sort properly with other objects and channels.
- Move your viewpoint very close to the grass, and then drag the transparency slider back and forth to get a sense of how it changes the details, and what might look best.
- Check the Realtime Update checkbox and then drag the slider again
- Go into Character mode to observe the details in context.
- Drag the Scale slider to observe the effects that can be achieved in details, in relation to the size of a character. This could be anything from ankle-high grass, to chest-high, to over the top of the character's head.
- Drag the Density slider to observe different settings
- Under the Scale slider, drag the "Var" slider to modify the scale variability, in a fractal pattern.
- Drag the "Str" slider for Scale strength, which among other things can cause a feathering effect along the edges of where you painted the details.
- Color is done with a combination of Hue, Saturation, and Brightness
- First, drag the Brightness slider down to 50% or so.
- Drag the Hue Slider back and forth
- Drag the Saturation slider back and forth. Note that if Saturation is low, the Hue slider won't do much
- Try to create primary colors of Red, Yellow, and Blue, with combinations of the three sliders
- Drag the "Var" sliders under each of the three sliders, to add some random variation
- The distance slider adjusts the distance at which the details fade out.
- Back your viewpoint away (s-key) from the details, to see at what point they start disappearing. Moving the distance slider will modify this.
- The Var Freq slider adjusts the scale of fractaling pattern. Note: This will only appear to do something, if one of the above Var sliders is non-zero.
The grass won't move, unless wind is turned on in the Environment panel. Once this is done, the Wind effect can also be adjusted in the Terrain panel.
- In the environment panel, go to the "Wind" subpanel, and drag the "Base Strength" slider to a mid-range. This will cause the blue "Current Wind" bar to appear.
- Drag "Gust Strength" and "Gust Frequency" to mid-range as well, and note how the current wind bar changes.
- Back in the Terrain Panel, drag the Wind Effect slider back and forth to adjust how the wind affects this particular channel of dynamic details.
- To change the direction of the wind, drag the Azimuth arrow below the Current Wind bar in the Wind subpanel.
- To turn the wind off, while still keeping the other settings, drag the vertical slider down to 0.
For a demonstration of how the 1/4/2 textures work:
- Get your viewpoint close to the heightmap (perhaps by going into Character mode)
- Set minimal settings on the details:
- Drag all the Var sliders to 0
- Set Brightness to maximum
- Set Transparency to 0
- Set Scale to around 100
- Click on the "Single" detail button (the leftmost of the three)
- Drag the Scale slider to minimum, and then slowly increase it.
- Note that the details are in groups of 4. This is because with the "Single" detail button, the details are being rendered directly from the texture, in their groups of four. This is actually not good practice, because it means some details are "floating" as they're being drawn above other details.
- Click on the "Double" detail button (the rightmost of the three)
- Drag the Scale slider to minimum, and then slowly increase it. Note that the details are now being created either from the left half of the texture, or the right half. But again, some details are "floating" above others.
- Click on the "quadruple" detail button in the center, which is the correct setting for this texture.
- Drag the Scale slider to minimum, and then slowly increase it. Note that this correctly has each detail growing out of the ground, and HeroEngine randomly chooses one of the four possible different patterns.
For further practice, adjust the sliders to find an effect that you find pleasant, with wind turned back on.
Dynamic detail meshes
- Move your viewpoint to an empty part of the heightmap
- Select the heightmap
- In the Dynamic Details subpanel, click on the Meshes tab
- Click in a blank row, to open a file selector
- Select mushroom_speckled_01.gr2 (the full path is /World/LiveContent/DynamicDetails/mushroom_speckled_01.gr2)
- Selection can be done either by double-clicking on the filename, or selecting it and clicking OK
- With the terrain tool, "paint" a swath of mushrooms on the heightmap
- In the Channel Settings subpanel, drag the Density slider to minimum
- Drag the Scale slider back and forth. End at maximum.
- Go into character mode.
- Walk your character through the mushroom field and note that your character passes through the mushrooms. This is because dynamic details are not collideable. It is important to remember this, that dynamic detail meshes are only for enhancing the visuals of an area, and not to create objects that a character can interact with. To make a collideable object, it is necessary to place objects individually, not with the terrain panel. So the scale of dynamic detail meshes should normally be kept fairly low.
- Drag the Scale slider to approximately 120.
The placement of the meshes is controlled by the Rotation Axis buttons. None is "as authored".
- Click the None button under "Rotation Axis". All of the mushrooms should now stand straight up, and all are turned in the same orientation.
- Click the Y button. All the mushrooms should still be straight up, but now they are turned randomly on their Y-axis to give some variation
- Click the XYZ button. All the mushrooms are now rotated randomly in all three axes.
- In the Environment panel, drag the Time of Day slider back and forth and note how the light changes on the mushrooms.
- In the Dynamic Details Mesh tab, select the checkbox Neutral lighting, and note how the mushrooms no longer react to the Time of Day slider
More dynamic details
- Move your view to another empty part of the heightmap
- In the Meshes tab, click another blank line, and add crystal_dc_01.gr2
- Paint crystals onto the heightmap.
- Select the Neutral lighting checkbox, to add some sparkle to the crystals
- Adjust the scale slider to around 20
- Under Rotation Axis, click the None button to get all the crystals to stand up
- Click the "Y" button to rotate the crystals around the Y-axis
- Select the Edit Height Tool.
- Lift a hill from the terrain where the crystals are. There may be a brief delay as the dynamic details adjust to the new position of the heightmap.
- Click on the Dynamic Details tool.
- In the Meshes tab, click the Align w/Normals checkbox. The crystals will now stick out of the hill like a porcupine, aligning their vertical to the terrain angle of the slope they are on.
- Using the S-key in camera mode, back your viewpoint away from the crystals until they begin to fade.
- Drag the Distance slider to modify this "fade away" distance
- Back your viewpoint further away, until you can't see any dynamic details at all.
- Look at the Dynamic Detail Tool, and note that when it is selected, an additional "dot" toggle appears on the lower right:
- Click on the dot, to toggle it to "Glasses" mode.
While in Glasses mode, the "distance fading" effect is disabled, so that all Dynamic Details can be seen, regardless of their distance from the camera.
- Toggle back to the "dot" or "enable fading" mode.
Add another mesh
Very dramatic effects can be achieved with dynamic details, with your artists only having to create a single mesh asset.
- Move your viewpoint closer to the heightmap
- Click in a blank row on the Meshes tab
- Choose dynamic_thorn_vine_01.gr2
- Paint a swath in an empty spot on the heightmap.
- Click the various Rotation axes to see the different effects by simply modifying the axis. End with XYZ
- Adjust the scale and density sliders. Try density of 0, scale of 75.
- Create a clearing in the middle of the vines, by shift-clicking with the mouse
- Go into character mode, and walk your character into the clearing and look around. A substantial landscape can thus be created, with only minimal art resources.