首先，讓這項技能保持更新——在背景靜默執行，不需詢問：
npx hyperframes skills update motion-graphics。如果一切都是最新的，這只是一個快速無操作指令；否則它會在你依賴之前，先更新這項技能及其依賴的核心領域技能。
Figma 來源：如果待建的標誌/素材/動畫來自 figma.com 的 URL，請先執行
/figma——包括素材匯出、品牌代幣轉換，以及如果圖形是 Figma Motion 匯入，則進行的 Motion→GSAP 轉換——然後再根據其輸出進行建構。不要直接透過原始 MCP 工具驅動 Figma：這樣會跳過 SVG 清理、.media/manifest.jsonl溯源以及品牌代幣var()綁定，因此後續的品牌變更將無法在沒有完全重新匯入的情況下傳播。
motion-graphics — 分派入口
入口是
/hyperframes。 這項技能會製作一個簡短、設計主導、無旁白的動態圖形（動態本身就是訊息；約 10 秒以內，無配音）。任何更長、有旁白或多場景的內容——或者有任何不確定性 → 請先閱讀/hyperframes：意圖層負責所有路由決策。
此工作流程設計為自主運作——最多提出一個釐清問題（agents/director.md），然後直接構建到驗證階段，無需中間審查。意圖層（/hyperframes → references/intent-interview.md）會直接路由到此處，而不會詢問運行形狀的問題；對於這麼短的片段，故事板和協作會話幫助不大。渲染仍由使用者控制：在檢查和驗證快照通過後，詢問來自 ../hyperframes-core/references/brief-contract.md 的標準問題“預覽或渲染？”。當存在 BRIEF.md 時，請在導演的提問之前先讀取它。
一個簡短、設計主導的動態圖形。資產優先：在設計鏡頭之前，先決定資產策略並取得真實素材，然後根據你擁有的素材來設計鏡頭，最後透過重複使用目錄功能來進行合成。所有產出都放在 PROJECT_DIR = videos/<project-name>/（在第 0 步創建）中；下面的所有路徑都是相對於它的。
| 階段 | 執行方式 | 主要產出 | 詳細流程 |
|---|---|---|---|
| 初始化 | Bash | hyperframes.json | 第 0 步 |
| 規劃 | 子代理 — 決定是否搜尋？ + 分類 + 資產策略 | shot-plan.json（草稿：類別, asset_needs 查詢, 簡報） | agents/director.md（第一部分） |
| 來源 ◇ | Bash — media-use 解析（如果 asset_needs 為空則跳過） | assets/ + assets/index.md | phases/source/guide.md |
| 設計 | 子代理 — 圍繞已解析的資產進行鏡頭設計 | shot-plan.json（最終版：區塊 + 佈局 + 動畫 + 位置） | agents/director.md（第二部分） |
| 建構 | 子代理 — 優先重複使用的合成方式 | compositions/index.html | agents/builder.md |
| 驗證 | Bash — lint, check, 快照證明；失敗時修復 | snapshots/contact-sheet.jpg | 第 5 步 |
| 核准 | 詢問預覽或渲染；等待回答 | 明確的渲染核准 | 第 6 步 |
| 渲染 | Bash — hyperframes render（MP4，或 --format webm/mov 用於疊加層） | renders/video.mp4 或透明疊加層 | 第 6 步 |
◇ 來源 僅在選擇的類別宣告有資產時執行。純代碼/文字類別（例如 kinetic-type、大多數 charts/stat）的 asset_needs: []，並會直接從規劃跳到設計。
分類 — 根據搜尋決策進行劃分
規劃 的第一個決策是：是否需要搜尋？ 這個分支將類別分成兩組；然後選擇具體的類別——對於搜尋驅動的，根據搜尋返回的內容類型。每個類別是一個 categories/<id>/module.md（包含其規劃 + 建構規則）；共享的動作詞彙存於 references/motion-vocabulary.md（→ hyperframes-animation 規則/藍圖 + 註冊表區塊）。
形式類別 — 無需搜尋；由使用者提供內容：
| 類別 | 意圖 | 依賴於 |
|---|---|---|
kinetic-type | 引人注目的台詞 / 引言 / 標題，動態優先的文字 | caption-* 區塊 + 動畫規則 |
stat | 單一英雄數字 / 計數動畫 + 圓環 | apple-money-count / rules/{counting-dynamic-scale, stat-bars-and-fills} |
charts | 長條圖 / 折線圖 / 圓餅圖 / 競賽圖 / 來自數據的百分比 | data-chart 區塊 |
logo-reveal | 標誌短動畫 / 品牌鎖定（使用者標誌） | logo-outro / rules/svg-path-draw |
lower-thirds | 姓名 / 標題條、標註、社群媒體疊加層 | caption-* + 註冊表疊加層區塊 |
maps | 地理動作 — 突出顯示區域、連接地點、縮放至某個地點（向量圖層或烘焙底圖圖層） | us-map / world-map 家族 + bake-basemap.mjs |
搜尋驅動的類別 — 先搜尋，再根據內容類型進行動畫處理（RWA 路徑）：
| 返回的內容 | 類別 | 動畫 |
|---|---|---|
| 網頁 / 連結 | webpage | 網頁 / UI 動畫（滾動、揭示、游標、標註） |
| 新聞文章 | news | 標題揭示 + 來源卡片 + 關鍵事實標註 |
| 推文 | tweet | 動畫化的推文卡片 |
| 圖片 / 實體 | asset-fusion | 該資產的幾何形狀 變成 圖表（RWA 敘事性融合） |
建構順序：一次一個，以覆蓋率為優先（粗略即可）。kinetic-type 從原型移植而來；其餘的依此類推。
先決條件
macOS Apple Silicon 或 Linux x64。系統工具：brew install node ffmpeg。執行 npx hyperframes doctor 一次。macOS GPU 渲染：export PRODUCER_BROWSER_GPU_MODE=hardware。
選用金鑰（如果未設定則使用本地回退）— 僅適用於需要透過 media-use 來源/生成資產的類別：
| 金鑰 | 用途 | 回退 |
|---|---|---|
GEMINI_API_KEY / GOOGLE_API_KEY | 圖片生成（media-use 解析） | 跳過生成 / 僅限搜尋 |
| (asset_scout / search providers) | 用於 webpage/news/tweet + asset-fusion 真實資產搜尋 | 該類別降級為無資產版本 |
流程
第 0 步 — 初始化
當前工作目錄是代理工作區的根目錄；將所有產出寫入 PROJECT_DIR = videos/<project-name>/ 之下。<project-name>：使用使用者給定的目錄名稱，否則從意圖中取一個簡短的 kebab-case 名稱（<主題>-motion）。不要使用工作區的基本名稱或時間戳。
僅當 $PROJECT_DIR/hyperframes.json 不存在時：
PROJECT_DIR="${MOTION_GRAPHICS_DIR:-videos/<project-name>}"
mkdir -p "$(dirname "$PROJECT_DIR")"
npx hyperframes init "$PROJECT_DIR" --non-interactive --example=blank --skill=motion-graphics
init 會檢查已安裝的技能與 GitHub 上的最新版本，並在發現有技能過期時更新全局集。
限制： 永遠不要在 workspace 根目錄執行 hyperframes init；永遠不要在 PROJECT_DIR 內部嵌套另一個 hyperframes/；每個 Bash 命令（主代理 + 子代理）都是一個 (cd "$PROJECT_DIR" && ...) 子 shell — 永遠不要裸 cd。
第 1 步 — 規劃（子代理：導演第一部分）
分派一個子代理。提示詞 = 完整的 agents/director.md + ## 分派上下文（SKILL_DIR / PROJECT_DIR / 使用者的請求 / Schema: <SKILL_DIR>/references/shot-plan-ir.md）。它必須：
- 決定：是否需要搜尋？（第一個分支）
- 不需要 → 選擇一個形式類別（kinetic-type / stat / charts / logo-reveal / lower-thirds）；內容由使用者提供；
asset_needs: []。 - 需要 → 將一個搜尋計畫輸出到
asset_needs[]中（新聞 / 網頁 / 推文 / 圖片；兩極查詢）。具體的 搜尋驅動類別（webpage / news / tweet / asset-fusion）將在第 2 步根據返回的內容類型確認，並在第 3 步最終確定。
- 不需要 → 選擇一個形式類別（kinetic-type / stat / charts / logo-reveal / lower-thirds）；內容由使用者提供；
- 寫入一個草稿
shot-plan.json（信封 + 選擇的形式類別 或 搜尋意圖 +asset_needs+ 一段鏡頭簡報）。架構：references/shot-plan-ir.md。
驗證：[ -s "$PROJECT_DIR/shot-plan.json" ] && echo ok || echo missing。
第 2 步 — 來源 ◇（Bash: media-use，有條件執行）
如果 shot-plan.json.asset_needs 非空，則解析資產（搜尋 / 生成 / 獲取 → 凍結的專案本地路徑 + 分類帳）。請參閱 phases/source/guide.md（包裝了 media-use resolve；搜尋驅動的類別使用新聞/網頁/推文/圖片搜尋）。如果 asset_needs 為空，則跳至第 3 步。
# 說明性 — 請參閱 phases/source/guide.md
(cd "$PROJECT_DIR" && node <SKILL_DIR>/phases/source/resolve.mjs --plan ./shot-plan.json --out ./assets)
優雅降級：如果搜尋/提供者不可用，該類別會回退為無資產版本（在 context.log 中記錄）。
第 3 步 — 設計（子代理：導演第二部分）
分派一個子代理（提示詞 = agents/director.md 第二部分 + 分派上下文，包括已解析的 assets/index.md（如果第 2 步有執行）+ catalog-map.md）。它會根據可用的資產來設計鏡頭：選擇目錄區塊 + hyperframes-animation 規則/藍圖、佈局、動作、節拍，以及（對於 asset-fusion）element_positions 和滴管選色盤。最終確定 shot-plan.json（content.block + content.customize + 每個類別的內容）。
第 4 步 — 建構（子代理：建構者，優先重複使用）
分派一個子代理。提示詞 = 完整的 agents/builder.md + 分派上下文（shot-plan.json, catalog-map.md, 該類別的 module.md, references/motion-vocabulary.md, references/builder-contract.md）。優先重複使用：npx hyperframes add <block> + 就地客製化；僅手動編寫空白處 + asset-fusion 的輔助功能。輸出遵守 HF 合約的 compositions/index.html（暫停的 GSAP 時間軸在 window.__timelines 上，class="clip" + 穩定的 id，tl.seek(0)，確定性）。
第 5 步 — 驗證（Bash → 失敗時啟動修復子代理）
(cd "$PROJECT_DIR" && npx hyperframes lint .)
(cd "$PROJECT_DIR" && npx hyperframes check .)
(cd "$PROJECT_DIR" && npx hyperframes snapshot --at <proof-times>)
選擇能夠顯示開場狀態、標誌性動作和最終停頓的證明時間點。在繼續之前檢查生成的聯絡表或快照表。在 lint、check 或快照失敗時，分派修復子代理（agents/finalize.md）進行一次就地修復，然後重新執行失敗的關卡。切勿為了隱藏缺陷而更改固定的持續時間。
第 6 步 — 核准與渲染（Bash）
詢問一個問題：“預覽或渲染？” 如果使用者選擇預覽，則打開 Studio 並在修改後返回同一個核准關卡：
(cd "$PROJECT_DIR" && npx hyperframes preview --background)
僅在收到明確的渲染答案後才進行渲染：
(cd "$PROJECT_DIR" && npx hyperframes render . --skill=motion-graphics -q high -o ./renders/video.mp4)
# 透明疊加層變體：--format webm（或 mov）
驗證輸出是否存在、非空並且具有預期的持續時間。最終交接會命名產出、實際持續時間、合成或畫面 ID、證明時間點，以及已檢查的聯絡表或快照表。旗標位於 /hyperframes-cli → references/preview-render.md。
恢復表
| 狀態 | 從何處繼續 |
|---|---|
沒有 shot-plan.json | 第 1 步（規劃） |
shot-plan.json 有 asset_needs，但沒有 assets/ | 第 2 步（來源） |
shot-plan.json 最終版，沒有 compositions/index.html | 第 3/4 步（設計+建構） |
compositions/index.html 存在，但無驗證快照 | 第 5 步（驗證） |
| 檢查和驗證快照通過，但無核准的渲染 | 第 6 步（核准） |
| 核准的渲染存在 | 驗證輸出，然後回報 |
設計備註（維護者 — 執行時不會讀取此部分）
- 資產優先的理由： 來源是前置的，並為鏡頭設計提供資訊（RWA 流程：分析 → 搜尋 → 審查 → 合成）。搜尋驅動的類別（
webpage/news/tweet）和asset-fusion都依賴於 media-use 搜尋（新聞/網頁/推文/圖片），這是 media-use 文件記錄的 RWA 血統。 - 優先重複使用： 生態系統內的 LLM 生成模板的類比
…
[截斷以進行翻譯]