Juicy Fog in Unity: A Mini Case Study

Posted by Write Meow · September 08, 2020

Usually, I achieve fog by layering a decent amount of some low opacity fog sprites which are somewhat randomly scaled and rotated. The move slowly in random directions, and slowly change in scale and opacity over time.

You can change the feel of the fog by changing the fog sprite assets themselves to be softer or harder-edged (or more/less detail) and by tuning the balance between the opacity of the fog particles and quantity. The more opaque they are, the less you need (lower emission rate), and the more "chunky" the fog will appear as a result. Less opaque fogs particles and more of them results in a more even distribution of fogginess (more smooth, less chunky).

Here's an example fog particle system made that way:

That's using this asset:

And here's a variant using a softer fog asset:

That used this asset:

SpriteParticleCloudWhiteSoft.psd

Here are the particle system settings I used there. Chances are, many of the settings will need to be substantially changed to fit the use case, but it can give you an idea. It's important to set the max particle size to something huge like 999, otherwise, unity may automatically scale the particle size based upon how big they are on camera. The max particle size there is really the "maximum size of particle in screen space at runtime".

If it's low like at 0.5, it means their maximum size when rendered on screen would be 0.5, regardless of size settings elsewhere in the system. Important optimization and implementation related detail:

There are two ways you can add a fog system like this to an area.

You can set the simulation space in the particle system's main section, by gravity.

With option 1, the particles will not move relative to the camera as the camera moves due to being in world space simulation, but the particles will spawn relative to the camera's position, which means the fog is essentially generated as the camera moves around, and the particles made where they camera used to be naturally go away. This works well with slowly moving cameras, because a low fog emission rate can easily keep up with the camera's slow position changing.

It is also good if you're fine with the whole visible area being subject to fog in the same way visually (e.g, there's no place you don't want fog to be).

This approach saves you the need from having to manually place and tune fog particle systems for the entire area, while still being decently efficient since it's one system moving with the camera, emitting a small amount of particles. You want to go with option 2 if you want to carefully control where the fog is, for example, if you never want it to display on top of a particular area such as a building or body of water. In DTs view angle, it may give more of a sense of depth to actually not have building rooftops occluded by fog, because it gives the sense that the roof tops are above the fog which is low to the ground.

The main downside for 2 is that you have to manually place the particle systems and tune them by hand appropriately based upon amount of area covered. This is not so much a problem if the amount of space you have to deal with is small.

You want to go with option 2 if you want to carefully control where the fog is, for example, if you never want it to display ontop of a particular area such as a building or body of water. In DTs view angle, it may give more of a sense of depth to actually not have building rooftops occluded by fog, because it gives the sense that the roof tops are above the fog which is low to the ground.

The main downside for 2 is that you have to manually place the particle systems and tune them by hand appropriately based upon amount of area covered. This is not so much a problem if the amount of space you have to deal with is small.

TLDR;
Option 1 is good if you have a lot of content and little time to add fog to it, or you're fine with fog being everywhere on-screen.

Option 2 is good if you want a lot of control over where the fog is and isn't, and is best if there's not that much content to treat this way. I think DT will look best with this option