3

Grayboxing with Terrain and ProBuilder

Now that we’ve grasped all the necessary concepts to use Unity, let’s start designing our first level. The idea in this chapter is to learn how to use Terrain Tools to create the landscape of our game and then use ProBuilder to create the 3D mesh of the base with greater detail than using cubes. At the end of the chapter, you will be able to create a prototype of any kind of scene and try out your idea before actually implementing it with final graphics.

Specifically, we will examine the following concepts in this chapter:

• Defining our game concept
• Creating a landscape with Terrain
• Creating shapes with ProBuilder

Let’s start by talking about our game concept, which will help us draft the first level environment.

Defining our game concept

Before even adding the first cube to our scene, it is good to have an idea of what we are going to create, as we will need a basic concept of our game to start designing the first level. Throughout this book, we will be creating a shooter game, in which the player will be fighting against waves of enemies trying to destroy the player’s base.

This base will be a complex in a (not so) secret location bordered by mountains:

Figure 3.1: Our finished game

We will be defining the mechanics of our game as we progress through the book, but with this basic high-level concept of the game we can start thinking about how to create a mountainous landscape and a placeholder player’s base to start.

With that in mind, in the next section of this chapter we will learn how to use Unity’s Terrain Tools to create our scene’s landscape.

Creating a landscape with Terrain

So far, we have used cubes to generate our level prototype, but we also learned that those shapes sometimes cannot represent all possible objects we could need. Imagine something irregular, such as a full terrain with hills, canyons, and rivers. This would be a nightmare to create using cubes given the irregular shapes you find in the terrain. Another option would be to use 3D modeling software, but the problem with that is that the generated model will be so big and so detailed that it won’t perform well, even on high-end PCs. In this scenario, we need to learn how to use Unity’s Terrain system, which we will do in this first section of the chapter.

In this section, we will cover the following concepts related to terrains:

• Discussing Height Maps
• Creating and configuring Height Maps
• Authoring Height Maps
• Adding Height Map details

Let’s start by talking about Height Maps, whose textures help us define the heights of our terrain.

Discussing Height Maps

If we create a giant area of the game with hills, canyons, craters, valleys, and rivers using regular 3D modeling tools, we will have a problem in that we will use fully detailed models for objects at all possible distances, thus wasting resources on rendering details that we won’t see when the object is far away. We will see lots of parts of the terrain from a great distance, so this is a serious issue.

Unity Terrain Tools uses a technique called Height Maps to generate the terrain in a performant and dynamic way. Instead of generating large 3D models for the whole terrain, it uses an image called a Height Map, which looks like a top-down black and white photo of the terrain.

In the following image, you can see a black and white top-down view of a region of Scotland, with white being higher and black being lower:

Figure 3.2: Scotland’s Height Map

In the preceding image, you can easily spot the peaks of the mountains by looking for the whitest areas of the image. Everything below sea level becomes black, while anything in the middle uses gradients of gray, representing different heights between the minimum and maximum heights. The idea is that each pixel of the image determines the height of that specific area of the terrain.

Unity Terrain Tools can automatically generate a 3D mesh from that image, saving us the hard drive space of having full 3D models of that terrain. Also, Unity will create the terrain as we move, generating high-detail models for nearby areas and low-detail models for faraway areas, making it a performant solution.

In the following image, you can see the mesh that was generated for the terrain. You can appreciate that the nearer parts of the terrain have more polygons than further away parts:

Figure 3.3: Height Map generated mesh

Take into account that this technology has its cons, such as the time it takes for Unity to generate those 3D models while we play and the inability to create caves, but for now, that’s not a problem for us.

Now that we know what a Height Map is, let’s see how we can use Unity Terrain Tools to create our own Height Maps.

Creating and configuring Height Maps

If you click on GameObject | 3D Object | Terrain, you will see a giant plane appear on your scene, and a Terrain object appears on your Hierarchy window. That’s our terrain, and it is plain because its Height Map starts all black, so no height whatsoever is in its initial state.

In the following image, you can see what a brand-new Terrain object looks like:

Figure 3.4: Terrain with no heights painted yet

Before you start editing this Terrain, you must configure different settings such as the size and resolution of the Terrain’s Height Map, and that depends on what you are going to do with it. This is not the same as generating a whole world. Our game will feature the player’s base, which they will defend, so the terrain will be small. In this case, an area that’s 200 x 200 meters in size surrounded by mountains will be enough.

In order to configure our terrain for those requirements, we need to do the following:

1. Select Terrain from the Hierarchy or Scene window.
2. Look at the Inspector for the Terrain component and expand it if it is collapsed.
3. Click on the mountain and gear icon (the furthest right option) to switch to configuration mode. In the following screenshot, you can see where that button is located:

Figure 3.5: Terrain Settings button

4. Look for the Mesh Resolution (On Terrain Data) section.
5. Change Terrain Width and Terrain Length to 200 in both settings. This will say that the size of our terrain is going to be 200 x 200 meters.
6. Terrain Height determines the maximum height possible. The white areas of our Height Map are going to be that size. We can reduce it to 500 just to limit the maximum peak of our mountains:

Figure 3.6: Terrain resolution settings

7. Look for the Texture Resolutions (On Terrain Data) section.
8. Change Heightmap Resolution to 257 x 257:

Figure 3.7: Height Map resolution settings

Another initial setting you will want to set is the initial terrain height. By default, this is 0, so you can start painting heights from the bottom part, but this way, you can’t make holes in the terrain because it’s already at its lowest point. Setting up a little initial height allows you to paint river paths and pits in case you need them.

In order to do so, do the following:

1. Select our Terrain in the Hierarchy panel.
2. Click on the Paint Terrain button (the second button).
3. Set the dropdown to Set Height if it’s not already there.
4. Set the Height property to 50. This will state we want all the terrain to start at 50 meters in height, allowing us to make holes with a maximum depth of 50 meters:

Figure 3.8: Set Height Terrain tool location

5. Click the Flatten All button. You will see all the terrain has been raised to the 50 meters we specified. This leaves us with 450 more meters to go up, based on the maximum of 500 meters we specified earlier.

Now that we have properly configured our Height Map, let’s start editing it.

Authoring Height Maps

Remember that the Height Map is just an image of the heights, so in order to edit it, we need to paint the heights in that image. Luckily, Unity has tools that allow us to edit the terrain directly in the editor and see the results of the modified heights directly. In order to do this, we must follow these steps:

1. Select our Terrain in the Hierarchy panel.
2. Click the Paint Terrain button (the second button, the same as in the previous section).
3. Set the dropdown to Raise or Lower Terrain:

Figure 3.9: Raise or Lower Terrain tool location

4. Select the second brush in the Brushes selector. This brush has blurred borders to allow us to create softer heights.
5. Set Brush Size to 30 so that we can create heights that span 30-meter areas. If you want to create subtler details, you can reduce this number.
6. Set Opacity to 10 to reduce the amount of height we paint per second or click:

Figure 3.10: Smooth edges brush

7. Now, if you move the mouse in the Scene view, you will see a little preview of the height you will paint if you click on that area. Maybe you will need to navigate closer to the terrain to see it in detail:

Figure 3.11: Previsualization of the area to raise the terrain

8. Hold, left-click, and drag the cursor over the terrain to start painting your terrain heights. Remember that you can press Ctrl + Z (Command + Z on Mac) to reverse any undesired change.
9. Try to paint the mountains all around the borders of our area, which will represent the background hills of our base:

Figure 3.12: Painted mountains around the edges of the terrain

We now have decent starter hills around our future base. We can also draw a moat around our future base. To do so, follow these steps:

1. Place a cube with a scale of 50,10,50 in the middle of the terrain. This will act as a placeholder for the base we are going to create:

Figure 3.13: Placeholder cube for the base area

2. Select Terrain and the Brush button once more.
3. Reduce Brush Size to 10.
4. Holding the Shift key, left-click and drag the mouse over the terrain to paint the basin around our base placeholder. Doing this will lower the terrain instead of raising it:

Figure 3.14: Moat around our placeholder base

Now, we have a simple but good starter terrain that gives us a basic idea of how our base and its surroundings will look. Before moving on, we will apply some finer details to make our terrain look a little bit better. In the next section, we will discuss how to simulate terrain erosion with different tools.

Adding Height Map details

In the previous section, we created a rough outline of the terrain. If you want to make it look a little bit more realistic, then you need to start painting lots of tiny details here and there. Usually, this is done later in the level design process, but let’s take a look now since we are exploring Terrain Tools. Right now, our mountains look very smooth. In real life, they are generally sharper, so let’s improve that:

1. Select the Terrain and click the Brush button as in the previous sections.
2. Set the dropdown to Raise or Lower Terrain if it’s not already set.
3. Pick the fifth brush, as shown in Figure 3.15. This brush has an irregular shape so that we can paint a little bit of noise here and there.
4. Set Brush Size to 50 so that we can cover a greater area:

Figure 3.15: Cloud pattern brush for randomness

5. Hold Shift and do small clicks over the hills of the terrain without dragging the mouse. Remember to zoom in to the areas you are applying finer details to because they can’t be seen at great distances:

Figure 3.16: Erosion generated with the aforementioned brush

This has added some irregularity to our hills. Now, let’s imagine we want to have a flat area on the hills to put a decorative observatory or antenna. Follow these steps to do so:

1. Select Terrain, Brush Tool, and Set Height from the dropdown.
2. Set Height to 60.
3. Select the full circle brush (the first one).
4. Paint an area over the hills. You will see that the terrain will rise if it’s lower than 60 meters or drop in areas higher than 60 meters:

Figure 3.17: Flattened hill

5. You can see that the borders have some rough corners that need to be smoothed:

Figure 3.18: Non-smoothed terrain edges

6. Change the dropdown to Smooth Height.
7. Select the second brush, as shown in Figure 3.19, with a size of 5 and an opacity of 10:

Figure 3.19: Smooth Height brush selected

8. Click and drag over the borders of our flat area to make them smoother:

Figure 3.20: Smoothed terrain edges

We could keep adding details here and there, but we can settle with this for now. The next step is to create our player’s base, but first, let’s explore ProBuilder in order to generate our geometry.

Creating shapes with ProBuilder

So far, we have created simple scenes using cubes and primitive shapes, and that’s enough for most of the prototypes you will create, but sometimes, you will have tricky areas of the game that would be difficult to model with regular cubes, or maybe you want to have some deeper details in certain parts of your game to get an idea of how the player will experience that area.

In this case, we can use any 3D modeling tool for this, such as 3D Studio Max, Maya, or Blender, but they can be difficult to learn and you probably won’t need all their power at this stage in your development. Luckily, Unity has a simple 3D model creator called ProBuilder, so let’s explore it.

In this section, we will cover the following concepts related to ProBuilder:

• Installing ProBuilder
• Creating a shape
• Manipulating the mesh
• Adding details

ProBuilder is not included by default in our Unity project, so let’s start by learning how to install it.

Installing ProBuilder

Unity is a powerful engine full of features, but adding all those tools to our project if we are not using all of them can make the engine run more slowly, so we need to manually specify which Unity tools we are using. To do so, we will use Package Manager, a tool that we can use to select which Unity Packages we are going to need. As you may recall, earlier, we talked about the Packages folder. This is basically what Package Manager is modifying.

In order to install ProBuilder in our project with this tool, we need to do the following:

1. Click the Window | Package Manager option:

Figure 3.21: Package Manager option

2. In the window that just opened, ensure the Packages mode is in Unity Registry mode by clicking on the button saying Packages in the top-left part of the window and selecting Unity Registry. Unlike the In Project option, which will show only the packages our project already has, Unity Registry will show all the official Unity packages you can install:

Figure 3.22: Showing all packages

3. Wait a moment for the left list of packages to fill. Make sure you are connected to the internet to download and install the packages.
4. Look at the ProBuilder package in that list and select it. You can also use the search box in the top-right corner of the Package Manager window:

Figure 3.23: ProBuilder in the packages list

5. Click on the Install button in the bottom-right-hand corner of the Package Manager:

Figure 3.24: Install button

6. Wait for the package to install; this can take a while. You can tell that the process has ended when the Install button has been replaced with the Remove label, after the Importing popup finishes. If for some reason Unity freezes or takes more than 10 minutes, feel free to restart it.
7. Go to Edit | Preferences on Windows (Unity | Preferences on Mac).
8. Select the ProBuilder option from the left list.
9. Set Vertex Size to 2 and Line Size to 1. This will help you to better visualize the 3D model we are going to create while editing its different parts:

Figure 3.25: Configuring ProBuilder

Although this is all we need to know about Package Manager to install ProBuilder, if you want to know more about it, you can review its documentation here: https://docs.unity3d.com/Manual/upm-ui.html. Now that we have installed ProBuilder in our project, let’s use it!

Creating a shape

We will start the player’s base by creating a plane for our floor. We will do this by doing the following:

1. Delete the cube we placed as the base placeholder. You can do that by right-clicking on the cube in the Hierarchy and then pressing Delete.
2. Open ProBuilder and go to Tools | ProBuilder | ProBuilder Window:

Figure 3.26: ProBuilder Window option

3. In the window that has opened, click the New Shape button:

Figure 3.27: New Shape option

4. In the Create Shape panel that appears in the bottom-right corner of the Scene View, select the Plane icon (the first icon on the second row).
5. Expand Shape Properties and Plane Settings.
6. Set Width Cuts and Height Cuts to 2. We will need those subdivisions later.
7. Click and drag over the terrain to draw the plane. While you do that, check how the Size value in the Create Shape panel changes, and try to make it have x and z values of approximately 50.
8. Release the mouse button and see the resulting plane:

Figure 3.28: New shape created

9. Select the newly-created Plane object in the Hierarchy and drag it a little bit upwards using the Transform tool.

Now that we have created the floor, let’s learn how we can manipulate its vertices to change its shape.

Manipulating the mesh

If you select the plane, you will see that it is subdivided into a 3 x 3 grid because we set up the width and height cuts to 2. We did that because we will use the outer cells to create our walls, thus raising them. The idea is to modify the size of those cells to outline the wall length and width before creating the walls. In order to do so, we will do the following:

1. Select the plane in the Hierarchy.
2. Open ProBuilder if it’s not already open, and go to the Tools | ProBuilder | ProBuilder Window option.
3. Select the second button (vertex) from the four new buttons that appear in the Scene View:

Figure 3.29: Select vertices tool

4. Click the Select Hidden option until it says On, as shown in the following image. This will make selecting vertices easier:

Figure 3.30: Enabling Select Hidden

5. Click and drag the mouse to create a selection box that picks the four vertices on the second row of vertices:

Figure 3.31: Vertex selection

6. Click on the second button in the top-left of the buttons of the Unity Editor to enable the Move Tool, which will allow us to move vertices. Like the Transform Tool, this can be used to move any object, but to move vertices, this is our only option. Remember to do this once you have selected the vertices. You can also press the W key to enable the Move Tool.

Figure 3.32: Move Tool

7. Move the row of vertices to make the subdivision of the plane thinner. You can use the checker pattern on the terrain to get a notion of the size of the wall in meters (remember, each square is one square meter):

Figure 3.33: Moved vertices

8. Repeat steps 3 to 5 for each row of vertices until you get wall outlines with similar sizes:

Figure 3.34: Moved vertices to reduce edges cell width

Now that we have created the outline for our walls, let’s add new faces to our mesh to create them. In order to use the subdivisions, or faces, we have created to make our walls; we must pick and extrude them. Follow these steps to do so:

1. Select the plane.
2. Select the fourth button of the ProBuilder buttons in the Scene View:

Figure 3.35: Select Face tool

3. While holding Ctrl (Command on Mac), click on each of the faces of the wall outlines:

Figure 3.36: Edge faces being selected

4. In the ProBuilder window, look for the plus (+) icon to the right of the Extrude Faces button. It is located in the red section of the window:

Figure 3.37: Extrude Faces option

5. Set Distance to 5 in the window that appears after we click the plus button.
6. Click the Extrude Faces button in that window:

Figure 3.38: Extrude distance option

7. Now, you should see that the outline of the walls has just raised from the ground:

Figure 3.39: Extruded grid edges

Now, if you pay attention to how the base floor and walls touch the terrain, there’s a little gap. We can try to move the base downward, but the floor will probably disappear because it will be buried under the terrain. A little trick we can do here is to push the walls downward, without moving the floor, so that the walls will be buried in the terrain but our floor will stay a little distance from it. You can see an example of how it would look in the following image:

Figure 3.40: Slice of the expected result

In order to do this, we need to do the following:

1. Select the third ProBuilder button in the Scene View to enable edge selection:

Figure 3.41: Select edges tool

2. While holding Ctrl (Command on Mac), select all the bottom edges of the walls.
3. If you selected undesired edges, just click them again while holding Ctrl (Command on Mac) to deselect them, while keeping the current selection:

Figure 3.42: Selecting floor edges

Figure 3.43: Enabling Wireframe mode

4. Enable the Move tool by pressing the second button (or the W key on the keyboard) in the top-left corner of the Scene panel:

Figure 3.44: Object Move tool

5. Move the edges down until they are fully buried in the terrain:

Figure 3.45: Overlapping faces

Now that we have a base mesh, we can start adding details to it using several other ProBuilder tools.

Adding details

Let’s start adding details to the base by applying a little bevel to the walls, a little cut in the corners so they are not so sharp. To do so, follow these steps:

1. Using the edge selection tool (the third of the ProBuilder buttons), select the top edges of our model:

Figure 3.46: Top wall edges being selected

2. In the ProBuilder window, press the plus (+) icon to the right of the Bevel button.
3. Set a distance of 0.5:

Figure 3.47: Bevel distance to generate

4. Click on Bevel Edges. Now you can see the top parts of our walls have a little bevel:

Figure 3.48: Result of the bevel process

5. Optionally, you can do that with the bottom part of the inner walls:

Figure 3.49: Bevel being applied to floor-wall edges

Another detail to add could be a pit in the middle of the ground as a hazard we need to avoid falling into and to make the enemies avoid it using AI. In order to do that, follow these steps:

1. Enable the Face selection mode by clicking the fourth ProBuilder Scene view button.
2. Select the floor.
3. Click the Subdivide Faces option in the ProBuilder window. You will end up with the floor split into four.
4. Click that button again to end up with a 4 x 4 grid:

Figure 3.50: Subdividing the floor

5. Select the four inner floor tiles while holding Ctrl (Command on Mac) using the Select Face tool (the third of the ProBuilder buttons in the top part of the Scene View).
6. Enable the Scale tool by clicking the fourth button in the top-left part of the Scene View, or pressing the R key on the keyboard. As with the Move tool, this can be used to scale any object, not only vertices:

Figure 3.51: Scale tool

7. Using the gray cube at the center of the gizmo, scale down the center tiles:

Figure 3.52: Inner cells being scaled down

8. Click the Extrude Faces button in the ProBuilder window.
9. Push the extruded faces downward with the Move Tool.
10. Right-click on the ProBuilder window tab and select Close Tab. We need to get back to terrain editing and having ProBuilder open won’t allow us to do that comfortably:

Figure 3.53: Close Tab option

11. Select the terrain and lower it so that we can see the pit:

Figure 3.54: Terrain being lowered for the pit to be visible

Summary

In this chapter, we learned how to create large terrain meshes using Height Maps and Unity Terrain Tools such as Paint Height and Set Height to create hills and rivers. Also, we saw how to create our own 3D meshes using ProBuilder, as well as how to manipulate the vertices, edges, and faces of a model to create a prototype base model for our game. We didn’t discuss any performance optimizations we can apply to our meshes or advanced 3D modeling concepts as that would require entire chapters and is beyond the scope of this book. Right now, our main focus is prototyping, so we are fine with our level’s current status.

In the next chapter, we will learn how to download and replace these prototyping models with final art by integrating assets (files) we have created with external tools. This is the first step to improving the graphics quality of our game, which we will finish by the end of Part 3, Improving Graphics.

Join us on Discord!

Read this book alongside other users, Unity game development experts, and the author himself.

Ask questions, provide solutions to other readers, chat with the author via Ask Me Anything sessions, and much more.

Scan the QR code or visit the link to join the community.

https://packt.link/handsonunity22