PPT 风格克隆
把一份"参考 PPT / PDF / 截图"的视觉语言(配色、字体、版式网格、装饰元素、整体气质)完整迁移到用户自己的内容里,产出一份同风格、可继续编辑的 HTML。重点是"套风格"而不是抄内容,最终用 HTML 交付——HTML 比 PPTX 有像素级控制权,且能在本地无头渲染自检排版,不必靠用户当眼睛。
何时使用
- 用户提供了参考作品 + 自己的内容,要求"复刻风格""套模板""照着排版""仿这个版式"。
- 典型请求:"照着这份发布会 PPT(附件)的风格,把我这段产品介绍做成 8 页新 PPT""把这个宣传册的排版套到我公司的介绍上"。
输入
- 参考来源(满足其一):本地 .pptx 原件、PDF、截图图片。两种都支持——原件能精确读样式,PDF/截图靠视觉分析还原。
- 新内容(满足其一):现成大纲(每页标题+要点,严格照填)、一篇长文档/Word/Markdown(AI 提炼拆页)、零散要点/主题(AI 扩展成完整 PPT)。内容偏少时 AI 主动补充使其饱满。
工作流
第 0 步:澄清与准备(先问,不要猜)
- 确认输出版式取向:参考是宣传册/画册类的"左右对开跨页",还是标准单页演示?问用户要 (a) 保持跨页双页(一屏=一个对开面,最像参考),(b) 改成标准 16:9 单页(更通用,需适度重排),还是 (c) 你做主。默认倾向 (a) 当参考本身就是跨页排版。
- 确认内容给齐没有;若偏少,提示将自动补充(补的内容自然融合,用户可追问"哪里是补的")。
- 建项目目录:
<workdir>/ppt-clone/(含ref_pages/、assets/、preview/)。
第 1 步:提取参考风格(最关键,不要发挥)
目标:把参考的"视觉基因"读成一份《风格档案》。
- 参考是 .pptx:用 python-pptx 提取每页文字、表格、内嵌图片(真实图片优先复用,见 Pitfalls)。同时渲染为图片以便视觉分析。
- 参考是 PDF:用 PyMuPDF 渲染前 12 页为 PNG(ref_pages/),再逐页用 Read 工具视觉分析。
- 参考是截图:直接用 Read 工具看图。
- 分析并产出《风格档案》,至少包含:
- 配色板:主色、辅色(精确取色,不要"差不多")。
- 字体气质:标题/正文分别是哪种感觉(粗宋、黑体、无衬线大写英文等)。
- 版式网格:单页还是跨页对开?内容区怎么分栏?页眉页脚位置?
- 标志性元素(signature):最容易被忽略但最定义风格的元素——如超大章节数字、竖排描边英文、全黄/全色满底、毛笔画印章、双白线、全出血大图、彩色胶囊标签。这些必须精确复刻,不得替换成"自创模板"。
- 页面类型清单:封面 / 目录 / 章节页 / 图文页 / 表格对比页 / 图片网格 / 封底,各长什么样。
- 完成判据:能用一句话概括"这份参考最像什么、和别的设计最大的不同点在哪"。说不出不同点,说明标志性元素没抓准,重看参考图。
第 2 步:提取并(必要时)扩写内容
- 用户给了大纲:直接按结构承载。
- 用户给了长文/文档:AI 提炼为每页标题+要点,控制信息密度均衡。
- 内容偏少:AI 主动补充——补全分论点、过渡句、示例、数据占位(标注"待填实"而非伪造权威数据)。规则见
references/content-augmentation.md。
第 3 步:构建 HTML(像素级还原)
以 references/html-template.html 为骨架,用 CSS 复刻风格档案:
- 用 CSS 变量锁定配色板;字体优先用系统/网络字体逼近参考气质。
- 跨页版式用 .spread 双栏(左 50% / 右 50%),标准单页用 16:9 画布。
- 逐页对照标志性元素实现:竖排描边 CONTENTS、超大章节数字、双白线、满底色块、全出血图等,必须与参考结构对齐。
- 图片优先用第 1 步抽出的真实素材,按"素材忠实度"原则复用,不要滥用生图。
- 内联样式、单文件自包含,方便直接预览与转发。
第 4 步:本地自检验排版(必须,别让用户当你的眼睛)
用本机 Chrome 无头把 HTML 渲染成图自检:
1. "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --headless --run-all-compositor-stages-before-draw --print-to-pdf=preview.pdf "file://<workdir>/ppt-clone/index.html"
2. 用 PyMuPDF 把 preview.pdf 每页渲染为 PNG(preview/page_XX.png)。
3. 用 Read 工具逐页看:配色对吗、标志性元素在吗、有没有溢出/拥挤/空洞、文字层级乱不乱。
4. 发现问题就地改 HTML,重复 1–3 直到自检通过。
- 若本机无 Chrome,则用已 present 的 HTML 预览请用户确认,并明确说明自检缺失、需要用户帮看。
第 5 步:交付与多轮迭代
- 用
present_files推 HTML,用户在浏览器预览。 - 用户提修改意见(配色/字体/页数/某页版式),迭代到满意。
- 满意后可额外用 Chrome 导出 PDF 给用户下载。
输出
一份自包含、可继续编辑的 index.html(同参考风格、内容为用户自有)。可选附 preview.pdf。
质量线(Quality Bar)
- 配色、字体气质与参考高度一致;标志性元素被精确复刻,不是"好看但根本不像"的通用模板。
- 版式尽量照搬参考,但会按用户内容灵活适配;整体和谐,无硬搬导致的拥挤或留白失衡。
- AI 已用截图自检过每页排版,无溢出、无元素错位。
- 内容完整饱满;补充内容贴题、不编造假数据/人名/权威数字。
陷阱(Pitfalls)
- 自我发挥过度(最高频失败):明明参考是"全黄满底+超大章节数字+竖排描边 CONTENTS",却自创了"深绿竖条+黄色内容块"模板。记住:先精确提取标志性元素,再严格复刻,不擅自替换。
- 内容陈旧/页面残留:若用 PPTX 管线(slidep upsert),追加会保留旧页导致页数错乱——本 skill 用单文件 HTML,天然避免此问题;若将来接 PPTX,务必重建干净文件再写入。
- 不自检:只凭想象交付,结果排版崩了还让用户发现。永远截图自检。
- 编造事实:扩写内容时伪造数据、人名、引文。补充内容可写"示例/待填实",不可伪造权威信息。
- 滥用生图:明明源文件有真实图片却用 AI 生成替代品,导致不相关或失真。真实素材优先复用。
- 忽略跨页结构:把宣传册每个对开面误当成独立单页,丢掉左右对开的版式逻辑。
示例
用户:"照着这份发布会 PPT(附件)的风格,把我这段产品介绍做成 8 页的新 PPT。"
你应:
1. 问清要跨页还是单页;
2. 渲染参考 PPT 为图,提取风格档案(配色/字体/超大数字/版式);
3. 读用户产品介绍,按 8 页结构组织(不够则补充);
4. 以 html-template 为骨架写 index.html,CSS 复刻风格;
5. Chrome 无头渲染自检、逐页修正;
6. present_files 推 HTML,等用户反馈再迭代。
结果:一份与参考同设计语言、内容为用户产品的可编辑 HTML。
参考
- 风格提取细节:
references/style-extraction.md - HTML 骨架模板:
references/html-template.html - 内容扩写规则:
references/content-augmentation.md