電影式攝影機
需與 remotion-best-practices 和 motion-graphics 搭配使用。建立一個相連的世界，並讓一台共享的攝影機在其中穿梭，而不是將不相連的面板彈入虛無之中。
強制性資訊收集
在規劃或編碼前，請遵循 motion-graphics 的資訊收集關卡。如果缺少此步驟，請詢問：
想要哪種格式：4:3 半螢幕 Instagram 嵌入片，還是 9:16 全螢幕 Instagram 影片？以及哪種背景：暖光、乾淨深色、淺色網格，還是深色網格？
請勿默默地預設為 9:16 或深色。如果使用者委託您選擇，請使用暖光。
絕對視覺禁令
此技能絕不引入霓虹、發光、光暈、發光邊緣、彩色陰影、漸變球體、放射狀色彩漸層、青紫漸層、玻璃擬態或賽博龐克燈光。攝影機移動不能將一個克制的場景變成一個「氛圍編碼」的 AI 展示。產品重點色應保持平實且克制。
強制性已核准參考審查關卡
在規劃或編碼前完成：
- 檢查與同一個專案、產品、長寬比、放置位置或視覺機制相關的最新 3–5 個已核准的渲染成品。
- 開啟原始檔中的合成，檢查攝影機關鍵影格、時間點、間距、排版、顏色、密度、入場、出場與結束停留。
- 檢查實際的片段或代表性影格；僅憑檔名是不夠的。
- 盤點真實資產：標誌、吉祥物、螢幕截圖、錄製內容、影片素材與先前的輸出。
- 撰寫一個簡短的節拍圖，說明此片段如何延續已核准的系統。
- 如果沒有專案參考資料，請使用鎖定的備案：暖白色實體/編輯世界、深色墨水、柔和中性色、一個克制的平實品牌重點色、中性陰影，以及零裝飾效果。
參考優先順序：同一部影片 → 同一產品/系列 → 同一個長寬比/使用案例 → 其他已核准的儲存庫範例 → 鎖定的備案。
標準圖庫：https://github.com/Liamrjohnston/remotion-motion-graphics-skill
近期已核准的作品是基準線，而非可選的靈感來源。請勿為了追求新穎而發明新的美學風格。
核心概念
建立一個比可視區域更大的世界。從一個緊貼的動作開始，在動作完成時停留，揭示背景脈絡，移動到對比/關鍵情節，最後穩定下來。
面板可以存在，但它們必須共享同一個世界，並具有有意義的空間關係。避免獨立的卡片在空無一物的空間中各自出現。
攝影機裝置
為焦點和縮放使用一個共用的關鍵影格時間軸：
const ease = Easing.inOut(Easing.cubic);
const KEY_T = [0, 46, 62, 78, 96, 132, 174, TOTAL_FRAMES];
const fx = interpolate(frame, KEY_T, [/* 焦點 x */], {
easing: ease,
extrapolateLeft: 'clamp',
extrapolateRight: 'clamp',
});
const fy = interpolate(frame, KEY_T, [/* 焦點 y */], {
easing: ease,
extrapolateLeft: 'clamp',
extrapolateRight: 'clamp',
});
const z = interpolate(frame, KEY_T, [/* 縮放 */], {
easing: ease,
extrapolateLeft: 'clamp',
extrapolateRight: 'clamp',
});
<AbsoluteFill style={{backgroundColor: BG}}>
<div
style={{
position: 'absolute',
transform: `translate(${VIEW_W / 2 - fx}px, ${VIEW_H / 2 - fy}px) scale(${z})`,
transformOrigin: `${fx}px ${fy}px`,
}}
>
{/* 整個場景以世界座標表示 */}
</div>
</AbsoluteFill>
- 尺寸來自已確認的格式，絕不使用隱藏的預設值。
- 世界寬度通常是可視區域寬度的 2–2.5 倍。
- 重複的相鄰關鍵影格會產生停留效果。
- 攝影機移動通常需要 14–24 影格。
- 結尾使用兩個幾乎相同的關鍵影格，以獲得穩定的編輯器停留效果。
- 攝影機、游標、效果與連接的物件保持在同一個座標系統中。
編排
- 緊緊跟隨一個已經在進行中的動作開始。
- 在主要動作完成時停留。
- 揭示其更大的系統。
- 移動到對比/關鍵情節。
- 在支援物件以交錯順序完成時，拉遠鏡頭。
- 穩定下來，準備乾淨的剪切。
規則：
- 攝影機移動到下一個動作；動作在停留期間完成。
- 每個節拍只有一個主要動作。
- 僅使用微動作來顯示狀態：打字、計時、勾選、播放、進度、游標移動。
- 優先使用連續轉換，而非場景替換。
- 偏好流暢的移動，而非狂亂的甩鏡。
- 動作解釋因果關係；它永遠不能補償一個薄弱的概念。
真實性與文字
- 在可用時使用真實的標誌、影片素材、螢幕截圖、錄製內容、使用者介面與經過驗證的資料。
- 絕不使用通用的彩色方塊、偽造的標記、虛構的使用者介面或假造的指標。
- 產品名稱、檔案名稱、計數器、指令、進度與真實的使用者介面文字是允許的。
- 不要因為畫面感覺空洞，而重複旁白句子或添加說明性的徽章。
第一輪拒絕關卡
在所有問題的答案都是「否」之前，不要展示渲染結果：
- 格式或背景是否未經確認？
- 是否有任何霓虹、發光、彩色燈光、漸層渲染、玻璃面板或氛圍編碼式的 AI 處理？
- 場景是否由一堆不相連的通用卡片構成，漂浮在虛無中？
- 是否使用了深色，但使用者並未選擇，也沒有已核准的參考要求如此做？
- 攝影機移動是否在裝飾，而非引導因果關係？
- 在可取得真實資產時，是否缺少它們？
- 在指定的 Instagram 放置位置上，基本元素是否難以辨識？
- 結果是否未能匹配已核准參考的間距、密度、材質與動作節奏？
請私下修改，直到通過此關卡為止。
品質保證與交付
- 為開場、每個攝影機目的地、轉場、關鍵情節與結束停留渲染靜態畫面。
- 與已核准的參考並排比較，檢查構圖、密度、品牌識別、材質克制性與精緻度。
- 確認真實資產保持可讀。
- 確認「停留 → 移動 → 停留」的節奏，且沒有動作在移動過程中被隱藏。
- 檢查完整的 MP4 影片，尋找空白移動、裁切、無用影格、通用填充素材、霓虹/發光效果與薄弱的結束停留。
- 只有當它看起來與同一個已核准的視覺系統相同時，才能交付。
技術限制
- 使用
useCurrentFrame()、spring()與interpolate()驅動動畫；不使用 CSS 動畫。 interpolate()的輸入範圍必須嚴格遞增。- 世界規模應保持適中；大型的模糊/陰影圖層很耗效能，且通常違反視覺規則。
- 對於會變動的資料，請使用等寬數字字型。