Digital Design - Rendering Lab I

Introduction
In this lab, you will setup a simple scene in Unity for global illumination, getting familiar with lighting
rendering effect with various materials or different types of lights.

After implementing this lab, you will know how to: (Bold lines are covered in Part I)
1. Set up materials for global illumination in Unity.
2. Set up Unity’s lightmapper.
3. Set up reflection probes and link custom shaders to materials
4. Set up an ambient light and customize a skybox
5. Set up common four types of lights for rendering in Unity
6. Make use of different effects among four types of light in Unity
7. Create a new scene with customized texture.

1. Materials
Rendering is the interaction between light, geometry and materials. As such, it is important to know
how to control the materials in a scene.

In this part, we will use a variant of the famous Cornell Box scene (reference:
https://en.wikipedia.org/wiki/Cornell_box) to explore various material rendering functionalities.

You will learn to:

- Set up materials for global illumination in Unity

- Set up Unity’s lightmapper
- Set up reflection probes and link custom shaders to materials

1.1. Create a New Material

Open project First, let’s open the included “Cornell Box” unity project. You will see a gray-looking
scene (see Figure 1.1.1).
 Figure 1.1.1 Cornell Box Scene

Right now, everything is gray because we have not set up the materials and lighting. For your
convenience, the objects and camera have already been set up. Now you need to set up the materials
and lighting.

Create a new default material Let’s add a new material. Click the “Assets” window and click “Create”
→ “Material” (see Figure 1.1.2).

All new materials use Unity’s default shader by default. This shader is able to handle a wide variety of
shading and we will use it for most of our objects in Material Part.
 Figure 1.1.2 Create a new material

Rename material We will name our first material “Plane Default Material” (see Figure 1.1.3). For this
material, we won’t change anything and use it as it is.

Figure 1.1.3 Rename material

Assign material to three planes This material will be assigned to three planes: the floor (Plane Bottom),
the back wall (Plane Back), and the ceiling (Plane Top).
Drag material from the “Assets” window and drop it onto each of three planes in the Scene window (or
in the Hierarchy window). (see Figure 1.1.4)

Figure 1.1.4 Assign material to planes

Set material color Next, we will make the material for the left wall. Let’s name it “Plane Left Material”.
Then make this material red: under “Albedo”, give it a value of “R:255, G:0, B:0”, or a hex value of
“#FF0000” (see Figure 1.1.5).

Figure 1.1.5 Set color red to left plane material

Likewise, let’s set the material for the right wall. Make a new material and name it “Plane Right
Material”. Give it a Green color: under “Albedo”, give it a value of “R:0, G: 255, B: 0” or a hex value of
“00FF00” (see Figure 1.1.6).

Figure 1.1.6 Set color green to right plane material

Assign colored material to plane Drag and drop the “Plane Left Material” to the left wall and the
“Plane Right Material” to the right wall. You should see that the left wall becomes red and right one
becomes green (see Figure 1.1.7).
 Figure 1.1.7 Set colored material to plane

Set object as visible light Finally, let’s add a light to the scene. Although Unity offers various kinds of
invisible light sources, we will create a light by assigning a light-emitting material to a visible object
instead in this Material Part. This method is used for its physical accuracy (light sources in reality are
visible objects), and robustness (it automatically handles soft-shadows and many kinds of lighting
phenomena).

Create a new material call “Plane Light Material”. To make it emit light, check the “Emission” checkbox.
Under “Color”, give it a value of “R:191, G: 191, B: 191”, or a hex value of “#BFBFBF”. This is Unity’s
value for white lights. Then, set the “Intensity” to 2, to make it strong enough (see Figure 1.1.8).

Also, under “Global Illumination”, select “Baked”. This will make Unity’s lightmapper consider this
material for its rendering pre-calculations.
 Figure 1.1.8 Set visible emissive object as light

Drag and drop this material to the small square on the ceiling (see Figure 1.1.9). The emissive ceiling
now is our main light source within the box.

Figure 1.1.9 Apply lighting material to ceiling

1.2. Setting up Unity’s Lightmapper
Now that we have assigned some basic materials and lights, let’s see Unity’s lightmapper in action.

Unlike conventional rendering software which shoots rays from a camera, Unity uses a hybrid approach
which combines ray-tracing and rasterization. At the start of a scene, Unity does a precomputation pass
called lightmapping, which shoots rays from the surfaces of objects to compute the amount of light
received at each surface point in the scene. These illumination values are then stored in a texture called
lightmap. During a game, this lightmap is then used to incorporate global illumination for rasterization in
real-time.

Of course, this approach has its limitations, but it is a good balance between realism and real-time
performance. For example, lightmaps can only consider light bounces amongst static objects in the
precomputation phase. There are also some global illumination effects that cannot be handled with
lightmaps.

Open lighting settings window To enable and tweak Unity’s lightmapper, we will need to display the
“Lighting” window. It can be enabled under “Window” → “Rendering” → “Lighting Settings”. You should
be able to see the “Lighting” window (see Figure 1.2.1). For ease-of-use, we can drag it to a suitable
position. For our examples, we will drag it to the right of the screen (see Figure 1.2.1 right).

Figure 1.2.1 Open Lighting Settings window

Set configuration of lightmapper Let’s configure the lighting settings. We will use the following
settings to give a good level of accuracy that should not take too long to compute (see Figure 1.2.2).
 Checke
d
Checke
d
“Baked Indirect”

Direct Samples: 8

Indirect Samples: 512

Lightmap Resolution: 10

Figure 1.2.2 Lighting settings

Label objects for precomputation Now we still must do one more step before we can see the effects
of global illumination. Recall that lightmapping is a precomputation pass that calculates light bounces
amongst static objects. As such, Unity requires that we label any objects we want to use in the
precomputation pass as static(non-moving) objects.

In the “Hierarchy” window, select all objects except the Main Camera (see Figure 1.2.3). Then under the
“Inspector” window, check the “Static” checkbox, wait for a while and you can see the rendered result
(see Figure 1.2.4).
 Figure 1.2.3 Select object for lighting calculation

Figure 1.2.4 Rendered result

1.3. Reflection and Refractions

Up to now, we have only been using basic materials. We will now assign more interesting materials to
the spheres.
Unity is able to compute reflections by means of reflection probes. A reflection probe is an invisible
object which stores incoming lighting values in all directions at a specified point in the scene. These
lighting values are stored in a cube map texture and is then used by material shaders for reflections in
real-time.

1.3.1. Reflection Probes

We will need to place two reflection probes in the scene, one for each sphere. Let’s start with the left
sphere (Sphere 1). To place a reflection probe in the scene, click on “GameObject” -> “Light” ->
“Reflection Probe” (see Figure 1.3.1.1).

Figure 1.3.1.1 Create a reflection probe

In “Inspector” window, let’s name this probe “Reflection Probe 1” and give it a position of “X:2, Y: -3.33,
Z: -1” (same position as left sphere) to place it at the center of the left sphere (see Figure 1.3.1.2).

Figure 1.3.1.2 Locate the reflection probe 1 in the center of left sphere

We will also need to increase the “Box Size” to “X:50, Y:50, Z:50”, so that the probe can capture the
entire scene (see Figure 1.3.1.3).
 Figure 1.3.1.3 Enlarge “Box Size”

We will make another reflection probe by duplicating the current one. Right-click on it in the “Hierarchy”
window and click “Duplicate” (see Figure 1.3.1.4).

Figure 1.3.1.4 Duplicate the probe

Likewise, let’s name the second probe “Reflection Probe 2” and give it a position of “X: -2, Y: -3.33, Z: 2”
(same position as right sphere) to place it at the center of the right sphere (see Figure 1.3.1.5).

Figure 1.3.1.5 Locate the reflection probe 2 in the center of right sphere

We will need to make the two spheres use the closest reflection probe. Select the two spheres and
under the “Inspector” window’s “Mesh Renderer”, select the “Reflection Probes” to “Simple” (see
Figure 1.3.1.6).

Figure 1.3.1.6 Set “Simple” reflection probes for spheres

1.3.2. Mirror Material
Now, let’s create a reflective material for the left sphere. Name this material “Mirror Material”. Give it a
“Metallic” value of “1” (reflects light like a metal) and a “Smoothness” value of “0.95” (the smoothness
of the surface). This should make it reflect light like a mirror (see Figure 1.3.2.1).

Figure 1.3.2.1 Create a mirror material

Drag and drop the material to the left sphere. It should have a mirror-like surface now.

Figure 1.3.2.2 Create mirror-like surface

1.3.3. Glass Material
Lastly, we will need to create a refractive material for glass-like surfaces. As Unity does not provide
refraction capabilities in its standard shader, we shall use a custom shader instead. For your
convenience, we have provided a shader file called “Refract Reflect Shader.shader”. This shader is able
to compute refractions and reflections from reflection probe data, and combine them with the Fresnel
effect (reference: https://en.wikipedia.org/wiki/Fresnel_equations).

To import the shader into the Unity project, drag and drop it from your file explorer into the “Assets”
window, or import new asset by selecting “Assets”→ “Import New Asset…” and import the shader file
(see Figure 1.3.3.1).

Figure 1.3.3.1 Import a shader script

Next, we will need to create a material that uses this shader. Create a new material and call it “Glass
Material”. In the “Inspector” window, under “Shader”, select “Custom” → “Refract Reflect Shader” (see
Figure 1.3.3.2).

Figure 1.3.3.2 Use custom shader

We will need to adjust the material properties to make it look like glass. First, give it a “Metallic” value
of “1” and a “Smoothness” value of “0.95”, so that it has a mirror-like reflective surface. For the “Index
of Refraction”, the default value of “1.52” is suitable for glass. To make it transparent, under “Albedo”,
set the alpha value to “20” (lower alpha value = more transparent). (See Figure 1.3.3.3)
 Figure 1.3.3.3 Set glass material properties

Drag the material to the right sphere, and you should see a glass sphere (See Figure 1.3.3.4).

Figure 1.3.3.4 Assign glass material to sphere

1.3.4. Debugging note on multiple reflections

You should be able to see the reflection of the glass sphere in the mirror sphere. If the glass sphere
appears as a black sphere in the reflection, try the followings (see Figure 1.3.4.1):
1. In the “Hierarchy” window, select the two reflection probes.
2. In the “Inspector” window, toggle “Use Occlusion Culling” on/off under the cubemap settings.
3. If that still doesn’t work, try deselecting “Transparent FX” under the “Culling Mask” option.
4. If it still doesn’t work, change “Clear Flags” to “solid color” and change it back to “Skybox”.
5. If it still doesn’t work, try changing all attributes under the cubemap settings and change
them back.
 Figure 1.3.4.1 Debugging

1.4. Extra: Normal Mapping

A common method to give materials a more interesting look is to assign textures to them. Textures can
be used to change the color and the normals of the surface. In the case of changing surface normals, it is
called “Normal Mapping”
(reference: https://docs.unity3d.com/Manual/StandardShaderMaterialParameterNormalMap.html ).

In Unity, normal mapping can be done within a few clicks.

First, drag and drop a normal map image into the “Assets” window. A normal map should look like a
blue-ish texture, due to how the RGB values are used to hold the XYZ values of the normal directions.

Figure 1.4.1 Import normal map

Then, select an object you want to assign the normal map to (e.g. the metal sphere). Under the
“Material” window, double click the “Normal Map” option and select the normal map. The object should
have a “bumpy” looking appearance.
 Figure 1.4.1 Apply normal map to material

Note: the glass sphere does not support normal mapping currently due to shader limitations.

1.5. Practice Details

1) Adjust the number of indirect samples under the Lightmapping settings in the Lighting window. Try
the following values: 10, 128, 512. For each value, take down the time needed for the lightmapping and
take a screenshot of the final result. Try telling the differences in the final results.

2) Adjust the number of bounces under the Lightmapping settings in the Lighting window. Try the
following values: None, 1, 2. For each value, take a screenshot of the final result. Try telling the
differences in the final results. (You can ignore the reflection and refraction on the spheres, as the
number of bounces used by reflection probes is not controlled by the lightmapper settings)

3) Replace one of the spheres with a 3D object that is imported from Rhino or Blender or any preferred
external 3D modelling program of your choice. You can export a model as an .obj file and import it into
Unity (drag and drop it into the “Assets” window, then drag to the scene).

4) Recall that there are various global illumination effects. Compare the result of the Cornell box in this
lab against the ones in http://graphics.stanford.edu/~henrik/images/cbox.html. Identify one global
illumination effect that is missing in the current Unity implementation.