TUTORIALS - UE3 MATERIAL EDITOR - PART 2
Share/Save/Bookmark  

Info

About : This second material tutorial focusses on teaching you a thing or two about the UE3 Material Editor by explaining slightly more advanced examples. Learn by practical use rather than theoretical explanations.
Target Audience : Unreal Engine users - Beginners and Intermediate
Platform : Unreal Engine 3
Last Update : September 2007
Related links : Material Tutorial 1
Material Tutorial 3
Water Tutorial 1 - Outdoor
Water Tutorial 2 - Indoor
Material Expressions










Introduction

This tutorial continues on my first material, albeit with slightly more complex examples. Instead of giving you complex, technical and theoretical explanations of every single property I'm convinced that you learn quicker by practice, therefore this tutorial simply provides you with examples of common materials and how they were made.



The Examples



Hotspot Size

Changing the size of the Specularity hotspot is incredibly easy.



As shown in the picture simply connect a Constant node to SpecularityPower and alter its value. 0 is a very wide hotspot, where as 255 is a very tiny and sharp hotspot. The strength and size of Specularity is important if you want to make realistic materials. Metal often has very strong but also very small and concentrated highlights while things like wood often have very large but also very soft highlights. Controlling the Specularity is an essential requirement for making realistic materials.




Making Something Wave

You may have noticed the lack of an Oscilator expression in UE3. If you want something to wave, for example a grass material, you need to hook up Time and Sine expressions. As explained before, when Time is combined with Sine it will result in a material that will contiguously fade from black to white and the other way around. This will basically constantly flip the direction of the animation







Simulating Motion

Another great way to simulate motion is to displace part of the material using a scrolling gradient or other pattern. The gradient will scroll by every few seconds and thereby making the surface look as if its waving, going up and back down. This technique is ideal for making tree leafs and grass wave in the air, and just as useful for things like water, certain effects, and anything else you can come up with. For example, flags and other types of fabric are also great candidates for this technique.



In this example the BumpOffset bumps the surface up using the information of the heightmap. In this case the heightmap is a simple gradient that continuously scrolls along. For a more varied result a cloud pattern or a swirly gradient might offer better results, or you might want to consider multiplying two different gradients on top of each other for the ultimate random result.
It is often a good idea to scale the heightmap up a lot using a TextureCoordinate. An overscaled heightmap often looks better than a tiny one.
Also note that the BumpOffSet node has a HeightRatio property to control the maximum height, you can increase or decrease the strength of the effect with it.




Fading two textures
By using the Sine-Time setup it is possible to continuously fade from one texture to another, which is great to simulate certain effects such as an lamp that changes color or intensity.



Also note that by replacing Sine-Time with a VectorParameter you can trigger the change through some Kismet Scripting, or, you could Multiply Sine-Time with a VectorParameter. This way it will not start fading until it is toggled on via Kismet.




Increasing a texture's bloom strength

If the amount of bloom a texture gives off is not enough, you can strengthen it through the material editor. Add a Multiply expression and a Constant and connect them. While the normal maximum value of any Constant expression is 1.0000000 you can actually go way over it. Anything above 1.000000 won't make the expression appear whiter, since 1.000000 already is utterly white, but it will affect the bloom. In my example I used a value of 20.00000. Increasing bloom is great for textures that give off light such as lamps.







Automatic Fade Out

A very cool graphic feature of UE3 is the ability to have surfaces automatically fade out near its edges whenever they hit another piece of geometry. This can both be used for particles (prevents the well known problem when a sprite cuts through geometry and therefore displays a seam) or for more advanced things such as water or fog surfaces. A nice soft edge on a water surface would obviously look a lot better than a harsh one. Instead of manually painting that edge in the alpha layer, like in the old days, you can now let the engine handle it.



This material will fade out whenever it hits another object. The fade out strength can be configured in the properties of the DepthBiasedAlpha expression. In my example the BiasScale is 128.
Note that the material must be unlit and translucent so be sure to set the right blend and render modes. Refer to my first material tutorial to see how translucent materials must be set up.



Flickering Texture

You can make a texture, or part of it if you were to mask it out, flicker or pulse. This can be great to fake lightning effects with, and to make things like stars, lamps or other similar surfaces light up subtlety every now and then. It can be set up by adding a Sine and a Time node and connecting them.
The Time node makes it flicker, the Sine node determines the speed. Be sure to set the Period property correctly. 1.0000 is default, anything lower will make the flickering go faster, anything higher will make it slower.

In my example the effect is softened by an additional Add node that adds the Time effect with a Constant 1.125 node. This result is then interpolated (blended by using an alpha texture) on top of the real texture. In this case the result is ugly but this same setup could very well be used to make a few small lights of the diffuse texture light up every now and then.







Static reflection/Cubemap

Static Cubemaps can be used for fake and cheap reflections. In the Generic Browser go to the top menu's File -> New and enter a name and package. In the Factory drop down list select CubeMap. Once you have such thing, open its properties by double-clicking it in the Generic Browser and fill in the 6 images you have.



After that close the Texture Property window, create a new Material and open the Material Editor for it. Add a regular TextureSample expression while having the Cubemap selected in the Generic Browser to make the TextureSample carry the Cubemap.
Finally, to make the cubemap actually respond to camera movement and behave like a cubemap should, add a CameraVector expression and connect it as shown in the example screenshot.




This also works with a ReflectionVector instead of a CameraVector. The difference between both types is minimal, a ReflectionVector uses another axis.