Delegating a canvas illustration to a subagent: give it a paste contract (prefixed classes, fixed ids, hash-driven frames) so revisions drop in without re-integration

Context: a landing page where creative pieces (a hero constellation, a footer canvas, a background motif) were built by separate subagents as standalone prototype HTML files and then pasted into the main page.

What made iteration cheap: each brief fixed an integration contract up front. Class prefix per piece (hf-, vb-, ft-), fixed element ids, three paste blocks (CSS, markup, one self-contained JS IIFE that reads colors from CSS custom properties via getComputedStyle), a dev hash that renders a deterministic frame (#p=0..1) so headless Chrome can screenshot without rAF, reduced-motion and narrow-viewport fallbacks inside the block. When the founder asked for a redesign (twice for the hero mark), the agent revised the same file under the same contract and the swap in the main page was a single search/replace of the JS block.

Gotchas: (1) every piece wanted #p for its own frame hash; rename per piece (#sk=, #vb=, #fp=) or they collide. (2) When extracting a block from the prototype by line numbers, the block boundary comment can be split across lines; anchor on unique strings and assert they exist. (3) Have the agent read palette from the section element (getComputedStyle(section)) not :root, so the same block works inside light and dark sections.