Sticker and Stamp Kinetic

About this style

Sticker-bombing comes from skate, streetwear and zine culture, where layered die-cut stickers and rubber stamps signal a brand that's handmade, collectable and a bit irreverent. In motion it leans on squash and stretch, the first of the classic twelve principles of animation set out by Disney animators Frank Thomas and Ollie Johnston, so each sticker feels like it has weight and hits a real surface. Youth, snack and drinks brands use it for drops and launches.

<inputs>
- BRAND. Default: "FIZZWICK" (a fictional soda).
- TAGLINE. Default: "LOUD SINCE LUNCH".
- STICKERS. Default: "NEW!", lightning bolt, "100% FIZZ", smiling sun, "WOW" starburst, "SPRING DROP".
- COLORS. Default: pink #FF4F9A, yellow #FFE14D, mint #3DDC97, cobalt #2D4BFF, ink #151515, stamp red #E5372D, paper #F3EEE4.
If I don't give you something, use the default and don't ask.
</inputs>

<direction>
A youth-brand sticker-bomb: vinyl stickers slap on with cartoon physics, stamps thud in real ink, the logo lands last and hardest. Loud, funny, composed.
- Paper: #F3EEE4, a 48px grid in #E3DCCF, static grain (feTurbulence, fixed seed, 5% opacity).
- Stickers: bold flat vector art, a 10px white die-cut border, a hairline #00000014 outline, and a soft shadow that tightens as the sticker approaches (blur 28→5px, y 26→5px). Copy in Archivo Black. Sizes 220–360px; logo sticker 620px wide. Seeded rotations within ±14°, no two neighbors alike.
- Slap: drop in from scale 1.35 with extra rotation over 180ms (easeInQuad, accelerating into the hit). On impact squash to 1.14 × 0.86 for 50ms, rebound to 0.96 × 1.04, settle by 320ms on a damped spring (ζ 0.45), volume preserved.
- Stamps: Space Mono 700 caps in a double-ruled border, stamp red or ink, mix-blend-mode multiply, rotated −8° to 6°. Ink: a seeded feTurbulence mask (baseFrequency 0.9) thresholded so 15–25% of the print speckles away, heavier ink toward one edge. Thud: a translucent stamp-shaped shadow drops from scale 1.25 to 1 in 110ms, the print snaps to full, and the page nudges 5px down and back over 180ms. Stamps at least 0.4s apart.
- When the logo lands, stickers within 500px jolt 6–10px outward and spring back.
- Composition: a clear center for the logo, the collage framing it like a wreath; text at least 80px from frame edges.
Banned: identical rotations or timing, linear scaling, page nudges for stickers (stamps only), clean vector stamp edges, rainbow gradients, emoji, hard black shadows, anything covering the logo, anything flashing more than 3 times per second.
</direction>

<structure>
- 0.0–0.4s: empty page.
- 0.4–2.9s: six stickers slap on around the edges, 0.38–0.46s apart (vary it), alternating sides.
- 2.9–3.5s: "LIMITED DROP" stamp thuds bottom-left.
- 3.5–4.1s: "SPRING '27" date stamp thuds top-right.
- 4.1–5.4s: logo sticker slaps center with the hardest squash; neighbors jolt.
- 5.4–6.6s: its top-right corner peels up (a folded triangle, light gradient on its back, 0.5s) and springs back down (0.4s).
- 6.6–7.6s: tagline stamp thuds under the logo.
- 7.6–10.0s: hold; nothing moves.
For other lengths change sticker spacing; never under 0.3s apart.
</structure>

<build>
- One self-contained index.html, 1920×1080 (16:9) stage, designed for 60fps.
- window.seek(t), t in seconds, computes every visual from t: no CSS transitions or CSS animations, no setTimeout/setInterval, no state carried between frames (anything cumulative is solved analytically from t or re-simulated from 0 at a fixed step), randomness only from a seeded PRNG.
- No ?render in the URL: drive seek from requestAnimationFrame. With ?render: don't start that loop. Define seek once fonts and assets load.
- Google Fonts via <link> are fine.
- Engine: HTML/CSS plus inline SVG art and filters, all driven from seek(t).
</build>

<check>
Before showing me, screenshot one frame per second (t = 0…10) and look at each. Fix overlaps, clipped or cramped text, and anything that reads as a cheap demo. Nothing may cover the logo or tagline; stamps must stay readable through the speckle; squash frames must look intended and the collage balanced. Confirm the final frame holds as a composed end card.
</check>

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

Similar prompts

Gradient Mesh Brand Film

Made by us

A slow, ribbon-like gradient mesh flows in a skewed band behind sharp headline type, while white payment, API and chart…

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,…

Split-Flap Departure Board

Made by us

A mechanical station departure board where every flap steps through its drum to land on times, destinations and statuse…

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,…