UDN
Search public documentation

MaterialsTutorial
Licensees can log in.

Red links require licensee log in.

Interested in the Unreal engine?
Check out the licensing page.

Questions about UDN itself?
Contact the UDN Staff

Materials Tutorial

Document Summary: An tutorial on creating materials in the Unreal Editor.

Document Changelog: Created by Chris Sturgill (Demiurge Studios?); updated by Dave Burke?, Scott Brown?, and Kedhrin Gonzalez.

Introduction

The Material Editor is very powerful tool in the Unreal Editor suite that allows you to create a multitude of effects. Here you will see examples that show how to create some general effects with Modifiers, the possibilities however are near infinite. This document begins with showing how to use the Generic Browser and Material Editor to create new Material and continues on to explanations on how to create more complex Material effects.

Those familiar with previous versions of the Unreal Editor have a few surprises coming as the Unreal Engine 3 Editor handles textures significantly differently. As an introduction to creating and setting up Materials, we will go step-by-step through the entire process of creating a normal-mapped Material. Afterward, we will then cover the differences in procedure for materials with offset bump maps and SH maps, and then go into detail on how to create increasingly complex Material effects.

If this is your first time creating a Material in the Unreal Editor, be sure that you read up on Importing Textures, Creating a New Material, and The Material Editor.

Getting Content into the Engine

Generic Browser

Before we create a Material we will import our textures. First we will import our diffuse map, which contains the color information for our object (traditionally this would have been the only type of texture assigned to the object). In the Unreal Editor, open the Generic Browser window. Click on the blue-and-white checked icon at the top right, shown below:

GenBrowserButton.jpg

You can also find it under the Browser Windows submenu of the View menu.

For those familiar with Unreal Engine 2, the Generic Browser replaces and combines the former Texture and Static Mesh Browsers. It is split into a list of packages on the left and a content preview pane on the right. Clicking on one of the packages will reveal the contents of that package. In a package you will probably find different kinds of content such as meshes, materials, and textures. Unlike previous versions of the Unreal Engine, there is now no longer a need for separate Texture and Mesh packages. We will create a new package as we import our textures.

GenBrowser.jpg

For more information on the Generic Browser, see the Generic Browser Reference page.

Importing Textures

In the Generic Browser, select Import from the File menu. Find the texture and click Open. A Generic Import dialog box will open (seen below) giving you several fields to fill in. Name your new package (by default named MyPackage). Fill in a Group and change the Name if desired.

NOTE: Imported textures should be targas (.TGA) having dimensions measured in powers of two.

ImportTexture.gif

In the Options below you will need to select the appropriate CompressionSettings and CompressionNoAlpha setting. Below are descriptions of each of the different setting for each option.

CompressionSettings

TC_Default
This profile should be used for regular textures like diffuse or specular masks.

TC_NormalMap
If you are importing a Normal map this is the profile you want. It will use the same compression as the Default profile but it will also correctly set the pank/unpack range automatically.

TC_DisplacementMap
If you are planning on using the texture as a terrain displacement map, then you will want to select this profile. Note that the engine will crunch the texture down to an 8-bit grayscale image using the Alpha Channel as the source (not the RGB channels).

CompressionNoAlpha

For optimal compression, set this to True if your Texture has no Alpha channel (or if you wish to discard the Alpha channel). If your texture does have an Alpha channel, be sure to set this option to False

NOTE: When importing a texture, the original source file also gets imported. This allows you to change your mind and increase or decrease the amount of compression at any point.

So for this example, we will want the TC_Default and False settings for our diffuse texture.

The Generic Browser will reset, closing any packages you might have had open. Open your new package and your new texture will be there.

Now, we need a normal map. Let's assume that you have already created a normal map using SHTools, or with newer versions of 3D Studio Max. Check out the ImportingStaticMeshTutorial to see how this is done.

Make sure your package is highlighted in the Generic Browser, so that the texture will appear in your package. Repeat the above process to load your normal map with the exception of selecting the NormalMap profile.

Creating a New Material

Now that your textures are in the Unreal Editor, it's time to put them together. To do this we will have to create a material. New in Unreal Engine 3 is the notion of materials (they are very similar to Shaders in past Unreal engines). They operate basically as a container in which all relevant texture information is contained. Diffuse textures, Opacity Maps, and Normal Maps, etc. are assigned to a material. The material, in turn, is assigned to a mesh. Textures cannot be assigned to a mesh directly.

To create a material, be sure the intended package is highlighted. In the Generic Browser select New from the File menu. This will bring up a GenericNew dialog box. In the Options choose Material. Give your new material a Name and click OK.

GenericNew.jpg

You will find a new blank material in your package. Right-click on it and select Material Editor; the Material Editor will come up.

For more information on how to use the Material Editor, see the Material Editor User Guide page.

The Material Editor

Diffuse

To assign the diffuse texture you just imported, right-click somewhere in gray background of the Material Editor. Select New TextureSample from the context menu. To assign your texture to that sample, left-click the sample icon. A menu at the bottom of the Material Editor will appear labeled Texture with None in the field to its right. Highlight your desired texture back in the Generic Browser. Back in the Material Editor, click the None field. It will go blank and two buttons marked Clear and Use will appear to the right. Clicking the Use button will bring up your selected texture in both the text field and in your Texture Sample.

MatEditor.jpg

On the left side of the Texture Sample are 5 colored tabs. From the top downward you will find one for the combined RGB (red, green, blue) channels, one for each channel individually, and one for the alpha channel.

Also notice the right side of the Material icon has 8 tabs (for Diffuse, Emissive, etc). You can connect the Texture Sample to the Material via these tabs literally by connecting the dots. To assign your texture as the Diffuse map, just click and drag a line from the Texture Sample's RGB (top) tab to the Material's Diffuse tab. If you're having trouble making a connection make sure you drag the line right to the edge of the tab. You should get something like the following image

MatEditor2.jpg

Normal Map

Create another Texture Sample and repeat this process for the normal map. Notice the obvious change in your material.

MatEditor3.jpg

Of course, this material has only diffuse and normal maps; your material can be much more sophisticated. Consider adding emissive maps, specular maps, etc., as they will greatly increase the subtlety and visual depth of your materials.

Bump Mapping

In UnrealEngine3 there are three distinct methods of lighting and therefore three distinct types of Bump Map Materials. Briefly described they are:

  • Normal Mapping -- Uses XYZ vector information instead of just height info of simple bump maps. (as seen in the introductory section: The Material Editor)
  • Offset Bump Mapping -- Height displacement of bumps in addition to normal mapping.
  • Spherical Harmonic Mapping -- effectively sophisticated self-shadowed normal maps.

Creating a Material with Normal Mapping

A Normal Map Material uses XYZ information that is stored as RGB components of a texture that is then translated into the surface angle of the of the texture. This creates the illusion of depth as light reflects off it differently depending on the Normal direction.

See the introductory example in the The Material Editor section to see how to set up this type of Material.

Creating a Material with Offset Bump Mapping

ParallaxBumpShot.jpg

Offset Bump Mapping takes the illusion of depth available in normal maps a step further by actually displacing the pixels from the surface. The above screenshot is of a completely flat plane, yet the bricks appear to rise up from the surface, even at this steep angle.

To see the difference between normal maps and offset bump maps look below. Notice the edges of the bricks in the image on the right. The bricks on the left have bumpiness but are essentially flat whereas the bricks on the right appear to have actual height .

SideBySide.jpg

Import into Material Editor

To set up a material with offset bump mapping import files as usual. Create a material and Texture Samples for your diffuse and normal maps. Attach them to the material.

You will also need to import a grayscale bump map to be used for height displacement. In the case of our tutorial, this information is in the alpha channel of our normal map. To access this we will have to create a new Texture Sample and fill it with our normal map.

If you have a separate bump map, import it and create a Texture Sample. Do not attach your bump map to the material yet.

Your material network should look something like the one below. If you are using a separate bump texture your third Texture Sample will reference that instead of the normal map.

Setup1.jpg

Bump Offset

Now right-click somewere in the gray background of the Material Editor. Choose "CreateBumpOffset" from the top of the menu. We will now connect the alpha channel tab (bottom one) on the left side of our third Texture Sample to the "Height" tab on the right side of the Bump Offset. If you are using a separate bump map, connect the RGB tab (the top one) instead of the alpha. The blank BumpOffset should fill with color.

If you click your Bump Offset you will see two variables appear at the bottom of the Material Editor.

HeightRatio
effectively the ration between the virtual height of the bumps and the width of the texture. The default is .05, which means that if one tile of the material is mapped to a 10 ft square, the bump depth will appear to be about 10*.05=.5 ft. Find a value that looks right for your material.

ReferencePlane
is a number between 0 and 1 which represents the bump height which results in no texture coordinate offset. The default of .5 should work for most cases. Tweak it if desired.

Setup2.jpg

Your final material network should look something like the one above. In this case the diffuse material is serving as the material's specular map, which does not have to be the case in your network.

Creating a Material with Spherical Harmonic Mapping

Information on Spherical Harmonic materials is on the way....

TO DO: Complete this section

Basic Material Examples

This section assumes that you have at least read the Introduction and know how to use the Material Editor and can at the very least create a blank Material. Included in this section are simple materials that can be created with just a few modifiers. In this section and the following Intermediate and Advanced Material Example sections, the examples are taken from the MaterialDemo.unr map.

Reflective Car Paint

RedCarPaint.jpg

This effect is produced from a fairly simple combination of materials. The three parts of the material can be seen in the hierarchy shown below:

RedCarPaint_Mat.gif

Diffuse

In the Diffuse channel, the first Constant 3 Vector provides the base red color with RGB values of 0.5, 0.0, and 0.0.

Specular

Then in the Specular channel, a second Constant 3 Vector adds the reflection with a red tint. It's RGB fields are set to 3.0, 1.0, and 1.0

Specular Power

Lastly to further tweak the reflection a single Constant modifier is assigned to the Specular Power channel. This in effect controls the focus of the reflection of the surface. The greater the number, the more focused the reflection is. This Constant is set to 50

Environment Maps

EnvMap.jpg

Environment maps such as the one pictured above, can be easily created with the following modifiers and textures.

EnvMap_Mat.gif

Diffuse and Emissive

These channels use a CubeTexture with a CameraVector linked into it. To create the CubeTexture, go to the Generic Browser, select "New.." from the File menu and then create a TextureCubeFactoryNew.

TextureCubeFactoryNew.gif

Then import the six images of your environment into the slots available in the CubeTexture section of the CubeTexture properties. For each of the sides of the CubeTexture, they will be oriented all with the top of the image being the top most part of the texture, and the top and bottom sides will both share the same top direction as depicted in the below image:

layout_TexCube.jpg

When filling in the textures into the CubeTexture, place them in the following slots:

prop_TexCube.gif

Once the TextureCube is set up, you can add it into your new Material by right clicking in the Material Editor and selecting the "Create TextureSample" option at the bottom of the list, and select your newly created TextureCube and "Use" it in the field at the bottom of the Material Editor.

You can connect the RGB component of the TextureSample to the Diffuse and Emissive tabs of the Material at this point, but you will get errors. To correct these errors you will need to create a CameraVector (by right clicking in the Materials Editor and selecting "Create CameraVector) and then linking it to the Coord tab of the Texture Sample.

Specular

The combination of Modifiers described above will create a functioning Environment Map, but it will be somewhat mat in appearance. To give it that final shine you will need to add in a Constant to the Specular tab. To add a Constant Modifier, right click in the Marerial Editor and select "Create Constant."

By default, the Constant will have its single value set to 0.0 and this is precisely the value that you want. Once assigned to the Specular tab with a setting of 0, the reflective hot spot from lights will be eliminated.

Gold Leaf

GoldLeaf.jpg

This effect creates a rippled reflective gold leaf look using an environment map texture and normal map texture. Here you can see how the modifiers work together to create this effect

GoldLeaf_Mat.gif

Diffuse Emissive and Specular

In this channel a TextureCube is used with a Reflection Vector modifier. To set up the TextureCube texture, see the Environment Maps section. Note that this TextureCube uses a Reflection Vector so that it acts as a reflection of the environment.

Because this Environment Map already has some yellow in the texture (the rosy sky) it gives the appearance of a reflective golden surface when it is linked to the Diffuse Emissive and Specular channels. While the Environment Map itself isn't particularly golden in its over all hue, by also placing it into the Emissive channel, it brightens the rosy sky portion making it seem more golden. Then to remove the hot spot, the TextureCube is also added to the Specular channel.

Normal

To give the crinkled appearance of foil, a normal map is added to the Normal channel. This subtle normal map is just enough to give the effect of gold foil.

FoilNormal.jpg

Leather

Leather.jpg

Want a nice leather interior? You got it. To create this effect, all you need is a leather texture with an alpha channel applied to the Specular channel as pictured.

Leather_Mat.gif

Diffuse and Specular

To tone down the shininess of the Material, the base texture is added as a Texture Sample to both the Diffuse and Specular channels. The Alpha layer does not completely eliminate the shiny hot spot; it just lessens its intensity. Below is an image of the Alpha layer:

LeatherAlpha.jpg

Cube Maps with HDR

HDRCubeMap.jpg

Cube maps with simulated HDR lighting such as the one pictured above, can be easily created with the following modifiers and textures.

HDRCubeMap_Mat.jpg

To create the effect, take a cubesample/reflection texture, isolating the brightest pixels, adding a control to modify the intensity of those isolated pixels, and then adds those back on top of the base cubemap. With this setup, the cubemap itself will be darker while still having control over the highlight brightness.

This replicates the behavior of real world reflections: The bright things being reflected stay bright even on translucent or dark surface reflections. For it to look right on cubemaps sampled from within the editor, you'll need to disable the SRGB flag on the cube texture sample. You can leave it off, but you'll get very dark, contrasty reflections.

With this approach, you first desaturate the cube texture, isolate the bright pixels from that, then multiply that result with the original cube texture to recolor it before finally adding it to itself. This prevents any wrong color info from being introduced and truly only affects the brightness output.


Intermediate Material Examples

Corroded Plate Metal

CorrodedPlate.jpg

Complex materials such as this one can be created with multiple textures across the same Material. In this Material you can see how non-reflective rust can be combined with shiny plate metal.

CorrodedPlate_Mat_S.gif

Diffurse

The base texture of the corroded plate is assigned to the Diffuse channel to give the basic appearance to the Material.

Specular

In the Specular channel, a Multiply modifier combines the Alpha layer of the base texture (the Texture Sample used in Diffuse channel), with a TexutreCube. (To see how to create a TextureCube, see the Environment Maps section). The Alpha layer for the base texture essentially masks out the rusted areas and adds a buffed metal appearance to the plate metal sections. The TextureCube is the same environment map that is described above but using a Reflection Vector.

Specular Power

To increase the shininess of the Material, a Constant is added to the Specular Power channel. The lower the R value is in the Constant, the shinier the Specular channel will be. This Material has a value of 0.2 set for the Constant in the Specular Power channel.

Normal

To give the appearance that the rusted sections are eaten into the reflective metal plate, a Normal map has been added to the Normal channel. The Normal Map has some slight noise around there the rust meets the reflective metal, but in the rusted sections it is flat blue. The result is that light catches the edges around the rust making it appear to be etched into the metal plate.

Rough Rock

RedRock.jpg

Just using a normal map in the Normal channel will get you some depth to your texture, but additional Modifiers can be used to create extra depth and texture in your Normal channel.

RedRock_Mat_S.jpg

Diffuse and Specular

The RGB components of a basic rock texture is used in the Diffuse channel for this Material, and to reduce the shininess, a mostly black alpha channel is linked to the Specular channel.

Normal

Just using the base normal texture will give some depth to the final material, but additional Modifiers have been incorporated into this Material to exaggerate its texture. Directly linked to the Normal channel is a Multiply Modifier that combines a Constant 3 Vector with RGB values of 1.0, 1.0, and 0.2 respectively, into a Normal map Texture Sample. This reduces the blueness of the Normal map which in turn creates a more shadowed appearance. Visually, this is what the Multiply Modifier does to the Normal map:

Before_C3VM.jpg After_C3VM.jpg

(Note that neither image uses the base Normal map, but rather the Normal Map described below.)

The Multiply Modifier that links into the base normal map just scales the Normal Map. Here is what the Normal map looks like without any Modifiers applied to it:

Normal_RedRock.jpg

To scale any texture, a Multiply modifier is required to combine the Texture Coordinate Modifier with a Constant 2 Vector; a Texture Coordinate Modifier will not work on its own. The Texture Coordinate Tiling field can be used to scale both the U and V coordinates uniformly, or you can use the R and G fields to scale the U and V coordinate separately. In this Material, the Texture Coordinate has its tiling set to 0.5 and the R and G fields of the Constant Vector are each set to 0.5 causing the Normal Map to be scaled up by a factor of 4. It would also be possible to leave the Constant 2 Vector values for R and G at 1 (or removed the Multiply and Constant Modifiers from the chain) and then change the Tiling field in the Texture Coordinate to 0.25 to achieve the same affect.

Once all the Modifiers are linked together as pictured above, the rock Material will appear to have more depth and texture than just a regular Texture and Normal Map combination.

Soldered Mosaic Tiles

Mosaic.jpg

Here you will see how to create a tiled patchwork of shiny tiles soldered together. The effect is created with two Texture Samples and a few Multiply Modifiers to tweak the various base textures. Below you can see the arrangement of the Modifiers used to create the final Material.

Mosaic_Mat_S.jpg

Diffuse

For the Diffuse channel a base texture in a Texture Sample is multiplied by a Constant Modifier with a value of -1.0. By using a value of -1.0. the entire texture is darkened somewhat further, most noticeably around the glare of a white light reflected on the surface of the Material. The closer to 0 this value is the darker the whole texture is. Values beyond -1.0, look more and more like their positive reciprocals. The reason for passing a negative value into the Multiply Modifier is that it accentuates slighting the bumpiness of the Normal map.

You may or may not want to include this effect in the creation of your own Material.

Specular

The base texture is passed through a separate Multiply Modifier and then into the Specular channel to increase its over all brightness. The original texture, as you can see below, is rather dark.

Mosaic_Texture.jpg

But by multiplying it against Constant Modifier with a value of 100.0, it is greatly brightened. After this brightening effect, the Multiply Modifier is passed into the Specular channel to brighten the entire Material

Specular Power

As a slight tweak to reduce the glare on the Material, another Constant Modifier is added into the Specular Power channel. The larger the value the more constricted the glare produced by the Specular channel is. In this example, the Constant is set at 20, so the glare is only reduced mildly from what it would be without any Modifier linked to the Specular Power channel.

Normal

A simple Normal map is passed into the Normal channel to produce the appearance of raised solder around each of the colored tiles. No additional Modifiers are needed for this effect, just the Normal map texture shown below:

Mosaic_Normal.gif

Following Eye

Eye.jpg

The following chain of Modifiers shows how you can create a bump mapped Material that will follow the player attempt to follow the player wherever the player goes. Although the image above shows the material on a rounded cube, the effect is much more dramatic and eerie when the Material is assigned to a sphere StaticMesh. Note that if you travel beyond the edges of where the UV coordinates can follow, the effect will start to break down as the texture begins to wrap over the edge of the UV coordinates.

Eye_Mat_S.jpg

Diffuse & Normal

Both the Diffuse and Normal Channels have essentially the same combinations of Modifiers leading into them with the exception of the Texture Sample Modifiers used for each Channel. Below the too different textures are shown separately:

Eye_Tex.jpg     Eye_Norm.jpg
Texture Sample for the Diffuse
   
Texture Sample for the Normal

A BumpOffset is linked into both of these textures Coordinate channels with a HeightRatio of 0.5 and a ReferencePlance of 1.0 and into the Height channel of the BumpOffset a simple gradient texture is fed in (shown below).

Gradient.jpg

By setting up the BumpOffset in this way, the resulting material will attempt to point the center of its UV coordinates towards the players view much like an eye in a socket. The ReferencePlane value was increased from its default 0.5 to 1.0 to reduce the size of the iris portion of the Material and as a result exaggerate the effect. If increased to high though, the iris may be come to small and the effect may go completely unnoticed.

Snow

Snow.jpg

This is s simple snow material that sparkles.

Snow_Mat.jpg

First, create one 512x512 sparkle texture (a black background with dispersed white 1 pixel size dots) in the RBG channel and a mask texture in the Alpha channel to be used as a mask for the sparkling effect (using the Cloud filter in Photoshop and heavily contrasted). Also, if your version of the editor has support for importing DDS textures directly, you can manually create the sparkle texture's mipmap levels to work properly at different distances. The mipmap levels are just a portion of the original sparkle texture cropped and pasted onto the next mipmap level and so forth.

In the Material editor, use a "Multiply" node to mix both the RGB and Alpha channels (both used as separate nodes with different tiling properties). The RBG channel/node has a standard "Texture Coordinate" node plugged to it so that you can adjust its tiling. The Alpha channel/node has "Reflection vector" through a "Component Mask" plugged into it to only use the R and G channels and have a permanent size for the mask regardless the distance. Finally, multiply the "Multiply" node by a "Scalar Parameter" so that you can change the sparkle brightness at will.

The main problem is to get the sparkle effect working at different distances. You will see much better results by manually creating mipmaps than using "Pixeldepth" and the material itself will need less nodes.


Advanced Material Examples

Rippling Environment Map

Ripples.gif

This Material creates a rippling effect on an environment map using the following Modifier combinations:

Ripples_Mat_S.jpg

Diffuse, Emissive, and Specular

Into the Diffuse, Emissive, and Specular channels all use a Reflection Vector TextureCube (a Camera Vector will cause this effect to be far more subtle). To see how the TextureCube is created, see the Environment Maps section

Normal

In the Normal channel is where the rippling effect is produced with a Normal Map

With the RefernecPlane is left at the default 0.5 and the BumpOffset HeightRatio set at 1.0 (or greater) the offset will to appear to wrap over onto itself. When this offset is animated with a Panner, a rippling effect is produced.

The same Texture is references by the Texture Sample modifier, but since a Texture Sample cannot be looped into itself, two Texture Samples are needed. The RGB component of one Texture Sample is linked to the Normal channel of the final Material, and the other uses the Alpha layer of the Normal Map to create the Height of the BumpOffset. Below you can see the both the RGB layer and the Alpha Layer of the Normal Map:

RGB_Normal3.jpg Alpha_Normal3.jpg

This combination of BumpOffset with Normal Maps as described above will cause the Environment Map constructed above will create the rings that look like static ripples. To animate them a Panner is linked into the Coordinate channel of the BumpOffset.

The Panner has values of 0.1 set in both its SpeedX and SpeedY fields. Normally this would just cause the Material to pan diagonally across the surface, but because of the HeightRatio of 1 in the BumpOffset, a rippling effect is created. If you look carefully in the solid blue portions of the Normal Map you can still see that the Normal Map is in fact being panned diagonally across the surface.

Moving Dust in Water

Water.gif

This effect, similar to sand or dust being swirled about within a clear container, is created with a complex combination of Modifiers that blend and pan a specially created "distortion" texture map and a normal map. The distortion texture map is used in the two non-blue Texture Sample Modifiers pictured here:

Water_Mat_S.jpg

Diffuse

The Diffuse channel uses a Linear Interpolate Modifier that blends two Constant 3 Vectors using a modified Alpha Channel. The two Constant 3 Vectors are just two shades of blue, one grayish aqua (RGB values 0.0, 0.5, 0.6), one dark midnight blue (RGB values 0.0, 0.1, 0.2).

The Alpha channel of the Linear uses a modified version of the distortion texture map mentioned above. The below tie-dye looking image is what the distortion texture map looks like on its own:

WaterDistortion.jpg

First a Panner Modifier is applied to the distortion with following settings (SpeedX = .01, SpeedY= 0.0) so that the texture now scrolls slowly along its U coordinates. Then the distortion Texture Sample is filtered through a Component Mask which suppresses the Green, Blue, and Alpha channels, only passing on the Red Component.

Alternatively, the Red Channel from the Texture Sample could be passed directly into the next Modifier eliminating the need for the Component Mask all together, but it is included here for explanatory purposes only.

The resulting Modifier combination is then combined with a Texture Coordinate Modifier in an Add Modifier.

The Texture Coordinate Modifier values are set to the defaults (CoordianteIndex =0, Tiling = 1), and what this does when Added o the Component Mask is include additional noise an granularity. With increasing the Tiling value, the granularity will be increased. If increased beyond three, tiling in the movement starts to become apparent.

Then, the Add Modifier is passed into the Coordinates channel of another instance of the same distortion texture that we applied panner to. A Texture Sample is required so that the components of the Add Modifier can be separated. If the Add Modifier is linked directly into the Alpha component of the Linear Interpolate Modifier, then the Material Editor will show errors. However by linking into the Coordinates of a Texture Sample, the Alpha component of that Texture Sample can then be fed into the Alpha component of the Linear Interpolate Modifier.

Finally this complex string of Modifiers creates a subtle panning texture in the Diffuse channel. Note that much of these Modifiers are doing double duty since the Add Modifier is also used to create the Normal Channel of the final Modifier (explained further in the Normal section).

Specular Power

To reduce the glare from lights on the surface of the material, a Constant Modifier with an R value of 50 is applied to the Specular Power Channel. There is still some glare from bright lights, but with a Specular Power value so high greatly reduces it.

Normal

Lastly, a normal map is passed into the Normal channel to bring out the complex subtlety in the Diffuse channel while at the same time, adding on its own layer of intricacy to the effect.

Like the Texture Sample that is linked into the Linear Interpolate Modifier, this Texture Sample has the Add Modifier linked into its Coordinates channel. The original Normal map looks like this:

WaterNormal_base.jpg

Once the Add Modifier is attached, the Normal map's coordinates start moving in a swirling motion. In turn, this swirling motion is passed into the Normal channel of the final material creating a further layer of swirling in the end result. All of the effects on their own are subtle, but when combined produce a dramatic result.

Distorted Grid

DistGrid.gif

This effect takes a normal grid texture and distorts it to create a panning rippling effect. The Diffuse channel is where the majority of the effect is created, but to see how the entire Material is setup, click on the image below for the full layout.

DistGrid_Mat_S.jpg

Diffuse

The rippling and panning effect is created mainly in the Diffuse channel by passing Modifiers into the coordinates of a normal checkered black and white texture. First create a Panner Modifier with is SpeedX and SpeedY fields both set to 0.2 and save it for later.

Next create a Texture Sample that uses a normal map with large bumps and has a corresponding Alpha channel that looks like the following:

Distortion_Normal_Alpha.jpg

Then you will want to darken then alpha channel though to create the distortion effect. To do this, use a Multiply Modifier that multiplies the Alpha channel of the Normal map pictured above, against a Constant Modifier with its R field set to 0.2. If darkened too much (entering smaller values into the Constant Modifier) then the distortion effect of the Multiply Modifier will be minimized. A value of 0 in the Constant Modifier will have no distortion effect. Increasing this value will increase the distortion and if set all the way at 1, it will produce the rippling effect as described in the Rippling Environment Effect section.

Now use an Add Modifier to combine the Panner Modifier you created earlier with the Multiply Modifier you just created. Once the resulting Add Modifier is linked into the Coordinates channel of the checkered texture in the Texture Sample, it will create the main distortion effect in the for the Diffuse channel.

Specular

A simple Constant Modifier with its R field set to 0 eliminates any glare that might occur due to lights in the level.

Normal

The Normal channel is not required for the rippling effect, but it adds a subtle depth to the final Material, and since it is based on the same Texture Sample that is used to create the distortion effect in the Diffuse Channel, it blends in well with the effect. Directly liked into the Normal channel is a Multiply Modifier that multiplies the Normal Map specified in the Texture Sample but it uses the RGB component seen here:

Distortion_Normal_RGB.jpg

The Constant 3 Vector that is multiplied against it can be used to increase the perceived depth of the Normal map, but currently its R, G, and B fields are all set to 1 so it has no effect via the Multiply Modifier. The Multiply and Constant 3 Vectors could be removed to achieve the same affect with the Normal map Texture Sample being linked directly to the Normal channel of the Material, but the extra Modifiers are left in for explanatory purposes only.

Two Toned Surface

TwoTone.jpg

This effect is created entirely in the Diffuse channel. Creating the two tone effect is a bit involved, but once the material is set up, the two colors used for the tones can be easily swapped once You can click on the below image to see an enlarged layout of the final Material setup.

TwoTone_Mat_S.gif

Diffuse

The two tone effect is based off of multiplying a Camera Vector Modifier against a Reflection Vector Modifier using a Dot Product Modifier. Once these three Modifiers (Camera Vector, Reflection Vector, and Dot Product) are setup, then they can be fed into a Linear Interpolate Modifier, which takes your two colors (linked to in slots A and B) and uses the Dot Product in the Alpha channel to determine how the two tones are blended. Linking the Dot Product directly into the Alpha channel of the Linear Interpolate Modifier at this point results in the Material giving off unwanted glare making the final Material seem a bit fuzzy and also the second tone is not all that apparent.

To increase the area of effect of the second tone (the green tone in this example), a Constant Modifier is multiplied against the Dot Product Modifier. A value of 1 in the Constant Modifier will make no change to the size of the green area. If increased however, the green portion of the two tone material becomes more apparent. There is a limit to how large the green area can become. It is limited to the portion of the model that faces the viewer, so for instance, if only the face that is pointing at the view will have the green tone on it. In this example, the Constant Modifier is set to 3 so that the edge between the first and second tones fades nicely.

To reduce this fuzziness, the Multiply Modifier described above is passed into a Clamp Modifier. By using two more Constant Modifiers (one set to 0 and the other set to 1), the resulting material from the brightness Multiply Modifier can be clamped between 0 and 1. The lower the min value is permitted to be, the more glare you will see on the first tone (the purple tone in this example). The higher the max value, the more glare you will see on the second tone (the green tone in this example).

After passing the Dot Product Modifier through the Multiply and then Clamp Modifiers, the resulting material can be linked into the Alpha channel of the Linear Interpolate Modifier (mentioned in the beginning of this section). Then with the Constant 3 Vectors set in the A and B slots, the final Material will use blend between those two colors. It's also conceivable that you pass in two different Texture Samples to the A and B slots in the Linear Interpolate. The effect will still work the same just using your two textures as the two tones.

Grate Covering Power Stream

PanningGrate.gif

This effect combines an offset bump map as a mask over panning power stream texture. The resulting effect creates a great sense of depth in the grates of the final Material the offset somewhat occludes the powerstream depending on the viewing angle. It's not perfect occlusion, as that would require geometry, but it creates a convincing feeling of depth. Click on the below image to see the entire set up in the Material Editor (Note: the image is very large and may take a little while to load).

PanningGrate_Mat_S.jpg

Diffuse

The Diffuse channel is used to create the panning and masked effect as well as to supply the basic texture for the crate. Passed directly into the Diffuse channel is a Linear Interpolate Modifier that combines the panning effect with the grate.

Grate_Texture.jpg

The base grate texture (pictured above) is passed into the A channel of the Linear Interpolate Modifier with a BumpOffset passed into the Coordinates channel of the Texture Sample for the base texture. The BumpOffset is what created the effect of the texture occluding itself. For more on this effect, see the Normal section for this material.

Into the B channel of the Linear Interpolate is where the panning power stream effect is created. Starting at the very right of the chain of Modifiers is a Panner fed into a rainbow cloud looking Texture Sample that causes it to pan in the X direction with a speed of 0.2. This rainbow cloud texture is the same one used for the Moving Dust in Water material. Below you can see the texture used in the Texture Sample.

WaterDistortion.jpg

Then a component mask is applied to pass only the red and green components on into an Add Modifier. The Add Modifier is used to add a Panner with SpeedX of 0.0 and SpeedY of 0.2 to the R and G components of the Panning Texture Sample. The result of this Add Modifier is that it treats the Panner as if it is a texture and adds the color of that Texture to the texture passed into the B channel of the Add Modifier. This is due to the Material Editor not distinguishing between colors and numbers.

Now, we see the converse effect of a texture being used as a number value as the resulting Add Modifier is passed into the Coordinates of a simple Beam Texture. By passing in this complicated series of Modifiers into the Coordinates of another Sample Texture, the resulting texture is distorted and modified so that it pans with more organic irregularities rippling throughout the texture. Below you can see the contrasting results between the base texture and the texture with all of the Modifiers applied.

PowerBeam.gif     PowerBeamModified.gif
The base texture
   
Now with Modifiers

Now the power beam needs some color so it is fed into a Multiply Modifier where it is multiplied by a green Constant 3 Vector (with R G B values of 0.0, 0.2, and 0.05 respectively). Once colored, it is passed into the B channel of the aforementioned Linear Interpolate Modifier.

All that is left is to apply an Alpha component to the Alpha channel of the Linear Interpolate. In the Alpha component of the base texture for the grate, which is linked into the A channel of the Linear Interpolate, is just such an Alpha layer (shown below):

Grate_Alpha.gif

With all of these chains of Modifiers linked together into the Linear Interpolate Modifier and then passed into the Diffuse channel, the Material will show a grate texture with a dull green organic power stream flowing behind the grate mask.

Emissive

The Emissive channel is used solely to brighten the green power stream behind the grate mask. To do this, the Multiply Modifier that is passed into the B channel of the Linear Interpolate (described above) is also passed into a second Multiply Modifier and multiplied against a Constant. To make the green power stream extra bright, the Constant R value is set at 20.0. Then the resulting Multiply Modifier is passed into the Emissive channel of the Material.

Specular

By applying the same base texture via a Sample Texture Modifier into the Specular channel that is used for the grate in the Diffuse Channel, the glare from lights is reduced.

Normal

In the Normal channel is just a regular BumpOffset normal map. This creates the effect that the grate actually occludes itself depending on the viewer's eye position. The normal map pictured below is linked into a BumpOffest with the default HeightRatio and ReferencePlane values, and then that BumpOffset is link back into another instance of the normal map as well as the base texture in the diffuse channel. Lastly, the string of normal maps and BumpOffset Modifier is passed into the Normal channel of the final Material.

Here you can see the base normal map used in this material.

Grate_Normal.gif

Decal Material

This material demonstrates a "decal" effect, where an oriented and scaled texture is positioned on top of a background texture. The constants along the right edge affect the decal's location and orientation by feeding through panners and a rotator. The resulting image is then translated to the origin and scaled by the "Decal minifcation" node, which sets an inverse zoom (in this case 4.0, so 1/4 of original size). Finally, the decal texture is mixed in with the background, in this case with an If node which draws decal texels if their blue-channel intensity is greater than 0.3.

DecalMaterial.jpg

  • Tweaked MLM_Phong example using Linear Interpolate and full alpha:
    Decal_Placement_JC.jpg

Different settings for Normal Map textures

If you are encountering problems with your alpha channel being removed from your normal map or the normal map not giving off the full detail, you can edit the normal map. If you are going to use the offset shader and your height map is in the alpha channel of your normal map, you need to use a different texture compression than TC_NormalMap. Your normal map should be set to TC_NormalMapAlpha so it keeps the alpha channel. This way you can use the parallax bump mapping shader described above.

If your normal map isn't reporting the lighting information it should be, you may need to change settings on the normal map itself.

This is the result of just importing a common normal map texture without any other editing- badnormal.JPG

Notice there is not much depth in the texture itself. When applied to a scene with a dynamic light, there are many errors across brush surfaces. After tweaking with the texture in the browser (double click the normal map texture in the generic browser to bring up the settings window) you can achieve better results. goodnormal.JPG

The settings used for a better normal map are listed here. The SRGB check box is not checked. The first 3 channels of UnpackMin set to -1. The LOD Group is - TEXTUREGROUP_WorldNormalMap.

These settings gave the normal map more depth. You will also notice a offset shader is being used. The compression settings on the normal map is set to TC_NormalMapAlpha. The height map is in the alpha channel of the normal map. This is the desired setting for it. Lowering the UnpackMin settings more can give you even more detailed information. If your normal map isn't showing the desired detail, you should try playing with this. However, there are chances of distortion.