Remotion Production
將 Remotion 影片建構為確定性幀渲染器。將素材幾何、視覺錨點、時間軸時序和最終媒體驗證視為獨立問題處理。
路由任務
- 對於精靈圖提取、幀溢出、主體未置中、圖稿被截斷或非自然循環,請參閱 references/sprite-sheets.md。
- 對於合成結構、場景時序、即時座標面板或轉場設計,請參閱 references/scene-architecture.md。
- 對於影片內開場封面、獨立縮圖合成、品牌結尾或最終定格,請參閱 references/covers-and-endings.md。
- 對於素材載入、音訊、
delayRender失敗、記憶體不足渲染或匯出驗證,請參閱 references/rendering-and-audio.md。 - 對於封面圖片提示、縮圖方向、短影音描述或發佈 hashtag,請參閱 references/publishing-copy.md。
僅閱讀與請求相關的參考文件。在選擇匯入方式前,請檢查已安裝的 Remotion 版本,因為較舊的專案可能從 remotion 暴露媒體元件,而目前的專案則使用 @remotion/media。
生產工作流程
1. 建立渲染契約
在編輯前檢查現有專案。記錄:
- 合成 ID、寬度、高度、FPS 和持續時間;
- 場景邊界以及幀是全域的還是相對於
Sequence的; - 來源素材的尺寸、透明度、幀中繼資料和音訊持續時間;
- 所需的輸出編解碼器、目標位置和可用的渲染資源;
- 交付成果是否包含開場封面場景、獨立封面圖片、結尾卡、可聽見的音訊、刻意靜音或發佈文案。
保留不相關的工作區變更。傾向於做一個小型、有針對性的變更,而不是重構一個可運作的專案。
2. 明確地模型化時間
將場景持續時間和剪輯幀定義為具名常數或資料。從 useCurrentFrame() 和 useVideoConfig() 推導動畫狀態。
const spriteIndex =
Math.floor((frame * spriteFps) / compositionFps) % sequence.length;
對於連續運動,使用帶有夾緊範圍的 interpolate()。請勿使用 CSS 轉場、CSS 關鍵影格、即時時鐘計時器、隨機值或可變的播放狀態來進行渲染動畫。
3. 分離來源幾何與呈現
將裁切矩形、動畫順序、內容邊界和視覺錨點保留在型別化的資料中。讓渲染元件消費這些資料,而不是在 CSS 或標籤中重複座標。
對以下項目使用相同的計算後當前幀物件:
- 可見的裁切;
- 幀計數器和突出顯示的儲存格;
- JSON/座標面板;
- 描述當前幀的標題。
這可以防止在正確的動畫上出現過時的解釋性 UI。
當顯示影片條格時,產生一個包含精確當前幀的視窗。請勿在渲染不同裁切時突出顯示最接近的取樣幀。
4. 穩定主要主體
為動畫使用固定的視口。首先裁切精確的來源矩形,然後使用逐幀視覺錨點或可見內容框,在視口內平移該裁切後的幀。當圖稿在儲存格內移動時,請勿僅將原始儲存格矩形置中。
對於精靈圖,請驗證每個邊緣幀以及任何包含長形肢體(如尾巴、頭髮、陰影或運動軌跡)的幀。請遵循 references/sprite-sheets.md 中的詳細工作流程。
5. 建立場景連續性
為合成提供一個在所有場景序列之外的持久不透明基底背景。場景背景也可以保持不透明。將轉場應用為幀驅動的覆蓋層,置於場景上方以及任何最終的暗角或安全覆蓋層下方。
保持裝飾效果從屬於解說。轉場應隱藏剪輯,而不是揭露透明度、棋盤格、相鄰的精靈圖儲存格或未掛載的內容。
當請求包含封面或結尾時,將其實作為一級場景,並在有用時渲染一個獨立的封面合成。請遵循 references/covers-and-endings.md。除非使用者只要求一個提示,否則請勿用封面產生提示來取代實際的 Remotion 封面。
6. 添加並混合音訊
使用 staticFile() 參考本地音訊。透過選擇足夠長的音軌、刻意循環或刻意修剪來覆蓋整個合成。對於使用者提供的長音軌,請檢查其持續時間、靜音和響度,然後僅將所需的摘錄放入 public/audio/。選擇一個音樂上自然的邊界,而不是僅依賴響度。
對於淡入淡出,使用基於幀的音量回呼,並保持背景音樂夠低,以便容納旁白或教學文字。當 Remotion 已擁有音量包絡時,避免將淡入淡出烘焙到摘錄中。
請勿僅從 Studio 預覽就宣告音訊完成。驗證匯出的檔案包含可測量的非靜音音訊串流。
7. 按範圍遞增驗證
按以下順序執行檢查:
- 對專案進行型別檢查。
- 在封面、每個剪輯的兩側、代表性的精靈圖幀、結尾入口點以及最終定格處渲染靜態幀。
- 渲染完整的合成。
- 如果 Chrome 耗盡 RAM 或暫存磁碟,請在變更應用程式程式碼之前降低渲染並行度。
- 檢查最終容器的持續時間、視訊串流和所需的音訊串流。
匯出後使用內建驗證器:
node /path/to/remotion-production/scripts/verify-render.mjs out/video.mp4 --expect-duration 35 --expect-width 1920 --expect-height 1080 --expect-video-codec h264 --require-audible-audio
即使目標位置存在檔案,也將部分或失敗的輸出視為無效。
8. 在要求時準備發佈文案
根據最終合成、經過驗證的主體、教學重點、視覺風格、持續時間和目標受眾來建立封面提示和影片描述。直接在使用者對話中輸出這些交付成果。請勿建立提示或描述檔案、呼叫圖像生成工具或產生封面圖片,除非使用者明確要求這些操作。
請遵循 references/publishing-copy.md。使結果易於複製、針對目標平台簡潔,並以使用者的語言撰寫。
完成標準
在滿足以下條件之前,請勿聲稱完成:
- 動畫是根據幀確定性推導的;
- 主體邊界在整個循環中保持完整且視覺穩定;
- 解釋性座標隨著渲染的精靈圖幀更新;
- 場景剪輯從不暴露透明或棋盤格偽影;
- 媒體素材載入時沒有洩漏的渲染控制代碼;
- 完整渲染在穩定的並行度下成功;
- 匯出的檔案具有預期的持續時間、所需的音訊/視訊串流,並且在需要音樂時具有非靜音的音訊。
- 在完整狀態、轉場邊界和最終幀處對請求的封面和結尾場景進行視覺檢查;
- 獨立的封面圖稿包含其自己的不透明背景,並與影片層級結構匹配;
- 請求的封面提示和發佈描述準確反映最終影片,並直接傳遞在對話中。
報告輸出路徑、渲染命令、驗證結果,以及任何刻意降低的並行度。