Slime Tray

Created
Status
Toy
Comments
–
Detail level

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, install 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. The Sound section is a little mixer: pitch, wobble, wetness, thump, crispness, stretch creak, snaps and splats, and an echo that goes from kitchen table to giant cave, with a button to hear it as you go. Made a good one? Tap + Save, give it a name, and it joins the recipes with every setting kept, colour and glitter included.

Install it. Tap Install and it goes on the home screen as an app, opens full screen with no browser bars in the way, and works without Wi-Fi once it's been opened. Android, Chrome and Edge show their own install prompt. On an iPad or iPhone the button shows the two taps for Add to Home Screen, since Safari doesn't let a page install itself.

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.
  • App: a web app manifest with display: fullscreen, and a service worker that serves everything from cache and refreshes it in the background, so it opens instantly offline and picks up new versions on the next launch. The install button uses beforeinstallprompt where the browser has it.
  • 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. The mixer scales each layer separately, shifts every filter up or down for crispness, and feeds a darkening feedback delay for the echo.

Updates

  1. New projectSlime arrives

    Asked Claude for "a little slime simulator" on a Saturday afternoon. It came back with this. Have a go.

Comments

Loading comments…

Add a comment