| 方式 | 示例 |
|---|---|
| ------ | ------ |
| 自然语言 | "做个PPT"、"生成一个演示"、"做几页幻灯片"、"presentation about X" |
| 显式 | KAIFA## PPT <主题> |
| 参数 | 简易 | 标准 | 详尽 |
|---|---|---|---|
| ------ | ------ | ------ | ------ |
| 时长 | ~10 min | ~25 min | ~50 min |
| 总页数 | 7-10 | 20-25 | 40-50 |
| 目录页 | 无 | 有 | 有 |
| 章节封面 | 无 | 有(每章1页) | 有(每章1页) |
| 结构页 | Cover+Ending=2 | Cover+TOC+章封面+Ending | 同标准 |
简易: total = 2 + Σ每章内容页
标准: total = 2 + 1(TOC) + 章节数 + Σ每章内容页
详尽: total = 2 + 1(TOC) + 章节数 + Σ每章内容页
PHASE 0: DISCOVERY → 模式确认 → 大纲打磨 → 锁定
PHASE 1: PLAN → 分配布局 → 内容要点
⛔ APPROVAL
PHASE 2: IMPLEMENT → 并发生成 slide 片段 → 拼接
PHASE 3: REVIEW → 一致性检查
PHASE 4: REPORT → canvas 预览 → 输出文件
📊 大纲草案 — 标准模式
总页数: 22页 (结构7 + 内容15)
结构页:
p1 封面 [cover]
p2 目录 [toc]
第1章 项目概况
p3 章节封面 [chapter-cover]
p4 背景与目标 [ca-bullets]
p5 项目范围 [ca-bullets]
第2章 关键进展 ← 核心
p6 章节封面 [chapter-cover]
p7 三大成果 [ca-cards-3]
p8 对比分析 [ca-bullets-2col]
...
pN 结束页 [ending]
需要展开/压缩/调整哪里?
基于锁定的大纲,产出两个结构化数据文件:
master_config.json — 母版配置slides_data.json — 每页的数据定义{
"theme_color": "#004D8C",
"theme_accent": "#009688",
"header_title": "数据安全合规培训",
"show_footer": true,
"footer_text": "内部资料,请勿外传",
"bg_style": "gradient"
}
每页定义:page, type(content_area 或 special 或 chart), layout(布局模板名), data(模板变量)。
[
{ "page": 1, "type": "special", "layout": "cover", "data": { "title": "...", "subtitle": "..." } },
{ "page": 2, "type": "content_area", "layout": "ca-bullets", "data": { "title": "...", "points": [...] } },
{ "page": 3, "type": "special", "layout": "chapter-cover", "data": { "number": 1, "title": "...", "desc": "..." } },
{ "page": 4, "type": "content_area", "layout": "ca-cards-3", "data": { "title": "...", "cards": [...] } },
{ "page": N, "type": "special", "layout": "ending", "data": { "thanks": "...", "contact": "..." } }
]
布局分配完成后、进入实现之前,必须逐页写出完整文字内容。
这是整个流程中最关键的一步。不能只写"标题+1-2句要点"就进入渲染——渲染阶段不增不减文字,只做排版。
| 页面类型 | 字数要求 | 说明 |
|---|---|---|
| ---------- | --------- | ------ |
| cover / chapter-cover / ending | 10-30字 | 极简导航 |
| toc | 30-120字 | 章节标题+简述 |
| ca-bullets / ca-cards / ca-image / ca-timeline / ca-architecture | 100-500字 | 展开阐述 |
每个 bullet point 可以多句展开,不是每条只能10个字。 参考PPT的平均展开型页面有300-400字。
将完整文字内容写入 slides_data.json,每条文字必须是可逐字渲染的最终版本。
> ⚠️ 前端渲染 = 排版。后端内容 = 定稿。两者的职责不可混淆。
| 页面意图 | 推荐 layout |
|---|---|
| ---------- | ----------- |
| 法规/要点罗列 | ca-bullets |
| 对比/并列 | ca-bullets-2col |
| 3 个方案/类型 | ca-cards-3 |
| 4 个方案/类型 | ca-cards-4 |
| 架构图/流程 | ca-architecture |
| 数据展示 | ca-table |
| 案例/截图说明 | ca-image-left / ca-image-right |
| 步骤/时间 | ca-timeline |
输出 Plan 摘要 + 审批闸门。
一次性审批,通过后进入 Implement。
master_config.json ──→ PM renders base-template.html
→ 母版HTML(header + footer + {{content-area}} 占位符)
slides_data.json ──→ For each slide:
1. 根据 type 选择分支:
- type=special → 读取 references/specials/{{layout}}.html
- type=content_area → 读取 references/content-areas/{{layout}}.html
- type=chart → 读取 references/content-areas/{{layout}}.html
2. 展开模板中的 {{#each}} {{#if}} {{variable}} → 纯HTML
3. content_area 类型: 注入到母版的 content-area 占位区,包裹 <section class="slide">
special 类型: template 已自带 <section class="slide">,直接使用
4. 按 page 排序 → 拼接所有 <section>
拼接所有 <section> → 注入 {{slides}} 占位 → 完整HTML
审批通过后,并发 spawn N 个子 agent:
┌─ developer-slide-1 (cover, p1)
├─ developer-slide-2 (toc, p2)
├─ developer-slide-3 (chapter-cover, p3)
├─ developer-slide-4 (ca-bullets, p4)
├─ developer-slide-5 (ca-cards-3, p5)
├─ developer-slide-6 (ca-architecture, p6)
└─ developer-slide-N (ending, pN)
│
全部返回 → PM 拼接为完整 HTML
基于以下信息生成一页 slide 的 HTML 片段:
页面类型: [special | content_area]
布局模板: [从 references/content-areas/xxx.html 或 references/specials/xxx.html 读取]
母版片段: [master-header + master-footer HTML]
内容数据: { title, points, icon, highlight, cards... }
页码: N
要求:
1. 输出 ONLY <section class="slide" data-page="N">...</section>
2. 展开所有 {{#each}} {{#if}} {{variable}} 为纯HTML
3. content_area 类型:模板只输出 .content-area 内部,需自行构造完整 .ppt-slide 结构(master-header + content + master-footer)
4. special 类型:模板已自带完整结构,直接展开变量
5. 严格使用 CSS 变量,不硬编码颜色
6. 内容精确匹配 data,不删减不压缩,不自行发挥
PM 收齐所有 slide 片段后:
assets/base-template.html{{slides}} 占位符{{icons}} 占位符output/-presentation.html 基于 PHASE 2 Plan 产出的结构化内容数据,生成可编辑的 .pptx 文件。
python3 scripts/export_pptx.py \
--input content_data.json \
--output output/<slug>-presentation.pptx
| 维度 | HTML | PPTX |
|---|---|---|
| ------ | ------ | ------ |
| 视觉精度 | 高(像素级控制) | 中(PPTX 排版模型不同) |
| 可编辑性 | 低(需改源码) | 高(原生 PPTX) |
| 图表支持 | Chart.js 交互 | 表格替代(v1,v2 支持原生图表) |
| 生成速度 | 并行子 agent | 单进程顺序 |
| 适用场景 | 演示预览 | 交付/分享/修改 |
PPTX 不支持 Google Fonts CDN,会使用系统已安装字体。
推荐安装 Noto Sans SC,否则自动回退到 Microsoft YaHei。
| # | 检查项 |
|---|---|
| --- | -------- |
| 1 | 页数与 Plan 一致? |
| 2 | 结构页出现顺序正确(封面→目录→章封面→内容→结束)? |
| 3 | 每页布局匹配 Plan? |
| 4 | 配色/字体统一(CSS 变量)? |
| 5 | 翻页 JS 正常? |
| 6 | 内容准确无误? |
详见 references/design-system.md。核心固化:
#004D8C + 透明度层级| 操作 | 路径 |
|---|---|
| ------ | ------ |
| 加新 content-area 布局 | 直接创建 references/content-areas/xxx.html |
| 加新 special 页面 | 直接创建 references/specials/xxx.html |
| 改单个布局 | 直接编辑对应文件 |
| 改配色/设计系统 | 走 KAIFA##(影响所有模板) |
| 改流程 | 走 KAIFA##(编辑 SKILL.md) |
ppt-generator/
├── SKILL.md
├── assets/
│ ├── base-template.html # 母版系统(v3: Master + content-area 占位)
│ └── icons.svg
├── references/
│ ├── content-rules.md
│ ├── design-system.md # 设计令牌 + 布局选择指南
│ ├── content-areas/ # [v3 新增] 内容区布局模板(9个)
│ │ ├── ca-bullets.html # 单列要点
│ │ ├── ca-bullets-2col.html # 双列要点
│ │ ├── ca-cards-3.html # 三列卡片
│ │ ├── ca-cards-4.html # 四列卡片
│ │ ├── ca-image-left.html # 左图右文
│ │ ├── ca-image-right.html # 左文右图
│ │ ├── ca-architecture.html # 架构/流程图
│ │ ├── ca-table.html # 数据表格
│ │ └── ca-timeline.html # 时间线
│ └── specials/ # [v3 新增] 特殊页面模板(3个)
│ ├── cover.html # 深蓝全屏封面
│ ├── chapter-cover.html # 章节标题页
│ └── ending.html # 结束页
├── scripts/
│ └── export_pptx.py
├── tests/
│ └── test_export_pptx.py
└── requirements.txt
共 2 个版本