baoyu-slide-deck 的 editorial-infographic 预设：现代杂志风格信息图幻灯片的视觉规范与实战指南

AI 技能AI 插件【免费下载链接】baoyu-skills项目地址https://gitcode.com/gh_mirrors/ba/baoyu-skills点击查看免费下载导读editorial-infographic是 baoyu-slide-deck 技能内置的 17 个视觉预设之一以现代杂志式信息图Modern magazine-style editorial infographic为核心擅长用清晰的视觉叙事把复杂信息转化为易于消化的叙事结构。本文以 styles/editorial-infographic.md 的完整规范为骨架结合 SKILL.md实际路径见文末说明中的预设映射、维度系统与生成流程系统讲解该预设的设计美学、背景与排版规范、完整配色表、视觉元素清单、Do/Dont 规则及其最佳适用场景并给出在真实生成流程中落地该预设的完整实操路径。一、预设定位它是谁什么时候该用它在 baoyu-slide-deck 的风格体系中每个预设都不是孤立的一份文案而是四个维度纹理 texture、情绪 mood、排版 typography、密度 density的组合。根据 SKILL.md 中Presets (17)一节editorial-infographic被明确标注为editorial-infographic|clean cool editorial dense| Tech explainers, research也就是说这个预设由四个具体维度叠加而成clean 纹理纯色背景、无线条纹理、cool 情绪冷色调、蓝色主导、editorial 排版杂志风格的粗衬线/无衬线混排、dense 密度每页可承载多个数据点与图表。四者叠加后得到的就是一份信息密度高但组织清晰、阅读体验像高端科技杂志的幻灯片。该预设的适用面原文档 Best For 一节非常聚焦技术解说technology explainers、科学传播science communication、研究报告总结research summaries、政策简报policy briefings、调查性内容investigative content、教育深度长文educational deep-dives、思想领导力内容thought leadership pieces。与之形成对照的是同为 editorial 风格的bold-editorialclean vibrant editorial balanced后者偏产品发布与主题演讲色彩更鲜艳、信息密度适中而editorial-infographic偏研究型、数据密集型内容强调把复杂讲清楚两者不宜混用。自动选择信号在技能的实际运行中预设并不总是由用户手动指定。SKILL.md 的 Auto-Selection 一节定义了内容信号到预设的自动匹配表其中与editorial-infographic对应的信号是源内容中出现的关键词信号命中预设explainer, journalism, science communicationeditorial-infographic也就是说当用户输入的内容包含 explainer解说、journalism新闻/报道、science communication科学传播等信号时技能会自动推荐该预设。如果没有任何信号命中则回退到默认的blueprint。二、设计美学与背景规范2.1 设计美学把复杂信息变成可读的叙事原文档对editorial-infographic的美学定位是High-quality magazine explainer aesthetic. Clear visual storytelling that transforms complex information into digestible narratives. Clean illustrations, structured layouts, and professional typography. Think Wired, The Verge, or high-end science publications.即高品质杂志解说体美学。核心要求是通过清晰的视觉叙事visual storytelling把复杂信息转化为可消化的叙事digestible narratives参考对象是 Wired、The Verge 一类高端科技刊物。这意味着每一页幻灯片都应当像杂志的一个版面——有明确的主标题、有逻辑引导的信息分区、有支撑论点的图标与图表而不是堆砌文字。2.2 背景Background规范原文档对背景给出两项约束颜色纯白#FFFFFF或浅灰#F8F9FA纹理无纹理或极淡的纸张颗粒感subtle paper grain以营造印刷质感print feel这与预设的clean纹理维度完全一致——dimensions/texture.md 中对 clean 纹理的定义就是纯色实底、无可见纹理、边缘锐利、数字化的清晰与高对比。浅灰#F8F9FA适合用于分区背景section backgrounds让页面在保持干净的条件下产生层级。三、排版Typography规范editorial-infographic的排版遵循三层字体系统每一层承担不同的视觉职责这也是杂志式设计的关键所在层级字体要求视觉作用主字体标题 Headlines粗体展示型衬线体bold display serif或现代无衬线体modern sans-serif强烈的视觉存在感、干净的字母形态、编辑级精致感、大字号制造冲击力次级字体小标题 Subheads半粗无衬线体semi-bold sans-serif章节标题用与正文拉开明确层级全篇风格统一正文字体Body人文主义无衬线体humanist sans-serif为阅读优化干净、专业、易读行高 1.6这一套描述与 dimensions/typography.md 中editorial排版维度的定义互相印证该维度要求粗衬线体或高对比无衬线体做标题杂志封面风格戏剧性的字号对比Think Playfair Display, Didot, or bold condensed sans正文则使用经典衬线体或优雅、精炼的字形。需要特别说明的是由于图像生成后端无法直接使用字体名实际操作中应在提示词中用视觉特征描述代替字体名。例如 dimensions/typography.md 给出的 editorial 渲染描述为标题dramatic high-contrast serif with thick-thin stroke variation高对比衬线粗细笔画变化剧烈正文elegant classic serif优雅的经典衬线体对于中文内容design-guidelines.md 的字体推荐表中还提供了多语言配对参考编辑风格Editorial场景下英文使用 Oranienbaum中文推荐 siyuanSongti思源宋体来营造杂志感。四、完整色板Color Palette原文档给出了editorial-infographic的完整 9 色配色表这是整个预设的设计令牌必须在每页幻灯片中保持一致角色颜色Hex用途背景 Background纯白#FFFFFF主背景备用背景 Alt Background浅灰#F8F9FA分区背景主文字 Primary Text近黑#1A1A1A标题、正文次文字 Secondary Text深灰#4A5568图注、元信息强调色 1 Accent 1编辑蓝 Editorial Blue#2563EB主强调色强调色 2 Accent 2珊瑚橙 Coral#F97316次强调色强调色 3 Accent 3翡翠绿 Emerald#10B981正向元素强调色 4 Accent 4琥珀 Amber#F59E0B警告、注意力分隔线 Dividers中灰#D1D5DB分区分隔线这套色板与cool情绪维度高度一致蓝主导、灰阶层次、强调色克制。对照 dimensions/mood.md 中 cool 情绪的标准色板背景#FAF8F5、主文字#334155、强调蓝#2563EB、海军蓝#1E3A5F、浅蓝#BFDBFE可以看到editorial-infographic直接沿用了核心强调蓝#2563EB并把色板收窄为白/灰 蓝 三种功能性强调色的结构。使用建议结合 design-guidelines.md 的一致性要求单页幻灯片建议最多使用 3–4 种颜色#2563EB作为主强调色承担主要视觉锚点珊瑚橙、翡翠绿、琥珀三色各自承担次强调 / 正向 / 警示的语义功能避免同时大面积使用造成视觉噪音。五、视觉元素清单Visual Elements原文档规定了该预设可用的视觉词汇表这是信息图属性的直接体现干净的扁平化插画clean flat illustrations而不是照片结构化的多分区版面structured multi-section layouts关键洞察的标注框callout boxes for key insights基于图标的数据可视化icon-based data visualization抽象概念的视觉隐喻visual metaphors for abstract concepts具有清晰方向层级的流程图flow diagrams with clear directional hierarchy引用句与高亮框pull quotes and highlight boxes分区分隔线与视觉断点section dividers and visual breaks这些元素与 layouts.md 中的信息图衍生布局Infographic-Derived Layouts一一呼应线性流程linear-progression、二分对比binary-comparison、中心辐射hub-spoke、漏斗funnel、仪表盘dashboard、循环流程circular-flow、冰山iceberg、桥接bridge等 14 种布局都可以直接服务于该预设的视觉叙事需求。在编写大纲时可在幻灯片的// LAYOUT节指定Layout: name来启用这些布局。六、风格规则Do 与 Dont原文档给出了明确的行为约束这是保证编辑级品质的底线Do应当做建立清晰的视觉叙事流clear visual narrative flow使用结构化的多分区版面为关键洞察加入标注框为复杂观点设计视觉隐喻保持杂志级打磨magazine-quality polishDont禁止做使用摄影类图像photographic imagery创建拥挤密集的版面cluttered dense layouts——注意dense 指信息密度高但组织有序与 cluttered 完全不同混入过多视觉风格mix too many visual styles添加无目的的装饰元素添加页码、页脚或 Logo其中不要页码页脚 Logo与 base-prompt.md 中的全局规则一致NO slide numbers, page numbers, footers, headers, or logos——这是整个 slide-deck 技能的硬性约束editorial-infographic同样遵守。七、在真实生成流程中落地该预设editorial-infographic不是一段孤立的样式说明它最终会通过 baoyu-slide-deck 的九步工作流变成真实的幻灯片图像。以下是该预设如何被消费的完整链路依据 SKILL.md 的工作流定义Step 1–2 分析与确认对输入内容做信号检测。若命中 explainer / journalism / science communication 信号系统推荐editorial-infographic并在确认轮Round 1 Q1 风格问题中作为Recommended选项呈现给用户。Step 3 生成大纲解析预设文件把editorial-infographic的设计美学、背景、排版、色板、视觉元素、Do/Dont 规则汇总为STYLE_INSTRUCTIONS块写入 outline.md 定义的结构中。Step 5 生成提示词读取 base-prompt.md 作为提示词骨架将大纲中的STYLE_INSTRUCTIONS整块复制进每个幻灯片的提示词文件prompts/NN-slide-{slug}.md提示词文件是强制要求作为可复现记录。Step 7 生成图像由图像后端如 Codex imagegen、baoyu-image-gen 等按 codex-imagegen.md 的规则解析依据提示词渲染 16:9 的幻灯片位图。Step 8 合并用scripts/merge-to-pptx.ts与scripts/merge-to-pdf.ts把单页图像合并为 PPTX / PDF 成品。落地时的实操要点单页单信息虽然预设维度是 dense但 base-prompt.md 要求每页只传达一个核心信息Each slide conveys ONE clear messagedense 指的是在一个核心信息之下可容纳多个支撑数据点而非多主题混排。每页文字元素控制在 3–4 个以内正文行高按 1.6 执行配合 dimensions/density.md 中 dense 层的页边距指导紧凑型 5–8%。保持全篇一致色板、字体层级、图标风格在整个 deck 中重复使用这是杂志感的核心来源。修改单页时按 SKILL.md 的 Slide Modification 规则先改prompts/NN-slide-{slug}.md再执行--regenerate N禁止对已生成位图做文字修补。八、总结何时选择 editorial-infographic一句话判断标准如果你的内容是一份需要把复杂研究/技术讲给专业读者听的解说型内容且你希望成品看起来像高端科技杂志的版面而非商务 PPT就选editorial-infographic。内容类型技术解说、科学传播、研究报告、政策简报、深度调查、教育长文视觉基调白底、蓝主强调色、扁平图标、结构化分区、杂志级排版信息密度dense数据丰富但组织有序杜绝拥挤混乱红线不用照片、不混风格、不加页码页脚 Logo、装饰必须有目的该预设的完整权威定义见 styles/editorial-infographic.md维度层面的延伸规范可参考 dimensions/typography.md、dimensions/mood.md、dimensions/density.md、dimensions/texture.md预设的全局消费流程见 SKILL.md 与 base-prompt.md。赞分享AI 技能AI 插件【免费下载链接】baoyu-skills项目地址https://gitcode.com/gh_mirrors/ba/baoyu-skills点击查看免费下载相关推荐电脑开不了机别慌三步用免费开源Rufus制作万能启动U盘电脑开不了机别慌三步用免费开源Rufus制作万能启动U盘 电脑突然蓝屏、重启后卡在品牌Logo画面、新笔记本装不上系统——这类糟心事遇上一次就够头疼。好消息是AI 技能AI 插件ppt-master Editorial Rendering 指南为金融、新闻与深度分析类幻灯片打造杂志风格 AI 图像ppt master Editorial Rendering 指南为金融、新闻与深度分析类幻灯片打造杂志风格 AI 图像 PPT Master 在每次生成整套AI 技能人工智能AI 应用OpenMAIC 幻灯片页面设计规范指南slide-craft 技能详解OpenMAIC 幻灯片页面设计规范指南slide craft 技能详解 导读 slide craft 是 OpenMAIC 多智能体交互课堂中定义一页幻灯人工智能AI 应用AI Agent多智能体教育前端后端RAG上一篇GitHub Docs版本发布发布流程与回滚策略下一篇Ghost 分析管线构建与部署实战Tinybird CLI 4.0 的 tb build / tb deploy 工作流规范创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考