A little ghost on rainy water: a Three.js cloth shader, designed by GPT 6 Astra, coded by Opus 5.5

How it was made

1. The character is minimal: a domed white sheet, two black eyes, a touch of blush, no legs.
2. The cloth is the point. The hem and the two "sleeves" swing with every move and trail back when it flies.
3. A line at the bottom lists five actions: tap the ghost, tug its hem, drag the bottle, tap the cork, tap the water.
4. The water is reused: small sparkles, raindrops, distant lights reflected on the surface.

The details that matter

• One lamp lights the scene. The bottle lantern is the only warm light; it catches one side of the ghost and everything else stays cold and dark.
• The background is just bokeh. A row of soft, defocused lights says "shore" without modelling anything.
• Lit and unlit states. In some frames the lantern is dark and the ghost turns cold grey. We guess tapping the cork switches it.

Where it breaks

• Cloth that's too soft reads as jelly. Let the swing grow with distance from the top, and keep the head almost still.
• An all-black scene turns to mush. Protect the water highlights and the rain streaks.

Try it yourself

Set up the rain and water with the Three.js scene starter, then place one key light and the bokeh with the Three.js cinematic look^[1].