Communitygithub.com

concept-reel:無旁白概念講解短片

用 Canvas、Playwright 和 FFmpeg 製作或修改無旁白的 1080p 字幕概念短片:內容驅動分鏡、15 種動態設計風格、確定性動畫、預覽聯絡表和依事件同步的音效。

concept-reel:無旁白概念講解短片 是什麼?

產品示範成片配方第 3 步(講清原理),來自 Jogzh/concept-reel(2026-10-13 新建)。README 附風格預覽圖與 WebP 範例片段。目標是觀眾認得出主體、看得見變化、理解因果;數字來自計算,事實標來源,算圖流程為 raw.mp4 → 事件音效配樂 → final.mp4。

相容平台~Claude Code~Codex CLI~Cursor
npx skills add Jogzh/concept-reel

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

Concept Reel · 概念短片

讓畫面解釋一句話:觀眾能認出主體,看見變化,理解因果。交付可運行的工程、分鏡與事實出處,以及請求範圍內的預覽或成片。

本 skill 目錄包含共享引擎;工程可以建立在用戶專案內。命令中的 engine/、scripts/ 相對於本 skill 目錄,呼叫時請使用實際路徑。目前固定畫幅為 1920×1080 橫屏;預設 30fps,新建工程可設定幀率。

按任務閱讀

創作原則

  • 先決定觀眾要明白什麼,再選擇主體與動作。幾何圖形可用於圖表和抽象量;描述真實物體時應有可辨認的形態。
  • 字幕中的變化要在螢幕上發生。數字來自計算,示意、適用條件與不確定事實須標清楚;重要事實記錄可核查來源。
  • 一次只安排一個主要視覺焦點。字幕可穩定,標題、關鍵詞和標籤隨主體與留白佈局。
  • 字體、色彩含義和運動手感統一;鏡頭重心、景別與資訊密度按內容選擇。風格預設是起點,可調整色板與動作、組合一個主風格和一個輔助風格。
  • 字幕完全顯現後再計算閱讀停留;看圖和推理需要額外時間。結論先停住,再離場。
  • 動畫由 t 決定。亂數使用固定種子,不以即時時鐘、計時器或跨影格累計狀態決定畫面。
  • 原始範例用於學習實現方式;新片應圍繞自己的主題、文案與分鏡製作。來源與材料邊界請見 NOTICE。

工作流程

確定交付範圍。 識別題目、既有文案、現有壞鏡頭、長度、風格、配樂與是否需要完整匯出。能從上下文推斷的選擇可直接推進;只澄清影響結果的缺失要求。使用者已授權完整製作時,繼續完成,不反覆要求階段批准。

整理事實與分鏡。 寫一句話核心問題和事實表(事實、來源、適用條件、把握程度)。按鏡頭記錄時間、敘事任務、主體與重心、文案與閱讀順序、動作、完整閱讀停留和聲音。先解決無法畫清的句子,再安排時間。保留既有文案的原意;需修改的事實或結構須說明原因。

把風格落實到畫法。 無明確風格時,根據主體、空間關係、資訊密度、運動語氣和實現成本考慮 2–3 個方向,再選定適合內容的方案。分鏡記錄選型理由、可辨認特徵與實現邊界。用風格畫廊探索動作,自己的片子仍按事實與分鏡創作。3D、玻璃與液態預設是 Canvas 適配,複雜真實渲染需另外實現;綜藝花字仍為橫屏。

先驗證關鍵鏡頭。 檢查環境,建立工程,再實現最難或最能代表風格的一段。骨架沒有成片畫面,需要填寫 SUBS 和場景函數。已有分鏡會保留,已有原始碼預設不會覆蓋。

python scripts/check_env.py
python scripts/new_film.py --list-styles
python scripts/new_film.py --describe-style isometric
python scripts/new_film.py <工程目錄> --style isometric --title "片名" --duration 60 --fps 30
python engine/render.py <工程目錄> --serve
python engine/render.py <工程目錄> --stills 2.5 8 15
python engine/render.py <工程目錄> --motion 8 10 12

環境缺少依賴時請按 README 安裝;字體缺失時執行 python engine/get_fonts.py。預設使用 bundled Chromium,使用者需要本機 Chrome 時傳 --browser chrome。

--style ID 與 --world B/C 互斥;不指定時保留預設 C。新風格工程內嵌可調整的 STYLE 配方,使用共享 VStyles;motion.fps 指風格動作的建議取樣頻率,實際輸出幀率由 --fps 決定。骨架不會自動生成主題內容。

檢查後擴展。 查看真實截圖,判斷主體是否認得出、動作是否承擔解釋、文字是否可讀;在目標觀看尺寸檢查遮擋。調整發現的問題並複查相關時刻,再擴展全片。一個場景一個函數,字幕在 draw 的最外層繪製。複雜章節可分檔案,在 index.html 中宣告。

python engine/render.py <工程目錄> --sheet 16
python engine/render.py <工程目錄> --det
python engine/render.py <工程目錄> --clip 0 5 preview

--sheet 單值表示取幀數量,多值表示指定時刻。--det 失敗時需檢查 Canvas 狀態、亂數種子與跨幀快取;不得把失敗稱為通過。

按授權範圍匯出與配聲。 請求成片時執行全片渲染、事件匯出和音訊合成;只需原始碼/預覽時可在相應結果完成後交付。

python engine/render.py <工程目錄> --jobs 4
python engine/render.py <工程目錄> --events
python engine/audio.py <工程目錄>
# 有可使用的外部配樂
python engine/audio.py <工程目錄> --bgm music.mp3 --bgm-db -8

fr.sfx 事件名為 tick、soft、chord、bloom(相容 flash)、rise、thud、tock、stamp、shimmer、hush。無外部配樂也可合成底音與事件音;具體結果如實說明。--wav-only 只輸出合成音軌,不疊加外部 BGM。

驗收交付。 連續觀看已匯出的片段/全片,並抽查入場、穩定閱讀、關鍵動作和轉場中點。確認事實與分鏡相符、音畫同步、數字一致、字體無缺字。修復已發現的問題,複查受影響鏡頭。交付原始碼路徑、預覽或 renders/final.mp4,簡述驗證結果和實際限制;未完整觀看的部分要明確說明。

工程與產物

index.html 引用 /engine/ 共享資源和本地 film.js;storyboard.md 儲存分鏡和事實。review/ 放關鍵幀,audio/ 放事件和合成音軌,renders/ 放片段與成片。生成物預設不提交,保留可再渲染的原始碼。

相關技能