Slides Grab 设计技能
在 Claude Code 或 Codex 中，把已批准的幻灯片大纲直接变成高质量、可逐张迭代修改的 HTML 幻灯片，并通过对抗式设计门禁把关质量。
技能明确声明模板包数据为不可信数据、禁止执行导入内容、限制本地资产路径、禁止远程URL，数据流披露较完整；但默认codex-imagen复用本地Codex登录凭据(~/.codex/auth.)调用非官方私有后端，凭据用途披露虽存在但外部效果与回滚机制不完整，故扣分。
工作流指令自洽，validate/design-gate失败反馈路径明确，含CLI强制报告结构；但全部为静态阅读，happy path之外的异常输入处理未见证据，仓库测试套件未确认覆盖本技能关键路径的执行证据，扣分。
输入输出、阶段边界(需已批准的slide-outline.md)、非适用范围声明较清楚；但触发条件依赖Stage 1产物，且核心图像生成依赖海外服务(OpenAI/Google/非官方Codex后端)，对中国大陆网络可达性存在风险，扣分。
文档分层好(SKILL.md→references)，已知限制(codex-imagen不稳定、PPTX实验性)有披露，MIT许可明确；但版本/变更记录、维护责任与更新路径在技能文件内未见，部分引用文件(design-gate.md)疑似截断，扣分。
声称可直接产出可导出的HTML幻灯片并带验证/评审闭环，边际价值较明确；但无执行证据确认产出可直接使用，静态评审下效果上限受限，扣分。
有具体命令、文件结构与测试脚本名(package.)等可审计素材，README/韩文README相互印证；但无第三方执行证据、无独立复现，上限封顶。
- 默认图像生成provider复用本地Codex登录凭据并调用非官方私有后端，可能随时失效，敏感环境慎用并考虑改用显式API key provider。
- 核心图像/视频/CDN依赖海外服务，中国大陆网络可达性需自行验证。
- design-gate.md在提供内容中疑似截断，实际包内完整性需用户确认。
- PPTX/Figma导出为实验性功能，可能需大量手工修整。
- 发布者未经FollowSkills验证，身份未知，维护责任与更新路径不明确。
这个 Skill 能做什么，适合哪些场景？
slides-grab-design 是 slides-grab 工具链中的第二阶段（Stage 2）设计技能，在前一阶段的大纲（slide-outline.md）获得批准后使用。它根据大纲中指定的设计风格，为每页幻灯片生成独立的 HTML 文件（默认 720pt × 405pt），并配套浏览器可视化编辑器进行局部修改。技能内置 95 种设计风格、Chart.js 图表、tldraw 复杂图示、本地图像/视频资产管理和基于 Playwright 的验证流程。导出 PDF/PPTX 前必须通过由两个独立评审代理执行的设计门禁（Design Gate），防止不可读、配色违规或 AI 味套路的页面流出。
读取已批准的 slide-outline.md 并提取 style 字段；从内置风格库（src/design-styles-data.js）、DESIGN.slides.md 设计文档或导入的模板包中加载设计规范；先写视觉论点、内容规划和设计令牌，再逐页生成 slide-01.html 等文件；按需调用 slides-grab image 生成配图（默认 codex-imagen 提供商，复用本地 Codex 登录，无需 API key）、slides-grab tldraw 渲染复杂图示、Chart.js 绘制图表、slides-grab fetch-video 下载网页视频；随后运行 slides-grab validate 验证、slides-grab png 截图作为评审证据、由两个独立的视觉评审代理执行 A/B 两轮设计门禁，全部通过后写入 Proceed 回执解锁导出；最后提供 slides-grab edit 交互式编辑器和 build-viewer 单文件预览，按用户反馈逐张迭代。
- 需要在 Claude Code 或 Codex 里从主题文件直接产出整套演示文稿的设计师或工程师
- 有企业既有 PPT 或品牌页面，想通过 import-template 让新幻灯片遵循其视觉规范的团队
- 需要图表密集型汇报，且要求图表经过像素级验证（空画布会被判定为失败）的数据分析人员
- 为 Instagram 制作 1:1 卡片图，或需要逐张精修视觉效果的社交媒体内容创作者
- 担心 AI 生成的幻灯片出现渐变滥用、通用字体堆栈等 AI 味套路，希望有强制评审环节把关的用户
这个 Skill 有哪些优点和局限？
- 质量把关严谨：Playwright 验证 + PNG 渲染证据 + 双评审代理对抗式门禁，Critical 发现会硬性阻断导出
- 资产契约清晰：图片/视频本地化到 assets/ 目录，图表必须真实渲染，杜绝空白画布和伪造数据
- 风格体系庞大：内置 95 种设计风格，支持 DESIGN.slides.md 自定义设计系统和模板包导入
- 默认图像生成无需额外 API key（复用 Codex ChatGPT 登录），并提供 OpenAI / Google 备选提供商
- 反向提示明确：列出 AI slop 套路清单、字号下限、颜色纪律，减少模板化产出
- 工作流偏重：每轮修改都要求重新验证和双评审门禁，轻量需求会觉得流程繁琐
- 默认 codex-imagen 调用的是不受支持的私有 Codex 后端，可能随时失效，且并非所有 ChatGPT 账号都有图像生成权限
- PPTX 和 Figma 导出（属兄弟技能/CLI 层）被官方标注为实验性/不稳定，需要手动清理
- 设计门禁要求具备视觉能力的独立评审代理，单代理或纯 HTML 检查不被视为有效评审
- 除 README 中的演示视频和展示画廊外，无公开测试套件或第三方评测证据
如何安装这个 Skill？
无需克隆仓库：npm install slides-grab && npx playwright install chromium，然后运行 npx slides-grab install-skills --target all --scope user 把共享技能装入 Codex 和 Claude Code；或让 coding agent 读取 https://raw.githubusercontent.com/NomaDamas/slides-grab/main/docs/installation/claude.md（或 codex.md）并按步骤执行。要求 Node.js >= 20。本技能位于仓库 skills/slides-grab-design/SKILL.md，属于包含 7 个技能的集合之一。
如何使用这个 Skill？
在 Stage 1（规划技能）产出并获得批准 slide-outline.md（其中 meta 需含 style: <id>、style: template-pack 或自定义风格方向）后，让 agent 运行本技能：例如对 agent 说"按已批准的大纲和 glassmorphism 风格生成幻灯片"。Agent 会生成 slides/slide-01.html 等文件，运行 validate、设计门禁，再通过 slides-grab edit 打开浏览器编辑器让你框选区域提修改意见。确认后运行 slides-grab build-viewer 预览，再进入导出阶段（PDF/PPTX）。
这个 Skill 与同类方案有什么区别？
仓库自述为"Claude Design 的开源替代品"，定位上是 Claude 官方幻灯片/设计能力之外的选择：slides-grab-design 强调 HTML/CSS 幻灯片的可视化框选编辑、强制设计门禁和本地资产契约，且同时支持 Claude Code 和 Codex。项目亦致谢基于 Builder Josh 的 ppt_team_agent 构建。