What Figma Is, Told Through a Shared Canvas
A 95-second animated product explainer turns workflow chaos into a colorful, collaborative design space.
Field notes / why it works
The bright geometric opening holds without a cut until 0:05, then the film makes its problem concrete with file passing, version clutter and missing fonts at 0:20–0:30. At 0:35 it converts the abstract shapes into a product window, and from 0:47–1:33 it progressively adds artifacts, roles, comments and a wider shared board. That problem-to-interface reveal and staged collaboration proof are reusable beyond this brand.
Plate 01 / The format in one breath
A narrated brand explainer begins with a colorful visual metaphor for good work, turns that same design language into a messy old workflow, then reveals a shared product canvas that resolves each problem. The promise starts as an aspiration at 0:03 and becomes a concrete product claim at 0:37. The final proof is several roles working in one place at 1:24–1:33.
Why it works
- The first five seconds are a moving wall of bright geometric shapes; the narration waits until 0:03.16, making the visual style carry the opening.
- The problem becomes specific at 0:20–0:29: files bounce between people, version names multiply, and fonts break. Those three concrete failures make the 0:35 interface reveal feel earned.
- The benefits escalate from making an artifact at 0:45 to real-time collaboration at 1:24. The product is shown in use, not only described.
Plate 02 / Format card
| Platform · aspect · length | YouTube · 16:9 · 95.0 s · source measured at 640×360, 24 fps |
| Pace | 16 shots, 15 confirmed cuts; 9.5–15.2 cuts/min allowing uncertain changes; 17.7 measured picture changes/min; mean shot 5.94 s, median 4.27 s |
| Script | 208 spoken words; 138 wpm across the full runtime, 215 wpm during speech; 23 short sentences averaging 9 words; no spoken questions |
| Voice | One bright, confident, conversational narrator; pitch median 205 Hz, animated movement |
| On screen | 100% designed animation and stylized product UI; no live-action presenter or stock footage visible |
| Captions | No speech subtitles; type appears as oversized examples, labels, and UI content |
| Sound | Continuous quiet tonal/music-like bed measured around −29.1 dBFS; no clear cut-synced effects; −13.9 LUFS integrated, −1.6 dBFS true peak |
| Structure | Aspiration → painful workflow → product reveal → creation → role-by-role collaboration → shared outcome → brand end card |
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 / Script templatePro
- Plate 11 / Production planPro
- Plate 12 / PromptsPro
- Plate 13 / Edit recipePro
- Plate 14 / QA checklistPro
- Plate 15 / Make it yoursPro
- Recipe / runnable promptPro