💨 Smoke VFX — Stable Fluids

Real-time smoke simulation using Jos Stam's Stable Fluids solver (implicit diffusion + advect + project). Vorticity confinement adds swirl. Interactive mouse drag generates smoke.

VFXInteractive
Hover or drag to disturb / emit smoke toward the cursor · P pause · R reset

How it Works

The simulator implements a 2D grid-based Stable Fluids solver on a 128×67 grid. Each simulation step: (1) apply mouse forces to velocity field, (2) diffuse velocity using Gauss-Seidel iteration, (3) project to enforce incompressibility (Poisson solve), (4) advect velocity using semi-Lagrangian back-tracing, (5) apply vorticity confinement, (6) diffuse and advect smoke density.

Navier-Stokes: ∂u/∂t = -(u·∇)u + ν∇²u + f, ∇·u = 0 Advect: q(x,t+dt) = q(x - u(x)·dt, t) [semi-Lagrangian] Project: ∇·u = 0 via ∇²p = ∇·u*, u = u* - ∇p Vorticity: f_vc = ε(η × ω), η = ∇|ω|/|∇|ω||

Frequently Asked Questions

What are Stable Fluids?

Stable Fluids is a method by Jos Stam (1999) for unconditionally stable real-time fluid simulation. It uses implicit time integration for diffusion and a semi-Lagrangian advection step that never becomes numerically unstable, regardless of timestep size.

What is the Navier-Stokes equation?

The incompressible Navier-Stokes equations describe fluid motion: ∂u/∂t = -(u·∇)u + ν∇²u + f, with ∇·u = 0 for incompressibility. The terms represent advection (transport by flow), diffusion (viscosity), and external forces respectively.

What is semi-Lagrangian advection?

Semi-Lagrangian advection traces each grid cell backwards in time along the velocity field to find the fluid origin, then interpolates density/velocity at that point. It is unconditionally stable but introduces numerical diffusion, making flow appear blurry over time.

What is the projection step in fluid simulation?

The projection step enforces incompressibility (∇·u = 0) by solving a Poisson equation for pressure and subtracting the pressure gradient from velocity. This prevents fluid from accumulating or disappearing, conserving the total amount of fluid.

What is vorticity confinement?

Vorticity confinement counteracts numerical diffusion of semi-Lagrangian advection. It detects regions of high vorticity (curl of velocity) and applies forces to concentrate swirling motion, producing more turbulent, realistic-looking smoke and fire effects.

What is numerical diffusion in fluid simulation?

Numerical diffusion is artificial smoothing introduced by discretisation of advection equations. Semi-Lagrangian methods with bilinear interpolation are particularly prone to it, causing smoke to appear blurry over time without corrective techniques like vorticity confinement.

How is smoke density advected in Stable Fluids?

Smoke density is a passive scalar transported by the velocity field. The full timestep: (1) add forces, (2) diffuse velocity, (3) project to divergence-free, (4) advect velocity, (5) project again, (6) advect density. Density is multiplied by a dissipation factor to simulate smoke fading.

What grid resolution is needed for real-time fluid simulation?

Real-time Stable Fluids typically uses 64×64 to 256×256 grids for 60 fps in JavaScript. GPU implementations (WebGL) can run 512×512 or higher. Higher resolution captures more turbulent detail but requires more computation per frame.

What is the Gauss-Seidel method in fluid simulation?

Gauss-Seidel iteration solves the linear systems arising from implicit diffusion and pressure projection. Each cell is updated using the latest neighbour values in repeated sweeps until convergence—typically 4-20 iterations per frame for a good quality-speed trade-off.

How does vorticity confinement force work?

Vorticity ω = ∇×u is computed at each cell. The gradient of |ω| gives direction toward vortex centres. The confinement force f = ε(η×ω) where η = ∇|ω|/|∇|ω|| pushes fluid to rotate around existing vortices, restoring lost curl from numerical diffusion.