---

name: ai-ppt description: "智能演示文稿创建工具，基于专家工作流方法论，支持需求调研、大纲策划、策划稿设计、Bento Grid 布局、SVG 生成完整流程。" license: MIT version: "2.0.0"

AI-PPT: 智能演示文稿创建工具 v2.0

概述

ai-ppt 是一个基于专家工作流方法论的智能演示文稿工具。它模拟专业 PPT 制作团队的分工协作：

需求调研 → 结构大纲 → 策划稿 → 设计稿 → 最终 PPTX

核心功能

功能	说明
结构架构师	需求调研 + JSON 大纲生成
策划师	内容规划 + 版面设计
设计师	Bento Grid 布局 + SVG 生成
PPTX 生成	基于 pptxgenjs 生成最终文件

工作流程

1. 结构架构师阶段：阅读 architect-prompt.md，通过提问确认受众、目的、时长、风格，基于金字塔原理生成 JSON 大纲
2. 策划师阶段：阅读 planning-guide.md，为每页选择 Bento Grid 布局，输出策划稿
3. 设计师阶段：阅读 bento-grid.md，使用 bento-layouts.js 计算卡片坐标，svg-generator.js 生成 SVG 页面
4. PPTX 生成：使用 scripts/replace.py / scripts/rearrange.py / scripts/thumbnail.py 处理现有 PPT

快速开始

1. 结构架构师 - 生成 JSON 大纲

参考 architect-prompt.md 进行需求调研和资料搜集，输出 JSON 格式大纲：

{
  "ppt_outline": {
    "cover": { "title": "主标题", "sub_title": "副标题" },
    "table_of_contents": { "content": ["第一部分", "第二部分"] },
    "parts": [
      {
        "part_title": "第一部分标题",
        "pages": [{ "title": "页面标题", "content": ["要点1", "要点2"] }]
      }
    ],
    "end_page": { "title": "总结与展望", "content": [] }
  }
}

2. 策划师 - 版面规划

参考 planning-guide.md 填充内容并选择布局：

{
  "planning_draft": {
    "page_id": "page-1",
    "page_title": "处理器性能",
    "layout_type": "three-col",
    "cards": [
      { "id": "core-speed", "title": "超大核频率", "content": { "value": "4.3GHz", "sub": "× 2 核心" } },
      { "id": "process", "title": "制程工艺", "content": { "value": "3nm", "sub": "能效提升" } },
      { "id": "benchmark", "title": "安兔兔跑分", "content": { "value": "331万+", "sub": "登顶榜首" } }
    ]
  }
}

3. 设计师 - Bento Grid 布局

使用 scripts/bento-layouts.js 计算卡片坐标：

const bentoLayouts = require('./scripts/bento-layouts');

// 计算三栏布局的卡片位置
const cards = bentoLayouts.calculateLayout('three-col');
// 输出: [{ id: 'left', x: 40, y: 40, w: 386, h: 640 }, ...]

// 获取支持的布局类型
const layouts = bentoLayouts.getSupportedLayouts();
// ['single-focus', 'two-col-equal', 'two-col-asymmetric', 'three-col', 'hero-with-sides', 'hero-top', 'mixed-grid']

// 根据卡片数量推荐布局
const recommended = bentoLayouts.recommendLayout(3); // 'three-col'

4. SVG 生成

使用 scripts/svg-generator.js 生成 SVG 页面：

const svgGenerator = require('./scripts/svg-generator');

// 生成内容页 SVG
const svg = svgGenerator.generateSvgPage(planningDraft);
fs.writeFileSync('output/page-1.svg', svg);

// 生成封面页 SVG
const coverSvg = svgGenerator.generateCoverSvg({ title: '产品发布会', sub_title: '2024 Q4' });

// 生成目录页 SVG
const tocSvg = svgGenerator.generateTocSvg({ content: ['性能突破', '影像系统', 'AI 能力'] });

5. PPTX 生成

使用 scripts/replace.py 替换文本内容：

# 提取文本清单
python -m scripts.inventory input.pptx output.json

# 批量替换文本
python scripts/replace.py input.pptx replacements.json output.pptx

使用 scripts/rearrange.py 重排幻灯片：

python scripts/rearrange.py template.pptx output.pptx 0,2,1,3

使用 scripts/thumbnail.py 生成缩略图：

python scripts/thumbnail.py input.pptx thumbnails --cols 4

文件结构

ai-ppt/
├── SKILL.md                 # 本文档
├── architect-prompt.md      # 结构架构师指南
├── planning-guide.md        # 策划稿指南
├── bento-grid.md            # Bento Grid 布局系统
├── requirements.txt         # Python 依赖
├── package.json             # Node.js 依赖
├── LICENSE.txt              # MIT 许可证
├── scripts/
│   ├── bento-layouts.js    # Bento Grid 布局计算
│   ├── svg-generator.js     # SVG 页面生成
│   ├── inventory.py        # PPTX 文本提取
│   ├── replace.py          # 文本替换
│   ├── rearrange.py        # 幻灯片重排
│   └── thumbnail.py        # 缩略图生成
└── styles/
    ├── gradient-glass.md    # 渐变玻璃风格
    └── vector-illustration.md  # 矢量插画风格

依赖安装

Python

pip install -r requirements.txt

Node.js

npm install

布局类型

布局类型	说明	适用场景
single-focus	单一焦点	封面、核心信息
two-col-equal	两栏对称	对比分析
two-col-asymmetric	两栏非对称	图文混排
three-col	三栏布局	三项并列
hero-with-sides	主次结合	核心+补充
hero-top	顶部英雄式	总结页
mixed-grid	混合网格	复杂内容

详细说明请阅读 bento-grid.md。

最佳实践

1. 需求调研阶段

• 不要直接给主题，让 AI 先提问确认需求
• 确认受众、目的、时长、风格偏好

2. 资料搜集阶段

• 使用 AI 检索最新信息，确保内容准确
• 避免使用过时或不准确的数据

3. 策划稿阶段

• 先规划内容，再选择布局
• 根据内容特点选择合适的 Bento Grid 布局

4. 设计稿阶段

• 统一风格，确保视觉一致性
• 保持卡片间距和留白

更新日志

v2.0.0

• 重大升级：基于专家工作流方法论重构
• 新增结构架构师阶段（需求调研 + JSON 大纲）
• 新增策划稿与设计稿分离流程
• 新增 Bento Grid 便当网格布局系统
• 移除外部 API 依赖，纯净本地运行环境
• 移除 playwright/sharp/react-icons 等可选依赖
• 保留核心脚本：bento-layouts, svg-generator, inventory, replace, rearrange, thumbnail