slide-creator
SPEAKER NOTES — SLIDE 1 / 08
Claude Code 技能 v2.18
SLIDE-CREATOR
Claude Code 零依赖 HTML 演示文稿
21 种样式
零 依赖
1 HTML 文件
01 / 08
系统架构
工作原理
你的内容
笔记、文档、BRIEF.json、图片、PPTX
输入
↓
/SLIDE-CREATOR
样式发现 → 布局生成 → 代码质量检查
技能
↓
PRESENTATION.HTML
内联 CSS + JS · 内联编辑 · 演讲者模式 · PPTX 导出
输出
02 / 08
核心功能
你将获得什么
21 种样式
🎨
精心设计的预设样式

Bold Signal、Swiss Modern、Terminal Green、Chinese Chan、Neo-Retro Dev 以及 16 种其他样式。每种都有独特的布局变体。

内联编辑
✎
按 E 在浏览器中编辑

点击任何文本，就地编辑。Ctrl+S 保存回 HTML 文件。无需外部编辑器。

演讲者模式
🎤
按 P 打开演讲者视图

演讲者备注 + 计时器 + 导航。通过 BroadcastChannel 同步。离线可用。

03 / 08
// 之前 -- 没有 slide-creator

- 选择工具（Canva? Keynote? Miro?）
- npm install reveal.js 或 impress.js
- 每张幻灯片依赖 3 个 CDN 库
- 反复调整 AI 提示词，直到输出看起来不错
- 导出 → 字体损坏、图片丢失

// 之后 -- 使用 slide-creator

- /slide-creator
- 从 21 种预设中选择样式
- 获得 presentation.html
- 零依赖 · 离线运行
- 内联编辑 · 导出 PPTX · 完成

04 / 08
一个命令。
一个 文件。
零 借口。

- 无需 npm install、无 CDN、无构建管道
- 提交前展示 3 个视觉样式预览
- 每张幻灯片完全适应一个视口 -- 无需滚动
- 离线工作 · 在浏览器中编辑 · 导出 PPTX

05 / 08
参考
命令

/slide-creator | 交互式：样式发现 → 内容 → 生成。最适合从零开始。
/slide-creator --plan | 创建 BRIEF.json IR。在生成 HTML 前停止；如需给人审阅，再派生 PLANNING 视图。
/slide-creator --generate | 读取 BRIEF.json，跳过提问，生成 HTML。从 IR 快速到演示文稿。
/slide-creator --export pptx | 通过系统 Chrome 截屏每张幻灯片 → 组装 .pptx。无需 Node.js。

06 / 08
数字说话
统计数据
21
种样式
精心设计的预设
深色主题
浅色主题
特色款
1
HTML 文件
输出格式
内联 CSS ✓
内联 JS ✓
无 CDN 调用 ✓
离线运行 ✓
0
NPM 依赖
运行时需求
无 node_modules
无 package.json
无构建步骤
仅 HTML
07 / 08
安装
开始使用
只需 30 秒
git clone https://github.com/kaisersong/slide-creator ~/.claude/skills/slide-creator
第一步：克隆 → 第二步：/slide-creator → 第三步：发布
无构建步骤 · 无配置 · 直接运行
08 / 08