電影攝影機
請與 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()的輸入範圍必須嚴格遞增。- 保持世界規模適中；大型模糊/陰影圖層的成本很高，並且通常違反視覺規則。
- 對滴答的資料使用等寬數字。