技能概述
html-ppt-knowledge-arch-blueprint 係一個專注嘅 16:9 HTML 簡報模板，視覺識別基於 knowledge-arch-blueprint 全頁模板。
核心視覺：奶油紙底（#F0EAE0）+ 單一銹紅色（#B5392A）高亮 + 48px 藍圖網格 mask + 2px 黑邊硬卡片 + pipeline 步驟盒（其中一個抬高）+ 右側銹紅 insight callout + Playfair 襯線大字 + SVG 虛線反饋環。
零漸變、零軟陰影，認真且印刷友好。適合系統架構介紹、數據流展示、工程白皮書等場景。
觸發關鍵字
- architecture、blueprint、system design
- 架構圖、data flow、engineering whitepaper
- 系統架構簡報、藍圖風格
視覺特徵
| 特徵 | 說明 |
|---|---|
| 背景底 | 奶油紙 #F0EAE0 |
| 高亮色 | 單一銹紅 #B5392A |
| 網格 | 48px 藍圖網格 mask |
| 卡片 | 2px 黑邊硬卡片，零圓角 |
| 流程圖 | pipeline 步驟盒，其中一格抬高突出 |
| 側欄 | 右側銹紅 insight callout |
| 字體 | Playfair Display 襯線大字 |
| 圖形 | SVG 虛線反饋環 |
| 風格 | 零漸變、零軟陰影，印刷友好 |
使用方法
自然語言觸發
用 knowledge-arch-blueprint 模板做一份系統架構介紹 PPT
奶油紙底 + 銹紅高亮 + 藍圖網格 + pipeline 抬高一格 + 襯線大字
blueprint architecture deck for system design review
預先確認
Agent 會先同你確認以下資訊：
- 系統名稱
- 5-7 個核心模組
- 數據流方向
建議生成 8-10 頁。
工作流程
- 先讀主技能：所有作者規則在
html-ppt/SKILL.md - 從模板文件夾開始：複製
knowledge-arch-blueprint/中嘅index.html和style.css，保留.tpl-knowledge-arch-blueprintbody class - 處理共享 runtime：將上游
../../../assets/...路徑改寫為項目本地路徑或內聯 - 替換 demo 內容，不要修改結構 class
- 演講者備註放進
<aside class="notes">
功能支持
- 演講者備註
- 鍵盤導航 runtime
- 36 個主題可切換
- 動畫支持