Skip to content
refs
REF-3549Source onlineBlueprint rev 01

Source by Webflow: quiet UI crescendo

A 92-second software launch film that turns a slow icon reveal into rapid UI proof and a spacious brand finish.

Maker @webflowFor WebflowOriginal post ↗
Cut timeline · 25 shots01:32
00:0000:1500:3000:4501:0001:1501:30

Field notes / why it works

The nearly black laptop opening delays the promise until 0:05.8, making the brightening icon and blue mark a visual hook. From 0:11 to 1:19, 24 measured cuts and 11 internal changes connect workspace, approvals, prompts, output variants, publishing, recommendations, and metrics; short black type cards reset attention between dense UI scenes. The final 13.6-second shot gives the product mark room to resolve.

01

Plate 01 / The format in one breath

A cinematic software announcement begins with a physical laptop in darkness, reveals a compact promise and logo, then shows the product through rapid interface close-ups, generated outcomes, a real editor, and agent activity. Sparse full-screen words connect those proofs. A long, quiet logo resolve replaces a spoken call to action.

Why it works

  • The first 3 seconds are nearly black while app icons slowly emerge; the main promise arrives around 0:05.8, making the light reveal itself the hook.
  • The film moves from abstract positioning (0:05–0:11) to visible UI proof (0:12–0:20), then to a workflow and published pages (0:30–1:18).
  • A cool blue pixel mark, black background, ivory pages, and terse white type keep 25 varied shots visually connected; the final 13.6-second shot resolves into the brand.
02

Plate 02 / Format card

Reference
Platform · aspect · lengthX · 16:9 · 92.0 s · 30 fps
Pace25 shots, 24 measured cuts, 15.7–17.0 cuts/min including uncertain changes; 11 internal steps; 22.8 picture changes/min; average shot 3.68 s, median 2.13 s
ScriptNo reliable speech. Two isolated “You” detections conflict with “no speech detected” and the visual evidence; treat this as a text-led film.
VoiceNone established; no narrator or visible speaker addresses camera. A person appears only as a small website image.
On screenApprox. 50% dark product UI and screen composites, 20% light website/editor views, 15% black or blue type/brand cards, 15% filmed laptop and graphic montage (inferred from sheets).
CaptionsNo spoken-word captions; short, centered headline cards and legible UI copy.
SoundContinuous low, tonal, electronic/cinematic bed (inferred); rough detected tempo 83 BPM; −16.4 LUFS integrated, −4.0 dBFS true peak.
StructureObject reveal → premise → capability proof → visible output → new request and measurement → brand close; payoff by 0:38, visual CTA at 1:25–1:32.

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
  1. Plate 03 / The hook, frame by frame (first 8 seconds)Pro
  2. Plate 04 / Structure (beat sheet)Pro
  3. Plate 05 / Shot grammarPro
  4. Plate 06 / Visual style guidePro
  5. Plate 07 / Voice and deliveryPro
  6. Plate 08 / Sound designPro
  7. Plate 09 / PackagingPro
  8. Plate 10 / Script templatePro
  9. Plate 11 / Production planPro
  10. Plate 12 / PromptsPro
  11. Plate 13 / Edit recipePro
  12. Plate 14 / QA checklistPro
  13. Plate 15 / Make it yoursPro
  14. Recipe / runnable promptPro