HyperFrames 是什麼、怎麼安裝使用：HeyGen 開源的「寫 HTML、出影片」框架與 Agent Skills

本文根據 heygen-com/hyperframes 倉庫 README 與 skills.sh 榜單整理，資料核對於 2026-10-11。技能數量和命令更新較快，以倉庫 README 為準。

是什麼

HyperFrames 是數字人影片公司 HeyGen 開源的框架，口號是「寫 HTML，渲染影片，為智能體而建」。它把一段影片定義成一個 HTML 文件：用 data 屬性標註時間和軌道，動畫可以用 GSAP、CSS、Lottie、Three.js、Anime.js 或瀏覽器原生動畫接口來寫。渲染時由無頭 Chrome 逐幀定位、FFmpeg 編碼，所以同樣的輸入永遠得到同樣的影片。

README 專門有一節和 Remotion 對比：兩者都靠無頭 Chrome 和 FFmpeg 出片，區別在創作模型——Remotion 押注 React 組件，HyperFrames 押注「人和智能體都容易寫的純 HTML」，不需要構建步驟。許可上，HyperFrames 是 Apache 2.0，README 強調沒有按次渲染費用，也沒有商用門檻。

截至 2026-10-11，GitHub 顯示該倉庫約 6.0 萬 Star、5378 Fork，最近一次推送在 2026-10-10；skills.sh 當日榜單上它的多個技能排在前列。

包含哪些 Skill

README 稱共 21 個按需加載的技能，分三層：

• 路由：/hyperframes，任何「做個影片 / 動畫 / 動態圖形」的請求都先讀它，它確認創作意圖並分流；
• 創作流程：/product-launch-video（圍繞一個網站做產品發佈或宣傳片）、/faceless-explainer（把任意文本講成不出鏡的講解影片）、/pr-to-video（把 GitHub PR 做成更新說明影片）、/music-to-video（圍繞一段音樂做畫面）、/slideshow（演示文稿式的分頁內容）、/general-video（其他情況）等；
• 領域技能：創作流程按需調用的原子能力，如 CLI 用法、動畫、音頻、關鍵幀、組件目錄。

怎麼安裝

Claude Code（README 推薦）：

bash
claude plugin marketplace add heygen-com/hyperframes
claude plugin install hyperframes@hyperframes

之後用 /hyperframes:hyperframes 調用；README 建議在 /plugin → Marketplaces 裏給這個市場打開自動更新。

其他智能體：

bash
npx skills add heygen-com/hyperframes

選擇器預設什麼都不勾，README 說只選「Core Skills」一組就夠，路由會按需安裝各創作流程。想要與主分支完全同步的版本，用 npx hyperframes skills update。

不經智能體也能直接用 CLI：npx hyperframes init my-video 建項目，npx hyperframes preview 預覽，npx hyperframes render 渲染成 MP4。

怎麼用

• README 的示例：「用 /hyperframes 做一個 10 秒的產品介紹，標題淡入，帶背景影片和輕微的背景音樂」；
• 「把我們官網首頁做成 45 秒的發佈宣傳片」——走 /product-launch-video；
• 「把這個 PR 的改動做成一段更新說明影片」——走 /pr-to-video。

技能教給智能體的是一個生產循環：規劃 → 寫合法的 HTML → 接好可定位的動畫 → 加媒體 → 檢查 → 預覽 → 渲染。

適合誰 / 不適合誰

適合：

• 想讓編程智能體直接產出產品演示、功能更新、講解類短片的團隊和獨立開發者；
• 會一點前端、想用代碼批量生成影片的人；
• 介意 Remotion 許可條款的商業項目。

不適合：

• 需要實拍剪輯、複雜調色的傳統影片工作；
• 想要 AI 生成畫面本身的人——它渲染的是你（或智能體）寫出來的網頁動畫，不是文生影片模型。

注意事項

• 許可證：Apache-2.0。
• 本機環境：渲染依賴 Node、Chrome 和 FFmpeg，README 也提供 Docker 方式；長影片渲染吃 CPU 和時間。
• 素材版權：做宣傳片時會抓取網站畫面、使用音樂和字體，確認你有權使用這些素材。
• 與 HeyGen 付費產品的關係：框架本身開源免費；README 提到它也可以作為託管創作流程背後的渲染核心，HeyGen 在線服務的費用與條款以其官網為準。
• skills.sh 的註冊內容可能比主分支滯後幾小時，README 對此有說明。