HyperFrames Creative
品牌、節奏、風格、旁白與構圖方向。在 hyperframes-core 的技術合約就緒後使用。
對於動態模式、場景藍圖、轉場與 CSS 標記效果，請使用 hyperframes-animation — 此技能刻意專注於非動畫領域。
對於任何非平凡的構圖，請先閱讀以下兩份文件 — 它們會覆蓋網頁直覺：
references/house-style.md— 「解讀提示，生成真實內容」、惰性預設清單，以及背景/前景圖層配方。這能將字面上的重新風格化轉變為一個_概念_。references/video-composition.md— 影片媒介的比例、深度與前景細節。它說明了如何避免空洞的網頁版面，而無需強加統一的元素數量。跳過這些文件是產生通用、網頁式輸出最常見的原因。它們在下方路由表中並非可選欄位 — 對於任何超過一行編輯的工作，在選擇顏色或撰寫 HTML 之前，請打開這兩份文件。
工作流程
- 若專案已有設計規格，請先閱讀該規格，並將其前端元數據視為品牌真理（色彩、字型、間距、語氣、限制）。應讀取哪個檔案（優先順序
frame.md→design.md→DESIGN.md）以及如何解析（前端元數據 = 規範性，正文 = 上下文）在references/design-spec.md中有明確定義 — 請按照該文件解析並載入。 - 若無設計規格，且使用者要求視覺方向，請選擇一個路線：
- 現成的框架預設（可選）→
frame-presets/（採用FRAME.md作為frame.md；請參閱references/design-spec.md） - 具名風格或氛圍 →
references/visual-styles.md - 快速預設 →
references/house-style.md - 互動選擇 →
references/design-picker.md
- 現成的框架預設（可選）→
- 對於多場景工作，請在撰寫 HTML 之前規劃節拍與節奏 →
references/beat-direction.md。對於場景轉場，請跳至hyperframes-animation/transitions/。 - 對於動態為主的工作，請閱讀
references/motion-principles.md（高階護欄），然後前往hyperframes-animation獲取原子規則。
路由
| 主題 | 閱讀 |
|---|---|
採用現成的框架預設作為 frame.md（可選） | frame-presets/ · references/design-spec.md |
| 預設調色板、動態、排版、需質疑的惰性預設 | references/house-style.md |
| 具名風格預設、氛圍到風格的路由 | references/visual-styles.md |
| 特定調色板的色彩令牌 | palettes/*.md |
| 構圖模式 — PiP、文字位於主體後方、標題卡、幻燈片 | references/composition-patterns.md |
| 統計/資訊圖表呈現 | references/data-in-motion.md |
| 針對開放式提示的結構化擴展 | references/prompt-expansion.md |
| 影片媒介的密度、比例、色彩、畫面構圖 | references/video-composition.md |
| 逐節拍方向、節奏規劃、轉場時序 | references/beat-direction.md |
| 創作後的規格驗證（色彩、字型、角落、間距、深度） | references/design-adherence.md |
| 高階動態護欄與 GSAP 品質規則 | references/motion-principles.md |
| 字型選擇、配對、渲染影片的字型護欄 | references/typography.md |
| 故事原則 — 鉤子語言、證據前先呈現價值、將故事板作為提案 | references/story-spine.md |
| 腳本節奏、語氣、開場、數字發音 | references/narration.md |
| 預先計算並映射至動態的音頻頻段 | references/audio-reactive.md |
腳本
scripts/contrast-report.mjs— 檢查渲染畫面中的對比度警告。scripts/extract-audio-data.py— 為音頻反應式構圖預先提取音頻頻段。scripts/package-loader.mjs— 支援腳本，用於捆綁的創意工具。
contrast-report.mjs 會先從目前專案解析輔助套件，然後可引導至捆綁的 HyperFrames 套件版本。僅在技能執行於捆綁 CLI/技能安裝之外，且需要明確固定該引導版本時，才設定 HYPERFRAMES_SKILL_PKG_VERSION=<版本>。
從儲存庫根目錄配合明確路徑執行，例如：
python skills/hyperframes-creative/scripts/extract-audio-data.py <音頻檔案>
動畫分析（animation-map.mjs）位於 hyperframes-animation/scripts/。
邊界
- 請勿覆蓋
hyperframes-core的技術規則。 - 對於最小技術構圖，無需要求設計系統。
- 除非請求明確要求，或您先提案擴展，否則請勿添加額外的場景、旁白、音樂、字幕或轉場。
- 保持配方參考與任務相關；對於簡單編輯，無需閱讀所有參考文件。