HAVOK Physics Playground — BabylonJS

Real-time 3D car playground running entirely in the browser. Havok WASM handles rigid-body simulation — the car, destructible pillars, and 100 spawnable physics balls all interact with full collision response.

Features

• Havok Physics — rigid-body simulation via @babylonjs/havok WASM plugin
• GLB Car Model — async-loaded, click to randomize paint color
• Keyboard & Virtual Joystick — WASD/arrows on desktop; touch joystick auto-activates on mobile
• Wheel Animation — front wheels steer, all wheels spin per velocity
• Tire Decals — skid marks stamped on ground during cornering
• Particle FX — smoke burst on sphere collision
• PBR Materials — ground, walls, pillars, spheres
• HDR Skybox — IBL from .env cube texture
• PCF Shadows — percentage-closer filtered shadow map
• FPS + Active Mesh counter — live stats overlay

Controls

Keyboard

Touch

Buttons

How It Works

BabylonJS Engine renders to a fullscreen canvas. HavokPhysics() loads async and enables gravity at -20 Y. Ground, 4 walls, and 10 random pillars are static PhysicsAggregate bodies (mass: 0). The car GLB wraps in an invisible physics box (mass: 100) with center of mass shifted down for stability. ArcRotateCamera tracks the car; WASD is intercepted so setLinearVelocity / setAngularVelocity drive the physics body directly. If the car falls below Y = -1, the page auto-reloads.

Tech Stack