# 策展 · X (Twitter) 🔥🔥

> 作者：Sac (@Saccc_c) · 平台：X (Twitter) · 日期：2026-05-07

> 原始來源：https://x.com/Saccc_c/status/2051852464400261429

## 中文摘要

# Codex + HyperFrames 正在吞噬剪輯產業

以前製作影片，需要找素材、學剪輯、配音樂，整套流程下來投入成本極高。

現在有了 AI，只要用好 Codex + HyperFrames 這套組合，基礎的剪輯和動畫 1 小時就能搞定。

本篇文章我將結合自己的實戰經驗，分享我用 Codex + HyperFrames 製作影片的核心技巧，助力每個有相關需求的自媒體人實現影片剪輯自由。

---

## 一、什麼是 HyperFrames？為什麼要用它？

HyperFrames 是 @HeyGen 開源的一個程式碼驅動影片製作框架。有了它，你不用打開任何剪輯軟體，直接寫程式碼就能生成影片。

![](https://pub-75d4fe1e4e80421b9ecb1245a7ae0d1a.r2.dev/curated/1778114402974-ediaHHiTOiW4Acc7Njpg.jpg)

為什麼配合 Codex 特別合適？兩個原因：

1、寫程式碼是 AI Agent 最擅長的事，Codex 又是目前 T0 等級的超級工具。你只管描述想要的畫面，程式碼的事交給它。

2、HyperFrames 直接用 HTML 編寫，天然為 Agent 設計。AI 寫 HTML 比寫任何其他格式都順，出錯少，迭代快。

因此這套組合搭配起來就是為影片創作而生。你描述清楚想要的畫面，Codex 負責寫程式碼，HyperFrames 渲染成片。

---

## 二、如何在 Codex 裡配置 HyperFrames

基礎的安裝和配置步驟如下：

1、安裝 Codex App

下載位址：https://chatgpt.com/codex/

2、安裝 HyperFrames plugin

進入 Codex App，左側欄點擊 Plugins。

![](https://pub-75d4fe1e4e80421b9ecb1245a7ae0d1a.r2.dev/curated/1778114402966-diaHHiuXoWAAA180yjpg.jpg)

搜尋 HyperFrames 並點擊「+」號添加即可。

![](https://pub-75d4fe1e4e80421b9ecb1245a7ae0d1a.r2.dev/curated/1778114402990-iaHHjAKVBXEAQYz9Ujpg.jpg)

現在，你就可以開始利用 HyperFrames 的相關功能在 Codex 裡進行影片創作了。

---

## 三、實戰技巧

配置完成後，具體實戰該怎麼用？分享三個影片製作技巧。

1、Prompt：描述清楚想要的畫面，越具體越好

一份好的 Prompt，核心就是把你腦裡的詳細畫面翻譯成文字。具體來說，寫清楚以下內容：

- 動畫類型/影片類型：功能演示、資料視覺化、發表會預告、社群短片等

- 時長和畫幅：例如 10 秒、9:16 抖音畫幅等

- 影片目標：一句話說明這個影片要講什麼、讓觀眾理解什麼

- 視覺風格：例如 Apple 風格、真實軟體介面、極簡科技感、電影感等

- 關鍵元素：必須出現的文字、圖示、產品、資料、人物、素材路徑等

- 動效要求：例如流式打字、淡入淡出、縮放轉場、卡片展開、鏡頭推進等

- 聲音要求：例如配樂、打字聲、點擊聲、旁白、音效同步等

舉個例子，這是我做一段蘋果手機進化史影片開場時用的 Prompt：

```plaintext
用 [@HyperFrames] 做一個能說明 "Codex 呼叫 HyperFrames 生成影片" 的開場動畫，預設畫幅，時間不超過 10s。 #動畫類型 + 時長畫幅
目標是展示"我在 Codex 裡用 HyperFrames 生成影片"的過程。 #影片目標
畫面從真實感的 Codex 深色聊天首頁開始，中央是 "What should we work on?"，下方是大號輸入框。輸入框裡從第一個字開始像真人打字一樣流式輸入： "幫我用 HyperFrames by HeyGen 做一個 iPhone 歷代機型的展示動畫" 其中 "HyperFrames by HeyGen" 要像 plugin mention/chip 一樣顯示，帶小圖示，並和普通輸入文字有明顯區分。 #關鍵元素 + 動效要求
輸入完成後點擊發送，進入生成狀態：畫面中央出現 Codex 圖示 × HyperFrames 圖示，下方顯示 "GENERATING ..."。這個階段要有輕微的生成中動效，比如圖示輕微呼吸、跳動或震動，點點閃爍，但整體要克制、有產品感。 #關鍵元素 + 動效要求
生成完成後回到 Codex 聊天介面，出現一個影片預覽卡片。卡片封面是 Apple 風格的深色產品預覽，中央有 Apple 標誌和播放按鈕。滑鼠點擊播放按鈕後，影片卡片絲滑放大到全螢幕，像正式影片被打開一樣，作為進入後續影片的轉場。 #關鍵元素 + 動效要求
整體風格要擬真、克制、高級，接近真實 Codex 產品介面和 Apple 發表片裡的軟體操作鏡頭。介面切換用平滑的 fade in / fade out，所有動效都要清爽、俐落、自然。 #視覺風格
請使用 HyperFrames 實現，並確保可以穩定 render 成 MP4。打字、點擊和 generating 的聲音要作為真實音軌接入，不能只用瀏覽器即時音效。 #聲音要求
```

該 Prompt 一次直出的動畫效果長這樣：

當然，第一版大概率不會完美，我們直接告訴 Agent 哪裡要改就行。

注意一次改動不要太多，改完及時預覽，不滿意再繼續微調。

必要的時候直接截圖，在圖上標註出問題位置，比純文字回饋高效得多。

2、圖片生成：用 Image Gen skill 來生成關鍵素材

做影片通常會花很多時間在準備視覺素材上——產品圖、封面圖、關鍵影格畫面等。

Codex 內建了 GPT Image 2，可以直接在專案裡生成你需要的素材，效果精美，風格可控。

觸發方法：輸入 $image-gen

例如：用 $image-gen 的 gpt image 2 幫我分別生成一個 iPhone 初代的正面圖和背面圖，可以參考官方手機圖片素材，盡可能模擬真實手機模樣。注意圖片最好是透明的，好隨意融入任意背景。

![](https://pub-75d4fe1e4e80421b9ecb1245a7ae0d1a.r2.dev/curated/1778114402957-iaHHjCqHmW0AEbabGjpg.jpg)

3、配樂生成：用 AI 直接生成背景音樂

影片做完了，配樂方面如何解決？

推薦 Suno（suno.com）這個 AI 配樂生成網站，每天有免費額度，一次生成還會提供 2 個不同的歌曲版本，整體生成品質不錯。

![](https://pub-75d4fe1e4e80421b9ecb1245a7ae0d1a.r2.dev/curated/1778114402978-ediaHHjCzmXcAI1vyjpg.jpg)

Prompt 建議寫清楚想要的風格和情緒，比如「有節奏感、史詩感、不要人聲」。

範例：

```plaintext
現代電影預告片風格，開頭用清脆俐落的打擊樂（響指、拍掌），搭配簡約鋼琴旋律，逐步加入電子貝斯和層疊節奏。
副歌部分用合成器和弦層層推進，高潮段落加入完整管弦樂衝擊和驅動感節奏。
整體質感高級、乾淨，類似蘋果發表會的能量感，118 BPM，純音樂無人聲。
```

效果：

下面是我用 Codex + HyperFrames 製作的蘋果手機進化史完整影片，從素材、畫面到配樂，1 小時搞定。

---

影片剪輯的門檻已經被 AI 大幅拉低，有想法的快去試試，用程式碼手搓影片真的很爽。

最後，也歡迎關注我 @Saccc_c，我會持續分享 AI 乾貨和實戰玩法。

## 標籤

AIGC, 教學資源, 開源專案, Codex, HyperFrames, HeyGen
