We built a realtime GPGPU cloth solver in Three.js + TSL. Then we fed it letters and cranked the pressure up. Now it's a balloon simulator 🎈🎈

Fonts make terrible sim meshes, so we don't use them. Text -> SDF -> marching cubes -> isotropic remesh. Out comes a closed, evenly triangulated shell per letter. Every vertex is a particle, every edge an XPBD distance constraint. All of it lives in GPU storage buffers.

Each frame runs a couple of compute passes: integrate -> distance constraints -> pressure + per-letter volume constraint (that's what makes it a balloon, not a sock) -> spatial-hash collisions -> strings. Nothing round-trips to the CPU.

@threejs Yummy 🎈

@threejs kewl!

Tried a cloth sim in three.js last year and blew the frame budget the moment I added text. Feeding letters into a GPGPU solver is the move I missed — keep the solver dumb, put the letters in as pressure. Balloon mode is the demo that actually explains the tech.

@threejs We made Hybrid Path Tracing Real-time in Web GL and Web GPU, lets connect!

@threejs Absolutely! Write a dm!

@threejs Actually we need follow each other to dm.

@threejs Followed

@threejs nice! ive been wanting a balloon font! where can i try it?

@threejs how does the cloth solver handle different materials or weights in the simulation?

@threejs Is it available to play with?

@threejs Soon! Working on a new version that is a more optimized and a bit cooler. Will release it later today probably

@threejs this is awesome. great work!

@threejs Thanks!!

@threejs a balloon simulator could open up fun possibilities for interactive experiences