About a month ago we wrote about our shader-based heat shimmer effect. Another effect we developed for the Danfoss-experience project is illustrated in the video below. It tries to reproduce the effect of a window or mirror steaming up entirely as a shader.

Our method uses a gradient image G which dictates the overall "growth" of the steam. A variable t is animated over time from 0 to 2 and the amount of steam s for a given position \mathbf{x} is then defined by a clamped linear interpolation over some range r:

s = \mathrm{clamp}\left(\frac{t - G(\mathbf{x})}{r}, 0, 1\right)

To make the growth more interesting, we modify G with a noise texture. The color of the steam c_s is determined from a lookup into a texture-rendered version of the scene which has been blurred by a Gaussian filter. To this value, we add some white noise to give the steam some texture. Finally, we add a value which can be tweaked to give the steam the desired amount of lightness.
The pixel color is then given by the unmodified color c interpolated with the steam color:

\mathrm{lerp}(c, c_s, s)

The final touch to our effect, is the ability to interact with the steam by dragging the mouse around like a finger on the steamed up window. This is implemented by adding a mask texture and modifying the amount of steam by taking the minimum value of the mask and s. The mask texture is updated by blending black lines into it where the mouse has been when it is being dragged around. Furthermore, a dark grey color is constantly blended into the entire mask in order to make the older strokes steam up again.