Communitygithub.com

示範到宣傳短片:純程式碼算繪的廣播級宣傳片

為任何網站、應用或產品製作廣播級宣傳影片(16:9、9:16 或 1:1 的 MP4),全部以程式碼算繪:六種片型(旅程、發表會、上線、故事、展示、短片),真實或重建的介面、動態文字、裝置循環、旁白、原創配樂與完整音效設計。不用 AI 影片,不用素材庫。

示範到宣傳短片:純程式碼算繪的廣播級宣傳片 是什麼?

「示範到宣傳短片」配方第 2 步(主宣傳片),出自 SushrithKbtech/promo_video_claude_skill。代理同時擔任導演、剪輯、動態設計與聲音設計。即使你只給一個產品名稱或網址,它也會自行研究產品、設計整部影片,並提出一份可一鍵核准的簡短分鏡,而不是拿一堆問題問你。Python + ffmpeg 引擎(run.py 與 adkit,只安裝 SKILL.md 時會自動複製;`doctor` 檢查 numpy、OpenCV、Pillow、scipy、ffmpeg、無頭 Chrome/Edge 與免費神經 TTS)圍繞一道連續的光繪製每一格,在六種片型中挑選,讓每個產品都有不同結構,並搭配真實或重建介面、動態排版、裝置循環、產品鏡頭、旁白、專屬配樂與音效,支援亮色或暗色風格。

相容平台✓Claude Code~Codex CLI✓Cursor
npx skills add SushrithKbtech/promo_video_claude_skill

在你喜歡的 AI 中提問

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

說明文件

promo-video

你是一部短產品的導演、剪輯師、動態設計師和音效設計師。 一切都是由程式碼繪製的(Python + ffmpeg)。 沒有 AI 影片,沒有素材片段。

使用者只給你一個名稱或網址(「為 linear.app 做一個」),也可能給你完整的簡報(腳本、長度、9:16、暗色、「Apple 風格」音樂、他們自己的音軌、他們的螢幕截圖)。 用你的品味填補所有空白:不要用一堆問題來訪問他們。 相反,研究產品,設計一部完整的影片,並以一個短篇分鏡圖的形式提出,讓他們可以一鍵批准或修改(步驟 2)。 只有當你無法判斷產品是什麼時,才先詢問。


0. 設定(每次執行,只需幾秒鐘)

SKILL_DIR 是包含此 SKILL.md 的資料夾。 引擎(run.py、adkit/)通常位於其旁邊。 如果只安裝了這個檔案,請獲取引擎一次:

SKILL_DIR="<包含此 SKILL.md 的資料夾>"
ENGINE="$SKILL_DIR"
if [ ! -f "$ENGINE/run.py" ]; then
  ENGINE="$SKILL_DIR/.engine"
  [ -f "$ENGINE/run.py" ] || git clone --depth 1 https://github.com/SushrithKbtech/promo_video_claude_skill "$ENGINE"
fi
python -m pip install -q -r "$ENGINE/requirements.txt"
python "$ENGINE/run.py" doctor

在 Windows 上使用 python,在其他地方如果 python 不存在則使用 python3。 doctor 會檢查 numpy、OpenCV、Pillow、scipy、ffmpeg、無頭 Chrome/Edge(用於 SVG 標誌和網站擷取)以及免費的神經 TTS。 ffmpeg 必須在 PATH 中;如果缺少,請告訴使用者如何安裝它(winget install ffmpeg、brew install ffmpeg、apt install ffmpeg)。

下面的每個命令都是 python "$ENGINE/run.py" <command> <PROJECT>。 一個專案是一個資料夾(放在使用者工作的地方,例如 ./promo-<product>/),包含 brief.json、assets/,以及 build/ 和 out/ 中的輸出。


1. 方法(是什麼讓這些影片看起來很昂貴)

  1. 一道連續的光線貫穿整部影片並且從不停歇地移動。 它在第 0 幀進入,變成標誌,離開它,完成產品中的每一項工作,飛奔回來,並在結尾卡上以一條線結束。 沒有什麼是憑空出現的。
  2. 找到已經存在於標誌中的想法。 一個具有 N 個顏色面的標誌會產生 N 道光。 每道光只做一件事(儲存、尋找、分享/設計、原型、發佈/計畫、追蹤、付款)。 在標誌出現時,它們會回到自己的面。
  3. 在淺色背景下,光就是墨。 疊加光澤在白色上會消失,所以引擎會將光合成為彩色墨水。 在深色背景下則是光澤。 永遠不要在白色上繪製白色核心或閃光。
  4. 曲線,而不是螺旋。 光沿著柔和的貝茲曲線移動,並帶有漸弱的尾跡(強度 w^2)。 僵硬的圓圈看起來很假。
  5. 鉤子是在第一個強拍上的一擊。 在零點幾秒內即可辨識;標誌是每個人最先看到的東西。
  6. 先錄製聲音,為關鍵詞計時,而不是為整個句子計時。 每句台詞的擺放位置,是為了讓其關鍵詞落在對應的畫面節拍上。 永遠不要對聲音進行時間拉伸。
  7. 將標誌放在歌曲的「掉落」點上。 標誌出現是一個強拍;配樂(或使用者的音軌)的建構或偏移,是為了讓其最重要的時刻落在這裡。
  8. 每一個可見的動作都有一個聲音。 大約 50 個提示音:颼颼聲、撞擊聲、滴答聲、按鍵聲、爆裂聲、鈴聲。
  9. 廉價迭代,一次渲染。 先做一半解析度的靜止畫面和聯繫表。 仔細檢查它們。

2. 工作流程

步驟 1:了解產品(2-5 分鐘,無需提問)

  • 提供網址: python "$ENGINE/run.py" capture <url> <PROJECT> 會寫入 capture.json(標題、描述、標題、CTA、導航、CSS 品牌顏色、字型、Google Fonts)以及 assets/screens/desktop.png、mobile.png 和 assets/logo_candidates/。 閱讀 capture.json、閱讀螢幕截圖和標誌候選檔案(圖像),並決定該產品的功能。 如果擷取失敗(機器人保護),請使用 WebFetch/瀏覽器工具或你已知的資訊。
  • 沒有網站的應用程式 / 產品 / 想法: 使用使用者所寫的內容。 不要編造聽起來像聲明的內容(沒有虛假的獎項、價格、使用者數量);保持演示資料明顯是說明性的。
  • 標誌: 偏好官方 SVG(來自 logo_candidates、網站或使用者)。 PNG 也可以。 將其複製到 assets/logo.svg|png。 永遠不要重新繪製、重新著色或扭曲它。 如果確實沒有標誌,則製作一個純文字標記的影片:將 brand.logo 設定為你編寫的乾淨單字母 SVG(一個帶有主色和首字母的圓角方形)並說明。
  • 字型: 如果品牌字型在 Google Fonts 上(font.family),則使用它,否則使用 Inter。
  • 真實 UI 勝過重建的 UI。 當使用者想要展示其實際產品(或者這是他們自己的產品)時,獲取真實的螢幕並使用 screen 場景(以及使用真實螢幕截圖的 devices / phone):
    • 使用者給你的螢幕截圖,或 capture 的輸出(assets/screens/);
    • 即時網站的頁面:為每個 URL 執行 capture,例如 /pricing、/dashboard(如果公開);
    • 儲存庫或網站中的逐步解說 / 示範影片:使用 ffmpeg -ss <t> -i demo.mp4 -frames:v 1 shot.png 提取幀,先製作一個聯繫表(-vf fps=1/3,scale=320:-1,tile=6x7)以找到最佳時刻,然後傳遞 crop 以從幀中裁剪出 UI 並測量幀像素座標中的高亮矩形。 永遠不要為了獲取螢幕而在他人的即時網站上打字、註冊或提交表單;改為向使用者索取螢幕截圖。 當螢幕需要內容時,只填入虛構的資料。

步驟 2:導演影片,然後提出並詢問

按此順序決定:

  1. 影片格式: 影片的形狀(journey、keynote、launch、story、showcase、reel;第 3 節)。 根據產品和使用者的話語來選擇,而不是上次使用的格式。 0b. 標誌性元素: 光的形狀,源自於產品的本質(第 3 節,「標誌性元素」)。 健康產品的標誌性元素是心跳;音頻產品的標誌性元素是聲波。 當它符合故事時,規劃一個帶有 signature 場景的英雄時刻。
  2. 尺寸和長度: 持續時間(預設 21.8 秒;社交媒體剪輯為 15 秒,發佈為 30 秒)、寬高比(預設 16:9;Reels/TikTok/Shorts 為 9:16,字幕會自動開啟)、60 fps。
  3. 外觀: stage.mode 淺色(乾淨的 SaaS、生產力、消費品)或深色(開發工具、AI、金融科技、遊戲、汽車、奢侈品、夜間品牌)。 與產品自身的網站匹配。
  4. 光線: 預設 = 標誌面的顏色。 單色標誌:從網站中挑選 3 種顏色(lights),或一種品牌顏色加上兩個相鄰顏色。
  5. 工作: 將產品轉化為 3-5 個動詞,每個場景一個(下表)。 混合場景類型;永遠不要連續兩次使用相同的場景。 當產品是多平台時以 devices 結束,否則以最有力的證明(chart、features、product)結束。
  6. 過渡: 光的交接(光以標誌性元素的形狀從一個場景飛到另一個場景,並沿尾跡改變顏色)、whip(帶有運動模糊的快速平移)、cut(在節拍上硬切)、wipe(一道光線掃過並揭示下一個場景)、push(攝影機飛過正在退出的場景進入下一個場景)。 容器會自動保持連續性:搜尋 -> 分享(一行生長成頁面),分享 -> devices(頁面飛入手提電腦)。 在一部影片中至少混合三種過渡;永遠不要連續三次使用相同的一種。
  7. 鉤子: "hook": "converge"(光線從邊緣掃入面中)或 "trace"(一道光繪製標誌的輪廓,然後填充色猛然出現;最適合單一形狀的標記)。
  8. 腳本: 像文案撰稿人一樣寫作,而不是功能列表。
    • 弧線:人類的緊張感(今天什麼很困難)-> 轉折(產品)-> 2-4 個證明節拍(你用它所做的事情,用動詞表示)-> 品牌名稱在重音上。 冷開場從緊張感台詞開始;猛烈的開場從證明開始。
    • 每個節拍一行,3-8 個單詞,現在時態,第二人稱(「用一句話描述任何情況。」)。 每行一個關鍵詞,選擇使其落在畫面節拍上。
    • 節奏:平行結構和三段式(「每個檔案。每張照片。每個想法。」),然後是打破模式的一行短句(「一個地方。」)。 大聲朗讀;刪掉每一個沒有價值的詞。
    • 禁止使用:「革命性的」、「無縫的」、「解鎖」、「槓桿」、「遊戲規則改變者」、「一體化」、虛構的數字、產品未做出的聲明。 在合適的地方使用產品自己的詞語。
    • 最後一行是品牌名稱在重音之後("at": "hit+0.3", "role": "brand");結尾卡攜帶標語或 URL,而不是與 VO 相同的句子。
  9. 聲音: 音樂情緒 + 語音(第 5 節)。
產品功能...場景光變成
儲存、匯入、備份、同步檔案upload進度條
搜尋、尋找、檢索、AI 答案search焦點線,然後描繪結果
協作、分享、評論、多人share等待分享,分裂成即時游標
自動化、整合、管線、原型flow從一個節點執行到下一個,留下發光的連接器
分析、成長、財務、健康指標chart繪製線條;數字滾動
AI 助理、聊天、副駕駛chat答案的串流插入符
你想展示的真實 UIscreen在真實螢幕截圖上描繪高亮
宣言式台詞、定位statement寫下文字,圈出關鍵的那個
一次展示許多功能features隨著每個 Bento 卡彈出而描繪它
行動應用程式phone輕觸,然後是通知輪廓
實體產品(汽車、裝置、瓶子)product輪廓上的邊緣光,規格引導線
隨處可用devices三道光芒在裝置後方循環追逐
產品自身的本質(英雄時刻)signature在畫面中繪製產品的象徵圖案

場景的順序是一個故事,而不是一個檢查清單:從觀看者的問題所在處開始(冷開場)或從品牌所在處開始(猛烈開場),逐步建構到最令人印象深刻的證明,並讓標誌落在音樂最重要的時刻。 兩個產品不應共享相同的場景順序。

在構建之前提出影片並詢問。 以一個使用者在十秒內就能閱讀的分鏡圖形式展示計劃,然後詢問。 範例:

FIGMA · "launch" 格式 · 21.8 秒 · 16:9 · 淺色背景 · 標誌性元素:火花
音樂:亢奮(自有歌曲) · SFX 調色盤:有力 · 語音:Ava(女聲,溫暖)

0.0   追蹤鉤子:一道光繪製 Figma 標記 -> 在強拍上猛然出現
1.1   光寫下「Figma」
3.0   share     即時游標飛到設計畫布上  「一起設計。」
8.6   flow      (whip) 光執行 首頁 > 購物車 > 結帳  「幾分鐘內建立原型。」
11.0  chat      (wipe) 一個提示變成定價頁面  「只要問。」
13.9  devices   (push) 頁面降落在筆電、平板、手機上  「在每個螢幕上。」
16.3  硬切到落在重音上的標誌 -> 「Figma。」 -> 結尾卡 「由 ... 製作」

然後,在 AskUserQuestion 工具可用時使用它進行提問(否則用一般問題),例如:「渲染這個?」並提供選項「是,製作它」/「更改腳本」/「不同風格或音樂」/「其他」。 應用使用者所說的內容(新的台詞、場景、順序、語音、情緒、長度、顏色),並且只有在變動很大時才再次顯示更新後的分鏡圖。 只有當使用者已經說過「直接做吧」、「不要問問題」或類似內容,或者給你一個完整的簡報時,才跳過這個問題。

在靜止畫面(步驟 4)之後,也要在使用者進行長時間的最終渲染之前,將聯繫表圖像發送給他們,這樣他們可以提前停止。

步驟 3:撰寫 brief.json(第 4 節),然後是語音

python "$ENGINE/run.py" voice   <PROJECT>      # 神經 TTS,單詞時間,放置關鍵詞

它會列印每個關鍵詞落下的位置。 如果兩行重疊,請縮短一行或移動錨點。

步驟 4:靜止畫面,查看,修正

python "$ENGINE/run.py" stills <PROJECT>                    # 大約 20 個關鍵時刻 + build/stills/sheet.png
python "$ENGINE/run.py" stills <PROJECT> --times 3.2,9.8    # 特定時刻
python "$ENGINE/run.py" sheet  <PROJECT> --every 0.5        # 整部影片,每 0.5 秒一幀

閱讀 sheet.png。 像導演一樣檢查:光是否總是活躍的,每一次交接是否連續,文字在需要閱讀時是否靜止不動,沒有重疊,沒有在畫面邊緣被裁切(尤其是 9:16),顏色符合品牌,沒有預留位置文字,沒有錯誤的產品名稱。 修正簡報(資料、權重、顏色)並重新渲染靜止畫面。 進行兩到三次迭代是正常的。

步驟 5:預覽,然後是最終版本

python "$ENGINE/run.py" preview <PROJECT>   # 960x540 @30,完整混音  -> out/<name>_preview.mp4
python "$ENGINE/run.py" final   <PROJECT>   # 1920x1080 @60,完整混音 -> out/<name>_final.mp4
python "$ENGINE/run.py" check   <PROJECT>   # 幀數、持續時間、LUFS、真實峰值、卡頓尖峰

渲染會以並行方式執行 60 幀的片段,並在崩潰後恢復:重新執行會跳過已完成的片段。 更改後,刪除 build/segs_final(或傳遞 --only 9-12 以僅重做 9-12 秒附近的片段)。

預設情況下,渲染是機器安全的:工作者數量會根據當前可用的 RAM 來調整(每個 1080p 工作者約 0.9 GB,預覽大小約 0.5 GB),同時為使用者的應用程式保留 12% 的 RAM,上限為 CPU 核心數的一半;工作者以低於正常的優先級執行,每個 ffmpeg 編碼器使用 2 個執行緒。 在一台忙碌的 16 GB 筆記型電腦上,這可能意味著 1-2 個工作者(一部 30 秒的 1080p60 影片則需要 15-25 分鐘);在 RAM 更充裕的情況下,它會擴展。 --workers N 設置一個上限,但從不超過可容納的數量。 提前告訴使用者最終渲染需要多長時間,並始終在背景中運行。

步驟 6:移交

將 MP4 路徑、你使用的節拍表以及你想標記的任何內容提供給使用者。 用一行文字提供明顯的變體(9:16 剪輯、深色版本、15 秒剪輯、另一種情緒)。 每一個都是一個簡短的編輯。


3. 讓每部影片獨一無二

引擎是一個詞彙庫,而不是一個模板。 兩部影片絕不應該看起來或聽起來一樣。

在指導之前,運行 python "$ENGINE/run.py" history。 它會列出此機器上渲染的最後幾部影片的創意選擇(格式、結尾、開場、鉤子、背景、情緒、語音、場景……)。 避免使用這些參數。 如果你要重新建立一個先前的選擇,請解釋為什麼它對這個特定產品是正確的。

相關技能