Fog tutorial

From Valve Developer Community
Revision as of 05:28, 27 December 2013 by Pacguy19 (talk | contribs)

Jump to: navigation, search

Fog with skyboxes

The most common problem with fog is that the env_fog_controller does not affect the skybox and will come out looking like this.

When you have fog in your map, you will most likely run into the problem that, while the geometry and models get affected by the fog, the skybox will not.

You can either use settings which have been used in other HL2 levels before or make your own skybox material. The latter version gives you not only a lot more control over the fog but does also improve performance.

Note:The 3D Skybox has its own fog settings in the sky_camera entity. Match those with the settings of your env_fog_controller for best results.
Tip:<Left 4 Dead 2> There is a Fog Panel in Left 4 Dead 2 that allows in-game manipulation of fog parameters. It is loaded via console command fogui.

Quick fix

An example of a successful fog, due to the fog color matching the 2D skybox.
For a quick fix these settings will work fine. However, you are limited to one color-setting and it will not look good if you are using the far z-clip plane function of the env_fog_controller.

To do: This is only a 'quick fix' if the skybox sky_day02_10 is being used. How were the fog colors below found?

First, you have to use sky_day02_10 as your skybox texture (if you look at it, it actually is foggy on the texture which is why it works). For a list of skies, see Sky List.

Then, your env_fog_controller should be something like this:

Primary fog color: 176 192 202
Secondary fog color: 206 216 222

These are the exact settings used in the bridge crossing part of Highway 17 in HL2.

Another very, basic and quick fix for night maps is to use a color darker than the skybox for fog. While it looks only slightly better, it won't look as fantastic.

Using your 3-D skybox to make realistic fog

How using brushes in your 3-D skybox can create a realistic fog illusion

One method to give a realistic fog in skybox is very simple.

First you need a 3-D skybox. any size will do, the larger, the better, as larger boxes will remove the chance of corners being seen.

Inside your 3-D skybox, line the walls with a thin brush, Use the material tools/toolblack. Now, Select the brushes inside and turn them into func_brush, in the settings, disable receiving shadows and casting shadows. You can set solidity but that's user preference.

Now, follow the above instructions for setting fog, Match the sky_camera settings with the env_fogcontroller settings, compile and enjoy!

Your skybox will now be colored as the brightest color you set the fog, there will be no visible skybox texture, but this method brings a more realistic look for a foggy environment.

Create custom skybox

We're simply creating a skybox that uses the primary fog color. While a normal skybox has 6 texture files with each 1024x1024 pixel, we only need one with a much smaller size, thus reducing the cached texture size.

First off, create a .vtf with the color of your fog. Ideally, save it into the skybox folder (located here: .../materials/skybox). Remember its name, for this tutorial I'll asume it is called sky_fog_tex.

Now create the six .vmt's needed for a skybox. If you want to call your skybox sky_fog, these are:


These have all the same content:

 	"$baseTexture" "skybox/sky_fog"

We are not using "$nofog" 1 like skyboxes usually do.

If you are using this skybox and only the primary fog color in the env_fog_controller is enabled, the fogged geometry and models have the same color as the skybox. ToDo: How does one disable the secondary fog color?

However, if you are using the secondary fog color as well, you have to make sure that the distance between player and skybox is always bigger than the fogend. Remember that we didn't use "$nofog" 1, means the fog is drawn onto the skybox. However, this is only done in a sufficient way when the skybox is completely overdrawn - just like the geometry. You can use a 3D Skybox for this purpose.

See also