Pablo Mesquida
esen

ProjectsExperiments

Accretion

A WebGPU experiment to try out rocks modelled in Blender: a rock spins in a dark studio, smaller rocks fall on it and stick, and a few pebbles stay in orbit around it.

Status
Finished
Period
2026.10
Type
Experiment
Role
Solo project, 3D development, Physics and simulation, 3D modelling
Technologies
  • Three.js
  • WebGPU
  • TSL
  • Rapier
  • Vite
  • Blender
Links
Development log
3 entries

Interactive demo

Drag to orbit the camera and scroll to zoom. Move the pointer over the rocks to nudge them. The Controls panel changes how the rocks fall (gravity, damping, grip, bounce, friction) and how the pebbles orbit; Launch plays the sequence again. It needs a browser with WebGPU.

Technical description

  • Rendering: Three.js r186's WebGPURenderer, with post-processing written in TSL: bloom, FXAA and a dithered backdrop. A procedural night-studio environment map, plus a key light and a rim light, both casting shadows.
  • Physics: Rapier. Each fragment is a body with a convex hull built from its own vertices; the main rock uses its real triangles. There is no global gravity: every frame, each fragment is pulled towards the centre.
  • Sticking: a fragment that stays still while touching something fixed for a couple of seconds becomes a fixed body, and the next ones can pile on top of it.
  • Spinning together: the physics world lives in the space of the rock's pivot, so whatever sticks spins with it at no extra cost.
  • Hits: each impact pushes and tips the pivot in proportion to the momentum the fragment lost, and a damped spring brings it back. It is visual only: in the physics the rock does not move.
  • Orbits: each pebble follows an ellipse with the rock at one focus, reached in a spiral from off screen. They are Rapier bodies driven by their velocity, so they move aside when something gets in the way and then drift back to their lane.
  • Rocks: modelled in Blender and exported as GLB, compressed with meshopt and with WebP textures. Each model is drawn as an InstancedMesh.

Results and limitations

  • It runs in browsers with WebGPU. Three.js falls back to WebGL 2 when it is missing, but that path is untested.
  • Sticking is a rule, not physical glue: a rock becomes fixed once it stops moving.
LOG

Development log

  1. A demo to try out the rocks

    The published demo, with a panel so anyone can change how the rocks fall and orbit.

  2. Hits, orbits and the pointer

    The rock reacts to every hit, a few pebbles stay in orbit and the pointer can move the rocks.

  3. Rocks that fall and stick

    The rock in a dark studio with WebGPU, and the first fragments that fall on it and stay attached.