短影音 是做什麼的？
打造一支能抵抗滑走的 9:16 影片。短影音不是一部小型形象片——它是一台留存機器：一個在最初一秒就贏得觀眾的鉤子，每隔幾秒就重置注意力的模式中斷，以及一個常能讓觀看時間突破 100% 的循環。其精髓在於時機的掌控，而非精緻度。
何時使用
- Reels / TikTok / YouTube Shorts（7–60 秒，9:16 垂直格式）。
- 留存剪輯：修補流失點、加入模式中斷、緊湊節奏。
- 鉤子、無縫循環、可重複使用的短影音模板（一個設計，多個主題）。
故事結構（留存合約）
短影音說故事是與觀眾拇指的一紙合約：每一秒都必須重新贏得下一秒。敘事是從留存曲線反向塑造，而非從開頭順向進行。在觸碰時間軸之前，務必先鎖定這些元素。
- 一支影片只說一件事。 一支短影音只承載一個收尾。第二個想法會分散注意力，使曲線在中段下沉——把它做成另一支影片。如果你無法用一句話說出單一重點，那你還沒準備好要拍短影音。
- 在最初 ~3 秒打開一個鉤子，最後才閉合它。 鉤子提出一個問題或缺口（開放式鉤子）；收尾則回答它。觀眾留下來是因為鉤子是開放的——所以永遠不要過早回答，也永遠不要把收尾埋在鋪陳之下。
- 不留空檔。 每個節拍要不是推進想法，就是重置注意力。剪掉任何兩者都不是的內容。沉默、緩慢的鋪墊、清喉嚨式的開場（「嗨大家，在這支影片裡…」）都是觀眾滑走的原因。
- 為什麼曲線，而非剪輯，才是工作的單位。 演算法會推廣任何能讓每秒留存曲線保持平穩的內容；一個能拉平曲線的「好」剪輯，輸給一個能維持曲線的「醜」剪輯。你是在編輯曲線，而鉤子決定了其後的一切——先修好它。
敘事主軸（鉤子 → 鋪陳 → 主體 → 收尾/循環 的弧線分配如下表）：
| 動作 | 故事任務 | 若未達成則失敗 |
|---|---|---|
| 鉤子 | 打開鉤子；承諾收尾 | 在前 3 秒內被滑走 |
| 緊張感維持 | 在主體部分保持缺口開放 | 中段平淡，中段流失 |
| 收尾 | 閉合鉤子——傳達那唯一的概念 | 「浪費我時間」，沒有分享 |
| 循環 / 行動呼籲 | 回到第 0 幀，或提出一個明確要求 | 沒有重播，沒有行動 |
（留存曲線 表為每個動作分配了秒數；本節是其背後的敘事邏輯與順序。鉤子文法 列出了鉤子的原型。）
驅動一切的單一指標
留存率，而非製作價值。 演算法會推廣能留住觀眾的內容；約 87% 的觀眾在 3 秒內決定留下或滑走，而獲得推廣的門檻約為 70% 以上的平均觀看完成率（Shorts 約 73%，TikTok 約 78%，Reels 約 65%）。以下的每個決策都必須權衡這個曲線。一個在 0:04 讓人感到無聊的完美鏡頭，輸給一個能留住觀眾的粗糙鏡頭。
留存曲線
| 節拍 | 任務 | 預算（以 20 秒短影音為例） |
|---|---|---|
| 鉤子（0–1 秒） | 一幀畫面 + 一句話，創造一個開放式鉤子 | 0–1 秒 |
| 鋪陳 | 回答為什麼要看——承諾、利害關係或缺口 | 1–4 秒 |
| 主體 | 以節拍傳遞價值；每個節拍一個想法 | 4–17 秒 |
| 收尾 / 循環 | 閉合鉤子——或讓它回到第 0 幀 | 17–20 秒 |
調整主體的長度，永遠不要調整鉤子。一支 60 秒的短影音擁有更長的主體和更多節拍——但鉤子依然是同樣的 1 秒。
鉤子文法（前 ~1 秒）
鉤子是一句話加上一個視覺畫面，它會打開一個大腦需要閉合的好奇心缺口。選擇一個模式並堅持使用：
| 鉤子類型 | 形狀 | 最適合 |
|---|---|---|
| 開放式鉤子 | 「你的 X 一直 Y 的原因是…」（答案延後） | 大多數內容 |
| 直接承諾 | 「30 秒內 ___ 的 3 種方法」 | 教育 / 列表式 |
| 模式中斷 | 瞬間縮放 / 甩鏡 / 第一幀視覺錯位 | 娛樂 |
| 否定 | 「別再做 ___」/「你 ___ 錯了」 | 強烈觀點 |
兩個規則：鉤子句子必須在第一幀就以文字顯示在畫面上（85% 的觀眾在靜音狀態觀看），且最引人注目的視覺也必須是第一幀——永遠不要使用緩慢的淡入。保持一個強而有力的開場畫面；不要從黑色畫面淡入。
模式中斷與剪輯節奏
模式中斷是任何能重置注意力的變化：硬切、放大、插入 B-roll、音效、字幕彈出或角度變化。在短影音中，密度必須很高——每 ~2–4 秒一個視覺變化；大約每 4 秒有一個中斷的影片，其留存率約為 58%，而靜態 talking head 則約為 41%。最大的殺手是中段平淡：TikTok 會在觀看曲線變平時限制推廣，所以永遠不要用低能量的鏡頭來拼接主體。
// 每個中斷都由幀數驅動，而非現實時間——確保渲染結果的確定性。
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);
變化間隔——規律的節拍聽起來像無聊；不均勻的剪輯則帶來動感。推近式縮放是最便宜、且不需要新素材的中斷方式：
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>;
};
字幕
大多數觀眾在靜音狀態下觀看，因此螢幕上的字幕是不可或缺的——它們承載內容，並在每個詞組彈出時，同時作為模式中斷。每行保持 4–7 個詞，高對比度，並放在安全區內。請勿在此重新實作字幕動畫——請使用 caption-animation 技能來進行逐字計時、卡拉 OK 高亮和樣式設定；此技能僅負責將字幕置於留存時間線和 9:16 安全區內。
循環與重播
無縫循環將每一次重播都計為新的觀看時間——一個乾淨的 8 秒循環被觀看 3 次，等於 300% 的觀看完成率，這是最強的信號。兩種技巧：讓最後一幀與第一幀匹配（相同的構圖、位置、顏色），使剪輯隱形；並撰寫一個句子循環——將鉤子設計成收尾可以回饋到第 0 幀（「…這就是為什麼我從不——」→ 循環到開頭）。最適合重播的長度約為 7–15 秒。
9:16 安全區
在通用安全區內構圖，以確保平台 UI 永遠不會遮蓋文字或臉部。
| 區域 | 像素（1080×1920） | 避免 |
|---|---|---|
| 通用安全區（所有平台） | 中心 900×1400 | 任何關鍵元素都在其外部 |
| 頂部 | 保持 ~120px 淨空 | 個人資料 / 聲音 UI |
| 底部 | 保持 ~320px 淨空 | 字幕、行動呼籲、主題標籤、音頻條 |
| 右側 | 保持 ~120px 淨空 | 按讚 / 留言 / 分享欄 |
將鉤子文字和關鍵主體放在中心 900×1400 的方框內。預留底部 ~320px，即使在編輯器中看起來是空的——那是平台繪製其自身字幕和按鈕的地方。
產出檢查清單
- 鉤子句子在第一幀就以文字顯示在畫面上；最強的視覺是第一個畫面（無淡入）。
- 一個開放式鉤子 / 承諾在前 ~4 秒內設定完成。
- 每 ~2–4 秒有一個視覺模式中斷；間隔不均勻；沒有平淡的中段。
- 字幕存在（透過
caption-animation），每行 4–7 個詞，在安全區內。 - 循環閉合——首尾幀匹配，或一句能回饋到第 0 幀的句子。
- 構圖在中心 900×1400 的方框內；底部 320px / 頂部 120px / 右側 120px 保持淨空。
- 所有動畫值皆從
useCurrentFrame()衍生——無 CSS / 計時器。
交付與驗證（渲染靜態幀 → MP4）
打包好的輔助工具（
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（<Composition> + zod schema + defaultProps）的形式交付——每個剪輯、推近和中斷都由 useCurrentFrame() 驅動，從不使用 Date.now() / Math.random() / 計時器。可交付成果 = out/*.mp4 + 專案（每次主題重新渲染）。預設為 9:16 垂直（1080×1920）。
驗證循環——渲染靜態幀 → 檢查 → 編碼。 三幀畫面測試三個決定成敗的因素：鉤子、節奏和循環接縫。
# 鉤子 / 主體中間 / 最後一幀的靜態畫面——使用實際主題的 props（非預設值）
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
# 檢查每個 PNG：
# - 鉤子畫面（約第 0 幀 / 前 3 秒）：鉤子句子是螢幕上的文字，且能立即讀取；最強的視覺已經出現（無淡入）
# - 循環接縫：比較 f-hook（第 0 幀）與 f-end（最後一幀）——構圖/位置/顏色必須相同，以實現隱形循環剪輯
# - 9:16 安全區：鉤子 + 關鍵主體在中心 900x1400 方框內；遠離頂部 ~12%、底部 ~20-35%（字幕/行動呼籲/音頻）、右側操作欄
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，以選取中間和最後的幀。
在完成之前：
- 靜態幀在鉤子、中間和最後一幀都能乾淨渲染——沒有錯誤。
- 鉤子畫面能立即讀取（螢幕上的文字 + 最強的視覺在前方，無淡入）；第一幀與最後一幀匹配，以實現乾淨的循環接縫。
- 在檢查的每個幀中，鉤子 + 主體 + 字幕都位於 9:16 中心 900×1400 的安全框內。
- 僅由幀驅動——沒有
Date.now()/Math.random()/ 計時器；剪輯不均勻，無平淡中段。 - 使用實際主題的 props（而非
defaultProps）能正確渲染；MP4 已編碼，GIF 可選。
參考檔案
references/retention-pacing.md——一個完整可執行的 Remotion<Short>composition：包含幀驅動的鏡頭排程器、不均勻剪輯、PunchIn 模式中斷、螢幕上的鉤子、9:16 安全區疊加層，以及無縫的首尾幀循環。此外還有鉤子模式庫、留存曲線除錯方法、各平台安全區映射圖，以及模板×主題的批次渲染模式。