Interactive browser-based 3D particle simulator written in TypeScript with Vite and Three.js.

It visualises air-like particles (light blue “smoke”) rising from a constant source, with an air blower you can move around to bend the flow in real time.

• 3D particle plume
  • Continuous incense-like stream from a fixed source at the bottom.
  • Particles collide, rise, and are recycled to keep the plume constant.
• Air blower object
  • Visible glowing sphere that pushes nearby particles away.
  • Drag on the canvas to move it in the (x,y) plane.
  • Strength and position can also be tuned from the UI panel.
• Controls panel
  • Gravity: add/remove global gravity.
  • Diffusion: controls how strongly the plume rises and wiggles.
  • Restitution: how bouncy collisions are.
  • Air strength / position: adjust the blower’s effect.
  • Play / Pause: freeze or resume the simulation.

Prerequisites:

• Node.js 18+ (recommended)
• npm (comes with Node)

Install dependencies:

npm install

Run the dev server:

npm run dev

Then open the printed local URL in your browser (usually http://localhost:5173).

• Watch the default upward plume of particles.
• Drag on the canvas to reposition the air blower; particles will bend and swirl around it.
• Use the right-side panel to:
  • Turn gravity on/off.
  • Change diffusion for tighter or looser smoke.
  • Adjust restitution for different collision feel.
  • Change how strong the blower is and where it sits.

• Vite + TypeScript
• Three.js for 3D rendering
• Vanilla DOM for the controls UI