short-form-video

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Short-Form Video

竖版短视频（Short-Form Video）

Engineer a 9:16 video that survives the swipe. Short-form is not a small launch film — it is a retention machine: a hook that earns the first second, pattern interrupts that reset attention every few seconds, and often a loop that buys watch-time past 100%. The craft is timing, not polish.

打造一条能让用户停留的9:16竖版视频。竖版短视频并非小型发布预热视频——它是一个留存引擎：一个能赢得第一秒注意力的hook，每隔几秒重置用户注意力的pattern interrupts，以及通常能让观看时长超过100%的loop。核心在于节奏把控，而非制作精度。

When to use

使用场景

Reels / TikTok / YouTube Shorts (7–60s, vertical 9:16).
Retention editing: fixing drop-off, adding pattern interrupts, tightening pacing.
Hooks, seamless loops, repeatable short-form templates (one design, many topics).

Reels / TikTok / YouTube Shorts（7–60秒，9:16竖版）。
留存率优化剪辑：解决用户流失问题、添加pattern interrupts、收紧节奏。
Hooks、无缝loop、可复用短视频模板（一套设计适配多个主题）。

Story structure (the retention contract)

故事结构（留存契约）

Short-form storytelling is a contract with the viewer's thumb: every second must re-earn the next one. The narrative is shaped backwards from the retention curve, not forwards from an intro. Lock these before touching the timeline.

One idea per video. A short carries exactly one payoff. A second idea splits attention and the curve sags in the middle — make it a second video instead. If you can't name the single takeaway in a sentence, you don't have a short yet.
Open a loop in the first ~3s, close it last. The hook poses a question or gap (the open loop); the payoff answers it. The viewer stays because the loop is open — so never answer it early, and never bury the payoff under setup.
No dead air. Every beat either advances the idea or resets attention. Cut anything that does neither. Silence, slow ramps, throat-clearing intros ("hey guys, in this video…") are where viewers swipe.
Why the curve, not the cut, is the unit of work. The algorithm distributes whatever holds the per-second retention curve flat; a "good" edit that flattens the curve loses to an ugly one that keeps it up. You are editing the curve, and the hook gates everything after it — fix it first.

The narrative spine (the

Hook → Setup → Body → Payoff/loop

arc is budgeted in the table below):

Move	Story job	Failure if missed
Hook	Open the loop; promise the payoff	Swipe in first 3s
Tension hold	Keep the gap open through the body	Flat middle, mid-drop
Payoff	Close the loop — the one idea, delivered	"Wasted my time," no share
Loop / CTA	Feed back to frame 0, or one clear ask	No re-watch, no action

(

The retention arc

table below assigns seconds to each move; this section is the narrative logic and ordering behind it.

Hook grammar

lists the hook archetypes.)

竖版短视频叙事是与用户的手指达成的契约：每一秒都要重新赢得用户的停留。叙事逻辑应从留存曲线倒推，而非从开头顺推。在开始剪辑前先确定这些规则：

每条视频仅聚焦一个核心观点。一条短视频只能有一个核心价值点。第二个观点会分散用户注意力，导致留存曲线在中段下滑——不如做成第二条视频。如果你无法用一句话概括核心要点，说明你还没准备好制作这条短视频。
在前约3秒打开一个loop，最后再闭合。Hook提出一个问题或制造信息缺口（即打开的loop）；核心价值点则用来填补这个缺口。用户会因为loop未闭合而停留——所以绝不要提前给出答案，也不要把核心价值点埋在铺垫内容之下。
无冗余内容。每一个环节要么推进核心观点，要么重置用户注意力。删掉任何不符合这两点的内容。沉默、缓慢的开场、铺垫式介绍（比如“嘿大家，在这条视频里…”）都是用户划走的高发点。
为何留存曲线而非剪辑是核心工作单元。算法会推广那些能维持稳定每秒留存率的内容；一条“精良”但拉低留存曲线的剪辑，不如一条粗糙但能维持高留存的剪辑。你正在剪辑的是留存曲线，而hook决定了后续所有内容的效果——先优化hook。

叙事框架（

Hook → Setup → Body → Payoff/loop

流程的时间分配如下表）：

环节	叙事作用	未达标后果
Hook	打开loop；承诺核心价值	用户前3秒就划走
张力维持	在主体内容中保持信息缺口开放	中段留存率下滑，用户中途离开
核心价值交付	闭合loop——传递唯一核心观点	用户觉得“浪费时间”，不会分享
Loop / 行动号召（CTA）	回到第0帧，或给出明确行动指令	无重复观看，无用户行动

（下方的「留存曲线」表格为每个环节分配了时长；本节是背后的叙事逻辑与顺序。「Hook语法」列出了Hook的典型类型。）

The one metric that drives everything

驱动一切的核心指标

Retention, not production value. The algorithm distributes whatever holds viewers; ~87% decide to stay or swipe inside 3 seconds, and the threshold for distribution sits near 70%+ average view-through (Shorts ~73%, TikTok ~78%, Reels ~65%). Every decision below trades against that curve. A flawless shot that bores at 0:04 loses to an ugly one that holds.

留存率，而非制作水准。算法会推广那些能留住用户的内容；约87%的用户会在3秒内决定停留或划走，而获得算法推荐的门槛是平均完播率70%+（Shorts约73%，TikTok约78%，Reels约65%）。以下所有决策都要围绕这条曲线权衡。一个在第4秒就让用户感到无聊的完美镜头，不如一个能留住用户的粗糙镜头。

The retention arc

留存曲线

Beat	Job	Budget (of a 20s short)
Hook (0–1s)	One frame + one line that creates an open loop	0–1s
Setup	Pay off why watch — promise, stakes, or the gap	1–4s
Body	Deliver value in beats; one idea per beat	4–17s
Payoff / loop	Close the loop — or feed it back to frame 0	17–20s

Scale the body, never the hook. A 60s short has a longer body and more beats — the same 1-second hook.

环节	作用	20秒短视频的时长分配
Hook（0–1秒）	一帧画面+一句话制造开放的信息缺口	0–1秒
铺垫	说明「为何值得观看」——承诺、悬念或信息缺口	1–4秒
主体	分模块传递价值；每个模块聚焦一个子观点	4–17秒
核心价值交付 / Loop	闭合loop——或回到第0帧	17–20秒

延长主体部分的时长，绝不要延长Hook。一条60秒的短视频主体更长、包含更多模块——但Hook仍只需1秒。

Hook grammar (first ~1s)

Hook语法（前约1秒）

The hook is a sentence + a visual that opens a curiosity gap the brain needs closed. Pick one pattern and commit:

Hook type	Shape	Best for
Open loop	"The reason your X keeps Y…" (answer delayed)	most content
Direct promise	"3 ways to ___ in 30 seconds"	educational / listicle
Pattern interrupt	snap-zoom / whip-pan / visual mismatch in frame 1	entertainment
Negation	"Stop doing ___" / "You're ___ wrong"	strong opinions

Two rules: the hook line is on-screen as text by frame 1 (85% watch muted), and the most striking visual is also the first frame — never a slow ramp-in. Hold a strong opening frame; do not fade up from black.

Hook是一句话+一个视觉画面，制造大脑想要填补的好奇心缺口。选择一种模式并坚持：

Hook类型	结构	适用场景
Open loop	“你的X一直Y的原因是…”（延迟给出答案）	大多数内容
Direct promise	“30秒内学会___的3种方法”	教育类/清单类内容
Pattern interrupt	第一帧就用快速缩放/甩镜/视觉错位	娱乐类内容
Negation	“别再做___” / “你的___方法错了”	观点鲜明的内容

两条规则：Hook的文字内容必须在第1帧就显示在屏幕上（85%的用户静音观看），同时最吸睛的视觉元素也要放在第一帧——绝不要缓慢开场。保持第一帧画面冲击力；不要从黑屏淡入。

Pattern interrupts & cut rhythm

Pattern Interrupts与剪辑节奏

A pattern interrupt is any change that resets attention: a hard cut, zoom punch, b-roll insert, sound effect, caption pop, or angle change. In short-form, density is high — a visual change every ~2–4 seconds; videos with an interrupt roughly every 4s hold ~58% vs ~41% for a static talking head. The killer is a flat middle: TikTok throttles distribution when the watch-through curve flattens, so never stitch the body from low-energy takes.

// Drive every interrupt off the FRAME, not wall-clock — renders deterministically.
import { useCurrentFrame } from "remotion";
const fps = 30;
const cuts = [0, 1.2, 3.0, 5.4, 8.0, 11.2, 14.0]; // seconds — uneven on purpose
const frame = useCurrentFrame();
const shot = cuts.findIndex((t, i) => frame < (cuts[i + 1] ?? Infinity) * fps);

Vary the interval — a metronome reads as boredom; uneven cuts read as momentum. A punch-in zoom is the cheapest interrupt that needs no new footage:

jsx

import { useCurrentFrame, interpolate, spring, useVideoConfig } from "remotion";
const PunchIn = ({ at, children }) => {
  const frame = useCurrentFrame(); const { fps } = useVideoConfig();
  const s = spring({ frame: frame - at * fps, fps, config: { damping: 12, stiffness: 200 } });
  const scale = interpolate(s, [0, 1], [1, 1.12]); // snap to 112% on the beat
  return <div style={{ transform: `scale(${scale})`, transformOrigin: "50% 45%" }}>{children}</div>;
};

Pattern interrupt是任何能重置用户注意力的变化：硬切、缩放冲击、插入B-roll、音效、字幕弹出或角度变化。竖版短视频的密度要高——每2–4秒就有一次视觉变化；每约4秒有一次interrupt的视频留存率约为58%，而静态镜头的留存率仅约41%。最致命的是中段平淡：当完播率曲线趋于平缓时，TikTok会限制推荐，所以绝不要用低能量的素材拼接主体内容。

// 基于帧而非时钟驱动所有interrupt——确保渲染结果确定。
import { useCurrentFrame } from "remotion";
const fps = 30;
const cuts = [0, 1.2, 3.0, 5.4, 8.0, 11.2, 14.0]; // 秒数——故意设置不均匀
const frame = useCurrentFrame();
const shot = cuts.findIndex((t, i) => frame < (cuts[i + 1] ?? Infinity) * fps);

变化间隔要多样化——匀速剪辑会显得无聊；不均匀的剪辑会营造出节奏感。缩放冲击是无需新素材的低成本interrupt：

jsx

import { useCurrentFrame, interpolate, spring, useVideoConfig } from "remotion";
const PunchIn = ({ at, children }) => {
  const frame = useCurrentFrame(); const { fps } = useVideoConfig();
  const s = spring({ frame: frame - at * fps, fps, config: { damping: 12, stiffness: 200 } });
  const scale = interpolate(s, [0, 1], [1, 1.12]); // 在节点处快速缩放到112%
  return <div style={{ transform: `scale(${scale})`, transformOrigin: "50% 45%" }}>{children}</div>;
};

Captions

字幕

Most viewers watch muted, so on-screen captions are not optional — they carry the content and double as a pattern interrupt when each phrase pops in. Keep 4–7 words per line, high contrast, inside the safe area. Do not re-implement caption animation here — use the

caption-animation

skill for word-by-word timing, karaoke highlight, and styling; this skill only places captions on the retention timeline and inside the 9:16 safe zone.

大多数用户静音观看，所以屏幕字幕是必备项——它们承载内容，同时每段字幕弹出时也能作为pattern interrupt。每行保留4–7个单词，高对比度，放在安全区域内。不要在此处重新实现字幕动画——使用

caption-animation

技能来实现逐词计时、卡拉高亮和样式设置；本技能仅负责将字幕放在符合留存逻辑的时间轴上，并置于9:16安全区域内。

Loops & re-watch

Loops与重复观看

A seamless loop counts each re-watch as fresh watch-time — a clean 8s loop watched 3× is 300% view-through, the strongest possible signal. Two techniques: match the last frame to the first (same composition, position, color) so the cut is invisible, and write a sentence loop — phrase the hook so the payoff feeds back into frame 0 ("…and that's why I never — " → loops to the start). Best length for re-watch is ~7–15s.

无缝loop会将每次重复观看计为新的观看时长——一个流畅的8秒视频被观看3次，完播率就是300%，这是最强的算法信号。两种实现技巧：最后一帧与第一帧匹配（相同构图、位置、颜色），让剪辑无缝衔接；以及撰写循环语句——让Hook的表述能让核心价值点自然衔接回第0帧（比如“…这就是我从不——” → 回到开头）。最适合重复观看的时长约为7–15秒。

9:16 safe areas

9:16安全区域

Compose inside the universal safe zone so platform UI never covers text or faces.

Zone	Pixels (1080×1920)	Avoid
Universal safe (all platforms)	center 900×1400	anything critical outside it
Top	keep clear ~120px	profile / sound UI
Bottom	keep clear ~320px	captions, CTA, hashtags, audio bar
Right	keep clear ~120px	like / comment / share rail

Put the hook text and key subject in the center 900×1400 box. Reserve the bottom ~320px even if it looks empty in the editor — that is where the platform paints its own captions and buttons.

在通用安全区域内进行构图，避免平台UI遮挡文字或人脸。

区域	像素尺寸（1080×1920）	注意事项
通用安全区（全平台）	中央900×1400	重要内容绝不要放在区域外
顶部	预留约120px空白	避免被头像/声音UI遮挡
底部	预留约320px空白	避免被字幕、CTA、话题标签、音频栏遮挡
右侧	预留约120px空白	避免被点赞/评论/分享栏遮挡

将Hook文字和核心主体放在中央900×1400区域内。即使编辑器里底部约320px看起来是空的也要预留——平台会在此处显示自带的字幕和按钮。

Output checklist

输出检查清单

Hook line is on-screen text by frame 1; strongest visual is the first frame (no fade-up).
One open loop / promise set in the first ~4s.
A visual pattern interrupt every ~2–4s; intervals uneven; no flat middle.
Captions present (via
```
caption-animation
```
), 4–7 words, inside safe area.
Loop closed — matched first/last frame or a sentence that feeds frame 0.
Composed inside the 900×1400 center box; bottom 320px / top 120px / right 120px kept clear.
Every animated value derived from
```
useCurrentFrame()
```
— no CSS/library timers.

Hook文字在第1帧就显示在屏幕上；最吸睛的视觉元素是第一帧（无淡入）。
在前约4秒设置一个开放的loop / 承诺。
每约2–4秒有一次视觉pattern interrupt；间隔不均匀；无中段平淡。
包含字幕（通过
```
caption-animation
```
实现），每行4–7个单词，位于安全区域内。
Loop闭合——第一帧与最后一帧匹配，或语句能衔接回第0帧。
在中央900×1400区域内构图；底部320px / 顶部120px / 右侧120px保持空白。
所有动画值均来自
```
useCurrentFrame()
```
——无CSS/库定时器。

Deliver & verify (rendered stills → MP4)

交付与验证（渲染静帧→MP4）

Packaged helper (
scripts/
): tile your stills with
scripts/contact-sheet.sh sheet.png f-hook.png f-mid.png f-end.png
, then assert the encode with
scripts/probe-mp4.sh out.mp4 [WxH] [fps]
. See
scripts/README.md
.

The short ships as a Remotion composition (

<Composition>

+ zod

schema

defaultProps

) — every cut, punch-in, and interrupt driven by

useCurrentFrame()

, never

Date.now()

Math.random()

/ timers. Deliverable =

out/*.mp4

+ the project (re-render per topic). 9:16 vertical (1080×1920) is the default.

Verify loop — render stills → inspect → encode. Three frames test the three things that make or break retention: the hook, the pacing, and the loop seam.

bash

undefined

打包工具（
scripts/
目录）：使用
scripts/contact-sheet.sh sheet.png f-hook.png f-mid.png f-end.png
将静帧拼接成预览图，然后使用
scripts/probe-mp4.sh out.mp4 [WxH] [fps]
验证编码。详见
scripts/README.md
。

短视频以Remotion组件（

<Composition>

+ zod

schema

defaultProps

）交付——所有剪辑、缩放冲击和interrupt均由

useCurrentFrame()

驱动，绝不要使用

Date.now()

Math.random()

/ 定时器。交付物 =

out/*.mp4

+ 项目文件（可针对不同主题重新渲染）。默认尺寸为9:16竖版（1080×1920）。

验证Loop——渲染静帧→检查→编码。三帧测试决定留存率的三个关键因素：Hook、节奏和Loop衔接处。

bash

undefined

Stills at hook / mid-body / last frame — WITH SHIPPED PROPS (the real topic, not defaults)

渲染Hook / 主体中段 / 最后一帧的静帧——使用实际交付的Props（真实主题，而非默认值）

npx remotion still Short out/f-hook.png --frame=10 --props='{"topic":"...","hook":"..."}' # ~first 3s reads instantly npx remotion still Short out/f-mid.png --frame=N --props='{"topic":"...","hook":"..."}' npx remotion still Short out/f-end.png --frame=L --props='{"topic":"...","hook":"..."}' # L = durationInFrames-1

npx remotion still Short out/f-hook.png --frame=10 --props='{"topic":"...","hook":"..."}' # 前3秒内容一目了然 npx remotion still Short out/f-mid.png --frame=N --props='{"topic":"...","hook":"..."}' npx remotion still Short out/f-end.png --frame=L --props='{"topic":"...","hook":"..."}' # L = durationInFrames-1

Inspect each PNG:

检查每张PNG：

- HOOK frame (~frame 0-ish / first 3s): hook line is on-screen text and reads instantly; strongest visual already up (no fade-up)

- HOOK帧（约第0帧 / 前3秒）：Hook文字显示在屏幕上且一目了然；最吸睛的视觉元素已呈现（无淡入）

- LOOP seam: compare f-hook(frame 0) vs f-end(last frame) — same composition/position/color for an invisible loop cut

- Loop衔接处：对比f-hook(第0帧)与f-end(最后一帧)——构图/位置/颜色一致，实现无缝剪辑

- 9:16 safe area: hook + key subject inside the center 900x1400 box; clear of top ~12%, bottom ~20-35% (captions/CTA/audio), right action rail

- 9:16安全区域：Hook + 核心主体位于中央900x1400区域内；避开顶部约12%、底部约20-35%（字幕/CTA/音频）、右侧操作栏

npx remotion render Short out/short.mp4 --props='{"topic":"...","hook":"..."}' # encode once stills verify npx remotion render Short out/demo.gif --codec=gif # README proof clip


**Per topic / batch**: verify ONE topic via stills *before* rendering all of them. Use `npx remotion compositions` for `durationInFrames`/`fps` to pick the mid + last frames.

**Before you finish:**
1. Stills render cleanly at the hook, mid, and last frame — no errors.
2. The hook frame reads instantly (on-screen text + strongest visual up front, no fade-up); first vs last frame match for a clean loop seam.
3. Hook + subject + captions sit inside the 9:16 center 900×1400 safe box at every checked frame.
4. Frame-driven only — no `Date.now()` / `Math.random()` / timers; cuts uneven, no flat middle.
5. A real topic's shipped props (not `defaultProps`) render correctly; MP4 encoded, GIF optional.

npx remotion render Short out/short.mp4 --props='{"topic":"...","hook":"..."}' # 静帧验证通过后再编码 npx remotion render Short out/demo.gif --codec=gif # README演示动图


**按主题/批量处理**：在渲染所有主题前，先验证一个主题的静帧。使用`npx remotion compositions`获取`durationInFrames`/`fps`来选择中段和最后一帧。

**完成前检查**：
1. Hook、中段和最后一帧的静帧渲染正常——无错误。
2. Hook帧内容一目了然（屏幕文字+吸睛视觉前置，无淡入）；第一帧与最后一帧匹配，实现流畅的Loop衔接。
3. Hook + 主体 + 字幕在所有检查帧中均位于9:16中央900×1400安全区域内。
4. 仅基于帧驱动——无`Date.now()` / `Math.random()` / 定时器；剪辑间隔不均匀，无中段平淡。
5. 真实主题的交付Props（而非`defaultProps`）渲染正确；MP4已编码，GIF可选。

Reference files

参考文件

```
references/retention-pacing.md
```
— a complete runnable Remotion
```
<Short>
```
composition: a frame-driven shot scheduler with uneven cuts, the PunchIn pattern interrupt, an on-screen hook, a 9:16 safe-area overlay, and a seamless first/last-frame loop. Plus a hook-pattern library, a retention-curve debugging method, per-platform safe-zone maps, and the template×topic batch-render pattern.

```
references/retention-pacing.md
```
——一个可运行的完整Remotion
```
<Short>
```
组件：基于帧的镜头调度器，包含不均匀剪辑、PunchIn pattern interrupt、屏幕Hook、9:16安全区域 overlay、无缝首尾帧Loop。此外还有Hook模式库、留存曲线调试方法、各平台安全区域地图，以及模板×主题批量渲染模式。