Full disclosure: I didn't write a line of this. It's pure vibe coded, made for my kids to squish on the tablet. My entire contribution was one sentence asking Claude to "knock me up a little slime simulator", with a menu of sliders, multi-touch and sound effects. Then I said "sick" and asked for it on the website.
What came back is a proper bit of kit. Claude wrote the physics engine from scratch, tuned it with a headless stability test before I saw a single pixel, and wrote the shaders that make it look wet and glossy. Every squelch is synthesised live in the browser, with no sound files at all. It's one HTML file with no libraries, and it was built for an iPad with all ten fingers in it. I'd have spent a fortnight on this and it wouldn't have been as good.
How to play
Open the tray on a tablet or phone and get your fingers in. Every finger works at once, and each one can use a different tool.
- Grab picks up a handful and stretches it. Pull hard enough and strands snap.
- Poke pushes a finger-sized hole through it.
- Swirl stirs it, which is how you marble the multi-colour slimes.
- Magnet gathers it up towards your finger.
- Add squeezes out more slime and Slurp sucks it back up.
The top bar has mute, shake, full screen and refill. The sliders button opens the mixing menu, where you can pick a recipe (Classic, Jelly, Butter, Stringy, Putty or Water) or fiddle with firmness, gooeyness, springiness and how far it stretches before it snaps. There are eight colours, including Galaxy, Rainbow and Unicorn, plus gold, holographic or snow glitter, gravity, and how sticky the tray is.
On an iPhone there's no full screen button, because Safari doesn't allow it. Add it to your home screen instead and it opens full screen like an app.
Technical details
- Physics: a viscoelastic particle fluid after Clavet, Beaudoin and Poulin (2005). Double density relaxation gives pressure and surface tension, viscosity impulses make it gloopy, and springs that form between neighbours give it stretch. The springs slowly forget their rest length, which is what lets you mould it. A spring stretched past the snap distance breaks, and that sets off the snapping sound.
- Speed: a spatial hash grid with typed arrays and no allocations in the hot loop. Up to about 1,500 particles at three substeps per frame, with the number of substeps matched to the display's refresh rate.
- Fingers: Pointer Events, so mouse, pen and any number of touches all work the same way. Finger positions are interpolated across the physics substeps, so fast swipes don't tunnel through the slime.
- Rendering: WebGL 2 metaballs. Each particle is drawn as a soft splat into a half-float buffer, carrying its colour, which is how two colours blend where they meet. A second, blurrier pass at quarter resolution gives the domed height. The final pass works out the surface normals and lighting, the specular shine, see-through thickness and a soft shadow on the tray.
- Sound: Web Audio. Bandpassed noise sweeps and pitch-dropping sine waves make the squishes, a filtered noise loop with a wobble follows how fast you're dragging, and tiny rising blips give the wet crackle.
Comments
Loading comments…