← Back to home
Playground — Experiments Six toys · all live

Things I build
for the joy of it. ੈ✩‧₊˚

Small interactive toys I prototype by pairing with AI — half design play, half code. Everything here runs right in your browser.

01

Floating Letters

Type anywhere and each letter drifts up like a balloon — a vibrant color, a little tilt, a gentle bob — crowding together at the ceiling. Hit clear to release them all and start fresh.

JavaScript · requestAnimationFrame · Interaction Design · Built with Claude

Fig. 01 · Click the canvas, then start typing.
02

Liquid Type

Type to fill the screen with massive type, then sweep your cursor through it — the letters repel, swell, tilt, and shimmer cyan-to-magenta like they're suspended in liquid. Backspace deletes, Esc clears.

Canvas 2D · Spring physics · Typography · Built with Claude

Fig. 02 · Click, then type and move your cursor.
03

Constellation Builder

Click across the night sky to place stars — nearby ones thread themselves together with light, and clusters of a few bloom into their own named constellations. Hover to trace the connections.

Canvas 2D · Generative · Interaction Design · Built with Claude

Fig. 03 · Click the sky to place stars.
04

Coffee Table Book

A 3D book of my artwork you can actually open and leaf through — lift the cover, turn spread by spread in real perspective, then close it shut again. Use the ‹ › buttons to page through.

CSS 3D · Animation · Interaction Design · Built with Claude

Fig. 04 · Open the cover, then turn the pages.
05

Wish You Were Here

Type any city and it develops a dithered postcard of the place — pulling the real weather and a real photo, then stamping and postmarking it like it actually traveled to reach you. Every card you make lands in the collection to leaf back through.

Canvas · Dithering · Open-Meteo + Wikipedia APIs · Built with Claude

Fig. 05 · Type a city, then press enter.
06

Paper Cranes

A flock of origami cranes trails your cursor in a loose murmuration. Drift slowly and they gather into formation behind you; dart across the screen and they scatter; hold still and they drift down to land.

Canvas · Flocking simulation · Interaction Design · Built with Claude

Fig. 06 · Move your cursor — slowly to gather them, fast to scatter.
07

Moonlight Video

A first-person, late-night video rental store. Browse the neon genre shelves and pull a case off the shelf — it flips to the real movie poster, then flips again to a hand-built back-of-box with synopsis, cast, and a Be Kind · Rewind sticker.

3D CSS · WebAudio · Interaction Design · Built with Claude

Fig. 07 · Click a spine to pull the case; click again to flip it over.

More experiments brewing.

This is where new interactive toys land as I make them. Check back — or say hi if there's something you'd like to see.