Futurist Dynamism

About this style

Italian Futurism was launched in 1909, when the poet Filippo Tommaso Marinetti's founding manifesto appeared on the front page of the Paris newspaper Le Figaro. Painters such as Umberto Boccioni, Giacomo Balla, Carlo Carrà and Gino Severini set out to paint motion itself, borrowing repeated phases from chronophotography and adding force lines and planes that cut through one another. Marinetti's words in freedom broke typography apart into mixed faces, sizes and angles. The visual language of speed it invented still runs through sports branding, car advertising and motion graphics.

Make a 10-second Italian Futurist painting in motion: a racing car repeated in overlapping phases, force lines and fragmented planes that convey speed, ending on a manifesto title.

<inputs>
Manifesto, four lines of words in freedom: SPEED / MAKES / THE WORLD / NEW. Event: Valdrena Cup · 400 km of open road. Details: Sunday 14 June · Start at dawn. Sound words: RRRRRR, VAAAM, TAC TAC. Subject: a 1910s racing car. Duration: 10s. If I don't give you something, use the default and don't ask.
</inputs>

<direction>
Palette, oil paint on a dark ground: ground #1B1916, vermilion #E0452B, deep red #9B2B1F, ochre #D7A13B, lemon #EFD26A, cobalt #2F4FA0, steel #8C9096, silver #C8CAC6, cream #EEE3C9 for type and the brightest lights.
Paint: every plane is flat color carrying seeded divisionist strokes: short dashes 18–60px long and 4–7px wide in a lighter and a darker neighboring hue at 18%, aligned to the motion vector or to the nearest force line. Generate them once at load per plane; they never boil.
The car, facing right, 760px long, its final lead position spanning x 1000–1760 with wheel centers on y 800: a long cigar body tapering to a pointed tail, a flat radiator nose, a bonnet strap, a driver hunched forward in a round helmet and goggles, an exhaust pipe running back along the side, and two wheels 230px across, each with 12 spokes, a hub cap and a tire band. Build it from faceted planes, not smooth curves: the body is 10–14 facets of light (silver, lemon) and shadow (steel, deep red) split by straight cuts, the way a Futurist painter breaks a volume.
Phases: the car's past positions are captured like chronophotographs every 0.12s of its travel, so the trail is literally where it was: phases spread wide where it was fast and bunch up where it slowed. Older phases fade (100% → 18%), cool toward cobalt and come apart more, their facets drifting 6–40px along the force lines. On every phase the wheels repeat as overlapping ellipses whose spokes smear into concentric arcs.
Force lines: nine long curved wedges, each a filled crescent tapering from 90px to a point, sweeping from the left and upper left and lashing toward the car's nose at (1760, 690), in vermilion, ochre, cobalt and cream. Where a force line crosses a phase or a background plane, that piece is cut along it and offset 8–30px: the planes interpenetrate.
Background: the road as three ochre and steel wedges converging on a vanishing point at (1800, 640); a row of four telegraph poles and a line of trees reduced to triangles, all breaking into facets that slide right at different speeds.
Type, words in freedom: SPEED in "Archivo Black" 400 at 230px, MAKES in "Playfair Display" 900 italic at 120px, THE WORLD in "Sofia Sans Extra Condensed" 900 at 190px, NEW in Archivo Black at 260px, each word at its own angle between −14° and −4°, stepping up and to the right within x 120–1060, y 110–520, in cream, with NEW in vermilion. Sound words in Archivo Black, cream at 70%, letters growing along a force line from 32px to 120px. Event and details in "Libre Caslon Text" 400 italic, 28px, cream, in two lines on a horizontal vermilion strip at bottom left (x 120–900, y 912–1008).
Motion is speed and impact: the car's travel follows cubic-bezier(0.16, 1, 0.3, 1); force lines draw on in 0.35s each on cubic-bezier(0.5, 0, 0.1, 1); manifesto words slam from 115% to 100% scale in 0.12s, each giving the whole stage a 6px shove along the motion vector that recovers in 0.15s.
The real thing puts time inside one image: phases that bunch where the car slowed, planes that cut through each other, force lines bending toward one goal; the cheap version is a motion-blur filter and parallel speed lines behind a cartoon car.
Banned: motion blur or blur filters, parallel cartoon speed lines, smooth gradients, chrome or glossy rendering, real car makers or badges, flags or any political symbol, photo textures, glow, anything flashing more than 3 times per second.
</direction>

<structure>
0.0–0.8s: the dark ground; the three road wedges slice in from the left toward the vanishing point, 0.15s apart; poles and tree triangles stand up along the road.
0.8–2.2s: the car streaks in from off-stage left to its lead position, decelerating; its phases are left behind along the way, wide apart at first and bunching near the end.
2.2–3.6s: the nine force lines lash in, 0.15s apart, each cutting and offsetting the phases and background planes it crosses.
3.6–4.6s: the wheels spin, spokes smearing into concentric arcs on every phase; RRRRRR grows along the lowest force line, VAAAM along an upper one, TAC TAC by the rear wheel; the background facets slide right and come to rest.
4.6–5.2s: the vermilion strip wipes in along the bottom and the event and details set on it, line by line.
5.2–6.0s: the manifesto slams in word by word, 0.2s apart: SPEED, MAKES, THE WORLD, NEW.
6.0–7.6s: the oldest phases drift one last step apart and everything eases to rest.
7.6–10.0s: hold, nothing moving.
For other durations, scale every timestamp proportionally.
</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 car's facets, every plane's paint strokes and the force-line shapes once at load; each phase's position is the lead car's closed-form position at its capture time, so no frame depends on the one before. 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 lead car reads as a racing car (wheels, driver, tapered body) in every frame from 2.2s on, the phases bunch toward the end of its travel, the manifesto words stay clear of the lead car, and every word reads in the final frame. 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…