短影音自動產製:從 HTML 模板到 FFmpeg 的完整技術流程
短影音的暴力效率
15 秒的影片,能傳達的資訊量遠超一段 200 字的文字。在 Instagram Reels、YouTube Shorts、TikTok 上,短影音的觸及率和互動率都是最高的內容格式。
問題是:製作一支短影音太耗時了。
用 Premiere Pro 或 CapCut 手動剪一支 15 秒的影片,從構思到完成至少要 30-60 分鐘。如果一天要發 3-5 支呢?
我們的解法:用程式自動產製。
系統架構總覽
Ultra Lab 的短影音自動產製系統分為三個階段:
HTML 動畫模板 → Playwright 擷取 → FFmpeg 合成
階段一:HTML 動畫模板
用網頁技術(HTML + CSS + JavaScript)製作影片的每一幀動畫。
為什麼用 HTML 而不是 After Effects?
- 可程式化:文字、數字、顏色都可以用變數控制
- 模板化:一個模板可以套用上百種不同的內容
- 不需要 Adobe 授權:開源技術,零成本
- 版本控制:模板就是程式碼,可以用 Git 管理
一個典型的模板結構:
<div class="video-container" style="width:1080px; height:1920px;">
<div class="background-animation">...</div>
<div class="text-layer">
<h1 class="hook-text">你知道嗎?</h1>
<p class="main-content">90% 的人不知道這件事...</p>
</div>
<div class="cta-layer">
<span>追蹤 @ultralab.tw</span>
</div>
</div>
CSS 動畫處理所有的進場、強調、轉場效果:
.hook-text {
animation: slideUp 0.6s ease-out 0.5s both;
}
.main-content {
animation: fadeIn 0.8s ease-out 1.5s both;
}
階段二:Playwright 擷取
Playwright 是一個無頭瀏覽器自動化工具。我們用它來:
- 開啟 HTML 模板頁面
- 等待動畫播放完成
- 逐幀擷取螢幕截圖(30 FPS = 每秒 30 張圖)
- 輸出為圖片序列
為什麼是 Playwright 而不是 Puppeteer?
- 支援更多瀏覽器引擎
- 對 CSS 動畫的渲染更精準
- 內建等待機制,不容易漏幀
每一幀是一張 1080×1920 的 PNG 圖片,一支 15 秒的影片大約產生 450 張圖。
階段三:FFmpeg 合成
FFmpeg 是影音處理的瑞士刀。我們用它把圖片序列合成為最終影片:
ffmpeg -framerate 30 -i frame_%04d.png \
-i background_music.mp3 \
-c:v libx264 -pix_fmt yuv420p \
-shortest output.mp4
在這個階段,我們同時加入:
- 背景音樂:從預設的音樂庫中自動選取
- 音效:文字出現時的提示音
- 字幕軌:自動生成的 SRT 字幕
三種心理觸發模板
我們設計了三類經過驗證的短影音模板,每類都對應不同的心理觸發機制:
恐懼型(Fear)
開場用令人擔憂的數據或事實,引發「我是不是也有這個問題?」的焦慮。
例如:
- 「90% 的人退休金不夠用」
- 「你的密碼可能已經被洩漏了」
效率型(Efficiency)
展示一個快速解決問題的方法,讓觀眾覺得「原來這麼簡單」。
例如:
- 「3 步驟自動化你的 IG 發文」
- 「這個工具讓我每天省 2 小時」
貪婪型(Greed)
展示潛在的收益或機會,引發「我也想要」的渴望。
例如:
- 「這個副業月入 5 萬」
- 「一個 SaaS 工具年營收 100 萬」
每類模板有 3-5 種視覺變化,總共 10-15 個模板可以輪替使用,避免觀眾看膩。
批量產製的工作流程
實際運作的完整流程:
- 每週一次:設定本週的主題和內容方向
- AI 自動生成:根據模板類型,用 Gemini 生成文案
- 自動套入模板:程式把文案塞進 HTML 模板
- 批量擷取:Playwright 對每個模板逐一擷取
- 批量合成:FFmpeg 批次合成所有影片
- 排程發布:影片自動進入發布佇列
一次批量處理 20 支影片,大約需要 15-20 分鐘(取決於電腦效能)。
成本結構
| 項目 | 成本 |
|---|---|
| HTML 模板開發 | 一次性(已內含在服務中) |
| Playwright + FFmpeg | 開源免費 |
| AI 文案生成 | NT$300-500/月 |
| 伺服器 / 本機運算 | 現有設備即可 |
| 背景音樂授權 | 免費素材庫 |
| 月總成本 | NT$300-500 |
相比外包一支短影音(NT$1,000-3,000/支),自動產製系統的成本是手動的 1/100。
適合誰?
- 品牌主:需要持續產出短影音但沒有剪輯團隊
- 自媒體經營者:一個人要管多個平台的短影音
- 行銷代理商:幫客戶批量製作短影音
- 電商賣家:產品展示、促銷倒數、開箱短影音
結語
短影音自動產製不需要你會 After Effects,也不需要昂貴的軟體授權。用 HTML + Playwright + FFmpeg 這套開源組合,就能建立一條高效率的短影音產線。
想了解更多技術細節,或想直接使用我們的系統?免費諮詢,24 小時內回覆。