Sliding Social Card Gallery
A silent 16-second motion showcase that turns a row of social post mockups into a staggered brand story.
Starter prompt / by Refs
The creator shared no short prompt. This is ours for making a film like it with Claude.
Mock up six Instagram-style graphic posts for {BRAND} ({ONE_LINE_PITCH}) and animate them as a 16-second showcase at 1600×1200. Present them as feed cards with a profile header, verified badge and like, comment and share icons on a bright lime backdrop; slide the row sideways, morph each card's artwork between soft 3D hills, blurred gradients and bold color fields, and pop the heart icons. Build it in one HTML file with CSS and canvas, then capture frames with headless Chrome and encode with ffmpeg.Field notes / why it works
The complete social-card system is visible at 0:00, while blank and blurred cards create an immediate reason to watch them resolve. The first promise and phone appear by 0:01.25; subsequent cards add benefit, editorial contrast, geographic proof, and a human image by 0:12.8, sustaining attention through one continuous 16-second shot with zero cuts.
Plate 01 / The format in one breath
A bright 4:3 canvas holds a single horizontal strip of Instagram-like posts. The row glides left while individual cards resolve from attractive but empty colour fields into a product promise, benefit, proof point, and human use case. The opening promises a polished brand system visually; no narrator explains it.
Why it works
- At 0:00, multiple finished card shells establish the design system instantly, while an empty centre card leaves a reason to wait.
- By 0:00.75, the first card gains a short headline and phone mockup; by 0:02.75, the next gains a logo, DNA-like motif, and copy. Continuous reveals make the 16-second hold feel active despite zero cuts.
- At 0:06.4–0:12.8, cards move from offer to thought-leadership headline, geographic proof, and a person using the service, giving the gallery more variety than repeated feature cards.
Plate 02 / Format card
| Reference | |
|---|---|
| Platform · aspect · length | X post · 960×720, 4:3 · 16.0 s · 60 fps |
| Pace | 1 continuous shot · 0 cuts/min · 16 s shot; card contents animate within it, though the detector logged 0 discrete step changes |
| Script | No spoken words or WPM; short headlines and support copy inside cards |
| Voice | None |
| On screen | 100% designed motion graphic; no live presenter or captured product walkthrough |
| Captions | No subtitles; card headlines serve as the readable copy |
| Sound | Silent in the measured file (−70 LUFS integrated; no detectable music or effects) |
| Structure | 4 visual phases: establish → first promise → additional cards/proof → continuing gallery; no explicit CTA |
Pro / 13 plates + recipe
The first plates are open. The full dissection is Pro.
Get the timed shots, type and sound specs, and the runnable recipe.
Open the full blueprint- Plate 03 / The hook, frame by frame (first 3 seconds)Pro
- Plate 04 / Structure (beat sheet)Pro
- Plate 05 / Shot grammarPro
- Plate 06 / Visual style guidePro
- Plate 07 / Voice and deliveryPro
- Plate 08 / Sound designPro
- Plate 09 / PackagingPro
- Plate 10 / On-screen copy templatePro
- Plate 11 / Production planPro
- Plate 12 / PromptsPro
- Plate 13 / Edit recipePro
- Plate 14 / QA checklistPro
- Plate 15 / Make it yoursPro
- Recipe / runnable promptPro