Watercolor Bloom

About this style

Watercolor paint is pigment bound in gum arabic and diluted with water, laid over white paper that serves as the light in the picture. Painting wet-on-wet, into paper that is still damp, lets pigment spread and mingle in soft blooms, while washes that dry unevenly leave darker edges where pigment gathers at the rim and backruns where water flows back in. Botanical illustrators have long used it to record plants, and its translucent, loose look is common in editorial illustration, stationery and packaging.

Make a 10-second watercolor animation: wet-on-wet washes bloom across cold-press paper and resolve into a botanical study of field poppies.

<inputs>
Title: Field Poppies. Line: "Sow in autumn, bloom by June." Brand: Wildmere Seed Co. · Packet No. 12. Duration: 10s. If I don't give you something, use the default and don't ask.
</inputs>

<direction>
Paper: cold-press #F8F4EA, generated once at load: a tooth height map (seeded value noise at two scales) lit softly from the upper left at 4%. Pigment settles in the valleys of that tooth (granulation).
Pigments: cerulean grey #8EA4BB, sap green #5F7F3D, grey-green #7F9B7B, poppy coral #E4533B, apricot #F1A15A, crimson glaze #AE2433, indigo violet #2F2648, yellow ochre #D6A440. No black.
Composition, within x 220–1280: two coral heads (about 260px at 560, 380 and 210px at 900, 300) and one apricot (180px at 760, 600) on long curving stems rising from the bottom edge between x 500 and 760; a closed bud near 1060, 520; a seed pod near 420, 560; a few lobed grey-green leaves. Petals keep 8–12% unpainted paper as highlights. The text column sits at x 1380–1780, y 640–860.
Washes, built once at load from a seeded PRNG: a base polygon of 10–14 points is deformed recursively (split each edge at its midpoint and push the new point out by a Gaussian scaled to the edge length, 3 rounds); 40 layer polygons come from it with 2 more rounds each. Draw each layer at 3–4% alpha with 'multiply', plus its outline as a 2px stroke at 4%, so pigment builds up at the edges (edge darkening). Multiply the granulation mask into each wash at 15%.
Blooming: a wet-on-wet wash grows from its drop point, each layer scaling 15% → 100% on an ease-out (spreading slows as the paper dries) with a seeded 0–0.4s delay, so the front is ragged and soft. A faint wet sheen (2% darker) shows where water lies before pigment arrives and fades as it dries. Where a second drop meets a drying wash, make a backrun: a paler interior pushed back by a darker rim with twice the deformation.
Wet-on-dry: later washes (petal glazes, leaves) keep crisp, irregular edges with darker rims; stems are fine rigger strokes whose width varies 2–6px.
Type, #2B2622: Instrument Serif 400, 72px, for the title; Instrument Serif italic, 32px, for the line; Hanken Grotesk 500, 20px, uppercase, tracking 0.14em, for the brand.
Motion is organic and unhurried: blooms take 1.2–2.4s, nothing travels in straight lines or at constant speed, and pigment never shrinks once laid.
The real thing is pigment and water behaving on paper: soft blooms, hard dried edges, granulation, and the white of the paper as light. The cheap version is a blurred vector shape with a paper texture on top.
Banned: blur filters standing in for wet edges, flat fills, gradients, drawn contour lines, pure black, airbrush softness, opaque white paint, clip-art flowers, anything flashing more than 3 times per second.
</direction>

<structure>
0.0–0.6s: paper only, lit across its tooth.
0.6–2.4s: a cerulean-grey wash blooms across the upper left and a sap-green wash below it; they meet wet-in-wet in a soft blend.
2.0–4.4s: coral drops into the three wet flower zones and blooms outward into loose round petal masses, bleeding a little into the green; a backrun opens in the largest.
4.4–6.2s: wet-on-dry: crimson glazes define each petal's folds with crisp edges; stems draw up from the bottom; leaves land as single washes.
6.2–7.4s: indigo-violet centers drop in as small blooms; fine stamen flicks ring them; the bud and seed pod take grey-green.
7.4–7.8s: a few seeded spatters land, 40ms apart, each round with a darker rim.
7.8–8.8s: title, line and brand rise 10px and fade in, 0.2s apart.
8.8–10.0s: hold, every wash dry and still.
For other durations, scale every timestamp proportionally; keep each bloom at 1s or longer.
</structure>

<build>
One self-contained index.html, CSS and JS inline. Google Fonts via <link> are fine; await document.fonts.load() for each face before defining window.seek. No other libraries (no three.js: this style is flat). Draw in Canvas 2D, repainting every frame from scratch, with the backing store sized from the canvas's CSS size × devicePixelRatio. Canvas won't fetch fonts itself, so the font wait matters. Build every wash's polygons once at load; once a wash has finished growing, render it into a cached offscreen canvas (built the same way whatever t you seek to), and redraw only growing washes layer by layer. The stage is 1920×1080 (16:9), scaled to fit the window. Design for 60fps. window.seek(t), t in seconds, must compute every visual from t alone, clamping past the end to the last frame: no CSS transitions or animations, no setTimeout or setInterval, no state carried between frames, and randomness only from a seeded PRNG. Anything cumulative is precomputed once at load from the seeded PRNG at a fixed step, or solved analytically, so seek(t) can jump to any time. Without ?render in the URL, drive seek from requestAnimationFrame so it plays in a browser (loop after a 1s end hold); with ?render, don't start that loop.
</build>

<check>
Before showing me, step through one frame per second: screenshot each and look at it. Fix overlaps, clipped or cramped text, accidental edge collisions, and anything off-style or Banned. Check every dried wash has a darker edge, granulation survives at 1280×720, blooms are soft and irregular rather than blurred, petals keep some white paper, and the poppies read as poppies. Confirm seek(duration) and seek(duration + 1) match, so the final frame holds.
</check>

Ours, and free to use under CC0: copy it, change it, ship it. No credit needed.

Similar prompts

Cut-Paper Title Sequence

Made by us

A jazz-tempo film title sequence in flat vermilion, mustard, bone and black: hand-cut paper shards jab in on the beat,…

Swiss Grid Typography

Made by us

A Swiss-style event poster that builds itself on a visible 12-column grid: grotesque type rises out of baseline masks,…

Bauhaus Geometry

Made by us

A primary-colored circle, square and triangle roll, drop and turn into place on a black bar, assembling a constructed B…

Constructivist Poster

Made by us

A Constructivist poster in motion: red bars, a wedge piercing a black circle, halftone fields and condensed uppercase t…