Remotion 影片管線
真實素材 + 程式繪製排版 = 無錯字且可重複編輯的品牌影片。
管線
- 盤點原始片段:
scripts/inventory.sh <raw-dir> > index.tsv(id、路徑、時長、解析度)。 - 代理檔案:
scripts/make-proxies.sh index.tsv proxy/建立 1080 寬、30 fps、all-intra-ish H.264(-g 15)的副本(不含音訊)。在代理檔案上編輯與渲染;4K/HEVC 原始檔會讓 Remotion 搜尋緩慢,甚至導致 Chrome 當機。 - 看圖選片段,而非猜測:
scripts/contact-sheet.sh proxy/v01.mp4 sheets/v01.jpg每秒一格,以網格方式輸出。打開聯絡表,記下每個剪輯的開始秒數。 - 構圖於
template/(複製它):Footage(修剪、縮放的片段)、Scrim(漸層遮罩以確保文字可讀)、Line(動畫文字)。每個輸出一個構圖(例如Main30 秒、Teaser9 秒、Spot16x920 秒)。 - 渲染:
npx remotion render <CompositionId> out/<name>.mp4。設定檔已設定 H.264、CRF 17、yuv420p。 - 驗證:提取 3 張靜態畫面(
ffmpeg -ss 5 -i out.mp4 -frames:v 1 still.png)並檢視;確認時長及音訊政策(無聲或音樂)符合客戶預期。
常見陷阱(每個都浪費過時間)
- 在根元素設定
lang="tr"(或正確的語言);否則 CSStext-transform: uppercase會將土耳其語的i轉成I(MAKINASI、TEKLIF)。建議直接在字串中輸入最終大小寫。 ffmpeg在while read迴圈內會吞掉 stdin:務必加上-nostdin。- zsh 與 bash 的分詞行為不同:
set -- $p和$2:s會出錯。腳本請使用#!/usr/bin/env bash。 - 許多 ffmpeg 編譯版本沒有
drawtext。請在 Remotion 中繪製文字,絕不在 ffmpeg 中處理。 - 基於 HTML 的渲染器(例如 Hyperframes)可能在各場景之間留下「暗淡」的疊加圖層;請同時為場景淡入淡出加上明確的不透明度動畫。請在前景執行此類渲染(背景
nohup執行會被取消),並使用ffmpeg -i in.mp4 -c:v libx264 -crf 18 -pix_fmt yuv420p out.mp4轉換 HEVC 輸出。 - 手機素材旋轉:檢查
ffprobe旋轉標籤;直式片段在橫式構圖中需要objectFit: cover加上明確裁切。 - 僅描述素材中顯示的內容。請勿在畫面文字中虛構規格、容量或價格。
- 將客戶檔案與你發佈的儲存庫分開;素材和標誌屬於客戶。
請參閱 references/checklist.md 獲取交付檢查清單。