ShippedSep 2026 – Oct 2026Direction & prompts — Claude Code wrote the code

Verdant Skyline

A hand-inked garden city you can throw things at — 16 prompts, 15 versions, plain JavaScript, then five video models repaint it.

javascriptcanvas 2dcomfy cloud
Verdant Skyline: a crosshatched garden city in blue ink on cream paper, seen from a garden terrace with a fountain

Overview

An interactive ink sketch of a garden city, drawn stroke by stroke in blue ink on cream paper: crosshatched buildings in one-point perspective, hanging and rooftop gardens, street trees, walkers, and a fountain terrace. The ink scatters away from the cursor and springs back; a click lobs a ball that blasts holes in walls, snaps tree limbs, and bowls walkers over — they get back up.

Built in sixteen prompts over two sittings with Claude Code. The prompts were ideas and reactions, not specs — "Push harder on the details", "The tree tops are disconnected from the trunk" — and the loop was look, react, push.

Then the recording became the input: the same five seconds went to five video models on Comfy Cloud with one brief — make it watercolor and ink, keep every motion. A blind panel of three AI judges scored motion, look and stability; Kling O3 was the steadiest and ran the full shot.

Media

Features

Living ink

Every element is pen strokes. The field swells with cursor speed, scatters around the pointer, and pulses in slow waves when you rest.

A destructible city

A lobbed ball blasts holes in buildings with flying debris and wrecked interiors, snaps branches that hang on torn fibres, and fells whole trees with rigid-body physics.

Splash reveal

Every redraw lands like paint splashes and settles roughly back to front — burst-and-wobble math picked from a brainstorm over the recommended option.

The Comfy ending

Five video models restyled the same shot in one Comfy Cloud batch (about 1,640 credits all in), and the published workflow lets anyone rerun the bake-off.

Technical

Everything is built once as 2D ink: 3D points are projected with one-point perspective, and strokes are grouped into depth-ordered layers that erase what's behind them — a painter's algorithm, not raycasting. The static scene bakes into a cache canvas and each frame redraws only the regions where ink moved.

Motion is per-point offsets on top of rest positions: the cursor field, tree sway, and the transforms of falling pieces. 11 files, 3,620 lines of plain JavaScript, no libraries, no build step, under 200 KB.

Grown trees

Branch skeletons grow by space colonization, limbs taper with da Vinci's pipe rule, and leaf clumps are scalloped and cut against each other — the fix after the 'floating tops' and 'bubble wrap' failures.

Rebuilt from the log

All 15 versions were rebuilt by replaying the session log (686 checkpoint lines, zero mismatches) and filmed on a virtual clock, one frame at a time, so the reel drops no frames.

Social posts

linkedin

Draft · drafted 2026-10-17
M

I made an ink sketch you can throw things at, and I want to talk about how it got made.

It started with a reference: a blue ballpoint landscape someone had drawn into a website footer. My first prompt asked for "a simple webpage with a canvas that contains dynamic drawn pen strokes like the image" and ended with "Let's brainstorm."

Sixteen prompts and two sittings later, it's a garden city in one-point perspective. The ink scatters around your cursor, walkers wander the terrace, and a click lobs a ball that blasts holes in walls, snaps tree limbs and knocks people over. They get back up.

What changed is the distance between an idea and a running sketch. "The lines should break apart and avoid the mouse cursor" became working code in one turn.

What didn't change is the loop. Look at it, react, push. My prompts were ideas and reactions, not specs: "Push harder on the details." "The tree tops are disconnected from the trunk." Taste still drives.

Then the Comfy part. I work at Comfy, so I wanted to see what happens when the recording becomes the input. We sent the same five seconds, the tree coming down, to five video models on Comfy Cloud with the same brief: make it a watercolor and ink world and keep every motion. A blind panel of three AI judges scored them on motion, look and stability. Gemini Omni was the prettiest but rewrote the city. Wan 2.2, an open model, kept the layout best. Kling O3 was the steadiest, so it got the full shot.

On who did what: I brought the reference, the reactions and the calls on what came next. Claude Code wrote the code, tested it in a browser between turns, ran six rounds of adversarial review on itself, and ran the Comfy bake-off and the judging.

The video is every version, v1 to v15, rebuilt from the session log, then the Comfy ending. The sketch is plain JavaScript with no libraries, under 200 KB. Links are in the first comment.

I'm curious how others are running this loop right now. Which part do you keep for yourself?

M

First comment

Try it: https://thedatalife.github.io/sketch-ball/ (a mouse is best, but touch works too: tap to lob a ball, drag to scatter the ink)
Code: https://github.com/thedatalife/sketch-ball
The Comfy part ran on Comfy Cloud with Kling O3, Runway Aleph2, Seedance 2.5, Gemini Omni 1.1 Flash and Wan 2.2 Fun Control. Here's the whole bake-off as one workflow you can open and run: https://cloud.comfy.org/?share=59c5ee8251f8
Times in the video are Pacific. The two sittings were Sep 22 and Sep 23, and the Comfy run was Oct 16.

x / bluesky / threads

Draft · drafted 2026-10-17
M
1/11

I made an ink sketch you can throw things at. 16 prompts, 15 versions, two sittings, and then a Comfy ending.

Here's every version, rebuilt from the session log, with the prompt that made it. 🧵

194 / 280
M
2/11

It started with a reference: a blue ballpoint landscape someone drew into a website footer.

My first prompt asked for "a simple webpage with a canvas that contains dynamic drawn pen strokes like the image" and ended with "Let's brainstorm."

Attachment: 01-v01.jpg
241 / 280
M
3/11

A lot of my prompts were just reactions.

"This needs to have a significant amount more detail."
"Push harder on the details."
"Push the design even harder."

Look at the last version, nudge, repeat.

Attachment: 02-v03.jpg Attachment: 05-v09.jpg
199 / 280
M
4/11

Some were physics in plain words: "The lines should break apart and avoid the mouse cursor. They should move like a vector field..."

That went from a sentence to a running sketch in one turn.

Attachment: 03-v05.jpg
192 / 280
M
5/11

Some were math. I asked how to make the reveal land like paint splashes, mathematically. It came back with options and the equations behind them, and I picked burst + wobble over its recommendation.

Attachment: 06-v10.jpg
198 / 280
M
6/11

Some were just looking closely: "The tree tops are disconnected from the trunk."

Trees took three tries. Floating tops, then bubble wrap, then branches grown toward the crown.

Attachment: 10-trees-triptych.png
176 / 280
M
7/11

Then it got pretty silly. A click lobs a ball from the bottom of the view. It blasts holes in walls, snaps tree limbs and knocks walkers over.

They get back up 🙂

Attachment: 07-v11.jpg Attachment: 08-v13.jpg Attachment: 09-v15.jpg
162 / 280
M
8/11

Then the Comfy part. I work at Comfy, so I wanted the recording to become the input.

Same 5 seconds, same brief (make it watercolor and ink, keep every motion), five video models on Comfy Cloud in one batch.

Workflow: https://cloud.comfy.org/?share=59c5ee8251f8

243 / 280
M
9/11

A blind panel of three AI judges scored motion, look and stability.

Gemini Omni was the prettiest but rewrote the city. Wan 2.2, an open model, kept the layout best. Kling O3 was the steadiest, so it got the full 10 s shot.

224 / 280
M
10/11

Who did what: I brought the reference, the reactions and the calls on what came next. Claude Code wrote the code, tested it in a browser, ran six rounds of adversarial review on its own work, and ran the Comfy bake-off.

Attachment: 11-who-did-what.png
219 / 280