Short-form video
TikTok, YouTube Shorts, and Instagram Reels — one 9:16 master, three platforms. A short lives or dies in the first ~1.5 seconds and earns its distribution on completion rate, so the system is a protocol, not a vibe. This page is the spec sheet and the workflow: how to harvest a vertical from an existing Pierce explainer, the four-pass edit, the vertical cover, and the Remotion composition that proves it. The full methodology lives in the pierce-shorts skill.
The 9:16 master
Export one clean master and post it to all three platforms. Never upload a file with another platform's watermark — a TikTok watermark is demoted on Reels and Shorts.
| Spec | Value |
|---|---|
| Aspect / size | 9:16 vertical, 1080 × 1920 |
| Frame rate | 30 fps (60 for high-motion) |
| Codec / audio | H.264 MP4, ~10–15 Mbps floor · AAC 48 kHz, mixed for phone speakers |
| Length | 15–34 s is the sweet spot; hard-favor ≤ 60 s. If it runs 61–75 s, cut to 60. |
| Captions | Always burned in — social plays muted. |
Safe zones
Platform UI overlays the video. Text and critical action must stay inside the safe canvas or the app's own chrome covers it. Design to the tightest platform and every platform misses your type.
| Zone | Keep clear | What lives there |
|---|---|---|
| Top band | top ~120 px (~6%) | Series eyebrow can sit just below, ~150 px down. |
| Right rail | right ~180 px | Like / comment / share buttons. Center your type to clear it. |
| Bottom band | bottom ~330 px (15–20%) | Username, caption, sound. Nothing readable here. |
| Safe canvas | center ~75% wide, ~12–78% tall | Headline layer upper-middle; caption layer at/just below center. |
video/productions/<slug>/production.json.The four-pass edit
The prime directive: nothing before the hook, nothing after the payoff. The most common failure is 2 seconds of on-ramp at the head and 3 seconds of fade at the tail — both get cut to zero.
| Pass | The rule for Pierce shorts |
|---|---|
| 1 · Hook frame | Frame zero is designed, not found. The ≤6-word gold/cream headline is on screen at frame zero (it doubles as the profile-grid cover). First spoken syllable within ~0.3 s. One motion in frame one — a slow push-in counts. |
| 2 · Density & cadence | A visual change every beat — new shot, punch-in, numeral pop, or caption swap (a caption change IS a cut). Gaps between sentences ≤ 2–3 frames. If it runs long, cut content, not pace. |
| 3 · Caption system | Two layers: HEADLINE (the hook line, key numbers — big Cormorant, gold punch word) and CAPTION (spoken words, Newsreader, ≤ 5 per page, active word in gold). Word sync within ±2 frames. Numbers on screen verbatim ("90 DAYS"). |
| 4 · Sound, loop, QC | VO unmissable on a phone speaker > SFX > music bed. QC muted (works on captions alone?), then audio-only (VO carries it?), then check safe zones and zero dead frames head and tail. |
Harvest mode — long-form → shorts
The reviewed long-form records under video/productions/ are the source. A short is not a compressed explainer — it selects one payoff and rebuilds around it. Every explainer ships with exactly five distinct shorts in the same production record.
| Step | Action |
|---|---|
| 1 · Select by payoff | Scan the explainer for the strongest self-contained moment — a reveal, the one stat, the sharpest 20 seconds. Not "the topic," the payoff. |
| 2 · Decapitation test | The clip must work with zero long-form context. The explainer's slow lead-in is never the hook — write a new 3-second cold hook that frames the payoff. |
| 3 · Re-frame to vertical | Rebuild at 1080 × 1920 — don't letterbox a 16:9 crop. Reuse the assets and VO; recompose type and photo for the tall frame and safe zones. |
| 4 · Re-edit to a beat map | Run Passes 1–4. A raw clip with captions slapped on is detectable and performs like it. |
| 5 · Route honestly | Point to the full explainer only when this payoff genuinely makes it desirable. Pinned comment / caption is the routing tool. |
Short-form authoring
This is the writing-only direction supplied to TimDS authoring clients. The executable video contract supplies current limits and the compiler owns visual production decisions.
| Part | Writing rule |
|---|---|
| Answer | Answer one exact, self-contained legal question. Lead with the useful answer; do not repeat the question or add an on-ramp. |
| Beats | Give each spoken paragraph one clear idea and order the ideas so the answer works without long-form context. |
| Summaries | Write a complete standalone micro-headline within the executable contract's current word limit. Never truncate a clause or end on an article, conjunction, preposition, or possessive. |
| Boundary | Supply spoken answer content and semantic roles only. TimDS owns role eyebrows, CTA copy, covers, footage, timing, captions, safe zones, and layout. |
The vertical cover
TikTok uses frame zero as the profile-grid cover unless you pick one; Reels and Shorts let you choose. Either way, design a cover — it's a micro-thumbnail for the grid. Same rules as the YouTube cover system, re-flowed for 9:16: expressive scrimmed photo, ≤6-word gold/cream hook, the series eyebrow and lozenge, and the gold PL — compact lockup as the signing mark.
| Property | Spec |
|---|---|
| Canvas | 1080 × 1920, matches the video so frame zero can double as the cover. |
| Type block | Vertically centered (not bottom — the grid crops it). Headline 2–6 words, gold punch word. |
| Kicker font & size | Inter, 600 weight, ~26px, uppercase, letter-spaced ~7px, top-center — matches the rendered TheNameShortCover component. |
| Headline font & size | Cormorant Garamond, 600 weight, ~168px cap height (~15% of the 1080px frame width), line-height 1.0, max 2 lines, centered. |
| Optional subheadline | Newsreader, italic, ~46px, cream, one line — a quiet second beat under the headline (e.g. the stakes detail). |
| Brand mark | The gold PL — compact lockup (the horizontal PIERCE LAW wordmark, pl-logo-yellow.svg), ~480px wide (~44% of the 1080 frame — 1.5× the YouTube cover's signature, since a vertical grid tile crops smaller), ~92% opacity, bottom-left. Bigger and bolder than the 16:9 cover on purpose: it has to survive the profile-grid crop. Never AI-generate it — stamp the real asset in code. |
| Rendered in code | The TheNameShortCover composition renders a one-frame poster: npx remotion still TheNameShortCover out/cover.png. |
TheNameShortCover still just adds a fuller subtitle for grid browsing.ChatGPT Images prompt — for a cover made outside Remotion (a still to hand-pick as the TikTok/Reels upload cover). Emotion table and hook formulas are the same ones on Thumbnails — only the layout changes from a side-split to a full-bleed vertical:
Design a 9:16, 1080 x 1920 vertical cover for a short-form law-firm video
(TikTok / YouTube Shorts / Instagram Reels).
PHOTO (full bleed): Warm documentary editorial photograph of {SUBJECT},
showing {EXPRESSION}. Natural golden-hour light, shallow depth of field,
muted heritage palette — deep navy, cream, warm gold. Genuine and
dignified, no posed stock smile. Photorealistic, fills the entire frame.
SCRIM: a deep navy (#0A1729) scrim over the whole photo at ~70% opacity,
slightly heavier toward the bottom third, so text stays legible and the
platform UI band at the very bottom stays uncluttered.
TEXT (vertically centered, safe inside the middle ~75% of the width and
12–78% of the height — clear of the top ~120px and bottom ~330px):
• Kicker, top-center: "{KICKER}" — Inter, 600 weight, ~26px, uppercase,
letter-spaced (~7px tracking), gold #C2A15A, with a small 45°-rotated
gold square to its left.
• Headline, centered, stacked up to 2 lines: "{HEADLINE}" — Cormorant
Garamond, 600 weight, ~168px cap height (about 15% of the frame
width), line-height 1.0, cream #F4EFE4 with the punch phrase in gold
#C2A15A.
• Optional subheadline below the headline, one line: "{SUBHEAD}" —
Newsreader, italic, ~46px, cream.
STYLE: flat gold as ink (no gradients, glows, or metallic sheen), sharp
corners, heritage law-firm restraint. No logos, no platform UI mockups,
no other text. Worked example — probate-the-name-v2.mp4 → the short's cover — same fields as the YouTube worked example, reformatted full-bleed:
| Field | Value |
|---|---|
{SUBJECT} | an older widow at a kitchen table, a folded letter and a framed photo in front of her |
{EXPRESSION} | quiet grief — looking down and away, eyes glassy, one hand resting near the photo |
{KICKER} | PROBATE, PLAINLY |
{HEADLINE} | Their name doesn't die. |
{SUBHEAD} | The 90-day deadline nobody warns you about. |
Design a 9:16, 1080 x 1920 vertical cover for a short-form law-firm video
(TikTok / YouTube Shorts / Instagram Reels).
PHOTO (full bleed): Warm documentary editorial photograph of an older
widow at a kitchen table, a folded letter and a framed photo in front of
her, showing quiet grief — looking down and away, eyes glassy, one hand
resting near the photo. Natural golden-hour light, shallow depth of
field, muted heritage palette — deep navy, cream, warm gold. Genuine and
dignified, no posed stock smile. Photorealistic, fills the entire frame.
SCRIM: a deep navy (#0A1729) scrim over the whole photo at ~70% opacity,
slightly heavier toward the bottom third, so text stays legible and the
platform UI band at the very bottom stays uncluttered.
TEXT (vertically centered, safe inside the middle ~75% of the width and
12–78% of the height — clear of the top ~120px and bottom ~330px):
• Kicker, top-center: "PROBATE, PLAINLY" — Inter, 600 weight, ~26px,
uppercase, letter-spaced (~7px tracking), gold #C2A15A, with a small
45°-rotated gold square to its left.
• Headline, centered, stacked 2 lines: "Their name doesn't die." —
Cormorant Garamond, 600 weight, ~168px cap height (about 15% of the
frame width), line-height 1.0, cream #F4EFE4 with "doesn't die." in
gold #C2A15A.
• Subheadline below the headline, one line, italic: "The 90-day
deadline nobody warns you about." — Newsreader, italic, ~46px, cream.
STYLE: flat gold as ink (no gradients, glows, or metallic sheen), sharp
corners, heritage law-firm restraint. No logos, no platform UI mockups,
no other text. TheNameShortCover composition actually uses the elder-hands photo (hands only, no face) rather than the widow-at-the-table concept above — both are valid; this prompt gives the face-forward variant for parity with the YouTube cover's click-through concept. Pick one per video and keep it consistent across the cover and any thumbnail grid.The pierce-shorts skill
The full generation methodology is packaged as an agent skill at .claude/skills/pierce-shorts/. It adapts the frontier short-form editing protocol to this repo — the four passes, harvest mode, vertical safe zones, cover creation, and the Remotion pipeline — so an agent (or a teammate) can turn an explainer in out/ into a platform-ready vertical without re-deriving the rules. This is Stage 5 of the Video Pipeline — the explainer it harvests from is the output of Stage 4.
| File | What it holds |
|---|---|
SKILL.md | The protocol: prime directive, four passes, harvest mode, cover creation, Pierce brand + Remotion specifics. |
references/platform-specs.md | TikTok / Shorts / Reels deltas — lengths, safe zones, watermark rules, publishing notes. |
Do & don't
- Harvest one payoff per short and write a fresh cold hook for it.
- Put the hook headline on screen at frame zero — it's also the cover.
- Keep every readable element inside the safe canvas; center type.
- Burn in word-timed captions; assume the sound is off.
- Export one clean master for all three platforms.
- Don't compress a whole explainer into 60 seconds — it fails.
- Don't letterbox a 16:9 crop; rebuild for the tall frame.
- Don't put readable text in the bottom ~330 px or under the right rail.
- Don't cross-post a watermarked file; export a clean master.
- Don't add a "follow for more" end shot that breaks the loop.