Moonlit waves break on a beach and the plankton in them flash electric blue.
The surf zone is a nonlinear shallow-water simulation on a staggered grid over a sloping beach with a sandbar and a rip channel. Swell from an offshore wave-maker steepens into bores that break on the bar and again at the shore, then runs up the sand and drains back, with an upwind flux that keeps every cell's depth positive so the shoreline can move. The dinoflagellates are an excitable medium carried by the current: wherever the water is sheared hard enough they flash, spend a charge that recovers slowly, and fade within a second. The scene is a voxel-space heightfield raycast, column by column, with Fresnel reflections of the night sky, a glittering moon path, wet sand that mirrors the moon, and a cheap bloom on the glow.
Try it. Drag through the water to stir it and leave a glowing wake. Press R to reset the sea. Left alone, the waves keep breaking and a ghost finger now and then draws through the shallows.
Paste this into Claude Code, Codex or any coding agent to get a simple version running, then take it wherever you like.
Build a bioluminescent surf simulation with JavaScript and the HTML canvas element: waves roll onto a beach at night and the water glows blue wherever it is stirred. Put everything in a single index.html file with no libraries or build step, so I can open it directly in a browser.
Start simple, looking straight down at the beach:
- Make a canvas that fills the window and is sharp on high-DPI screens. Keep a grid of about 160 by 120 cells: deep water at the top, a beach sloping up to dry sand at the bottom (a bed height per cell).
- Use the shallow-water equations on a staggered grid: water depth h at cell centers, velocities on the faces. Each step, push the velocities by gravity times the slope of the water surface, then move water across faces using the depth of the upwind cell. Skip faces where both cells are dry and never let h go negative, so waves can run up the sand and drain back.
- Drive the surface height in the top rows with a sine wave so waves roll in and steepen in shallow water.
- Draw the cells through ImageData at grid size, scaled up: dark sand, very dark navy water.
Once that works, make it glow:
- Give each cell a glow and a charge. Where the flow is strongly sheared (velocity differences between neighbors), add glow in proportion to the charge and spend some of it. Glow fades fast and charge recovers slowly.
- Carry glow with the water by tracing each cell back along the velocity (semi-Lagrangian advection).
- Draw the glow in cyan with additive blending plus a blurred copy for bloom, and let the visitor drag through the water to leave a glowing wake.
Explain the key ideas in short code comments. When you're done, tell me how to open it and suggest three directions I could take it next, such as a low perspective view raycast across the heightfield, the moon reflecting on the water, or sound that follows the breaking waves.
