podo/design-agent-skills

hyperframes

目錄存根 — 完整套件：heygen-com/hyperframes

注意： 需要 HeyGen 帳戶才能使用 TTS 與媒體生成功能。

決策樹

1. 套件是否已安裝？ 檢查：你的代理技能目錄中是否包含 hyperframes 且內容超過此存根。

   • 是 → 呼叫 hyperframes 並繼續
   • 否 → 前往步驟 2

2. 你使用哪個代理？

   • Claude Code → npx skills add heygen-com/hyperframes — 或以聊天訊息傳送 ! npx skills add …（加上 -g 為全域安裝，不加則僅限專案）
   • Cursor → npx skills add heygen-com/hyperframes
   • 其他 → npx skills add heygen-com/hyperframes 或參考 GitHub README

安裝指令

npx skills add heygen-com/hyperframes

需要 HeyGen 帳戶才能使用 TTS、轉錄與影片渲染功能。動畫編寫功能無需帳戶即可使用。

安裝後呼叫

• 技能名稱：hyperframes
• 觸發詞句："hyperframes"、"HTML to video"、"HeyGen"、"render video from HTML"、"Anime.js"

功能說明

「撰寫 HTML。渲染影片。」 — 一套專為需要從 HTML 組合產出影片輸出的 AI 編碼代理設計的 11 項技能套件。涵蓋：組合編寫（建立 HTML/CSS/JS 場景）、透過 HeyGen 進行的文字轉語音與轉錄、CLI 驅動的渲染工作流程、用於重複使用媒體的資產註冊、用於捕捉即時網頁內容的 URL 捕獲，以及六個動畫子技能，橫跨 GSAP、Anime.js、純 CSS 動畫、Lottie 播放、Three.js 3D 與 Web Animations API (WAAPI)。專為代理驅動的影片製作流程從頭設計。

何時不應使用

• 需要靜態動畫但無需影片輸出時（請改用 gsap-skills、framer-motion-skills 或 animate-css-skill）
• 當你沒有 HeyGen 帳戶時 — 媒體生成功能（TTS、影片渲染）將無法運作