Ukiyo-e Woodblock

About this style

Ukiyo-e, pictures of the floating world, were woodblock prints made in Japan from the 17th to the 19th century by a team of designer, block carver, printer and publisher. A keyblock carved with the outlines was printed first, then one block per color, kept in register by notches called kento, with gradients called bokashi made by wiping ink across the block by hand. Katsushika Hokusai's Under the Wave off Kanagawa, published around 1831, made the imported pigment Prussian blue famous and is one of the most reproduced images in the world. Its flat inks, carved line and bold cropping shaped European Japonisme and still influence illustration and poster design.

Make a 10-second Japanese ukiyo-e woodblock print of a great wave: it prints itself block by block, then the wave rises and curls like a sequence of prints before the cartouche and seal go on.

<inputs>
Print title, for the cartouche: 汐見沖浪裏 (Under the Wave off Shiomi). Series: 汐見浦八景 (Eight Views of Shiomi Bay). Signature: 潮風画 (painted by Shiokaze). Seal character: 潮. Caption: Under the Wave off Shiomi · from Eight Views of Shiomi Bay. All fictional. Duration: 10s. If I don't give you something, use the default and don't ask.
</inputs>

<direction>
Paper and inks: hōsho paper #EEE3C7 with seeded long fibers and soft mottling; keyblock sumi #2A2520; Prussian blue in three strengths, deep #17396A, mid #3C6797 and pale #A6C0CC; a sky bokashi from #7F7465 at the top of the sheet fading to bare paper by y 330; pale yellow #DCC58E for the boats and cartouche; grey-blue #7D8B96 for the distant mountain, its snow left as bare paper; seal red #B3302A. Foam and spray are bare paper inside sumi outlines. Nothing else.
The sheet: 1560×880 at x 180–1740, y 60–940, its edges slightly deckled, on a mount of #2C2A27. The caption in "Zen Old Mincho" 400, 24px, tracked 0.06em, #CFC6B2, centered on the mount at baseline 1000.
Print texture: each color block sits at its own fixed 1–3px offset from the keyblock (seeded), so slivers of paper and small overlaps show along edges; flat areas carry their block's wood grain (fine horizontal streaks at 5%) and faint circular baren marks; ink coverage varies 90–100%. Keyblock lines are carved, not stroked: each swells and tapers between 1.5 and 5px, with corners slightly rounded where the knife turned.
The great wave, built so it reads as the real thing:
- body: from a trough at the lower left it rises to a crest at about (700, 210) and hooks forward into a curling lip that overhangs the trough to its right; the face is striped by 7–9 keyblock lines that follow the curl, with bands of deep, mid and pale blue between them, darkest low in the face and palest just under the lip;
- crest: a band of foam along the lip that breaks into a fringe of 18 claw-like fingers, each a tapering curved tendril that forks into two or three smaller claws at its tip, all curling toward the trough;
- spray: about 120 drops (6–16px paper circles in sumi outline) flung from the claws, falling in arcs over the trough;
- echoes: a smaller breaker in the right foreground with its own claw fringe, and low swells crossing the middle distance, built the same way.
Two long narrow boats in pale yellow with sumi outlines, each carrying seven crouched rowers as rounded deep-blue shapes, cut diagonally across the wave faces, one high on the main wave's flank and one in the trough. The distant mountain: a small snow-capped cone with a 180px base, low in the trough at about (1180, 690), framed by the curl.
Cartouche: a 90×330 vertical pale-yellow rectangle with a double sumi border at the upper left of the sheet (left edge x 230, top y 110), the title in "Yuji Syuku" 400, 48px, sumi, one character under another; the series in Yuji Syuku, 26px, in a narrow column beside it. The signature in Yuji Syuku, 30px, vertical, under the cartouche, and the red seal (a 54px square, the character reversed out in paper, edges slightly ragged) at its foot.
Motion: printing comes first, each block revealed by a baren sweep, a soft-edged diagonal front with a slightly wavering edge, 0.35s per block. Then the wave comes alive, animated on twos (drive its geometry from tq = floor(t × 12) / 12) so every frame looks like another print, not a simulation: the swell rises 90px and leans forward, the lip curls 25° further over, the claws lengthen and fork, spray follows closed-form ballistic arcs, and the boats pitch ±4° with the water. The mountain never moves.
The real thing is a stack of flat water-based inks pulled from carved blocks: lines that swell and taper, Prussian blue in three strengths, a wiped gradient sky and foam claws you could count; the cheap version is wave clip-art with a brush font and a paper texture.
Banned: gradients other than the bokashi, 3D shading or highlights, photoreal water, blobby foam without claws, uniform vector strokes, glow, drop shadows, cherry blossoms, torii, rising-sun rays, geisha, real artists' names or signatures, anything flashing more than 3 times per second.
</direction>

<structure>
0.0–0.5s: the sheet on its mount, bare paper.
0.5–1.3s: the keyblock prints: the whole line drawing appears behind the baren sweep, top left to bottom right.
1.3–3.1s: the color blocks print in order, 0.35s each with short gaps: pale blue, mid blue, deep blue, then yellow and grey-blue together, then the sky bokashi wiped down from the top.
3.1–6.0s: the wave rises and curls on twos; the claws reach and fork; spray lifts from the lip and arcs over the trough; the boats ride and pitch.
6.0–7.0s: the wave eases into its final pose, tallest and most curled, the spray hanging over the mountain, and stops dead.
7.0–8.0s: the cartouche prints, its characters inking in from top to bottom; the signature follows; the seal presses (scale 1.05 → 1, full ink in 0.15s).
8.0–8.6s: the caption fades up on the mount.
8.6–10.0s: hold, completely still.
For other durations, scale every timestamp proportionally, keeping 12 drawings per second for the wave.
</structure>

<build>
One self-contained index.html, CSS and JS inline. Google Fonts via <link> are fine; no other libraries (no three.js: this style is flat). Draw in Canvas 2D, repainting every frame from scratch, the backing store sized from CSS size × devicePixelRatio. Canvas won't fetch fonts itself: await document.fonts.load() for each face, then define window.seek. Build the paper, fibers, wood grain and baren marks once at load; each frame computes the wave geometry from tq and paints each block's flat layer through its registration offset, revealed by its printing sweep. Spray drops follow closed-form arcs from seeded launch data. 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: 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 at a fixed step or solved analytically from t, so any frame can be drawn directly. 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 the wave reads as a breaking wave with a hooked lip and forked claws in every frame from 1.3s on, keyblock lines taper rather than stroke evenly, each color keeps its fixed registration, the spray never covers the cartouche, the characters run vertically and are the ones given, and the caption sits on the mount clear of the sheet. 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…