Motion study

Social Ad Spine

Loading…
Composition20s typicalportrait

Overview

Build the film as Hook → Hero → Proof well → Range → Offer → Lockup. Keep overlap uniform. Reuse the same product-bob and well-frame motifs so the spine reads as one material.

Build

  1. 01

    0–2s Hook: wordmark or badge, one motion.

  2. 02

    2–6s Hero: product push-in, price, bob.

  3. 03

    6–12s Proof: framed video well and/or spec chips.

  4. 04

    12–16s Range: grid, cycle, or montage of variants.

  5. 05

    16–19s Offer: bundle slam.

  6. 06

    19–22s Lockup: mark + URL + one ring or pill.

sequence overlap=0.4s
  Hook  Hero  Well  Range  Offer  Lockup
Example source React / TSX

examples/social-ad-spine.tsx · Uses the catalog’s shared composition helpers.

Loading source…