Tutorials‎ > ‎

Materials Overview in Unity 3D

Programs Required:
  • Unity 3D:  The Unity 3.5 Developer version (not pro) is being used in this tutorial
  • Photoshop:  CS5.5 is being used in this tutorial
  • A program that can read Unity Script:  MonoDevelop is typically installed with Unity and is the default script editor for it
This tutorial will explain how to use your various texture maps in Unity 3D.  The most common texture maps that I'll be discussing are diffuse maps, normal/bump maps, ambient occlusion maps (AO maps), and specular level and/or color maps.  I am not teaching you how to create these types of maps, that is particular to your model and can be different for each one; I will be teaching you how to put them together on one model in Unity 3D.

Understanding Shaders and your Texture Maps

A shader is something that holds all of your textures together within an engine to be displayed on a single model or object.  It is created with code, thus dictating how your object is seen by the camera.  Based on the texture maps you have will change on how your model appears.  As I mentioned before, the most common texture maps are the diffuse maps, normal/bump maps, ambient occlusion maps (AO), transparency/opacity maps, and specular level/color maps.

A diffuse map is made up of the colors that your model should be.  For example, the diffuse map below shows all the colors and logos in the suit of mecha armor.

Example of Diffuse Map (Source:  http://www.game-artist.net/forums/finished-projects/1524-some-work-i-did-ss2845.html)
Diffuse Map Example (Source)

A normal/bump map is a fancy map that plays on the normals of your model's geometry.  It can help save on poly-count by making details stick outward or inward instead of modeling the actual detail.  There are many ways in creating these kinds of maps, as well as many programs that can do so.  For example, the stone ground may be entirely flat, but with the normal map below, it will look like bumpy stones and rocks.

Normal Map Example (Source: http://www.keithlantz.net/wp-content/uploads/2011/10/normal_4.png)
Normal / Bump Map Example (Source)

The ambient occlusion map has all of the basic shadows on your model already baked in.  This saves render time when building your lighting.  This map is also usually baked on top of the diffuse map, which is what I recommend as well, because that will also save time when compiling the shader.  For example, you may want to already include shadows to places on the character such as their armpits and to where the "sun never shines."

http://download.autodesk.com/global/docs/mudbox2014/en_us/images/GUID-00ECA9E8-9740-41F0-89D0-519375A9C5F0-low.png
Ambient Occlusion (AO) Map Example (Source)

The transparency/opacity map is exactly what it reads like.  It allows you to see through the model on which it is applied to.  The maps range from black (100% transparency) to white (0% transparency), with various tones of gray in between.  For example, the beautiful tree below may be a backdrop in an environment.  However, only the tree needs to be seen, not the green background, and so the opacity map has the tree completely white with the background completely black.

https://sites.google.com/site/tessaleetutorials/home/turn-your-texture-maps-into-a-material-in-unity-3d/blender-3d-luxrender-alpha-map-trees-architecture-01.jpg

Transparency / Opacity Map Example (Source)

The specular level map is a gray-scale texture map, similar to the opacity map.  It determines how shiney your model is.  The whiter the area, the shinier it is.  The darker the area, the duller it is.  The example below shows how a 3D model of the earth may have the water be much more shiney when light is casted onto it than it's land counterpart.

http://docs.autodesk.com/MAXDES/13/ENU/Autodesk%203ds%20Max%20Design%202011%20Help/images/MED/Zelda-Ref/il/il_mapping_specular_level.jpg
Specular Level Map Example (Source)

The specular color map is similar to the specular level map in the sense that it determines the reflectiveness of your model, but this map goes one step further and provides data on what color light ought to be reflected as well.  I usually use one or the other, but hardly both.

http://docs.autodesk.com/3DSMAX/15/ENU/3ds-Max-Help/images/GUID-28646B34-A295-4544-9DFA-AD16766092B8-low.png
Specular Color Map Example (Source)

For this tutorial, my AO map is baked on my diffuse map, and I have a normal and a spec (level) map.

Preparing Your Textures

With the particular shader that I'll be showing later in the tutorial, it requires that your diffuse map and spec map are in one file.  The shader calls the diffuse map "base" and the spec map "gloss."

This is the single slot for the "base" and "gloss."

You'll notice that it says (RGB) after base and (A) after gloss.  Those are referring to the channels within that file.  When you're texture maps are completed (and preferably merged onto single layer of their own file), you can copy and paste the spec map you made onto the alpha channel of your diffuse map's psd file.  If you already know how, you can skip the next mini-section and continue on with the tutorial.

How To Add your Spec Map As An Alpha Channel

  1. Open your diffuse map (single layer, please) in Photoshop.
  2. Open your spec map (also a single layer, please) in Photoshop.
  3. Copy your entire spec map into your clipboard (that's another way of just saying "ctrl + a" followed by "ctrl + c").
  4. Go back to your diffuse map, and go to your channels window (if it's not already visible, click Windows > Channels).
  5. Click the button for a new layer, and "Alpha" will automatically be that layer, visible, hiding all the other layers, and black for some reason.
  6. Paste your spec map on that layer, and only that layer.  Unhide the other layers, and save the file (targa is probably best since it will keep the channel data).  This is the file you'll be using as "diffuse" or "base" and the one that I'll be referring to as "diffuse" from now on.
This is what my channels list looks like after I've pasted my spec map into my diffuse map's alpha channel.

Next, you need to have your unity project started and have your models and texture maps created.  Import both your models and all of your textures into the project.

My model is "Zikku.fbx" and my textures maps are "zikku_diffuse.png" and "zikku_normalBump.png" in my project's asset folder.

Once your files are loaded into your unity project, you're ready to make the material.

Create a Material

Now I will be picky on the term usage here.  Material and texture is not the same thing.  A texture is a 2D image, probably one you made or found on the internet.  A material is an object created to display a texture on a model.  In Unity, you can toss a texture onto a model and not have too many repercussions.  In UDK, you'll find you must create a material for your texture before you can do anything with it.  Making materials for your textures, even if they're simple checkers, is still good practice.

To make a blank material in Unity, click the "create" button in your project folder, and then "Material."  You'll have something like the picture below in your inspector:

This is a blank material in Unity's inspector window.

When you're at this point, the first step to do, before plugging in any textures, is choose the shader.  I will briefly cover the creation of a custom shader in the double-sided materials section.

Choose Your Shader

There are a LOT of shaders to choose from.  The one I prefer to use is called the "Bumped Specular" because it allows me to have a diffuse map and a bump map (with the data for my AO map and spec map inside my diffuse map's file).  If you had a really simple object that only required a diffuse map, then you could just use a "Diffuse" shader.

Simply drag and drop your diffuse map in the slot for "Base - Gloss" and your bump map in the slot for "NormalMap."  Unity will prompt you at this point, telling you that the texture you put into the NormalMap slot isn't set as a NormalMap type.  It will ask if you would like to convert it.  Say yes.  Now your material has some data in it, ready to be used, and it's not just empty!

This is where you can drag that little ball that represents your material from the projects folder onto the model in either your hierarchy or scene.  You can even put them on prefabs.

Though there is one more annoying thing about Unity's materials.  They do not come as double-sided.

Double-Sided (2-Sided) Materials

You'd think Unity would have an easier way to solve this.  Unfortunately, they do not.  So you have two options:

  1. Edit your model so that you don't have the back-side of any planes showing (which includes re-modeling, re-unwrapping, and re-texturing) or;
  2. Create your own shader to fix this.

Fortunately for you, the second option is probably quicker than having to remodel your object.

If you've never created your own shader before, you ought to start with one of the starting shaders.  You can find them on your computer where you've installed "Unity Projects / DefaultResources".  I'm assuming you haven't (hence this tutorial), and since I need a Bumped Specular shader, I'll be tampering with the one called "Normal-BumpSpec.shader" in the "DefaultResources" folder (downloaded from the link I just provided).

Take that "Normal-BumpSpec.shader" file and import that into your unity project's asset folder.  If you double click that object in your projects folder with Unity open, it will open in MonoDevelopment just as any C# or JavaScript would.

The next part is to find where it says "Pass {" in the code (line 14 of this particular shader script).  After the opening curly-brace, press enter and type "Cull Off" on line 15, all by itself - no punctuation.  Save your shader, load it into your material slot, plug in your textures, and you should now have all of your maps, double-sided(!), in your material and viewable on your model.

This is a picture of the code snippet for the shader.  "Cull Off" is highlighted on line 15, and I renamed the shader on line 1.

Click to make larger.  This is Tessa's shader in action.  Also, I'm terrible at creating textures - another reason why I'm not making that tutorial.

On a side note, you should also rename your shader so it's not the same name as the built-in shader.  Mine here is Tessa's Shader, edited in line 1.


Download Tessa's Shaders

Below are two shaders that I tampered with (originating from the default files "AlphaTest-BumpSpec.shader" and "Normal-BumpSpec.shader").  They both make their material's two-sided and include data for Diffuse maps, Bumped/Normal maps, and Specular maps.  The one with "Alpha" in it's name provides data for Transparency, or Opacity, in the place of a Specular map.  However, there are only two slots for a texture, so make sure to have the channels in your textures accordingly in order to take full advantage of these shaders.

"Transparent - Diffuse,Bump,Spec (2-Sided)" (Tessa-AlphaDiffuseBumpSpec.shader)

Slot 1:  Diffuse Map using the RGB channels

            Transparency/Opacity map using the Alpha Channel

Slot 2:  Normal Map

"Diffuse,Bump,Spec (2-Sided)" (Tessa-DiffuseBumpSpec.shader)

Slot 1:  Diffuse Map using the RGB channels

            Spec Map using the Alpha Channel

Slot 2:  Normal Map

ċ
Tessa-AlphaDiffuseBumpSpec.shader
(1k)
Tessa Watkins,
Jun 20, 2013, 9:35 AM
ċ
Tessa-DiffuseBumpSpec.shader
(365k)
Tessa Watkins,
Jun 20, 2013, 9:35 AM
Comments