Productcommunityclaude-opus-5-5

Flow-Field Poster Maker

Thousands of particles follow a smooth noise field and leave thin translucent trails that build up into ink-like posters in A-series proportions. Six palettes (paper and ink, risograph, ocean, sunset, mono, neon), sliders for particle count, noise scale, swirl and line width, and a contact sheet of nine random seeds you can click to open. Every poster is reproducible from its URL, and the PNG export renders at 3x. One self-contained index.html with hand-written noise and no libraries.

By PossibleMade with Claude
Remix
The generated page running in Chrome: a palette switch, the contact sheet, loading a seed, then the neon palette. Screen recording by Possible.
Recorded from session

How it was made

Captured locally, then reviewed and possibly edited by the creator. This is a shared recipe, not an unedited transcript. Copy this text kit to your agent to adapt it.

  • Recorded from a local session; privacy redactions and creator edits may change the wording.
  • Tool outputs and file contents were omitted. Unknown ingredients are not inferred.
  • Claude Code runtime version and API hosting provider were not inferred from model names.
  • Historical skill repository revisions are unknown unless explicitly recorded; current checkouts were not inspected.
  • 1 reference ingredients were detected; only shareable URLs retained below are included.

Models

  • claude-opus-5-5 · anthropic · execution · Claude Code

Agent

Claude Code

Tools and APIs

  • Write

    Create index.html in one pass from the first prompt.

  • Edit

    Add the contact sheet and grain texture to index.html.

Ordered steps

  1. Build the poster maker in one HTML file

    Describe the generative system, the controls, the palettes, export and shareable URLs in one prompt.

    Make a generative flow-field poster maker as one self-contained index.html, no libraries. Thousands of particles follow a smooth noise field (write your own simplex or Perlin noise) and leave thin translucent trails that build up into an ink-like drawing on a portrait canvas in A-series proportions. Controls in a slim side panel: seed (with a shuffle button), particle count, noise scale, curl or swirl strength, line width, and a palette picker with about six good palettes (paper and ink, risograph, ocean, sunset, mono, neon on black). Drawing animates live and stops by itself after a few seconds. Add Redraw, and Export PNG at 3x resolution. Put the seed and parameters in the URL hash so a poster can be shared and reproduced exactly.

  2. Add a contact sheet and paper grain

    Browse many seeds at once and add texture that carries through to the export.

    Looks great. Add a Contact Sheet button: it renders a 3x3 grid of small previews using the current settings with nine random seeds, and clicking one loads that seed full size. Also add an optional paper-grain texture toggle that is applied on top in the PNG export too.

About

Thousands of particles follow a smooth noise field and leave thin translucent trails that build up into ink-like posters in A-series proportions. Six palettes (paper and ink, risograph, ocean, sunset, mono, neon), sliders for particle count, noise scale, swirl and line width, and a contact sheet of nine random seeds you can click to open. Every poster is reproducible from its URL, and the PNG export renders at 3x. One self-contained index.html with hand-written noise and no libraries.

How it was made

An AI agent made this. Claude Code, running Claude Opus 5.5, built it in one recorded session from the two prompts in this recipe. Nobody edited the code by hand. Possible wrote the prompts and recorded the session with possible capture. The recipe shows the exact prompts and the tools the agent used; tool outputs and file contents are left out.

Try it

Open the generated index.html in a browser, or copy the recipe into your own agent and compare. Results vary between runs and models.

What to know

The agent did not run or test the page during the session (it had file tools only). Possible opened it in Chrome afterwards to record the preview, with no console errors. PNG export and the shareable URL were not checked in the recording.

Exact prompt

Hidden characters, if present, appear as Unicode escapes
Make a generative flow-field poster maker as one self-contained index.html, no libraries. Thousands of particles follow a smooth noise field (write your own simplex or Perlin noise) and leave thin translucent trails that build up into an ink-like drawing on a portrait canvas in A-series proportions. Controls in a slim side panel: seed (with a shuffle button), particle count, noise scale, curl or swirl strength, line width, and a palette picker with about six good palettes (paper and ink, risograph, ocean, sunset, mono, neon on black). Drawing animates live and stops by itself after a few seconds. Add Redraw, and Export PNG at 3x resolution. Put the seed and parameters in the URL hash so a poster can be shared and reproduced exactly.

Looks great. Add a Contact Sheet button: it renders a 3x3 grid of small previews using the current settings with nine random seeds, and clicking one loads that seed full size. Also add an optional paper-grain texture toggle that is applied on top in the PNG export too.

What you need

  • Claude Code, or another coding agent that can write files
  • A web browser to open index.html
FILES

Download the result

Technical details and provenance
Provider
anthropic
Model
claude-opus-5-5
Agent
Claude Code
Published
Publication
community