alifmahmudashik/shorts-studio-skill

卡通 3D 故事短片 (three.js + Remotion)

已證實範例: The Bridge That Fell for a Song。這是一部原創的 67 秒短片，內容關於 1831 年的 Broughton 橋與 74 名士兵步伐一致行進的故事。

• 程式碼: 你的 Remotion 專案中的 src/videos/bridge/ (合成 BridgeShort，1080x1920，30 fps)。
• 劇本、配音與音效: ~/bridge-short/。
• 風格研究: references/。

此風格參考來自一個私下研究的頻道 (references/: STYLE_BIBLE.md、reports/*.md、frames/)。

• 這些影片是私下的學習資料。切勿上傳、發布或傳送它們。
• 切勿複製它們的劇本、角色或鏡頭。故事、角色和配音必須是我們自己原創的。
• 切勿在旁白或描述中說出該頻道的名稱。

使用者規則適用:

• 字幕: 於 Shorts 預設為開啟。一次顯示一個單詞，置中，粗體，帶有深色外框，位於安全區域內，並與 words.json (見'字幕') 中的時間碼同步。僅在使用者要求時才將其關閉。不允許其他螢幕上的標籤。
• 僅限英文。
• 配音: 一種穩定的語調 (冷面滑稽: 敘述者從不反應，角色們則會反應)。
• 笑話基於研究過的真人真事。
• 標準混音: 音樂 +3 dB，音效 -6 dB，配音保持不變。
• 最終輸出為 2K 垂直: 1440x2560，--scale 1.3333。
• Opus max 驗證器會檢查每一項。
• 每一步驟後皆需儲存。
• 劇本獲得批准後就「直接執行」。

流程

1. 主題與事實。挑選一個令人驚訝的真實故事，具有物理上的因果關係 (應是視覺化的)，再加上一個能解釋它的簡單日常類比。
   • 將事實及其來源寫在 SCRIPT.md 的頂端。
2. 劇本 (~3.7 字/秒，35-70 秒)。對於冷知識短片，使用下方的'病毒式故事格式'和'讓它變搞笑'；橋樑節奏公式是災難故事的替代方案:
   • 鉤子: 用一句話陳述荒謬的事實 (「74 名士兵僅僅步行過橋，就震垮了一座鐵橋。」)。
   • 背景: 年份、地點、背景自豪感。
   • 行動: 透過三到四個節拍逐步升級，每個節拍都比前一個更大。
   • 斷裂點: 東西壞掉的瞬間。
   • 冷面雙關語: 「幸運的是... / 不幸的是...」。
   • 解釋: 透過一個日常類比 (盪鞦韆的小孩) 說明一個物理概念。
   • 後果: 它所創建的規則。
   • 回馬槍結局: 結尾。
   • 永遠不要描述觀眾已經看到的畫面。
3. 配音。錄製或生成 voice.wav，然後製作其單詞時間碼 words.json (任何能輸出單詞時間碼的語音轉文字工具)。
   • 將它們放在專案資料夾中，例如 ~/bridge-short/voice/。
   • 手動修正單詞時間碼。所有內容都以 words.json 為時間依據，字幕也從中提取。
4. 分鏡計劃 於 story.ts: 複製 templates/bridge/ (最終的橋樑原始碼，與你的 Remotion 專案中的 src/videos/bridge/ 相同) 到 src/videos/<name>/，在 src/Root.tsx 中於 BridgeShort 旁邊註冊一個新的合成，並重新命名。
   • SHOTS: id、a/b 幀、光線日間/金色時刻、群眾模式、tau 故事時間。
   • XFADE: 在地點/時間變換處進行交叉溶解。
   • FLASH_AT: 在鉤子之後出現閃白。
   • CAMS: 每個鏡頭的鍵 {f, dur?, cut?, s: f => {pos, look, fov, roll}}。
   • KICKS: 撞擊造成的翻轉晃動。
   • DOF/dofAt: 每個節拍的鏡頭模糊。
   • FOREGROUND: 近距離構圖道具。
   • 每個視覺反應都比其對應的單詞提前 0-3 幀出現。
   • 將每個句子的主詞連結成一個連續的流 (flow.ts，見'連續流')，為每個動作命名，每個停止點賦予構圖尺寸 (見'運鏡變化'和'構圖')。
   • 為每個地點賦予自己的燈光預設 (見'每個地點的燈光設定')。
5. 世界。
   • lights.ts: LIGHTS 加上每個燈光的 LOOK 天空/河流/雲朵調色板。
   • shade.ts: 雙色調陰影和 untone()。
   • build.ts: 城鎮、房屋和 Kenney CC0 套件道具，重新上色，並遮蔽任何阻擋相機視線的元素。
   • paint.ts: 使用 HD Canvas2D 繪製的紋理，接縫處以深色調繪製。
   • world.ts: 天空著色器、霧 = 地平線顏色、河流、每幀姿勢、太陽凍結在每個鏡頭中並相對於相機。
6. 角色。
   • toon.ts: Canvas2D Pen 繪圖 API，600x1000 設計畫布，腳底在 y = 975，豆形頭，棍狀四肢，梅子色可變寬度外框，表情庫。
   • cast.ts: 面向相機的廣告牌、群眾、效果卡片、眨眼、走路循環。所有廣告牌都放在 NOINK 圖層上。
   • cardshade.ts: 由場景光線照亮的卡片，無自發光。
7. 後期處理 (Bridge.tsx + ink.ts + lensblur.ts + grade.ts)。
   • 合成順序: 墨水 → 鏡頭模糊前 → 鏡頭模糊主 → 光暈 → NEUTRAL 色調映射 → 調色 (MSAA 4)。
   • 每個像素參數都隨輸出高度 / 1920 縮放。
8. 音效 (~/bridge-short/audio/: timeline.py、sfx_gen.py、sfx.py、music.py、instruments.py、dsp.py、mix.py)。
   • 事件表 → 合成的音效加上原創配樂，在配音下方進行閃避處理。
   • 輸出: mix.wav (48 kHz，精確長度)、音軌素材和 cues.md。
   • 在製作音效前鎖定畫面的時間常數。任何後續的時間變更都意味著重新執行音效。
9. 視覺檢查。執行 node scripts/bridge-stills.mjs out/<name>/x_ 100,400 0.5。
   • 設定 BRIDGE_ENTRY=src/sandboxes/<n>/index.tsx 以渲染沙盒副本。
   • 使用 python scripts/sbs_sheet.py out.jpg --ours ... --ref ... 製作與參考幀的並排比較圖。
   • 將它們傳送給 Opus max 驗證器: 1-3 張圖片，一段 ≤200 字的裁決。
   • 對每個鏡頭執行構圖檢查 (templates/bridge/framing.ts)，並製作一張包含每個鏡頭一張靜止幀 (第一、中間、最後一幀) 的索引圖。見'品質關卡'。
10. 最終渲染。
    • npx remotion render src/index.ts <Comp> out/<name>/video.mp4 --codec h264 --crf 16 --scale 1.3333
    • 使用 -map 0:v:0 -map 1:a:0 Mux (Remotion 會寫入一個無聲的音軌)。
    • QA: python scripts/short_qa.py final.mp4 out/<name>/qa shots.json 檢查每一幀是否有黑色、白色、凍結和跳幀，以及音量和索引圖。
    • 修正它找到的任何問題，然後執行一次深入的 Opus 審計。
11. 交付。將最終的 mp4 檔案傳送給使用者，更新記憶，撰寫筆記。

飛行前檢查 (請先執行此項)

• 檢查 templates/bridge/、references/ 和 scripts/ 是否存在 (如果缺少，請在 Remotion 專案旁邊 clone github.com/mromidev/claude-animated-shorts 或你自己的 fork)。如果缺少，請停止並獲取它們。切勿在沒有範本的情況下臨時製作一個通用的 three.js 外觀。
• 先製作一個 15 秒的測試片段 (鉤子 + 2-3 個鏡頭，包含字幕和音效)。渲染靜止幀，執行品質關卡，修正，然後擴展到完整故事。切勿直接進行完整渲染。

病毒式故事格式: 「嘲笑天才」 (用於冷知識短片)

六個節拍，每次都套用:

1. 奇怪的行動，沒有上下文，僅用一個畫面顯示 (鉤子，前 3 秒)。
2. 嘲笑: 其他角色嘲笑主角。
3. 他們都看向右邊: 時間流逝，主角看起來錯了或無害。
4. 線索: 一個預示回報的細節。
5. 回報: 證明主角正確的事件 (視覺高潮)。
6. 科學原理: 展示機制 (內部 / 剖面 / 微觀視圖) 並用一句簡單的話解釋。

• 以一個有主角的故事方式講述，而非事實列表。選擇一個在一張圖片中可見、且人們會嘲笑它的奇怪做法。
• 最後一行引發爭論或評論 (一些有爭議的事情)，而不是一個整潔的總結。
• 標題模式: 「為什麼 X...」、「如何 X...」、「X 的真正含義」。標題中不要劇透回報。
• 節奏: 每 2-3 秒引入一個新主題，透過相機移動 (見'連續流') 而非剪接來達成，幾乎每次移動或溶解都有音效 (嗖嗖聲、叮噹聲、群眾笑聲)，並且配音下方有音樂。
• 豐富的地點，簡單的角色 (圓頭、棍狀手臂): 為一個 60 秒的短片規劃 12-16 個不同的地點和 20 多個道具，並為每個地點賦予自己的燈光氛圍。
• 先撰寫事實及來源。年份和數字用口語自然說出 (「一八四七」)，並以數字形式作為字幕。
• 範例: templates/SCRIPT_viral_example.md。

讓它變搞笑 (搞笑引擎)

群眾嘲笑主角；觀眾也應該跟著笑。

• 冷面配音，荒謬畫面。敘述者從不反應；角色們則會反應。兩者之間的落差就是笑點。
• 每 4-6 秒一個笑料，在每個短片中至少使用三種: 台詞笑料 (輕描淡寫、「幸運的是... / 不幸的是...」)、視覺笑料 (反應表情、背景中的小細節、一個比例錯誤的道具) 和聲音笑料 (一個跟反應同時出現的滑稽音效)。
• 三的法則: 兩個正常節拍，然後第三個打破模式。
• 連環笑料: 一個背景角色或物件 (一隻鴿子、一個吃三明治的人) 出現 3-4 次，並在接近結尾處獲得回報。
• 反應鏡頭: 相機在台詞重點詞之後的 3-6 幀內，停留在臉上 (流動停止或跟焦，不是剪接) 並維持 8-12 幀。使用表情庫；至少包含一個「不以為然」和一個「震驚」。見'反應和對話節拍'。
• 自信的主角、自鳴得意的群眾、過於嚴肅的官員: 角色們將微不足道的事情看得極其嚴重。
• 僅為一個節拍 (回報) 誇大物理: 擠壓與拉伸、灰塵雲、撞擊晃動。
• 回馬槍結局: 最後一行利用發生過的事情，扭轉第一行 (鉤子)。
• 笑話必須基於真實事實：有趣的部分是真實的細節。切勿針對真實的受害者或群體；目標是過度自信和自鳴得意。

字幕 (逐字字幕)

• 來源: words.json (配音單詞時間碼，已手動修正)。任何語音轉文字工具皆可；templates/bridge/Captions.tsx 中的 normalizeWords() 接受 {word|text, start|start_time, end|end_time}，單位為秒或毫秒，並會跳過 ElevenLabs 的「間隔」項目。
• 如果語音轉文字的文字與劇本不同 (數字、名稱、拼寫)，請將文字替換為劇本中的單詞，並保留 STT 的時間碼。字幕顯示劇本拼寫 (「1847」)，即使配音說的是「一八四七」。
• 元件: 複製 templates/bridge/Captions.tsx 到 src/videos/<name>/，並將 <Captions words={WORDS} /> 作為合成的最後一個子元素渲染，作為 three.js 畫面上方的 DOM 覆蓋層，位於後期處理合成器之外 (文字上不要有墨水、模糊、光暈或調色效果)。
• 樣式: 一次顯示一個單詞，在約 68% 幀高度處水平置中 (在臉部下方，安全區域內)，使用粗體無襯線字體，白色填充，在 1080 寬度下帶有 9 像素深色外框，彈入縮放從 0.8 → 1.08 → 1 持續 6 幀，無背景框，最大寬度 86%。數字、名稱和台詞重點詞使用強調色 (highlight)。像素大小隨輸出高度 / 1920 縮放。
• 切勿遮蓋臉部：當特寫鏡頭中臉部位於字幕位置時，傳入 yPercent={(frame) => ...} 以在該鏡頭中移動字幕。
• 字幕在其對應單詞被聽到前 1 幀出現 (lead)。
• QA: 在每個鏡頭中，於一個台詞重點詞上渲染靜止幀，並確認字幕在安全區域內且未遮蓋臉部。

構圖、安全區域與縮放限制 (強制執行)

• 9:16 畫面。安全區域: 左右各 6% 邊距，頂部 8%，底部 15% (平台 UI 和字幕)。所有重要元素 (角色、道具、對話框、標誌) 都完全位於其中，除了特意安排的近距離前景構圖道具。
• 角色的頭部最多佔畫面高度的 30% (單人反應笑料鏡頭可使用 40%)。偏好中景鏡頭 (腰部以上) 和全身廣角鏡頭。
• 切勿從腳部裁切角色，也切勿裁切對話框或標誌。前景道具要麼可辨識，要麼消失；被裁切的道具不得覆蓋畫面超過 35%。
• 不要連續使用兩個相同尺寸的鏡頭 (廣角 / 中景 / 特寫 / 插入鏡頭)。
• 停留時的推近要保持緩慢: 每幀 0.15-0.35%，台詞重點詞處為 0.6%。不要有突然的大縮放。
• 自動檢查: templates/bridge/framing.ts 中的 checkShot(camera, items) 將邊界框投影到螢幕空間並列出每個問題。在 bridge-stills 中，對每個鏡頭的第一、中間和最後一幀執行此檢查，並在渲染前修正失敗的鏡頭。自我測試: npx tsx templates/scripts/framing_selftest.ts。

每個地點的燈光設定 (橋樑範本僅定義日間和金色時刻)

每個地點都需要在 lights.ts 中有自己的燈光預設: 一個清晰的主光方向、雙色調陰影 (暖色照亮區、冷色陰影區)、投射陰影與接觸陰影，以及匹配的天空或天花板。永遠不要有平淡無照明的房間，也永遠不要在房間內看到天空或雲朵。

• 室內 (大廳、飯店、辦公室): 天花板或深色牆頂、來自窗戶或燈具的一個主光、帶有光暈效果的暖色實用燈光 (蠟燭、燈具)、冷色陰影側、柔和的暗角、來自每個道具的地板和牆壁陰影、來自窗戶的光束或灰塵。
• 夜晚: 月光藍色主光 (約 #5b7fd6)、深藍紫羅蘭色陰影、作為對比的溫暖發光窗戶和燈具、月亮或星星。
• 日出 / 日落: 帶有上帝光的低位太陽、桃色到粉紅色天空、紫羅蘭色陰影、長陰影。
• 這些是起始值：使用並排比較圖 (sbs_sheet.py) 針對 references/frames/ 進行調整。
• 每個角色和道具下方都有接觸陰影，以及來自主光的方向性陰影尾巴；傢俱和道具在地板和牆壁上投射陰影 (在室內，卡片陰影是真實的，而不是模糊的色塊)。
• 景深 (見下方表格) 要一致地應用：特寫和中景鏡頭永遠不會完全清晰，廣角鏡頭保持清晰。

運鏡變化 (永遠移動，從不重複相同的移動)

• 在一個流或鏡頭中，使用命名的移動: 慢速推近、拉遠揭示、圍繞主體旋轉、具有視差的橫向跟拍、升降、傾斜、從前景道具到主體的跟焦、小幅度的荷蘭角轉動 (4-5°)。
• 不要連續出現兩個相同的移動。
• 在大約三分之一的鏡頭中，將前景道具 (柱子、欄杆、傢俱) 放置在鏡頭和主體之間，以便相機移動能呈現深度感。
• 每個故事至少兩個插入鏡頭: 一個用於節拍 4-6 的機制微距或剖面鏡頭，加上一個戲劇性角度 (低角度英雄鏡頭或鳥瞰)。
• 保留現有的 smootherstep 滑行 (18-40 幀)、潛行的停留和撞擊晃動。

連續流: 在主體間移動，不要剪接 (參考...

(後續內容因篇幅截斷，請參考原文結束)