In this part of the tutorial we learn how to add basic colors and textures to objects through Materials.

Adding colors and textures

At this stage we have a box, a camera, and also a light in our scene. Note that while the light has been created by default, we could have added light to our scene using the menu: GameObject | Light | Directional Light.

• Let’s rename the light present in our scene as we have done before (e.g., right-click on the object in the hierarchy) and rename it myLight.
• Once this is done, we will change the orientation and position of the light so that it is above the cube, and pointing downwards.
• To do so, we can start by resetting the transform attributes of the light by using the associated cogwheel located at the top-right corner of the inspector.
• As we reset the Transform attributes of the light, we see that all parameters are set to 0.
• We can now move the light along the y-axis so that it is above the cube (e.g., by switching to the Move mode).
• We can also rotate the light 90 degrees around the x-axis using the inspector.
• If we use the gizmo to see the scene along the x-axis, we can clearly see that the light is effectively pointing downwards.

Figure 34: rotating the light around the x-axis

Once you are happy with the position of the light, you can rotate around this object using ALT + drag and drop, and also look at the scene from the game view.

At this stage, our light is setup as well as the cube; however, we would like the camera present in our scene to look at the cube from above. We will, accordingly, change the attributes of the camera to implement this feature using the inspector. Note that, if we wanted, we could add multiple cameras in the scene, and display the image captured by these in different areas of the screen, and we will see this feature later on.

Select the camera in the hierarchy, as described on the next figure.

Figure 35: Selecting the default camera

So that it is above the cube and pointing downwards, let’s change its transform settings as follows:

• Position: (0, 4, 0): we raise the camera four meters above the ground.
• Rotation: (90, 0, 0): we rotate the camera 90 degrees around the x-axis.

Once these changes have been made, the scene should look as illustrated on the next figure. You may notice that, in the scene view, the camera object is symbolized by a camera, and that its field of view is symbolized by what looks like a prism which encompasses the cube in our scene. This means that the cube is in the field of view of the camera. We can check this in the camera preview window located in the bottom-right corner of the screen.

Figure 36: Displaying the field of view of the camera

Once the camera has been setup, let’s modify the attributes of the light. We will essentially change the color of the light as well as its intensity, so that you can see how these can be amended.

• Select the light in the hierarchy window.
• In the Inspector, you may notice a component called Light, which includes all attributes (except for transform attributes) of the light. Click on the white rectangle to the right of the label Color. This will make it possible to modify the color of the light. This may be useful when you need to set the atmosphere in your game and add different colored lights.
• Once you have clicked on this rectangle, a window labeled Color appears. This window is similar to the one used in image editing software such as Gimp or Photoshop whereby you can pick a color or define a color based on its RGB code. For those not familiar with the RGB code, its stands for Red, Green, and Blue and it can be perceived as a palette where we specify the amount of red, green, and blue that will be used to create a new color. In this window, the amount of each color is a number between 0 and 255. Which means that if we use (R=255, G=0, B=0) we will obtain a red color.
• If we click inside the color window, and choose a color we can see how the RGB components below change accordingly. For the time being, chose a color of your choice, for example a light blue.
• You may also notice an Alpha attribute (A) below the amount of blue. This is usually used to specify how transparent a color will be (255 means totally opaque and 0 means totally transparent).

Figure 37: Changing the color of the light

Once you have changed the color of the light, you should see that the color of the box will be of a slight blue tint; the same will apply if we switch to the game view.

Creating the ground from a box

So far we have a cube, a camera and a (slightly blue) light in our scene. However, we would like to build a scene where a character walks on the ground, jumps from boxes to boxes or walks up the stairs. The first step in creating this environment will be to set the ground. To create the ground, we can recycle the box that we have already created by modifying both its size and appearance:

• Select the box labeled myCube.
• Change its scale properties to (40, 1, 40). This means that we scale it on the x- and z-axes by 40.
• Rename this box ground using the hierarchy window or the inspector (top text field).

Figure 38: Creating the ground from the initial box

Now that we have resized and renamed the ground, it would be great to add some texture to it to make it look a bit more realistic.  For this we will import a texture asset and apply it to the ground.

You may download a ground texture of your choice (e.g., .png or .jpg image)or use the one provided on the website [click here]. In the example, I have saved a texture on my desktop in a folder called unity_assets.

In Unity, let’s import and apply this texture as follows:

• Select Asset | Import New Asset…: this will open a window that makes it possible to import assets in your project. These can be images, audio, 3D or models. Note that assets can be used across scenes, so we only need to import them once in our project, and you can then reuse them in all scene that are part of a particular project.
• A window labeled Import New Asset should appear as illustrated on the next figure. You can click on Import to import this asset.

Figure 39: Importing an image asset into the project

To see where this asset has been imported, let’s click on the Project tab:

• As we can see on the next figure, this image has been imported automatically inside the Assets folder within the project.

Figure 40: Locating the imported asset

• Note that we could create a new Folder (Create | New Folder) to organize our assets and move this image to the new folder accordingly.
• To apply this tile to the ground, we just need to drag and drop this image from the Assets folder onto the ground object in either the scene view or the hierarchy.

Figure 41: Applying a texture to the ground object

As we apply the texture, you may notice that the tiling of the texture, which means the number of times this texture is repeated on the surface of the object, could be improved. At present, based on the gridlines, we see that they are one meter apart.

However, we can change this setting easily using the corresponding material. In other words, whenever a texture is imported and applied to an object, a corresponding material is created, and makes it possible to modify how this texture will be used and be seen (i.e., how it will be rendered). This material is located inside a folder called Materials.

If we open the folder labeled Materials, we can find a material called tile. As we click on this material, we can see several properties, including Main Color, Tiling and Offset as described on the next figure.

Figure 42: Displaying the attributes of a new material

• For now, we will only change the x and y tiling properties from 0 to 10. This indicates that the texture will be repeated 10 times on the x- and y-axes.
• After making these modifications, we can zoom-in to look at the ground from a closer range (ALT + CTRL + drag and drop).

Figure 43: Increasing the x- and y-tiling attributes

You may also notice a sphere at the bottom-right corner of the screen, which provides an indication of how the texture and material will look like in the game. We can also look at the scene from the game window to see how it will look in the game.

Adding Colored Boxes and Stairs

Before we add new objects to the scene, let’s modify the attributes of the light slightly so that it illuminates the scene.

• Select the light labeled myLight.
• Change its intensity to  .96 using the Inspector window.
• Change its y position to 8.0.

Once this is done, we will add a succession of boxes using essentially duplications, to speed-up the process:

• Create a new cube (Game Object | 3D Object | Cube)
• Rename this cube redCube (e.g., in the Hierarchy window or in the Inspector)
• Change the y coordinate (position) of this cube so that it is above the ground, for example (0, 1, 0).

We will now add a color to this cube, using a similar process as for the ground texture:

• In the project window, open the folder Assets and select the folder labeled Materials.
• In the project window, you may notice a menu labeled Create located in the top-left corner of this project window. This menu makes it possible to create different types of assets for your project, including materials.
• Select Create | Material: this will create a new material asset in this folder.
• Rename this material redColor and select it (i.e., click once on it)
• In the inspector window, click on the white rectangle of the label Albedo (or Main color in previous versions of Unity) to define a color for this material.
• As the color window appears, select a red color.

Figure 44: Creating a new color for the cube

• Once this is done, we just need to drag and drop this new material onto the cube (in the Scene or Hierarchy view).
• If we zoom-in to look at the redBox closely, we can see that the red color has been applied to all faces of the cube.

Now that we have created our first colored cube, we can create similar cubes using successive duplications to speed-up the process:

• In the hierarchy window, select the object labeled redCube.
• Duplicate this object: we can either right-click on this object and select Duplicate from the contextual menu or press CTRL+D to duplicate.
• We can then rename the new (duplicated object) greenCube and move it along the x-axis (i.e., red handle).

Figure 45: Adding a new cube using duplication

As for the previous section, we will create a new green color:

• In the project window, open the folder Assets and select the folder labeled Materials.
• Select Create | Material: this will create a new Material asset in this folder.
• Rename this material greenColor and select it (i.e., click once on it).
• Set the color of this material.

Once this new greenColor material has been created, we can apply it to the second cube and we can check that the color has been applied to all faces of this cube by looking around it.

Figure 46: Duplicating the initial cube

We can, again duplicate this green cube, rename this duplicate greenCube2 and move it along the x-axis.

>> LET’S PROGRESS TO PART 6!