Text-to-PPT — 文本转 HTML 演示文稿
Convert any text input into a visually stunning, single-file HTML presentation.
CRITICAL: Two-Phase Generation
ALWAYS use the two-phase approach. NEVER generate the full HTML in one shot.
Phase 1: Plan (fast, single call)
Read the input text, then produce a slide-by-slide outline in JSON format:
CODEBLOCK0
Rules for Phase 1:
- - Output ONLY the JSON plan. No HTML. No explanation.
- Identify data points → mark
hasData: true and provide chartType + INLINECODE2 - Choose layout:
centered, bullets, split, grid, timeline, cards, fullchart, INLINECODE10 - Target 8-15 slides. Never exceed 20.
- This should take <10 seconds.
Phase 2: Generate (parallel, page-by-page)
Read references/design-system.md — this is where the full design spec lives.
Then generate HTML for each slide independently. Each slide is a self-contained <div class="slide"> block.
For each slide, the agent should:
- 1. Take ONE slide from the plan (by number)
- Read only the design system reference if not already loaded
- Generate ONLY that one slide's HTML INLINECODE13
- No
<html>, no <head>, no <body> — just the slide div
BATCHING: Generate slides in parallel using sub-agents. Spawn up to 5 sub-agents simultaneously, each generating 1-2 slides.
Phase 3: Assemble
After all slides are generated:
- 1. Read the shell template from INLINECODE17
- Insert all slide divs into the shell
- Ensure chart canvas IDs are unique across all slides
- Save to Obsidian vault: INLINECODE18
- Tell user the file path
Execution Strategy
When running as the main agent:
- 1. Phase 1 yourself (fast, just JSON)
- Write the plan to a temp file
- Spawn sub-agents for Phase 2 (parallel slide generation)
- Collect results and assemble in Phase 3
Sub-agent task format (for Phase 2):
CODEBLOCK1
Input Sources
- - Directly pasted text
- A file path — read it first with INLINECODE19
- A URL — fetch it first with INLINECODE20
- An Obsidian note path — read it first
Output
- - Single self-contained HTML file
- File naming: INLINECODE21
- Default save location: INLINECODE22
- Tell the user the file path
Theme Options
| Theme | Background | Text | Cards | Accent |
|---|
| dark (default) | slate-900 | slate-50 | slate-800 | blue-500/amber-500 |
| light |
slate-50 | slate-900 | white | blue-600/amber-600 |
| tech | gray-950 | emerald-50 | gray-900 | cyan-500/violet-500 |
| warm | stone-900 | amber-50 | stone-800 | orange-500/rose-500 |
User can specify a theme. Default: dark.
Text-to-PPT — 文本转 HTML 演示文稿
将任何文本输入转换为视觉惊艳的单文件 HTML 演示文稿。
关键:两阶段生成
始终使用两阶段方法。切勿一次性生成完整 HTML。
第一阶段:规划(快速,单次调用)
读取输入文本,然后以 JSON 格式生成逐幻灯片大纲:
json
{
title: 演示文稿标题,
language: zh-CN,
density: detailed,
theme: dark,
slides: [
{
number: 1,
type: title,
heading: 主标题,
content: 副标题或标语,
layout: centered,
notes: 视觉效果:大标题搭配强调下划线
},
{
number: 2,
type: content,
heading: 章节标题,
points: [要点 1, 要点 2, 要点 3],
layout: bullets,
hasData: false,
notes: 为每个要点使用编号徽章
},
{
number: 3,
type: chart,
heading: 关键指标,
chartType: bar,
chartData: {
labels: [A, B, C],
datasets: [{label: 销售额, data: [100, 200, 150]}]
},
points: [洞察 1, 洞察 2],
layout: split,
hasData: true,
notes: 左侧:图表,右侧:以统计卡片形式展示洞察
}
]
}
第一阶段规则:
- - 仅输出 JSON 规划。无 HTML。无解释。
- 识别数据点 → 标记 hasData: true 并提供 chartType + chartData
- 选择布局:centered、bullets、split、grid、timeline、cards、fullchart、quote
- 目标为 8-15 张幻灯片。切勿超过 20 张。
- 此阶段应在 10 秒内完成。
第二阶段:生成(并行,逐页生成)
阅读 references/design-system.md — 此处包含完整的设计规范。
然后独立生成每张幻灯片的 HTML。每张幻灯片是一个独立的
块。
对于每张幻灯片,代理应:
- 1. 从规划中取一张幻灯片(按编号)
- 如果尚未加载,仅读取设计系统参考
- 仅生成该张幻灯片的 HTML
...
- 无 、无 、无 — 仅幻灯片 div
批处理:使用子代理并行生成幻灯片。 同时启动最多 5 个子代理,每个生成 1-2 张幻灯片。
第三阶段:组装
所有幻灯片生成后:
- 1. 从 references/shell-template.html 读取外壳模板
- 将所有幻灯片 div 插入外壳
- 确保所有幻灯片的图表画布 ID 唯一
- 保存至 Obsidian 仓库:~/Documents/longhai/Longhai/
- 告知用户文件路径
执行策略
作为主代理运行时:
- 1. 自行完成第一阶段(快速,仅 JSON)
- 将规划写入临时文件
- 为第二阶段生成子代理(并行幻灯片生成)
- 收集结果并在第三阶段组装
子代理任务格式(第二阶段):
为演示文稿的第 {N} 张幻灯片生成 HTML。
幻灯片规划:
{该张幻灯片的 JSON}
设计系统:阅读 references/design-system.md 获取主题颜色、组件和规则。
输出:仅返回单个
...
块。
无 、 或 标签。使用内联样式。如果该幻灯片有图表,包含 Chart.js 的