Unreal Tournament 2004 Level Design - Tutorials


Skybox FogRings

FogRings are used in UT2004 maps for a number of reasons, which include blending between the ZoneInfo Distance Fog and the Skybox texture set, and to prevent the visual anomaly of distance culling.

For virtually any outdoor map, especially those which are using Terrain, Distance Fog should always be enabled.  This not only provides a more realistic environment, as the real world always has fog or haze in the distance, but it also utilizes one of the speed optimizations built into the engine: most objects beyond the DistanceFogEnd are not rendered.

If a FogRing is not used in the Skybox, often visual "popping" of the distant objects will be seen  as they are being culled from rendering.
A well designed FogRing also enhances the quality of the map as it "connects" the map world to the sky.


Example map screenshots without and with a FogRing (CTF-DG-Aether).







Determining the DistanceFog Color

The first step in creating a FogRing is actually determining the DistanceFog color that should be used.
The color chosen should be based on three things: 1. the Skybox texture set, 2. the weather, 3. the time of day.

If you study the real world, you will see that the haze or fog that is visible at far distances directly relates to the weather and the time of day.
For example if there is heavy weather, snow causes a white haze while rain causes a gray haze.  Or the time of day will affect what the distance haze coloring is, for example sunny daytime has a cyan haze, while evening has a dark purple or orange haze (depending on the location of the sunset).

The time of day will usually be dictated by the specific Skybox texture set that you choose for your map, such as mid-day or evening, but adding weather with an xWeatherEffect actor may change the exact color of haze that you will want.



Choosing the Color from the Skybox Texture set

The DistanceFog color is normally associated with the Skybox Texture set, so the best thing to do is to load up one of the textures into your paint software and choose a color that is appropriate.
In most Skybox subtraction cube designs, the SkyZoneInfo actor is placed in the exact center of the cube.  This also reduces the visual "box" look of the Skybox corners in-game.

If the Skybox Texture set is comprised of six cubic textures, load one of the side textures.
Choose an appropriate color that is located along the midpoint of the texture, since that will be in-line with the location of the SkyZoneInfo actor.  Also choose a color that is quite common across the center line of the texture.
Take note of the RGB value of that color.



Miramar Skybox Texture set from the HipShot Skybox Package.



Setting the DistanceFog Properties

The DistanceFog properties are located in the ZoneInfo actor.
The values of these properties should be set appropriately for the map design and style.
If there are multiple ZoneInfo actors in a map, they may all require their DistanceFog properties to be set identical, otherwise visible fog and speed issues may be noticed.

Right-click on the ZoneInfo actor, choose Properties, and open the ZoneInfo and ZoneLight groups in the tree.




The following are relevant ZoneInfo properties for DistanceFog:

Creating the DistanceFog Texture

When creating the Skybox subtraction cube and applying the texture set, in most cases the bottom of the cube should be set to the solid DistanceFog color, even if the Skybox texture set includes a custom Bottom texture.  Don't use the custom Bottom texture.

By setting the bottom of the Skybox subtraction cube to the DistanceFog color, it prevents anyone who can see through the map play area (Terrain, StaticMesh or CSG Brushes) from seeing anything but fog, which will otherwise usually ruin the realism of the map.

In the case of Skybox subtraction cubes where a Skydome StaticMesh is used instead of a Skybox texture set, all sides of the cube should be set to the DistanceFog color.


Simply create a 32x32 texture in your paint software that is a solid fill of the DistanceFog RGB value you determined previously, save it to disk as an uncompressed 24-bit Bitmap .bmp file, import it into UnrealEd (Package = myLevel, Group = Skybox, Name = SkyboxFogColorA, with MipMaps checked), compress the texture as DXT1 in the Textures browser, and then apply it to the required surfaces of the Skybox subtraction cube.



32x32 Texture



Creating the FogRing Texture

The FogRing texture uses alpha-channel information to create a gradient fade blend between the solid DistanceFog color and the Skybox texture set.

What this means visually, is that the FogRing alpha-channel texture usually looks something like this: a gradient from black to white in the upper 10 to 20%, solid white down the center area, followed by a second small gradient from white to black at the bottom.




You may wish to create two or three variations on this design, with a variety of gradient area sizes.  This allows you to create FogRings that range from slow blending to fast blending.




It is usually easiest to create these alpha-channel textures as 8-bit grayscale images, and save them to disk as Bitmap .bmp format for use in future FogRing textures.

To utilize them in the final FogRing texture itself, simply create a 128x128 RGB image, fill it with the DistanceFog color, then load the 8-bit alpha-channel image that you previously created into the alpha-channel of the image, and save that to disk as a TARGA .tga 32-bit image.

In Corel PhotoPaint, you can easily load the 8-bit grayscale alpha-channel image into the current image by selecting the Mask -> Load -> Load from disk function.

If you notice banding in the FogRing blending area on the map, which can occur in specific design, simply increase the resolution of the FogRing texture from 128x128 to either 256x256 or 512x512.
This allows the black-to-white gradient portion to contain more intermediate grayscale values, providing a smoother blend through the levels of transparency, but at a cost of more texture memory required in the game.





Creating the FogRing StaticMesh

In 3D Studio Max (or Maya) set up the workspace for compatability with Unreal Engine units (you can create a default .max file that has these settings and load it prior to starting any new meshes).

Create a Cylinder in the Standard Primitives and set its values to:

And click on the Create button.
This creates a cylinder that is located 512 units below the Z line.

Convert the object into an Editable Mesh.

Set the Selection Level to the Sub-Object Face, select the top and bottom caps and delete them along with any Isolated Vertices.  This results in a "hollow" cylinder.

Select all of the remaining faces using the Edit menu's Select All, there should be 48 faces total, and Flip the Normals.
The cylinder will now be outside-in.
While you are here, set the Material ID to 1, and reset the Smoothing Groups to only the group 1.

You can now exit the Sub-Object selection mode.

Bring up the Material Editor and assign the .tga FogRing texture that was created in the previous step.  Then drag this material to the mesh to assign it.

Add a UVW Map Modifier to the object, and adjust its settings to:

Save this to disk as SkyboxFogRing1.max





Now on the Utilities tab, Collapse the Modifier Stack, then on the File menu choose the Export item and export the mesh as an .ase with the same name SkyboxFogRing1.ase.

For variety you may wish to create one or two other FogRing meshes such as one that is only 640 units in height so that it sits lower in the Skybox subtraction cube for those skyboxes where you may have the SkyZoneInfo placed below center.



Importing the assets into UnrealEd

Start UnrealEd and open up your map.

This tutorial assumes that you have already created your Skybox subtraction cube, placed the SkyZoneInfo actor, etc.
Note that the Skybox subtraction cube should always be the same dimensions as the Skybox texture set.  So if the set is 1024x1024, the subtraction cube should be 1024x10240x1024.
Skybox subtraction cubes should also be located outside and up above the main world subtraction to prevent cuts from occurring that pass through the Skybox.

Choose the Textures tab in the browser.

Import the SkyboxFogColorA and SkyboxFogRingA textures that you created in the previous steps into the Package = myLevel and Group = Skybox.  Both should be imported with MipMaps checked.  The SkyboxFogRingA texture should also have the Alpha checked.

Once they are imported, right-click on the SkyboxFogColorA texture and Compress it as DXT1.  Similarly, right-click on the SkyboxFogRingA texture and Compress it as DXT5.




Choose the Static Meshes tab in the browser.

Import the SkyboxFogRing1.ase mesh.
If the texture was not properly assigned, go to the Textures browser and select the SkyboxFogRingA texture, go back to the Static Meshes tab and expand the Materials properties and highlight the Material slot and click Use to assign the selected texture.

Expand the Materials properties and set the EnableCollision property to False.  Also set all of the UseSimple*Collision properties to False.





Inserting the FogRing

Go to the [T]op viewport in UnrealEd, right-click beside the SkyZoneInfo actor and choose Insert SkyboxFogRing1 on the popup menu.

Make sure that the FogRing mesh is properly centered on the SkyZoneInfo in the [T]op view.
Switch to the [S]ide view and also make sure it is positioned appropriately there.

Right-click on the FogRing StaticMesh and choose Properties.
In the Collision group, set all of the bBlock* properties to False.
In the Display group, set the bShadowCast to False and bUnlit to True.

If your Skybox subtraction cube is 512x512x512, change the Display.DrawScale to 0.5.
If your Skybox subtraction cube is 1024x1024x512, change the Display.DrawScale.Z to 0.5.

Your FogRing is now complete.
View it in the 3D realtime viewport and see how it looks.  If necessary, adjust the staticmesh up or down a small amount.  Usually you will want it flush at the base of the Skybox subtraction cube (or a bit below) so that it properly masks out the sky to the fog color.  If the FogRing blending gradient is too low or too high on the horizon, resulting in culled objects such as mountain tops popping in and out, it is usually best to adjust the gradient range of the FogRing texture instead so that it matches correctly.