Launch video

製作一支如同小型動畫工作室水準的產品發表影片。首先決定影片的目標，並逐拍規劃內容。接著用程式碼構建每個影格，讓任何部分都能在幾分鐘內修改並重新渲染。

最終成果是一部關於真實產品的短片：其 UI 以 HTML 重建，在節奏網格上移動，配合音樂剪輯，以 60 fps 呈現並帶有動態模糊。

前置需求

Node 18+、含 libx264 的 ffmpeg、Python 3.9+。Python 腳本僅使用標準函式庫。
在影片資料夾中安裝 Playwright 與 Chromium：npm i -D playwright && npx playwright install chromium。
此技能目錄下的 scripts/ 與 assets/template.html。

在指令中，$SKILL 代表此技能的資料夾（例如 ~/.claude/skills/launch-video）。在 shell 中設定一次：SKILL=~/.claude/skills/launch-video。在影片資料夾中執行指令。

流程

依序完成各個階段。每個階段都會產出下個階段所需的內容。

階段	輸出	參考文件
1. 簡報	`brief.md`	references/1-brief.md
2. 格式	格式、長度、比例、平台（寫於簡報中）	references/2-formats.md
3. 故事	`beatmap.md`	references/3-story.md
4. 視覺風格	風格備註（寫於簡報中）	references/4-look-and-motion.md
5. 建構	`film.html`：4 張關鍵靜態圖供用戶確認，接著是整部影片	references/5-build.md、assets/template.html
6. 音樂與音效	歌曲選項、剪輯點、混合後的 MP4	references/6-music-and-sound.md
7. 渲染與檢查	MP4 及檢查結果	references/7-render-and-check.md
8. 交付	最終檔案、適應各平台的版本、發文備註	references/8-platforms.md

在進行到某個階段時才閱讀其參考文件，不要一次讀完。

1. 簡報

了解產品是什麼、影片的目標觀眾、他們需要記住的一件事，以及魔法時刻：產品明顯發揮作用的那個瞬間。先閱讀程式庫、網站和文件。然後一次向用戶提出最多 5 個問題。對於其他事項，將你的預設值寫入簡報的開放問題中並繼續進行。撰寫 brief.md。

2. 格式

根據產品類型、目標與平台選擇影片種類：預告片、發表影片、展示、解說、功能更新、創辦人影片、黑客松展示。設定長度與畫面比例。對於軟體類產品，預設通常是在 X 和 LinkedIn 上發布的 15–30 秒發表影片。當建議發生衝突時，以用戶的意見為準，其次為主要平台。其他平台則製作適應性版本。

3. 故事

以固定節奏撰寫拍子地圖；120 BPM 對應 0.5 秒一拍。每個拍子說明發生了什麼事、它從哪個先前的元素延伸而來、鏡頭位置、顯示的文字以及聽到的聲音。將魔法時刻放在音樂的 Drop 點。

4. 視覺風格

使用產品本身的品牌：顏色、字體、標誌、圖示和元件。閱讀設計標記和 CSS。如果沒有品牌，則使用明亮的 2D 風格：暖白色背景、近乎黑色的 UI、一個強調色、一種乾淨的無襯線字體、一種等寬字體用於程式碼。讓文字在手機上足夠大以便閱讀。

5. 建構

將 $SKILL/assets/template.html 複製到 video/film.html。保留其引擎，替換其影片內容。所有風格都來自 seek(t) 內部的時間控制：不使用 CSS 轉場、計時器或影格間的狀態。形狀之間應相互轉變，而非淡出。

先建構 4 個關鍵時刻：鉤子、魔法時刻、結局和尾卡。將它們渲染為靜態圖，並連同拍子地圖一起展示給用戶。在此取得用戶的確認：修改一句話的代價很小，但修改一個完成的場景則不然。然後再建構其餘部分。

6. 音樂與音效

找到 3–4 首接近影片節奏的候選歌曲，每首都需要有安靜部分和清晰的 Drop 點。在下載任何內容之前先詢問用戶。使用 scripts/beats.py 測量每首歌，查看 scripts/loudness_plot.py 的結果，並使用 beats.py --around 確認 Drop 點。以「歌曲 BPM / 影片 BPM」的速度渲染影片，使節拍對齊。然後使用 scripts/mux.py 剪輯每首歌，使其 Drop 點落在魔法時刻。讓用戶選擇。為點擊、呼嘯和爆裂聲添加真實的音效，並根據它們的最大聲點放置。

7. 渲染與檢查

先渲染靜態圖，再渲染影片：node $SKILL/scripts/render.mjs film.html --out out/film.mp4。然後檢查，並向用戶展示證據：

scripts/pops.py 會找出僅出現一個影格的閃爍影格。應該回報 0 個。
scripts/contact_sheet.py --video 每 0.5 秒顯示一個影格。檢查每個圖塊的構圖、被截斷的文字和重疊部分。
檢查 Drop 時間點和音量（-14 LUFS）。
以手機尺寸靜音觀看。

8. 交付

匯出主影片以及每個平台所需的適應版本，例如 16:9、1:1 或 4:5，以及 9:16。提供用戶檔案、包含主張和連結的發文文字，以及發布前需檢查的事項。然後像導演一樣記錄筆記（「中間部分拖沓」、「縮放應該對準 Drop 點」），並只針對筆記內容進行修改。

工作規則

真實產品，真實主張。 使用產品的真實名稱、UI、文字和資料型態。範例資料必須合理且在場景間一致：如果出現一筆 $120 的訂單，總額就增加 $120。絕不顯示不存在的功能或無法證明的數字。在適用的情況下標示「測試版」或「測試網」。
每支影片一個訊息。 如果簡報中有三個訊息，就製作三支影片或選擇其中一個。
下載前先詢問 音樂、音效或影片素材。註明檔案名稱、來源、授權條款及大小。
在展示之前先檢查自己的工作。 第 7 階段中的檢查大多能在用戶看到問題之前發現。用數字回報結果，而不是「看起來不錯」。
在涉及品味決定時提供選項。 尤其是音樂：剪輯 3–4 個版本讓用戶選擇。
模仿結構，而非藝術。 參考影片可以借用其節奏和拍子結構。不要複製其角色、藝術、音樂或品牌。

影片資料夾

除非用戶要求，否則將影片資料夾放在產品的原始碼樹之外。

video/
  brief.md        beatmap.md
  film.html       assets/      （標誌、字體、圖示、螢幕截圖）
  music/          sfx/         （下載的檔案及其授權說明）
  stills/         out/         （渲染結果；可拋棄）
  package.json    node_modules/ （Playwright）

腳本

腳本	功能
`scripts/render.mjs`	靜態圖，或帶有動態模糊、平行工作者與 `--speed` 參數的完整 MP4
`scripts/contact_sheet.py`	將靜態圖或影片影格拼接成可在一張圖中檢視的圖表
`scripts/pops.py`	找出單影格閃爍異常
`scripts/beats.py`	歌曲節奏、節拍網格、Drop 候選點；使用 `--around` 進行近距離觀察
`scripts/loudness_plot.py`	繪製歌曲的音量，並標示節拍網格與 Drop 候選點
`scripts/mux.py`	將音樂剪輯至對應時間點，根據峰值放置音效，設定音量

不帶參數執行任何腳本以查看其用法。

程式發布成片