diff --git a/CHANGELOG.md b/CHANGELOG.md index d648965..2b88ebd 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,22 @@ 本项目遵循 [语义化版本](https://semver.org/lang/zh-CN/)。 +## [1.1.0] - 2026-08-06 + +### 新增 + +- PPTD 对齐官方元素级 `animations` 规范;Skill 补充动画 / `notes` 使用边界 +- 对齐配图优先级、文风禁令、澄清提问、复刻细则、并行写页等官方策略 +- 内置约 30 套 preset design system,并支持点名使用 +- 恢复 `customFonts`(Google Fonts)与海报推荐尺寸 +- 根目录主题目录:`theme.md` / `theme_EN.md`(含预览图) +- 示例项目 `example/xiaomi-yu7-ppt-animation`(页内元素入场动画) + +### 变更 + +- 场景文档同步官方动画细则与 `customFonts` 引用 +- README 补充元素动画、预设主题说明与示例 Prompt + ## [1.0.2] - 2026-08-06 ### 变更 diff --git a/CHANGELOG_EN.md b/CHANGELOG_EN.md index ed7799a..7476ab9 100644 --- a/CHANGELOG_EN.md +++ b/CHANGELOG_EN.md @@ -4,6 +4,22 @@ This project follows [Semantic Versioning](https://semver.org/). +## [1.1.0] - 2026-08-06 + +### Added + +- Align PPTD with official element-level `animations`; Skill notes for animation / `notes` usage bounds +- Align image priority, anti-AI copy rules, clarification asks, replicate guidance, and parallel page writes +- Ship ~30 preset design systems, invoked only when named +- Restore `customFonts` (Google Fonts) and poster size recommendations +- Root theme catalogs: `theme.md` / `theme_EN.md` (with preview images) +- Sample project `example/xiaomi-yu7-ppt-animation` (on-slide entrance animations) + +### Changed + +- Sync scenario docs with official animation guidance and `customFonts` references +- README: document element animations, preset themes, and sample prompts + ## [1.0.2] - 2026-08-06 ### Changed diff --git a/README.md b/README.md index 28853ed..1e3e710 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ [![npm version](https://img.shields.io/npm/v/open-kimi-ppt-skills)](https://www.npmjs.com/package/open-kimi-ppt-skills) [![node](https://img.shields.io/badge/node-%3E%3D18-brightgreen)](https://nodejs.org) -逆向 Kimi Slides 实现的非官方演示文稿 Skill:让 AI Coding Agent 能够创建、编辑、复刻、读取并导出 PPT/PPTX。**每次生成默认同时交付两份成果:可继续编辑的 PPTD 项目和开箱即用的 PPTX 成品**(自动嵌入字体、写入淡入淡出切换动画),并提供本地在线 PPTD 编辑器支持随时手动导出。支持 Codex、Claude Code、Cursor、WorkBuddy 等任何兼容 SKILL.md 规范的 Agent。 +逆向 Kimi Slides 实现的非官方演示文稿 Skill:让 AI Coding Agent 能够创建、编辑、复刻、读取并导出 PPT/PPTX。**每次生成默认同时交付两份成果:可继续编辑的 PPTD 项目和开箱即用的 PPTX 成品**(自动嵌入字体、写入淡入淡出翻页切换),支持页内元素动画与[预设主题](theme.md),并提供本地在线 PPTD 编辑器随时手动导出。支持 Codex、Claude Code、Cursor、WorkBuddy 等任何兼容 SKILL.md 规范的 Agent。 > [!IMPORTANT] > 本项目通过逆向分析 Kimi Slides Skill、PPTD 格式以及公开网页编辑器的前端行为与通信协议实现,并非 Kimi 或 Moonshot AI 的官方项目,也未获得其认可或支持。项目依赖的公开前端资源和兼容协议可能随 Kimi 更新而失效,仅供学习与研究使用。 @@ -112,6 +112,15 @@ npx open-kimi-ppt-skills@latest install --target ~/.claude/skills [![iPhone 17 Pro](docs/images/example-iphone-17pro.png)](docs/images/example-iphone-17pro.png) +**示例 4:带页内元素动画(现场演示)** + +```text +使用 open-kimi-ppt 做一个介绍小米 yu7的 PPT,要求图片做背景,素材从网上找,8 页左右 +要求带元素入场动画 +``` + +成品示例见 [example/xiaomi-yu7-ppt-animation](example/xiaomi-yu7-ppt-animation)(含 PPTD 项目与 PPTX,可用 `npx open-kimi-ppt-skills serve` 打开预览动画)。 + ### 在线编辑与手动导出 建议直接让 AI 启动本地编辑器,例如说: @@ -141,7 +150,9 @@ npx open-kimi-ppt-skills serve --port 56000 ## 功能特性 - **PPTD 生成**:让 Agent 生成完整、可继续编辑的 PPTD 项目,支持从零创作、风格迁移、模板复用、图片/PDF 复刻。 -- **PPTX 生成**:默认同步生成 PPTX 成品,自动嵌入字体并写入淡入淡出切换动画。 +- **预设主题**:内置约 30 套官方同款 design system,点名即可套用;完整列表与预览图见 [theme.md](theme.md)。 +- **元素动画**:默认不加。提示词加上「要求带元素入场动画」即可,由 AI 按页编排合适的入场效果。 +- **PPTX 生成**:默认同步生成 PPTX 成品,自动嵌入字体并写入淡入淡出**翻页**切换(与页内元素动画是两回事)。 - **视觉质检**:多模态模型在导出 PPTX 前自动导出整份页面图片、拼接总览图逐项核查(变形、遮挡、出界、对比度、排版、文字溢出),问题页面修复后复检,直至全部通过。 - **在线编辑**:通过浏览器查看和编辑本地 PPTD 项目,自动保存,可配置页面切换动画。 - **手动导出**:在编辑器中随时手动导出 PPTX。 @@ -164,11 +175,12 @@ npx open-kimi-ppt-skills serve --port 56000 更具体地说,相对其他方案的优势是: 1. **中间格式为 Agent 设计**:PPTD 用 YAML 描述主题、布局与元素,比直接写 OOXML / pptxgenjs 更稳,也比「整页渲一张图」更可局部修改。 -2. **默认同交两份成果**:可继续迭代的 PPTD 项目 + 开箱即用的 PPTX(嵌字体、淡入淡出切换),不是只给半成品。 -3. **PPTX 真能改**:导出后文本框、形状仍可在 PowerPoint / WPS 里编辑,不像图片型 PPT 只能当海报。 -4. **有本地可视化编辑器**:浏览器里预览、微调、配切换动画并手动再导出,不需要每次都让 Agent 重跑全流程。 -5. **导出前强制视觉质检**:整页截图 + 总览图检查遮挡、出界、对比度、溢出等问题,修完再出 PPTX。 -6. **不绑官方模型,成本更低**:相对官方 Kimi Slides,你可以在任意兼容 Agent 里使用 DeepSeek 等低成本模型;即便模型不支持多模态,只要按 PPTD 规范生成,也能做出不错的成品(有多模态时再做视觉质检会更稳)。 +2. **默认同交两份成果**:可继续迭代的 PPTD 项目 + 开箱即用的 PPTX(嵌字体、淡入淡出翻页),不是只给半成品。 +3. **支持元素动画**:提示词写「要求带元素入场动画」即可启用;具体效果与节奏由 AI 处理,无需用户点名动画类型。 +4. **PPTX 真能改**:导出后文本框、形状仍可在 PowerPoint / WPS 里编辑,不像图片型 PPT 只能当海报。 +5. **有本地可视化编辑器**:浏览器里预览、微调、配切换动画并手动再导出,不需要每次都让 Agent 重跑全流程。 +6. **导出前强制视觉质检**:整页截图 + 总览图检查遮挡、出界、对比度、溢出等问题,修完再出 PPTX。 +7. **不绑官方模型,成本更低**:相对官方 Kimi Slides,你可以在任意兼容 Agent 里使用 DeepSeek 等低成本模型;即便模型不支持多模态,只要按 PPTD 规范生成,也能做出不错的成品(有多模态时再做视觉质检会更稳)。 [![DeepSeek 生成 Liquid Glass 风格 PPT](docs/images/example-deepseek-liquid-glass.png)](docs/images/example-deepseek-liquid-glass.png) @@ -184,17 +196,20 @@ npx open-kimi-ppt-skills serve --port 56000 ### 关于风格与主题 -本 Skill **不预设固定主题或模板**。风格由你决定。 +默认 **不会** 自动套用固定主题:未指定风格时由 Agent 按场景指南自行发挥。Skill 内另附约 30 套官方同款 preset,**仅在你点名时**才会使用(例如「用 pine-green-strategy」)。 + +完整主题名、风格说明与预览图见 **[theme.md](theme.md)**。 > [!TIP] -> **强烈建议在 Prompt 里写明 PPT 风格,或直接附上参考 PPT / PPTX 模板。** 有风格约束或模板参照时,出品会明显更好、更稳定;只给主题不给风格时,Agent 会自行发挥,效果容易波动。 +> **强烈建议在 Prompt 里写明 PPT 风格、点名一套 preset,或直接附上参考 PPT / PPTX 模板。** 有风格约束或模板参照时,出品会明显更好、更稳定;只给主题不给风格时,Agent 会自行发挥,效果容易波动。 -常见两种用法: +常见用法: 1. **在 Prompt 里描述风格**:例如「深色科技风」「杂志排版」「苹果 liquid glass」「极简留白 + 大字报」等; -2. **提供参考模板**:上传现有 PPT / PPTX / 截图,让 Agent 迁移配色、版式与风格。 +2. **点名预设主题**:例如「用 `pine-green-strategy`」——主题列表见 [theme.md](theme.md); +3. **提供参考模板**:上传现有 PPT / PPTX / 截图,让 Agent 迁移配色、版式与风格。 -两者可以一起用:先给模板定调,再用一句话补充本次要强化的风格。 +可组合使用:先点名 preset 或给模板定调,再用一句话补充本次要强化的风格。 ## 界面预览 diff --git a/README_EN.md b/README_EN.md index 47f10c3..277c8c7 100644 --- a/README_EN.md +++ b/README_EN.md @@ -5,7 +5,7 @@ [![npm version](https://img.shields.io/npm/v/open-kimi-ppt-skills)](https://www.npmjs.com/package/open-kimi-ppt-skills) [![node](https://img.shields.io/badge/node-%3E%3D18-brightgreen)](https://nodejs.org) -An unofficial presentation skill for AI coding agents, reverse-engineered from Kimi Slides. It lets your agent create, edit, replicate, read, and export PPT/PPTX files. **Every run delivers two outputs by default: an editable PPTD project and a ready-to-use PPTX** — fonts embedded and fade transitions included — plus a local in-browser PPTD editor with manual PPTX export. Works with Codex, Claude Code, Cursor, WorkBuddy, and any agent that supports the SKILL.md format. +An unofficial presentation skill for AI coding agents, reverse-engineered from Kimi Slides. It lets your agent create, edit, replicate, read, and export PPT/PPTX files. **Every run delivers two outputs by default: an editable PPTD project and a ready-to-use PPTX** — fonts embedded and fade page transitions included — with optional on-slide element animations and [preset themes](theme_EN.md), plus a local in-browser PPTD editor with manual PPTX export. Works with Codex, Claude Code, Cursor, WorkBuddy, and any agent that supports the SKILL.md format. > [!IMPORTANT] > This project is implemented by reverse-engineering the Kimi Slides skill, the PPTD format, and the frontend behavior and communication protocol of the publicly accessible web editor. It is not an official Kimi or Moonshot AI project and is not endorsed or supported by them. Public frontend resources and compatibility contracts used by this project may change without notice. Provided for learning and research purposes only. @@ -100,6 +100,15 @@ Use open-kimi-ppt to create an iPhone 17 Pro intro PPT. [![iPhone 17 Pro](docs/images/example-iphone-17pro.png)](docs/images/example-iphone-17pro.png) +**Example: on-slide element animations (live presentation)** + +```text +Use open-kimi-ppt to create a Xiaomi YU7 intro PPT, with images as backgrounds from the web, about 8 pages. +Require element entrance animations. +``` + +See the sample deck at [example/xiaomi-yu7-ppt-animation](example/xiaomi-yu7-ppt-animation) (PPTD project + PPTX; open with `npx open-kimi-ppt-skills serve` to preview animations). + ### Edit online and export manually Prefer asking your agent to start the local editor, for example: @@ -129,7 +138,9 @@ Writable folder access requires a Chromium-based browser with the File System Ac ## Features - **PPTD generation**: let your agent generate complete, editable PPTD projects — from scratch, with style transfer, template reuse, or replication from images/PDFs. -- **PPTX generation**: produce a matching PPTX by default, with fonts embedded and fade transitions written automatically. +- **Preset themes**: ~30 official-style design systems you can name to apply; full list with previews in [theme_EN.md](theme_EN.md). +- **Element animations**: Off by default. Add `Require element entrance animations` to the prompt; the agent picks suitable on-slide effects per page. +- **PPTX generation**: produce a matching PPTX by default, with fonts embedded and fade **page** transitions written automatically (separate from on-slide element animations). - **Visual QA**: with a multimodal model, the skill exports every page as an image, stitches them into an overview sheet, and checks each page (distortion, occlusion, out-of-bounds elements, contrast, layout consistency, text overflow) before PPTX export — fixing and re-checking until every page passes. - **Online editing**: view and edit local PPTD projects in a browser, with autosave and configurable slide transitions. - **Manual export**: export PPTX manually from the editor at any time. @@ -152,11 +163,12 @@ Most PPT skills fall into three buckets: assemble OOXML / pptxgenjs in code, ren In short: 1. **DSL built for agents** — PPTD describes theme, layout, and elements in YAML, more stable than raw OOXML / pptxgenjs, and more locally editable than full-slide images. -2. **Two deliverables by default** — an iterable PPTD project plus a ready-to-open PPTX (embedded fonts, fade transitions). -3. **Truly editable PPTX** — text boxes and shapes remain editable in PowerPoint / WPS, unlike image-only decks. -4. **Local visual editor** — preview, tweak, set transitions, and re-export in the browser without rerunning the whole agent flow. -5. **Visual QA before export** — full-page screenshots plus an overview sheet catch occlusion, overflow, contrast, and layout issues before PPTX is written. -6. **Not locked to the official model — lower cost** — unlike official Kimi Slides, you can run this in any compatible agent with cheaper models such as DeepSeek. Even without multimodal vision, a model that follows the PPTD spec can still produce strong decks (multimodal helps more with the visual QA pass). +2. **Two deliverables by default** — an iterable PPTD project plus a ready-to-open PPTX (embedded fonts, fade page transitions). +3. **Element animations** — add `Require element entrance animations` to the prompt; the agent chooses effects and timing for you. +4. **Truly editable PPTX** — text boxes and shapes remain editable in PowerPoint / WPS, unlike image-only decks. +5. **Local visual editor** — preview, tweak, set transitions, and re-export in the browser without rerunning the whole agent flow. +6. **Visual QA before export** — full-page screenshots plus an overview sheet catch occlusion, overflow, contrast, and layout issues before PPTX is written. +7. **Not locked to the official model — lower cost** — unlike official Kimi Slides, you can run this in any compatible agent with cheaper models such as DeepSeek. Even without multimodal vision, a model that follows the PPTD spec can still produce strong decks (multimodal helps more with the visual QA pass). [![DeepSeek generating a Liquid Glass-style PPT](docs/images/example-deepseek-liquid-glass.png)](docs/images/example-deepseek-liquid-glass.png) @@ -172,17 +184,20 @@ In short: ### Style and themes -This skill **does not ship a fixed theme or template**. You choose the look. +By default the agent **does not** auto-apply a fixed theme: without a style cue it follows the scenario guides. The skill also ships ~30 official-style presets, used **only when you name one** (e.g. “use pine-green-strategy”). + +Browse theme IDs, descriptions, and preview images in **[theme_EN.md](theme_EN.md)**. > [!TIP] -> **Best results come from stating a PPT style in the prompt, or attaching a reference PPT / PPTX template.** With a style constraint or template to follow, output quality is clearly better and more stable. Topic-only prompts leave the agent free to invent a look, so results vary more. +> **Best results come from stating a PPT style in the prompt, naming a preset, or attaching a reference PPT / PPTX template.** With a style constraint or template to follow, output quality is clearly better and more stable. Topic-only prompts leave the agent free to invent a look, so results vary more. Common approaches: 1. **Describe the style in the prompt** — e.g. dark tech, magazine layout, Apple liquid glass, minimal big-type poster slides; -2. **Provide a reference template** — upload an existing PPT / PPTX / screenshot and ask the agent to transfer colors, layout, and overall style. +2. **Name a preset theme** — e.g. “use `pine-green-strategy`”; see the catalog in [theme_EN.md](theme_EN.md); +3. **Provide a reference template** — upload an existing PPT / PPTX / screenshot and ask the agent to transfer colors, layout, and overall style. -You can combine both: lock the look with a template, then add one line about the style you want to emphasize. +You can combine these: lock the look with a preset or template, then add one line about the style you want to emphasize. ## Screenshots diff --git a/docs/themes/academic/blue-line-courseware.jpg b/docs/themes/academic/blue-line-courseware.jpg new file mode 100644 index 0000000..78fb142 Binary files /dev/null and b/docs/themes/academic/blue-line-courseware.jpg differ diff --git a/docs/themes/academic/deep-blue-atlas.jpg b/docs/themes/academic/deep-blue-atlas.jpg new file mode 100644 index 0000000..672a120 Binary files /dev/null and b/docs/themes/academic/deep-blue-atlas.jpg differ diff --git a/docs/themes/academic/paper-white-courseware.jpg b/docs/themes/academic/paper-white-courseware.jpg new file mode 100644 index 0000000..62467f4 Binary files /dev/null and b/docs/themes/academic/paper-white-courseware.jpg differ diff --git a/docs/themes/academic/pastel-derivation.jpg b/docs/themes/academic/pastel-derivation.jpg new file mode 100644 index 0000000..870ee05 Binary files /dev/null and b/docs/themes/academic/pastel-derivation.jpg differ diff --git a/docs/themes/academic/teal-green-academic-defense.jpg b/docs/themes/academic/teal-green-academic-defense.jpg new file mode 100644 index 0000000..b92eb4a Binary files /dev/null and b/docs/themes/academic/teal-green-academic-defense.jpg differ diff --git a/docs/themes/academic/wine-red-data.jpg b/docs/themes/academic/wine-red-data.jpg new file mode 100644 index 0000000..c379f7c Binary files /dev/null and b/docs/themes/academic/wine-red-data.jpg differ diff --git a/docs/themes/consulting/apricot-white-brief.jpg b/docs/themes/consulting/apricot-white-brief.jpg new file mode 100644 index 0000000..862ab8d Binary files /dev/null and b/docs/themes/consulting/apricot-white-brief.jpg differ diff --git a/docs/themes/consulting/indigo-due-diligence.jpg b/docs/themes/consulting/indigo-due-diligence.jpg new file mode 100644 index 0000000..5d5818b Binary files /dev/null and b/docs/themes/consulting/indigo-due-diligence.jpg differ diff --git a/docs/themes/consulting/marine-blue-research.jpg b/docs/themes/consulting/marine-blue-research.jpg new file mode 100644 index 0000000..076da68 Binary files /dev/null and b/docs/themes/consulting/marine-blue-research.jpg differ diff --git a/docs/themes/consulting/moss-green-transformation.jpg b/docs/themes/consulting/moss-green-transformation.jpg new file mode 100644 index 0000000..dc42dc4 Binary files /dev/null and b/docs/themes/consulting/moss-green-transformation.jpg differ diff --git a/docs/themes/consulting/pine-green-strategy.jpg b/docs/themes/consulting/pine-green-strategy.jpg new file mode 100644 index 0000000..09810a7 Binary files /dev/null and b/docs/themes/consulting/pine-green-strategy.jpg differ diff --git a/docs/themes/consulting/red-black-growth.jpg b/docs/themes/consulting/red-black-growth.jpg new file mode 100644 index 0000000..d3ae264 Binary files /dev/null and b/docs/themes/consulting/red-black-growth.jpg differ diff --git a/docs/themes/extra/color-stripes-documentary.jpg b/docs/themes/extra/color-stripes-documentary.jpg new file mode 100644 index 0000000..d67e491 Binary files /dev/null and b/docs/themes/extra/color-stripes-documentary.jpg differ diff --git a/docs/themes/extra/dark-themed-data.jpg b/docs/themes/extra/dark-themed-data.jpg new file mode 100644 index 0000000..c6d4c15 Binary files /dev/null and b/docs/themes/extra/dark-themed-data.jpg differ diff --git a/docs/themes/extra/dusk-violet-consulting.jpg b/docs/themes/extra/dusk-violet-consulting.jpg new file mode 100644 index 0000000..4526523 Binary files /dev/null and b/docs/themes/extra/dusk-violet-consulting.jpg differ diff --git a/docs/themes/extra/fresh-brand.jpg b/docs/themes/extra/fresh-brand.jpg new file mode 100644 index 0000000..e7ad6c6 Binary files /dev/null and b/docs/themes/extra/fresh-brand.jpg differ diff --git a/docs/themes/extra/gold-orange-type-journal.jpg b/docs/themes/extra/gold-orange-type-journal.jpg new file mode 100644 index 0000000..4c46c37 Binary files /dev/null and b/docs/themes/extra/gold-orange-type-journal.jpg differ diff --git a/docs/themes/extra/ink-green-market-trends.jpg b/docs/themes/extra/ink-green-market-trends.jpg new file mode 100644 index 0000000..4dd60cf Binary files /dev/null and b/docs/themes/extra/ink-green-market-trends.jpg differ diff --git a/docs/themes/extra/lead-gray-quarterly.jpg b/docs/themes/extra/lead-gray-quarterly.jpg new file mode 100644 index 0000000..d2c244a Binary files /dev/null and b/docs/themes/extra/lead-gray-quarterly.jpg differ diff --git a/docs/themes/extra/map-strategy.jpg b/docs/themes/extra/map-strategy.jpg new file mode 100644 index 0000000..c098d3b Binary files /dev/null and b/docs/themes/extra/map-strategy.jpg differ diff --git a/docs/themes/extra/mist-blue-travelogue.jpg b/docs/themes/extra/mist-blue-travelogue.jpg new file mode 100644 index 0000000..dd99c79 Binary files /dev/null and b/docs/themes/extra/mist-blue-travelogue.jpg differ diff --git a/docs/themes/extra/orange-tech.jpg b/docs/themes/extra/orange-tech.jpg new file mode 100644 index 0000000..4df0660 Binary files /dev/null and b/docs/themes/extra/orange-tech.jpg differ diff --git a/docs/themes/extra/pink-purple-diagnosis.jpg b/docs/themes/extra/pink-purple-diagnosis.jpg new file mode 100644 index 0000000..c12e535 Binary files /dev/null and b/docs/themes/extra/pink-purple-diagnosis.jpg differ diff --git a/docs/themes/extra/red-black-business.jpg b/docs/themes/extra/red-black-business.jpg new file mode 100644 index 0000000..cc2f86d Binary files /dev/null and b/docs/themes/extra/red-black-business.jpg differ diff --git a/docs/themes/extra/red-white-business.jpg b/docs/themes/extra/red-white-business.jpg new file mode 100644 index 0000000..cb7eeda Binary files /dev/null and b/docs/themes/extra/red-white-business.jpg differ diff --git a/docs/themes/extra/xuan-paper-annual.jpg b/docs/themes/extra/xuan-paper-annual.jpg new file mode 100644 index 0000000..928775a Binary files /dev/null and b/docs/themes/extra/xuan-paper-annual.jpg differ diff --git a/docs/themes/finance/black-gold-ledger.jpg b/docs/themes/finance/black-gold-ledger.jpg new file mode 100644 index 0000000..3116ee5 Binary files /dev/null and b/docs/themes/finance/black-gold-ledger.jpg differ diff --git a/docs/themes/finance/ebony-ledger.jpg b/docs/themes/finance/ebony-ledger.jpg new file mode 100644 index 0000000..7a459b6 Binary files /dev/null and b/docs/themes/finance/ebony-ledger.jpg differ diff --git a/docs/themes/finance/honey-orange-memo.jpg b/docs/themes/finance/honey-orange-memo.jpg new file mode 100644 index 0000000..8497b18 Binary files /dev/null and b/docs/themes/finance/honey-orange-memo.jpg differ diff --git a/docs/themes/finance/lake-blue-memo.jpg b/docs/themes/finance/lake-blue-memo.jpg new file mode 100644 index 0000000..bf4befe Binary files /dev/null and b/docs/themes/finance/lake-blue-memo.jpg differ diff --git a/docs/themes/finance/prospect-annual.jpg b/docs/themes/finance/prospect-annual.jpg new file mode 100644 index 0000000..03428bd Binary files /dev/null and b/docs/themes/finance/prospect-annual.jpg differ diff --git a/docs/themes/finance/rice-paper-annual.jpg b/docs/themes/finance/rice-paper-annual.jpg new file mode 100644 index 0000000..143779d Binary files /dev/null and b/docs/themes/finance/rice-paper-annual.jpg differ diff --git a/docs/themes/promotion/aqua-charity-report.jpg b/docs/themes/promotion/aqua-charity-report.jpg new file mode 100644 index 0000000..416027b Binary files /dev/null and b/docs/themes/promotion/aqua-charity-report.jpg differ diff --git a/docs/themes/promotion/cream-collage.jpg b/docs/themes/promotion/cream-collage.jpg new file mode 100644 index 0000000..d80cd72 Binary files /dev/null and b/docs/themes/promotion/cream-collage.jpg differ diff --git a/docs/themes/promotion/pine-soot-pictorial.jpg b/docs/themes/promotion/pine-soot-pictorial.jpg new file mode 100644 index 0000000..8f3e812 Binary files /dev/null and b/docs/themes/promotion/pine-soot-pictorial.jpg differ diff --git a/docs/themes/promotion/silk-yellow-magazine.jpg b/docs/themes/promotion/silk-yellow-magazine.jpg new file mode 100644 index 0000000..be9b4aa Binary files /dev/null and b/docs/themes/promotion/silk-yellow-magazine.jpg differ diff --git a/docs/themes/promotion/silver-gray-luxury-magazine.jpg b/docs/themes/promotion/silver-gray-luxury-magazine.jpg new file mode 100644 index 0000000..a034a7d Binary files /dev/null and b/docs/themes/promotion/silver-gray-luxury-magazine.jpg differ diff --git a/docs/themes/promotion/travel-green-handbook.jpg b/docs/themes/promotion/travel-green-handbook.jpg new file mode 100644 index 0000000..282c696 Binary files /dev/null and b/docs/themes/promotion/travel-green-handbook.jpg differ diff --git a/docs/themes/work/blue-flame-brand.jpg b/docs/themes/work/blue-flame-brand.jpg new file mode 100644 index 0000000..e5d6410 Binary files /dev/null and b/docs/themes/work/blue-flame-brand.jpg differ diff --git a/docs/themes/work/electric-violet-business.jpg b/docs/themes/work/electric-violet-business.jpg new file mode 100644 index 0000000..791dadd Binary files /dev/null and b/docs/themes/work/electric-violet-business.jpg differ diff --git a/docs/themes/work/moon-white-imagery.jpg b/docs/themes/work/moon-white-imagery.jpg new file mode 100644 index 0000000..a012184 Binary files /dev/null and b/docs/themes/work/moon-white-imagery.jpg differ diff --git a/docs/themes/work/sky-blue-wayfinding.jpg b/docs/themes/work/sky-blue-wayfinding.jpg new file mode 100644 index 0000000..418cc0a Binary files /dev/null and b/docs/themes/work/sky-blue-wayfinding.jpg differ diff --git a/docs/themes/work/warm-clay-works.jpg b/docs/themes/work/warm-clay-works.jpg new file mode 100644 index 0000000..521296c Binary files /dev/null and b/docs/themes/work/warm-clay-works.jpg differ diff --git a/docs/themes/work/warm-jade-annual-report.jpg b/docs/themes/work/warm-jade-annual-report.jpg new file mode 100644 index 0000000..168800e Binary files /dev/null and b/docs/themes/work/warm-jade-annual-report.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/cabin-detail.jpg b/example/xiaomi-yu7-ppt-animation/media/cabin-detail.jpg new file mode 100644 index 0000000..f8528f1 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/cabin-detail.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/cabin.jpg b/example/xiaomi-yu7-ppt-animation/media/cabin.jpg new file mode 100644 index 0000000..1091090 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/cabin.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/charging.jpg b/example/xiaomi-yu7-ppt-animation/media/charging.jpg new file mode 100644 index 0000000..b79336f Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/charging.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/design-detail.png b/example/xiaomi-yu7-ppt-animation/media/design-detail.png new file mode 100644 index 0000000..1e65668 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/design-detail.png differ diff --git a/example/xiaomi-yu7-ppt-animation/media/design-front.jpg b/example/xiaomi-yu7-ppt-animation/media/design-front.jpg new file mode 100644 index 0000000..608349c Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/design-front.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/design-side.png b/example/xiaomi-yu7-ppt-animation/media/design-side.png new file mode 100644 index 0000000..a839f95 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/design-side.png differ diff --git a/example/xiaomi-yu7-ppt-animation/media/hero.jpg b/example/xiaomi-yu7-ppt-animation/media/hero.jpg new file mode 100644 index 0000000..113ece7 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/hero.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/performance.jpg b/example/xiaomi-yu7-ppt-animation/media/performance.jpg new file mode 100644 index 0000000..3f3a20e Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/performance.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/tech-detail.jpg b/example/xiaomi-yu7-ppt-animation/media/tech-detail.jpg new file mode 100644 index 0000000..f632128 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/tech-detail.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/tech.jpg b/example/xiaomi-yu7-ppt-animation/media/tech.jpg new file mode 100644 index 0000000..e0906f4 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/tech.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-2.png b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-2.png new file mode 100644 index 0000000..eedb8be Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-2.png differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-3.png b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-3.png new file mode 100644 index 0000000..d9db109 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-3.png differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-4.png b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-4.png new file mode 100644 index 0000000..73e0957 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-4.png differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-5.png b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-5.png new file mode 100644 index 0000000..f16b075 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin-5.png differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-cabin.jpg b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin.jpg new file mode 100644 index 0000000..5b4138e Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-cabin.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-detail.jpg b/example/xiaomi-yu7-ppt-animation/media/yu7-detail.jpg new file mode 100644 index 0000000..de908df Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-detail.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-exterior.jpg b/example/xiaomi-yu7-ppt-animation/media/yu7-exterior.jpg new file mode 100644 index 0000000..e79222b Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-exterior.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-hero.jpg b/example/xiaomi-yu7-ppt-animation/media/yu7-hero.jpg new file mode 100644 index 0000000..1708dcb Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-hero.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-performance.jpg b/example/xiaomi-yu7-ppt-animation/media/yu7-performance.jpg new file mode 100644 index 0000000..e31e1a9 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-performance.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-tech-2.png b/example/xiaomi-yu7-ppt-animation/media/yu7-tech-2.png new file mode 100644 index 0000000..2bf654b Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-tech-2.png differ diff --git a/example/xiaomi-yu7-ppt-animation/media/yu7-tech.jpg b/example/xiaomi-yu7-ppt-animation/media/yu7-tech.jpg new file mode 100644 index 0000000..02e6d30 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/media/yu7-tech.jpg differ diff --git a/example/xiaomi-yu7-ppt-animation/pages/01_cover.page b/example/xiaomi-yu7-ppt-animation/pages/01_cover.page new file mode 100644 index 0000000..86240e7 --- /dev/null +++ b/example/xiaomi-yu7-ppt-animation/pages/01_cover.page @@ -0,0 +1,70 @@ +pageType: cover +background: + type: image + src: media/yu7-hero.jpg + fit: {mode: cover} +elements: + - elementId: cover-wash + elementType: shape + bounds: [0, 0, 960, 540] + shapeName: rect + fill: {type: solid, color: "#00000072"} + - elementId: cover-rule + elementType: shape + bounds: [58, 44, 72, 4] + shapeName: rect + fill: {type: solid, color: "$orange"} + - elementId: cover-meta + elementType: text + bounds: [58, 58, 700, 22] + content: + fontFamily: MiSans + color: "$muted" + fontSize: 12 + letterSpacing: 2 + text: "XIAOMI EV / YU7 / 2025 PRODUCT STORY" + - elementId: cover-title + elementType: text + bounds: [58, 206, 560, 120] + content: + fontFamily: MiSans + color: "$white" + align: [left, middle] + text: | +

小米 YU7

+

从容奔赴 · 伟大旅程

+ - elementId: cover-subtitle + elementType: text + bounds: [60, 366, 380, 64] + content: + fontFamily: MiSans + color: "$white" + fontSize: 17 + lineHeight: 1.35 + text: | +

跑车级姿态,SUV 的从容。

+

一台把长途旅行做成日常的纯电 SUV。

+ - elementId: cover-source + elementType: text + bounds: [60, 494, 800, 18] + content: + fontFamily: MiSans + color: "#D8DFE2" + fontSize: 9 + text: "图片 / 资料:小米汽车官网 YU7(访问:2026-08-06)" +animations: + - elementId: cover-title + effect: zoom-in + trigger: afterPrevious + durationMs: 700 + easing: ease-out + - elementId: cover-subtitle + effect: fly-in + direction: up + trigger: afterPrevious + durationMs: 550 + easing: ease-out + - elementId: cover-meta + effect: fade-in + trigger: withPrevious + durationMs: 450 diff --git a/example/xiaomi-yu7-ppt-animation/pages/02_position.page b/example/xiaomi-yu7-ppt-animation/pages/02_position.page new file mode 100644 index 0000000..78d9f1d --- /dev/null +++ b/example/xiaomi-yu7-ppt-animation/pages/02_position.page @@ -0,0 +1,80 @@ +pageType: content +background: + type: image + src: media/yu7-exterior.jpg + fit: {mode: cover} +elements: + - elementId: position-wash + elementType: shape + bounds: [0, 0, 500, 540] + shapeName: rect + fill: {type: solid, color: "#071013D4"} + - elementId: position-index + elementType: text + bounds: [58, 42, 120, 24] + content: + fontFamily: MiSans + color: "$orange" + fontSize: 12 + bold: true + letterSpacing: 2 + text: "01 / POSITION" + - elementId: position-title + elementType: text + bounds: [58, 94, 400, 112] + content: + fontFamily: MiSans + color: "$white" + text: | +

从 SU7 到 YU7

+

小米的第二台车,第一台 SUV

+ - elementId: position-body + elementType: text + bounds: [60, 236, 360, 112] + content: + fontFamily: MiSans + color: "$muted" + fontSize: 17 + lineHeight: 1.45 + text: | +

保留跑车式的低趴比例,

+

把车内空间、舒适与长途能力

+

放进同一台车。

+ - elementId: position-line + elementType: line + bounds: [60, 382, 354, 1] + viewBox: [354, 1] + points: "0,0.5 354,0.5" + border: {style: solid, width: 2, color: "$orange"} + - elementId: position-stats + elementType: text + bounds: [60, 405, 410, 88] + content: + fontFamily: MiSans + color: "$white" + text: | +

1:3 头身比  0.245 风阻系数

+

接近 5 米车长,仍然保留向前俯冲的姿态

+ - elementId: position-source + elementType: text + bounds: [58, 510, 850, 16] + content: + fontFamily: MiSans + color: "#CCD4D7" + fontSize: 9 + text: "数据来源:小米汽车官网 YU7;图源同上" +animations: + - elementId: position-title + effect: fly-in + direction: right + trigger: afterPrevious + durationMs: 600 + easing: ease-out + - elementId: position-body + effect: fade-in + trigger: afterPrevious + durationMs: 500 + - elementId: position-stats + effect: zoom-in + trigger: afterPrevious + durationMs: 500 diff --git a/example/xiaomi-yu7-ppt-animation/pages/03_design.page b/example/xiaomi-yu7-ppt-animation/pages/03_design.page new file mode 100644 index 0000000..2c15643 --- /dev/null +++ b/example/xiaomi-yu7-ppt-animation/pages/03_design.page @@ -0,0 +1,80 @@ +pageType: content +background: + type: image + src: media/yu7-detail.jpg + fit: {mode: cover} +elements: + - elementId: design-wash + elementType: shape + bounds: [0, 0, 960, 540] + shapeName: rect + fill: {type: solid, color: "#0000004C"} + - elementId: design-topline + elementType: line + bounds: [58, 46, 844, 1] + viewBox: [844, 1] + points: "0,0.5 844,0.5" + border: {style: solid, width: 1, color: "#FFFFFF7A"} + - elementId: design-index + elementType: text + bounds: [58, 58, 160, 22] + content: + fontFamily: MiSans + color: "$orange" + fontSize: 12 + bold: true + letterSpacing: 2 + text: "02 / DESIGN" + - elementId: design-title + elementType: text + bounds: [58, 88, 560, 74] + content: + fontFamily: MiSans + color: "$white" + text: | +

长车头,宽体,低趴

+

一眼看上去,就知道它在向前

+ - elementId: design-callout + elementType: text + bounds: [62, 186, 270, 168] + content: + fontFamily: MiSans + color: "$white" + text: | +

1:3

+

头身比

+

让 SUV 也有跑车的第一眼张力。

+ - elementId: design-labels + elementType: text + bounds: [58, 390, 460, 74] + content: + fontFamily: MiSans + color: "$white" + fontSize: 16 + lineHeight: 1.45 + text: | +

3.11㎡ 蚌式铝机盖 | 0.245 超低风阻

+

10 组贯穿式风道 | 19 个风口 | 流线型尾部

+ - elementId: design-source + elementType: text + bounds: [58, 508, 850, 16] + content: + fontFamily: MiSans + color: "#D8DFE2" + fontSize: 9 + text: "数据来源:小米汽车官网 YU7 外观设计;数据来自小米汽车实验室" +animations: + - elementId: design-title + effect: fade-in + trigger: afterPrevious + durationMs: 500 + - elementId: design-callout + effect: zoom-in + trigger: afterPrevious + durationMs: 600 + easing: ease-out + - elementId: design-labels + effect: fly-in + direction: up + trigger: afterPrevious + durationMs: 500 diff --git a/example/xiaomi-yu7-ppt-animation/pages/04_cabin.page b/example/xiaomi-yu7-ppt-animation/pages/04_cabin.page new file mode 100644 index 0000000..90d1a93 --- /dev/null +++ b/example/xiaomi-yu7-ppt-animation/pages/04_cabin.page @@ -0,0 +1,80 @@ +pageType: content +background: + type: image + src: media/yu7-cabin.jpg + fit: {mode: cover} +elements: + - elementId: cabin-wash + elementType: shape + bounds: [0, 0, 960, 540] + shapeName: rect + fill: {type: solid, color: "#00000055"} + - elementId: cabin-panel + elementType: shape + bounds: [0, 0, 390, 540] + shapeName: rect + fill: {type: solid, color: "#11161AD9"} + - elementId: cabin-index + elementType: text + bounds: [58, 42, 160, 22] + content: + fontFamily: MiSans + color: "$orange" + fontSize: 12 + bold: true + letterSpacing: 2 + text: "03 / CABIN" + - elementId: cabin-title + elementType: text + bounds: [58, 91, 315, 132] + content: + fontFamily: MiSans + color: "$white" + text: | +

座舱,

+

不只是屏幕

+

是第一排观景席

+ - elementId: cabin-body + elementType: text + bounds: [60, 240, 278, 100] + content: + fontFamily: MiSans + color: "$muted" + fontSize: 16 + lineHeight: 1.5 + text: | +

把导航、车况与娱乐信息

+

放到自然视线里,

+

让驾驶少一点低头,多一点从容。

+ - elementId: cabin-stats + elementType: text + bounds: [60, 380, 312, 92] + content: + fontFamily: MiSans + color: "$white" + text: | +

1.1 m HyperVision 全景显示

+

三块 Mini LED | 108 PPD 视网膜级清晰度

+ - elementId: cabin-source + elementType: text + bounds: [58, 508, 850, 16] + content: + fontFamily: MiSans + color: "#D8DFE2" + fontSize: 9 + text: "资料来源:Xiaomi Global · YU7 cabin;图源:小米汽车官网" +animations: + - elementId: cabin-title + effect: fly-in + direction: right + trigger: afterPrevious + durationMs: 600 + easing: ease-out + - elementId: cabin-body + effect: fade-in + trigger: afterPrevious + durationMs: 500 + - elementId: cabin-stats + effect: zoom-in + trigger: afterPrevious + durationMs: 500 diff --git a/example/xiaomi-yu7-ppt-animation/pages/05_performance.page b/example/xiaomi-yu7-ppt-animation/pages/05_performance.page new file mode 100644 index 0000000..cc2c12d --- /dev/null +++ b/example/xiaomi-yu7-ppt-animation/pages/05_performance.page @@ -0,0 +1,72 @@ +pageType: content +background: + type: image + src: media/yu7-performance.jpg + fit: {mode: cover} +elements: + - elementId: perf-wash + elementType: shape + bounds: [0, 0, 480, 540] + shapeName: rect + fill: {type: solid, color: "#071013D0"} + - elementId: perf-index + elementType: text + bounds: [58, 42, 200, 22] + content: + fontFamily: MiSans + color: "$orange" + fontSize: 12 + bold: true + letterSpacing: 2 + text: "04 / PERFORMANCE" + - elementId: perf-title + elementType: text + bounds: [58, 92, 390, 110] + content: + fontFamily: MiSans + color: "$white" + text: | +

快,不必牺牲从容

+

YU7 Max · 性能旗舰

+ - elementId: perf-stats + elementType: text + bounds: [60, 250, 360, 150] + content: + fontFamily: MiSans + color: "$white" + text: | +

3.23 s 0—100 km/h

+

508 kW 最大功率

+

253 km/h 最高时速

+ - elementId: perf-caption + elementType: text + bounds: [60, 435, 350, 38] + content: + fontFamily: MiSans + color: "$muted" + fontSize: 14 + text: "性能被放进电机、底盘与整车稳定性里。" + - elementId: perf-source + elementType: text + bounds: [58, 508, 850, 16] + content: + fontFamily: MiSans + color: "#D8DFE2" + fontSize: 9 + text: "数据来源:Xiaomi Global · YU7 launch;图片:小米汽车官网" +animations: + - elementId: perf-title + effect: fly-in + direction: right + trigger: afterPrevious + durationMs: 600 + easing: ease-out + - elementId: perf-stats + effect: zoom-in + trigger: afterPrevious + durationMs: 650 + easing: ease-out + - elementId: perf-caption + effect: fade-in + trigger: afterPrevious + durationMs: 450 diff --git a/example/xiaomi-yu7-ppt-animation/pages/06_range.page b/example/xiaomi-yu7-ppt-animation/pages/06_range.page new file mode 100644 index 0000000..6abf560 --- /dev/null +++ b/example/xiaomi-yu7-ppt-animation/pages/06_range.page @@ -0,0 +1,71 @@ +pageType: content +background: + type: image + src: media/yu7-hero.jpg + fit: {mode: cover} +elements: + - elementId: range-wash + elementType: shape + bounds: [0, 0, 960, 540] + shapeName: rect + fill: {type: solid, color: "#00000070"} + - elementId: range-index + elementType: text + bounds: [58, 42, 160, 22] + content: + fontFamily: MiSans + color: "$orange" + fontSize: 12 + bold: true + letterSpacing: 2 + text: "05 / RANGE" + - elementId: range-title + elementType: text + bounds: [58, 95, 520, 90] + content: + fontFamily: MiSans + color: "$white" + text: | +

长途,不应被充电打断

+

高压平台,把“出发”交还给生活

+ - elementId: range-big + elementType: text + bounds: [58, 238, 490, 118] + content: + fontFamily: MiSans + color: "$white" + text: | +

835 km

+

CLTC 最长续航(标准版)

+ - elementId: range-secondary + elementType: text + bounds: [60, 400, 460, 70] + content: + fontFamily: MiSans + color: "$white" + text: | +

12 min 10% → 80%

+

15 分钟补能,最高可增加约 620 km 续航

+ - elementId: range-source + elementType: text + bounds: [58, 508, 850, 16] + content: + fontFamily: MiSans + color: "#D8DFE2" + fontSize: 9 + text: "数据来源:小米汽车官网 YU7;续航 / 充电数据以车型配置与测试条件为准" +animations: + - elementId: range-title + effect: fade-in + trigger: afterPrevious + durationMs: 500 + - elementId: range-big + effect: zoom-in + trigger: afterPrevious + durationMs: 700 + easing: ease-out + - elementId: range-secondary + effect: fly-in + direction: up + trigger: afterPrevious + durationMs: 500 diff --git a/example/xiaomi-yu7-ppt-animation/pages/07_intelligence.page b/example/xiaomi-yu7-ppt-animation/pages/07_intelligence.page new file mode 100644 index 0000000..cd62063 --- /dev/null +++ b/example/xiaomi-yu7-ppt-animation/pages/07_intelligence.page @@ -0,0 +1,74 @@ +pageType: content +background: + type: image + src: media/yu7-tech.jpg + fit: {mode: cover} +elements: + - elementId: intel-wash + elementType: shape + bounds: [0, 0, 530, 540] + shapeName: rect + fill: {type: solid, color: "#05080CD9"} + - elementId: intel-index + elementType: text + bounds: [58, 42, 230, 22] + content: + fontFamily: MiSans + color: "$orange" + fontSize: 12 + bold: true + letterSpacing: 2 + text: "06 / INTELLIGENCE" + - elementId: intel-title + elementType: text + bounds: [58, 92, 420, 105] + content: + fontFamily: MiSans + color: "$white" + text: | +

智能能力,藏在日常里

+

从“能用”到“好用”

+ - elementId: intel-body + elementType: text + bounds: [60, 230, 390, 118] + content: + fontFamily: MiSans + color: "$muted" + fontSize: 16 + lineHeight: 1.45 + text: | +

HyperVision 全景显示、智能座舱、

+

高算力辅助驾驶硬件,

+

共同把“信息”变成自然的体验。

+ - elementId: intel-stats + elementType: text + bounds: [60, 390, 410, 94] + content: + fontFamily: MiSans + color: "$white" + text: | +

700 TOPS DRIVE AGX Thor

+

LiDAR | 11 个高清摄像头 | 12 个超声波雷达

+ - elementId: intel-source + elementType: text + bounds: [58, 508, 850, 16] + content: + fontFamily: MiSans + color: "#D8DFE2" + fontSize: 9 + text: "资料来源:Xiaomi Global · YU7 intelligent cabin;图片:小米汽车官网" +animations: + - elementId: intel-title + effect: fly-in + direction: right + trigger: afterPrevious + durationMs: 600 + easing: ease-out + - elementId: intel-body + effect: fade-in + trigger: afterPrevious + durationMs: 500 + - elementId: intel-stats + effect: zoom-in + trigger: afterPrevious + durationMs: 550 diff --git a/example/xiaomi-yu7-ppt-animation/pages/08_summary.page b/example/xiaomi-yu7-ppt-animation/pages/08_summary.page new file mode 100644 index 0000000..f8f002c --- /dev/null +++ b/example/xiaomi-yu7-ppt-animation/pages/08_summary.page @@ -0,0 +1,80 @@ +pageType: final +background: + type: image + src: media/yu7-exterior.jpg + fit: {mode: cover} +elements: + - elementId: summary-wash + elementType: shape + bounds: [0, 0, 960, 540] + shapeName: rect + fill: {type: solid, color: "#071013A6"} + - elementId: summary-rule + elementType: shape + bounds: [58, 44, 72, 4] + shapeName: rect + fill: {type: solid, color: "$orange"} + - elementId: summary-index + elementType: text + bounds: [58, 58, 180, 22] + content: + fontFamily: MiSans + color: "$orange" + fontSize: 12 + bold: true + letterSpacing: 2 + text: "07 / TAKEAWAY" + - elementId: summary-title + elementType: text + bounds: [58, 106, 540, 90] + content: + fontFamily: MiSans + color: "$white" + text: | +

YU7 的答案,很简单

+

快 · 远 · 智能 · 从容

+ - elementId: summary-body + elementType: text + bounds: [60, 248, 620, 125] + content: + fontFamily: MiSans + color: "$white" + fontSize: 23 + lineHeight: 1.45 + text: | +

它没有把 SUV 做成“更大的一台车”,

+

而是把速度、空间与科技,重新排成了同一条路。

+ - elementId: summary-end + elementType: text + bounds: [60, 412, 500, 60] + content: + fontFamily: MiSans + color: "$muted" + fontSize: 17 + text: | +

小米 YU7

+

让每一次出发,都更接近“伟大旅程”。

+ - elementId: summary-source + elementType: text + bounds: [58, 508, 850, 16] + content: + fontFamily: MiSans + color: "#D8DFE2" + fontSize: 9 + text: "图片 / 资料:小米汽车官网 YU7;本页为产品信息摘要" +animations: + - elementId: summary-title + effect: zoom-in + trigger: afterPrevious + durationMs: 650 + easing: ease-out + - elementId: summary-body + effect: fly-in + direction: up + trigger: afterPrevious + durationMs: 600 + easing: ease-out + - elementId: summary-end + effect: fade-in + trigger: afterPrevious + durationMs: 500 diff --git a/example/xiaomi-yu7-ppt-animation/xiaomi-yu7.pptd b/example/xiaomi-yu7-ppt-animation/xiaomi-yu7.pptd new file mode 100644 index 0000000..fdf5557 --- /dev/null +++ b/example/xiaomi-yu7-ppt-animation/xiaomi-yu7.pptd @@ -0,0 +1,30 @@ +version: v2 +title: 小米 YU7|介绍 +size: [960, 540] +theme: + colors: + orange: "#FF6900" + white: "#FFFFFF" + muted: "#C9D0D4" + ink: "#11161A" + textStyles: + title: + fontFamily: MiSans + color: "$white" + fontSize: 42 + bold: true + lineHeight: 0.98 + body: + fontFamily: MiSans + color: "$white" + fontSize: 18 + lineHeight: 1.35 +pages: + - pages/01_cover.page + - pages/02_position.page + - pages/03_design.page + - pages/04_cabin.page + - pages/05_performance.page + - pages/06_range.page + - pages/07_intelligence.page + - pages/08_summary.page diff --git a/example/xiaomi-yu7-ppt-animation/xiaomi-yu7.pptx b/example/xiaomi-yu7-ppt-animation/xiaomi-yu7.pptx new file mode 100644 index 0000000..c4cfdf1 Binary files /dev/null and b/example/xiaomi-yu7-ppt-animation/xiaomi-yu7.pptx differ diff --git a/package.json b/package.json index d8afd3d..6b97798 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "open-kimi-ppt-skills", - "version": "1.0.2", + "version": "1.1.0", "description": "Unofficial reverse-engineered Kimi Slides skill for AI coding agents with local PPTD editing and PPTX export.", "license": "MIT", "author": "binaryify", @@ -37,7 +37,9 @@ "skills/open-kimi-ppt/reference/", "skills/open-kimi-ppt/scripts/", "README.md", - "README_EN.md" + "README_EN.md", + "theme.md", + "theme_EN.md" ], "scripts": { "test": "node --test", diff --git a/skills/open-kimi-ppt/SKILL.md b/skills/open-kimi-ppt/SKILL.md index 3c2b12c..3d1cc3d 100644 --- a/skills/open-kimi-ppt/SKILL.md +++ b/skills/open-kimi-ppt/SKILL.md @@ -39,7 +39,7 @@ Understand the user's requirements based on the context: 2. Then determine the design direction - Self-directed design: no preference, or only simple style constraints given; you need to fill in or create the design - - Design system: the user provides a complete and detailed design scheme covering all color, font, layout, and component specifications + - Design system: a preset design system from the skill (`reference/design_system/`) is specified, or the user provides a complete and detailed design scheme covering all color, font, layout, and component specifications - Use a template: a template is provided and must be used - Style transfer: a style reference source is provided (images, web pages, etc.) @@ -49,10 +49,22 @@ Understand the user's requirements based on the context: - Outline: the user provides a page-by-page outline, speech script, or similar content * When the "user input type" is [Full document] or [Outline] and it is not specified whether expansion is allowed: since a page-by-page outline, speech script, or user document can hardly support the full content of a presentation, prefer using search to expand with more relevant material, cases, etc., unless the user explicitly says not to expand -4. Page count +4. Finally determine the exact page count - If the user requests a specific page count, the user's requirement takes priority - Page-by-page outline/script provided: match the number of pages in the outline/script - - When a complete and relatively structured document is provided / when only a topic is provided: decide the page count yourself based on the document content / search results + - When a complete and relatively structured document is provided: ask the user how much document content one page should cover, and give an estimated total page count; when only a topic is provided: suggest a recommended page count and confirm with the user + +#### Clarification and follow-up questions +When any of the following situations arise, resolve them by asking the user (use the agent's ask/clarification tool when available) +1. Requirements are ambiguous +- The user's intent is unclear or hard to understand +- The files/URLs provided by the user are inaccessible +2. Conflicting intents +- The user's intents contradict each other. For example: + * A design system is selected while also requesting a style that is completely inconsistent with that design system (e.g., using a McKinsey style while requiring large areas of whitespace on pages) / using a template / referencing an image style + * Requesting both "make 10 pages" and "deliver 30+ pages of output" +3. Unable to determine the user's requirements on your own +- When the purpose, design direction, input type, page count, etc. are hard to determine by yourself ### step3. Generate the presentation based on the user's requirements @@ -60,7 +72,8 @@ Before generating, first read `reference/pptd.md` to understand the pptd format #### Replicating a PPT - Analyze the images to estimate element positions, fonts and sizes, etc., and **replicate 1:1 as closely as possible**. -- When an image contains elements that are hard to replicate directly and cannot be approximated with icons/shapes (e.g., photos, avatars), you may use tools such as bash or python to crop and screenshot the original image +- For parts that are difficult to make out, use methods such as grid lines and close-up views to improve understanding. +- Replicate simple content in the image with elements; icons may be approximated with icons provided by Font Awesome. For content that cannot be approximated with icons or shapes, such as photos and avatars, use tools such as bash or python to crop and split the original image, then add the resulting image elements to the presentation #### Editing a PPT - Convert the user's uploaded pptx file to .pptd format @@ -79,8 +92,9 @@ When generating a PPT, adopt different production approaches for different user ##### Design system 1. Read the general constraints section of the `reference/slides_categories.md` guide, and read the scenario document corresponding to the user's query as the design foundation -2. Read the user-provided design system document as the presentation style. It is strictly forbidden to reference or mix in other design styles +2. Read the specified design system as the presentation style: either the user-provided design scheme, or the matching preset under `reference/design_system/` (search by name / path the user specified; prefer the folder's `design.md` when present). It is strictly forbidden to reference or mix in other design styles 3. Produce the presentation with reference to the above +4. Do not auto-pick a preset during self-directed design; only use `reference/design_system/` when a preset is explicitly specified ##### Using a template 1. Convert the user's uploaded pptx file into pptd form @@ -93,6 +107,21 @@ When generating a PPT, adopt different production approaches for different user - If the user provides a style reference URL, do not only read the text content; refer to and learn from the page's visual effect more to help understand the style 2. Produce the presentation using the reference file's style characteristics. You are encouraged to reuse illustrations, fonts, font-size hierarchies, elements, etc. from the original pdf/url +##### Images and Visual Materials +1. Images are an effective way to enrich a presentation's visual impact. Appropriate images should be used not only on covers and section dividers, but also on body pages to enrich the page, aid understanding, or support decision-making +2. Images are used to show concrete subjects, explain content, provide evidence, or establish a scene. Logos, icons, decorative textures, and very small thumbnails do not count as substantive imagery. +3. When a page involves products, people, places, buildings, events, cases, interfaces, experimental subjects, or spatial environments, prioritize corresponding real images or screenshots. If real images and screenshots cannot be obtained, generated images may be used instead. +4. Image priority: images provided by the user; images from official websites, official reports, and credible sources; searched images that are directly relevant to the content; images generated for conceptual expression or atmosphere. +5. After deciding which images are needed, complete image search, generation, and downloading in a batch before designing pages around their proportions. Save images in the `media` directory, keep them clear, and never stretch or distort them. +6. Analytical, technical, and academic PPTs should use corresponding evidence images when products, experiments, interfaces, cases, or on-site materials are available. Do not reduce every page to text, color blocks, and shapes. +7. Do not add irrelevant images merely to meet a quantity target. Every image must be directly relevant to the page's conclusion or communication goal. + +##### Content Guidelines +1. Language style: unless the user explicitly requests otherwise, strictly avoid overly abstract expressions and uncommon metaphors +- Do not overuse metaphors, slogans, or abstract jargon such as distribution, an N-step argument, everything at a glance, a closed loop, hands-on practice, verification, deconstruction, second-class citizens, poison pills, or wall clocks +- Do not use common AI phrasing such as “not X, but Y,” “X is Y,” “why / based on what / how,” “key takeaway,” or “N battlefronts / paths” +- Do not use overly colloquial expressions such as “where should the ammunition go,” “the Nth thing,” “can't pick the right one,” or “cannot be used as X” + ### step4. PPT validation 1. Validate the generated pptd against the format definition in `reference/pptd.md` (required fields, types, bounds, theme tokens, resource paths, etc.) and repair issues over multiple rounds 2. Visual review with exported page images — **required before PPTX export when the model supports image input (multimodal)**: @@ -162,3 +191,6 @@ When generating a PPT, adopt different production approaches for different user 8. After export, verify that the output exists and report the generated path. Confirm that every slide has exactly one root-level fade transition in valid CT_Slide order (`cSld`, optional `clrMapOvr`, `transition`, optional `timing/extLst`) and that the PPTX ZIP passes integrity checks. A byte-string search for `` is insufficient because Office ignores transitions nested inside `cSld`. For higher-risk decks, additionally inspect font parts and representative rendered/opened pages as appropriate. 9. When the user wants to open, edit, save, or export a PPTD project manually, start the local browser editor with `npx open-kimi-ppt-skills serve`. Ask the user to open `http://127.0.0.1:55173/` and authorize the complete PPTD project directory. Use a Chromium-based browser for writable access; folder-upload fallback is read-only. The local host only serves the editor shell, while the embedded public Kimi editor and remote assets still require network access. 10. After completing and delivering any presentation, always end the final response with a concise optional next step telling the user that they can run `npx open-kimi-ppt-skills serve` to view or edit the PPTD project, configure slide transition animations, and export PPTX manually. Keep this reminder in addition to, not instead of, the required project and file links. +11. Element animations (`page.animations` in PPTD — entrance / emphasis / exit / motion-path; see `reference/pptd.md` §6): use them only when the user explicitly requests animations, or when the deck is clearly intended for live presentation / slideshow playback and animation provides a clear benefit for staged disclosure, process demonstration, causal explanation, pacing, visual impact, or brand storytelling. By default, do not add element animations to reading-oriented, self-study, print, or primarily send-and-browse decks. Prefer 1–3 animation groups per page and simple effects such as fade, fly, and zoom. This is separate from the default PPTX slide-level fade page transition written by `export_pptx.py`. +12. Speaker notes (`notes` on each `.page`): use them only when the user explicitly requests them; otherwise, do not add them. +13. Parallel tool calls: during PPT production, make tool calls in parallel whenever possible; in each round, write multiple page files in parallel to reduce the number of steps. diff --git a/skills/open-kimi-ppt/reference/design_system/01_strategy/01/en/dusk-violet-consulting.md b/skills/open-kimi-ppt/reference/design_system/01_strategy/01/en/dusk-violet-consulting.md new file mode 100644 index 0000000..8b2fb00 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/01_strategy/01/en/dusk-violet-consulting.md @@ -0,0 +1,177 @@ +# Organization Name — The Productivity Payoff STYLE DESIGN SYSTEM + +## 1. Style Positioning + +A consulting thought-leadership report-style PPT for executives, strategy teams, and research readers. It supports readable long-form text, quantitative charts, section navigation, and a branded, forward-looking visual feel; it is not a low-word-count sales pitch page or a visual-poster-style one-pager. + +Core page grammar: + +1. **Light blue report pages**: a soft pale blue–light purple gradient background carrying black long-form text, multi-column explanations, and purple key numbers. +2. **Black-background evidence pages**: charts sit on a large black canvas, with white text and purple/pink/orange bars or lines creating strong contrast. +3. **Dark photographic section dividers**: the cover and section transitions use "path forward" imagery such as light trails, ridgelines/roads/people. +4. **Fixed report skeleton**: a white section-navigation strip at the bottom, a purple ">" identity mark at lower left, a vertical report name on the right edge, and a page number at lower right. + +Underlying principles: + +1. **Evidence takes precedence over visual drama**: charts, sources, numbers, and conclusions must be readable; black backgrounds, purple, and photographic light effects must not obscure data or weaken contrast. +2. **High density must be disciplined by a stable skeleton**: multiple text paragraphs, multi-column modules, and complex charts are allowed, but every page must have a title area, a body area, footer navigation, and sufficient padding — avoid free-floating stacking. +3. **Page variation serves section rhythm**: photography pages for openings and section transitions, black-background pages for models/data evidence, light blue pages for explanations and recommendations; do not invent a new template on every page just for variety. + +## 2. Page Skeleton + +- **Canvas ratio**: widescreen 16:9; use the full rectangular canvas — no portrait or social-media ratios. +- **Default margins**: content pages keep relatively wide outer margins; the body extends from upper left toward center-right, with a fixed navigation band reserved at the bottom. Black chart blocks and photography blocks may extend nearly full-bleed, but must still avoid the footer and page number. +- **Background system**: content pages and the table of contents use pale blue, ice blue, and light purple gradients; chart pages overlay a black rectangular evidence area on the light blue page, or let a single black block occupy most of the page; sections/covers use full-bleed dark photography. +- **Title area**: typically at upper left. Black or purple on light blue pages; white inside the black region on black-background chart pages; placed over dark or calm areas on photography pages. +- **Body area**: divided into text explanation areas, chart evidence areas, image areas, and number-emphasis areas. Content pages are mostly 2–3 columns; chart pages are usually a large black-background chart + explanatory sidebar; case pages are usually text + a photo on the right or above. +- **Header**: no strong header bar; the report name appears as vertical text on the right edge instead of a horizontal top header. +- **Footer navigation**: most non-cover pages have a white navigation band at the bottom. A purple ">" symbol at lower left; section names laid out horizontally in the middle, separated by thin vertical lines; the current section darker or bolder; the page number at lower right. Keep it low-height, thin-lined, and in a stable position. +- **Vertical report name on the right**: content pages, the table of contents, and some chart pages place the report title/subtitle along the right edge. Do not make it a prominent decoration — it should be small and unobtrusive. +- **Logo**: on the cover's lower right, use the full brand wordmark (rendered as plain small text, writing the new topic name; do not draw a graphic logo); on content pages, the purple ">" identity mark mainly replaces the full wordmark; the back cover or closing page may restore the full brand wordmark. +- **Table of contents page**: light blue gradient background, title at upper left, section entries laid out in multiple horizontal columns; page-number ranges placed above or near the section titles; key sections may carry a small thumbnail grid; columns separated by thin vertical lines. +- **Author page**: light blue gradient background, purple title at upper left; author headshots arranged in a grid — headshot, name, title, and a small professional-social-platform icon form a standard author card. +- **Default reading path**: top-left title/lead-in → body left-column text → central chart or number → right-column supplement/photo → bottom navigation confirming the section. + +## 3. Content Organization + +- **Title style**: use report-style statements — a judgment sentence, a section name, or a "Figure X" chart caption; important section divider pages may use a large title to pose the question or direction. Do not chase short punchy slogans. +- **Key message sentences**: place 1–2 explanatory sentences under the title or above a chart, stating the finding, definition, or how to read the chart. Do not make an entire page a single big-statement sentence unless it is a section photography page. +- **Body text organization**: short paragraphs, left-aligned; single paragraphs medium-to-short in length; 2–4 paragraphs per column. Avoid long unbroken walls of text. +- **Grouping logic**: includes "problem—evidence—implication", "model elements", "behavior/recommendation lists", "case explanations", and "number comparisons"; use columns, light-colored cards, black-background areas, or thin dividers to separate them — not large numbers of icons. +- **Number of points per page**: a content page carries 1 main topic plus 2–4 supporting points; high-density pages may contain multiple sub-modules but must have one unified overall title and clear arrangement. +- **Bullet style**: prefer subheadings + paragraph explanations; use traditional bullet lists sparingly; list items should be short, indentation restrained. +- **Keyword emphasis**: use bold, purple numbers, or purple subheadings; avoid heavy colored highlighting. Highlight at most 1–2 keywords or numbers per module. +- **Numbers/units/time frames**: large numbers may stand alone as purple or black info blocks with an explanation alongside; percentages, multiples, and time ranges must stay consistent with chart labels. Numbers must not be replaced by decorative graphics. +- **Source footnotes**: place small source/notes at the bottom of charts and research pages or at chart edges, low-contrast but readable. Sources must not enter the main title hierarchy and must not grab attention with decorative colors. + +## 4. Content Page Layout System + +### A. Light blue multi-column report page + +For concept explanations, background, recommendations, case text, and a small number of key figures. Pale blue/light purple gradient background, title at upper left, body in 2–3 columns: the left column holds the lead-in or main argument, the middle column holds supplementary paragraphs/bullets, and the right column holds large numbers, images, or a short conclusion. Use purple numbers, bold subheadings, and clear column widths to establish focus, and keep paragraph spacing. If complex data comparison is needed, do not force it into this layout — switch to a black-background chart page. + +### B. Black-background chart evidence page + explanatory sidebar + +For complex bar charts, line charts, grouped comparisons, model derivations, and "Figure"-type evidence. One side or the center is a large black rectangular chart area with a white title and caption inside; the other side keeps a light blue text column explaining the findings in black body text. The chart area is the visual center of gravity; use purple/pink/orange data series, white key annotations, and local arrows/connecting lines. If the chart carries only a single simple number, do not use a large black background — it would feel too heavy. + +### C. Photography section/question page + +For covers, section transitions, important questions, or interim conclusions. Use full-bleed dark photography — ridgelines, roads, silhouettes, tech devices, purple light trails are common; a large white title sits over a dark area, with a smaller subtitle. Apart from the necessary title, a brief caption, and the brand wordmark (plain small text; do not draw a graphic logo), do not overlay long body text or complex charts. + +### D. Text + image case page + +For industry cases, scenario descriptions, or concrete evidence. A real photo or a partial device/scene sits in a large rectangular area on the right or above; text sits in columns on the left or beside it. The image does not act as a full-page background, and no illustrations are used. If the photo background is busy, do not place text directly on it — put the text in a light-colored area. + +### E. High-density module/framework page + +For 3–5 behaviors, elements, stages, or model components. Organize with horizontal cards, vertical columns, purple bottom labels, or a black-background formula area; each module contains a subheading, a short explanatory paragraph, and necessary numbers or keywords. When there are many modules, use equal-width columns and consistent padding; do not replace textual logic with complex SmartArt decoration. + +## 5. Color System + +- **Light blue background**: approximately #D6ECFE / #E4F4FF / #DFF3FF. Used for the large background areas of content pages, table of contents, author, and case pages; may gently gradient into light purple but must not become oversaturated. Low replaceability — it is core to the style. +- **Light purple background transition**: approximately #DAE3F9 / #D8E3FA / #C2A1BC. Used at background gradient edges, card bases, or local atmosphere; medium-to-low area. May be adjusted within the same color family; switching to a large warm-color base is not recommended. +- **Black/near-black evidence base**: approximately #08151C / #201F20 / #000000. Used for chart canvases, formula models, and text-carrying areas of dark section pages; area may range from half a page to most of a page; must not be broken into fragments mixed with the light blue body text. +- **Primary text black**: approximately #111111 / #201F20. Used for body text, subheadings, footer navigation, and table text on light blue backgrounds; high contrast is mandatory. Must not be replaced by light gray as the primary body color. +- **Reversed-out white text**: #FFFFFF or near-white. Used for black-background charts, photography-page titles, and cover titles; only on dark backgrounds. +- **Brand purple / accent purple**: approximately #A100FF / #8A00E6 / #7F35FF. Used for the ">" identity mark, key numbers, key chart series, labels, and a few subheadings; small-to-medium area. It may be fine-tuned toward the brand's primary color, but must not be replaced with multiple unrelated vivid colors. +- **Pink-purple/magenta data color**: approximately #D000FF / #C000C8. Used for the second accent series in charts or black-background cards; serves data grouping only, never large blocks of body text. +- **Orange/coral data color**: approximately #D38778 / #D7AA9F. Used for cover light effects, contrast series in charts, or warm accents; small area; must not become the primary body color. +- **Gray support**: approximately #8C95A4 / #A8ABBC / #C7CAD6. Used for axes, dividers, notes, non-key labels, and navigation separators; keep it unobtrusive. +- **Table base / light card base**: approximately #E8F3FC / #DCEFF8. Used for high-density tables or info boxes, slightly differentiated from the background. + +Keep a single page within the blue-purple family + black/white/gray + 1 warm data color. Status colors are not prominent; if positive/negative states are needed, prefer text labels and purple/gray depth variations, and introduce red/green cautiously. + +## 6. Fonts and Text Hierarchy + +- **Font character**: the body mainly uses Liter (Arial-family sans-serif, built-in); titles, sections, or table-of-contents entries may use Unna (Times-class serif, built-in); branded special titles may use QuattrocentoSans Bold. Overall avoid script, handwriting, and rounded cartoon fonts. +- **Body text**: 1x, used for paragraphs, explanations, author titles, and footer navigation. +- **Footnotes/sources/page numbers**: about 0.6–0.8x, understated but readable; page numbers should not be enlarged into decorative numerals. +- **Subheadings/module titles**: about 1.1–1.4x, may be bold or purple. +- **Chart labels/axes**: about 0.7–0.9x, white/gray on black backgrounds, black/gray on light backgrounds; keep clear without competing with titles. +- **Key message sentences/lead emphasis**: about 1.2–1.6x, sitting between the title and body size. +- **Page titles**: about 2–3x, aligned top-left on content pages; table-of-contents/author-page titles may be slightly larger. +- **Cover/section large titles**: about 3–5x, white or black depending on the background; the first visual level of the whole page. +- **Large numbers**: about 2.5–4x, usually purple, paired with 0.9–1x explanatory text; numbers must carry a unit or context. + +Text is primarily left-aligned. Centered copy may appear sparingly only on the cover or photography section pages; avoid large centered blocks on content pages. + +## 7. Chart Language + +The main chart types are bar charts, grouped bar charts, line/trend charts, formula/model-type diagrams, and a small number of matrix comparisons. + +- **Chart canvas**: prefer black or near-black rectangles with clean edges, no thick borders or shadows; a clear boundary from the light blue text area. +- **Titles and numbering**: place "Figure X" plus an explanatory title at the upper left of the chart area, in white; the title should state the purpose of reading the chart, not just the chart type. +- **Axes and gridlines**: use low-brightness thin gray lines, kept few in number. Do not create noise with dense grids. +- **Data series**: primarily purple, pink-purple, and orange/coral; non-key series use gray or dark purple; the number of series should be limited — avoid rainbow colors. +- **Labels**: key data may be marked directly at bar tops or near lines; small labels in white or light gray. Avoid stacking all labels into illegibility. +- **Legends**: small and clear, placed to the right of or above the chart; color swatches/line segments must match the series. +- **Key annotations**: white arrows, curved connectors, brackets, or short notes may emphasize trends/gaps; annotations must serve the conclusion, not decorate. +- **Forecast/target/baseline lines**: use dashed lines, thin lines, or a single accent color with a text explanation; do not cover data with large semi-transparent bands. +- **Boundaries**: on pages with few charts do not force charts in; when there is no data, use text modules or number cards instead. + +## 8. Tables and High-Density Information + +- **Headers**: use white text on black, black text on light purple/light blue, or bold text; restrained height, left-aligned text. +- **Row/column structure**: separate with thin gray lines or light base blocks; avoid heavy grids; allocate column widths by importance — the first column may be slightly wider. +- **Row height**: accommodates 1–3 lines of text; high-density pages may compress, but text must never touch lines or overlap. +- **Base colors**: light blue/light purple for ordinary cells, black backgrounds for high-contrast evidence tables; if zebra striping is used it should be very subtle. +- **Key rows/columns**: highlight with purple text, purple bars, bold, or reversed white on dark bases; do not mark with multiple status colors simultaneously. +- **Number alignment**: numbers, percentages, amounts, and years align by column with unified units; explanatory text is left-aligned. +- **Symbols/rating dots**: simple dots, short dashes, checks, or purple marks may be used; they must be low-decoration and unambiguous. Avoid colorful icon rating systems. +- **Summary rows**: handle with bold, a top divider, or a dark base — no raised shadows. + +## 9. Components and Graphic Elements + +- **Bottom section navigation**: thin white band + purple ">" + horizontal section names + thin vertical lines + page number; must not be covered by body content. +- **Vertical report name on the right**: small, near the edge, low contrast. Do not turn it into a large sidebar. +- **Purple ">" brand symbol**: used at lower left and for local brand hints; small area — it must not become a large decorative arrow used everywhere. +- **Title bar/chart title block**: at the upper left of the black chart area, composed of "Figure X + conclusion title", white text layered, compact and left-aligned. +- **Number emphasis blocks**: a large purple percentage/value + short black explanatory text; usually 1–3 per page; avoid overuse. +- **Light-colored info boxes**: for "knowledge at work"-style supplements, definitions, tips, or action recommendations; base color slightly deeper than the background, stable padding, medium text density. +- **Purple labels/card bases**: for short recommendations or key sentences on model or behavior pages; suitable as strong emphasis inside black areas, but keep the count low. +- **Image frames**: rectangular real photos with clean edges and no thick borders; may occupy half or a third of the page, zoned apart from text. +- **Process arrows/model symbols**: use simple arrows, multiplication signs, plus signs, and connecting lines to express formulas or relationships; thin lines, colors mainly white, gray, purple. +- **Icons**: use only a few functional small icons, such as professional-social-platform marks. Do not expand into a colorful icon system. + +## 10. Texture and Prohibited Items + +A flat, restrained, report-like tech-consulting style that builds visual focus through dark photography, black-white contrast, purple brand accents, and data charts — not complex decoration. + +**Prohibited**: + +- emoji, cartoon stickers, social-media-style icons, large colorful illustrations. +- 3D fonts, dimensional buttons, glowing outlines, heavy drop shadows, glassmorphism cards. +- complex textured backgrounds, ornate borders, rainbow gradients, meaningless decorative lines. +- large blocks of centered body text, text placed over busy photos, low-contrast light gray body text. +- fake charts without data sources, dashboard components added purely for aesthetics. + +**Use with caution**: + +- Gradients: only light blue–light purple backgrounds or photographic light-trail atmosphere; no strong multi-color gradients. +- Shadows: the source file barely relies on shadows; avoid them when generating; if used for image layering, keep them extremely subtle. +- Rounded corners: not a primary feature; cards and images should have square or slightly rounded corners — do not become a rounded SaaS style. +- Colorful icons: visible only in functional marks such as professional-social-platform icons on author pages; should not be heavily used in body pages. +- Photos: may be used for cases or scenarios in content, but must be zoned; do not make every page a photographic background. + +**Usable on special pages**: + +- Full-bleed dark photos, strong light trails, large white titles: for covers and section transitions. +- Large black backgrounds: for chart evidence, model derivations, and dark closing/appendix-style pages. +- Full brand wordmark (plain small text, writing the new topic name; do not draw a graphic logo): more appropriate on the cover and back cover; content pages primarily use the purple ">". + +## 11. Generation Checklist + +- Is it a 16:9 report page rather than a poster/social card? +- Does the page type clearly belong to one of: light blue content page, black-background evidence, photography section, case text+image, author/table of contents? +- Is the bottom white navigation band kept, with the purple ">" at lower left, section names, and page number; do content pages have the vertical report name on the right? +- Are titles left-aligned and report-style; is the body text columned with paragraphs that are not overlong? +- Is the palette mainly blue-purple-black-white-gray, with warm colors only supplementing a small amount of data/light trails? +- Is purple used for brand, numbers, and key points rather than flooding large areas? +- Do charts have titles, labels, legends/sources, and sufficient contrast on the black background? +- Do tables use thin lines, unified alignment, and restrained base colors, with consistent number units? +- Are images real photography and zoned apart from text, without long text pressed onto busy backgrounds? +- Are emoji, 3D, heavy shadows, complex decoration, rainbow colors, and meaningless icons avoided? +- Have you checked for text overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, covered footers, and wrong proportions? +- Does each page have one main topic and a clear reading path, without information weakened by template repetition or element stacking? +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/01_strategy/02/en/indigo-due-diligence.md b/skills/open-kimi-ppt/reference/design_system/01_strategy/02/en/indigo-due-diligence.md new file mode 100644 index 0000000..ed89bb6 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/01_strategy/02/en/indigo-due-diligence.md @@ -0,0 +1,208 @@ +# PJ Mountain — Business DD Report (Organization Name) STYLE DESIGN SYSTEM + +## 1. Style Positioning + +For high-information-density scenarios such as commercial due diligence, market research, strategic diagnosis, and management decision reporting. It uses a white landscape canvas, black conclusion titles, thin gray dividers, deep navy structural blocks, blue data accents, and dense charts and tables. The title area states "this page's judgment/analysis topic"; bar charts, stacked bars, lines, heatmaps, matrices, and multi-column text provide the evidence; the footer fixedly holds sources, company name, and page number. Large images, illustrations, and decorative graphics rarely appear; brand color serves structure and emphasis only, never atmosphere. + +**Underlying principles** + +1. **Evidence takes precedence over decoration.** Charts, tables, footnotes, sources, and measurement-basis notes must be kept first; if a page is crowded, compress decoration and whitespace rather than deleting data labels or sources. +2. **Consistency takes precedence over per-page variation.** Variants such as a right-side explanation column, a left dark opinion column, table-of-contents highlighting, or gray-based explanation areas are allowed, but the title area, footer, dividers, font hierarchy, and brand-color grammar must remain stable. +3. **Brand color serves readability.** Deep navy is used for structure and key categories; bright blue for data emphasis and selected states; when brand color reduces contrast or confuses data, prefer black, gray, white, and clear labels. + +## 2. Page Skeleton + +**Canvas ratio:** widescreen 16:9 landscape. White background by default; the table-of-contents page and explanation columns may use light gray; section/opinion pages may use deep navy vertical blocks. Content pages do not use full-bleed image backgrounds. + +**Margins and grid:** keep stable outer margins on left and right; the title area at top, the body's rectangular workspace below the title rule, and a fixed footer area at bottom. Body text commonly uses 2 columns, 3 columns, image-left-text-right, table-left-notes-right, or chart-on-top-footnotes-below. + +**Title area:** the main title at upper left is usually 1–2 lines, in large black serif bold or a bold title style; below it a sans-serif subtitle stating the subject, scope, unit, or measurement basis. A thin gray/black horizontal rule under the title separates the evidence area. + +**Body area:** carries charts, tables, flow/structure diagrams, parallel modules, and explanatory text. Usually the main evidence sits on the left; explanations, background, conclusions, or supplementary material on the right; multi-module pages read top-to-bottom, left-to-right. + +**Footer:** fixedly contains the source/footnotes, company name, and page number. Sources sit at lower left or below charts, in a size clearly smaller than body text; "Organization Name" and the page number sit at lower right. A thin line often separates the body above the footer. + +**Logo and branding:** the cover's upper left carries the brand wordmark as plain small text showing the new topic name or left blank — no graphic logo drawn; content pages convey the brand through the footer company name, not by repeating an enlarged logo in every module. + +**Page types:** + +- **Cover:** the left side holds the brand wordmark, project name, report type, date, and confidentiality statement; the right side features a blue linear-curve graphic as the only strong visual element. The cover does not use the content-page footer and page-number structure. +- **Table of contents page:** large-size Contents on the left white area, section structure on the right light gray area; the current section may be highlighted with a deep navy horizontal bar. The TOC page emphasizes navigation and holds no data charts. +- **Content pages:** mainly white background, top conclusion title + rule + body evidence + bottom source/page number. +- **Section/progress pages:** reuse the Contents structure with a deep navy bar marking the current position; they may serve as transitions between sections but must not be generalized into ordinary content pages. +- **High-density appendix/analysis pages:** smaller text, denser tables, and stronger columnization are allowed, but the title, footnotes, and page number are retained. + +**Default reading path:** title judgment → subtitle/units → largest difference in the chart or table → right-side/bottom explanation → sources and footnotes. + +## 3. Content Organization + +**Title style:** use an analytical topic or conclusion sentence, not marketing slogans. The common structure is "subject + trend/judgment + key numbers/scope/reason", controlled to 1–2 lines; when the title already carries the conclusion, the subtitle only adds the measurement basis. + +**Key message sentences:** placed above or to the right of charts, stating data scope, units, CAGR, market definition, sample, or scenarios; they serve the chart directly — no abstract promotional lines. + +**Body organization:** use short paragraphs, bullets, numbering, or subheading groups, with each bullet expressing one fact or reason. Avoid long centered copy. Organize dense text with bold keywords, indentation, rules, and module titles. + +**Number of points per page:** a standard content page revolves around 1 main judgment and carries at most 2–4 supporting arguments. High-density pages may contain multiple evidence blocks, but they must share the same analytical question; do not collage unrelated charts onto one page. + +**Grouping logic:** group by market/customer/product/competition/organization, or by time, region, segment, growth driver, or degree of impact. Parallel modules must be isomorphic: title position, metric definition and basis, and color meaning consistent. + +**Keyword emphasis:** use bold, deep navy subheadings, bright blue numbers, and light gray base boxes. Avoid colored highlighters, emoji, exaggerated exclamation marks, or decorative underlines. + +**Numbers and units:** numbers must carry units, time ranges, and the necessary measurement basis; growth rates, CAGR, shares, and amounts are specified in chart titles, axis labels, or footnotes. Forecasts, targets, and actuals are distinguished by color, dashes, or labels — not by text explanation alone. + +**Source footnotes:** all data charts and tables must have Source/Note/measurement-basis notes. Use the smallest text level, placed at the bottom of charts or on the left of the footer; never at the visual center. + +## 4. Content Page Layout System + +**A. Conclusion title + single main chart + right explanation column** + +For core trends or scale judgments. The left 65%–75% holds a bar, stacked-bar, or line chart; the right 20%–30% holds a light-gray-background explanation column or a white caption column with background, growth drivers, and management implications. Use a bright blue series, bold numbers, arrows, or a few elliptical labels for emphasis. Not suited for multi-topic side-by-side layouts or complex classification pages that need item-by-item expansion. + +**B. Conclusion title + multi-column text analysis page** + +For textual argumentation such as trends, market characteristics, drivers, and risk points. The body divides into 2–3 columns, each with a numbered subheading and a short paragraph of explanation; narrow spacing or thin lines between columns, with sparing bold keywords. This layout is information-dense but weak in visual evidence — do not use it for too many consecutive pages; if there are key numbers, switch to a chart page. + +**C. Chart + mechanism/flow explanation combination page** + +For migrations from a traditional state to a new state, value chains, business processes, or organizational transformation. A trend chart sits left or center; vertical flow blocks, arrows, or stage notes sit right; deep navy/bright blue blocks mark the target state, key steps, or emphasized links. Flow components aid explanation — they cannot replace data evidence. + +**D. High-density table/matrix page** + +For multi-dimensional comparison of customers, competitors, products, features, KBFs, or opportunity points. The body is a large table or matrix with clear headers and fine row/column separation; key cells use blue, gray bases, rating dots, or symbol marks. A deep navy opinion column may sit on the right summarizing 2–4 key findings. Not suited for telling a single trend, nor for content lacking comparable dimensions. + +**E. Dark sidebar opinion page** + +For section openings, strong-opinion summaries, or separating "explanation" from "evidence". A deep navy vertical column on the left or right takes about a quarter to a third of the width, with white text and bright blue subheadings inside; the other side holds white-background charts/tables. The dark column must not be abused as decorative background — use it only when guidance, conclusion pressure, or section identification is needed. + +**F. Table of contents / progress navigation page** + +For section transitions. Contents on the left, light gray content area on the right, current section highlighted in deep navy. It only takes on navigation — it carries no body analysis. When generating a new topic, preserve the section numbering, hierarchy, page ranges, and highlight-bar grammar. + +## 5. Color System + +**Background white #FFFFFF**: the main background of content pages, largest area. Cannot be replaced by a colored background; large color bases are not recommended except for the TOC/explanation columns. + +**Light gray background #E6E6E6 / #E9E9E9**: for the right area of the TOC, side explanation columns, table bases, and local backgrounds. Used for structural distinction; lightness may be slightly adjusted, but replacing it with a high-saturation brand color is not recommended. + +**Primary text black #000000 / dark gray #222222**: for titles, body text, chart labels, and table text. Low-contrast gray must not replace body text. + +**Brand deep navy #051C2C**: for dark sidebars, key structural blocks, some bar series, title bars, and flow blocks. May be replaced by a corporate primary color of equal depth, but white text must remain readable. + +**Bright blue #2150FE / #1F5BFF**: for emphasized data series, current states, key labels, selected items, and key flow blocks. Must not be spread over large areas; if replaced by a brand color it must stay high-saturation, high-contrast, and distinct from deep navy. + +**Light blue #BBD5EE / #DAE7F3 / #E6EEF6**: for secondary data series, light area charts, cover linear graphics, and weak table emphasis. Cannot carry white body text; avoid going too light and losing edges. + +**Neutral grays #747474 / #8E9294 / #A4A4A4 / #D0D0D0**: for secondary bars, axes, gridlines, table lines, captions, and un-emphasized categories. Gray steps may be replaced, but the hierarchy must be maintained. + +**Status color boundary:** no red-green-yellow status system is established. When positive/negative states are needed, prefer depth variations, labels, and arrows; red/green may only be used cautiously and sparingly for explicit positives/negatives — they must not change the deck's calm blue-gray temperament. + +**Per-page primary-color limit:** content pages use black/white/gray + deep navy + bright/light blue. Unless data must be distinguished, do not introduce a third high-saturation color. + +## 6. Fonts and Text Hierarchy + +**Font character:** body text and most labels use Arial-class sans-serif; the cover main title and content-page large titles may use Times New Roman Bold-class serif bold. Italic Arial is used sparingly for explanatory text in notes, footnotes, or source lines. + +**Relative hierarchy:** + +- **Cover project name:** about 3.5–4.5x body size, serif bold, one of the largest texts in the deck. +- **Content-page main title:** about 2–3x body size, black, 1–2 lines allowed, conclusion first. +- **Section/TOC title:** about 2–3x body size, often paired with generous whitespace or a light gray content area. +- **Subtitle/chart title:** about 1.1–1.4x body size, may be bold; states the subject, units, and measurement basis. +- **Body text and bullets:** defined as 1x, line spacing tight but never overlapping. +- **Table text/chart labels:** about 0.75–1x body size; number labels may be slightly smaller but must remain readable. +- **Notes, sources, footnotes, page numbers:** about 0.55–0.75x body size, complete in information but visually recessed. + +**Weight rules:** bold is used for titles, subheadings, table headers, keywords, and key numbers; do not bold large stretches of long body paragraphs. Italic is only for note tone or source attribution, not a primary emphasis device. + +**Alignment:** titles and body are mainly left-aligned; numbers are right-aligned or aligned on decimal places in tables, category text left-aligned. Avoid large centered blocks. + +## 7. Chart Language + +Business analysis charts include bar charts, stacked bars, line/trend lines, combination charts, market-size forecasts, share/ranking charts, and a few scatter/bubble-type marks. Charts must prove the title — they are not decoration. + +**Axes and grids:** axes use thin gray or black; gridlines are very light and may be omitted when unnecessary. Axis labels are short; units go in the chart title or beside the axis. The horizontal axis is usually years, market segments, or categories; the vertical axis carries amounts, shares, indices, etc. + +**Series colors:** key series use deep navy or bright blue; secondary/historical/other categories use gray or light blue. The same color for the same category in stacked bars must stay consistent across pages — do not randomly change colors page to page. + +**Data labels:** directly mark key bars, the latest year, CAGR, forecast endpoints, and comparison differences. Keep labels close to data points; avoid making readers depend on complex legends. + +**Forecasts and baselines:** forecast years, CAGR, targets, or baselines may be distinguished with dashed lines, arrows, brackets, elliptical labels, or different gray-blue tones. Actual/forecast intervals must be stated — color alone is not enough. + +**Legends:** placed above the chart or in blank space inside it; with few series, prefer direct labels. Color swatches must match the graphics; text in small sans-serif. + +**Annotations:** sparing use of short arrows, brackets, CAGR labels, rounded/elliptical small marks. No glow, shadows, 3D bars, or perspective effects. + +## 8. Tables and High-Density Information + +Tables are used for comparing competitors, customers, products, features, market attributes, and opportunity points — as analytical tools, not decorative lists. + +**Headers:** use bold, dark text, or deep navy/light gray bases. Column headings may run multiple lines but must use comparable definitions and measurement bases. If a header is very long, split it into a main heading + subheading — do not squeeze it into illegibility. + +**Rows/columns and separation:** mainly thin gray lines, more horizontal than vertical; light gray bases may distinguish headers, group rows, or explanation columns. Avoid heavy borders and complex grids. + +**Row height and density:** high density is allowed, but each row needs a stable baseline and enough spacing. Long text should be broken into lines or phrased as fragments — never overflow the cell. + +**Key marks:** key rows/columns may use deep navy bars, light blue bases, bright blue text, bold, rating dots, checks/symbols, or small labels. Wingdings-type symbols may be used sparingly for states/marks, but must not become a colorful icon system. + +**Alignment:** left-align text; right-align numbers or align on digit positions; keep percentages, amounts, and years in unified formats. Rankings, scores, and status dots are center-aligned. + +**Zebra striping and base colors:** light gray zebra striping or local light gray bases may improve scannability, but must not be too dark. Table base colors must keep black text high-contrast. + +**Summary and notes:** summary rows, averages, or key conclusions go at the bottom of the table or in a right-side note column; sources and measurement-basis notes sit immediately below the table. + +## 9. Components and Graphic Elements + +**Thin horizontal rules:** separate the title area, body area, and footer. Lines are thin, gray or black; do not replace them with thick colored lines. + +**Deep navy sidebar:** for section opinions, conclusion summaries, explanation columns, or guidance beside high-density tables. White text, bright blue subheadings, and short bullets inside; it is an information container, not a decorative color block. + +**Light gray explanation box:** for background, growth drivers, assumptions, and supplementary notes. Placed on the right of the page or beside tables; must have a subheading. + +**TOC highlight bar:** a deep navy horizontal bar marks the current section with reversed white text. Only used on TOC/progress pages. + +**Data labels and badges:** CAGR, latest values, forecast values, and key categories may use small labels, ellipses, or capsule marks; colors stay deep navy, bright blue, or gray; keep them near the corresponding data. + +**Flow blocks and arrows:** for migration paths, stages, and mechanism explanations. Shapes are rectangles, rounded rectangles, or simple arrows in dark blue/bright blue/gray. No complex SmartArt styles, dimensional arrows, or gradient arrows. + +**Image frames:** if screenshots/system interfaces are used, embed them only as evidence material, keeping rectangular boundaries and captions — no large emotional imagery. + +**Icons:** colorful icons are not a stable language of this style. If a state must be shown, use simple symbols, dots, checks, arrows, or text labels in a single color or the blue-gray family. + +## 10. Texture and Prohibited Items + +Overall a flat, restrained, data-driven, consulting-report texture, building professionalism through typography, lines, tables, charts, and limited color blocks. + +**Prohibited:** + +- large photo backgrounds, video-still backgrounds, or emotional full-bleed images; +- emoji, cartoon illustrations, complex colorful icons, sticker-style decoration; +- 3D charts, perspective bars, glow, strong shadows, glassmorphism, textured backgrounds; +- large gradient color blocks as body backgrounds; +- large centered copy, marketing-slogan titles, unsourced data; +- random multi-color palettes or multiple high-saturation colors competing on one page. + +**Use with caution:** + +- Rounded corners: may be used for small labels, flow blocks, elliptical marks; must not generalize into a card-style UI style; +- Shadows: the source file barely relies on them; if used on embedded screenshots, keep them extremely light; +- Red/green status colors: only for explicit positive/negative/risk/opportunity, used sparingly; +- Screenshots: only as factual evidence — they need a title, boundary, source, or caption. + +**Usable on special pages:** the cover may use the blue linear-curve graphic; the TOC may use a large light gray content area and deep navy highlight bar; section progress pages may strengthen whitespace and navigation, but must not introduce poster-like visuals. + +## 11. Generation Checklist + +- Is it 16:9 landscape, mainly white background, with a stable title area, body area, and footer area? +- Is the title an analytical topic or conclusion sentence rather than an empty slogan? Is it controlled to 1–2 lines? +- Does the page have only one main judgment, with charts/tables directly supporting that judgment? +- Are sources, footnotes, units, time ranges, and the actual-versus-forecast basis retained? +- Is the palette limited to black/white/gray + deep navy + bright/light blue, with bright blue only on key points? +- Is body text Arial-class sans-serif, with titles allowed in formal serif bold? Is dependence on specific point sizes avoided? +- Do charts use flat bars, stacked bars, lines, labels, and thin gray axes, avoiding 3D, gradients, and excessive legends? +- Do tables have clear headers, thin separators, unified alignment, readable row heights, and necessary key marks? +- Does the right explanation column or dark sidebar carry a conclusion/background function rather than pure decoration? +- Are photo backgrounds, emoji, complex icons, shadows, glow, textures, and random colors avoided? +- Have you checked for text overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong proportions, and missing page numbers/sources? +- When generating multiple pages, are TOC highlighting, footer, color grammar, chart encoding, and title hierarchy consistent — avoiding each page looking like a different template? +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/01_strategy/03/en/pine-green-strategy.md b/skills/open-kimi-ppt/reference/design_system/01_strategy/03/en/pine-green-strategy.md new file mode 100644 index 0000000..58563e1 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/01_strategy/03/en/pine-green-strategy.md @@ -0,0 +1,151 @@ +# Organization Name · 2023.05 Report Name CEOs Roadmap on Generative AI STYLE DESIGN SYSTEM + +## 1. Style Positioning + +For consulting-firm presentations to CEOs, executives, and business leaders covering trend insights, strategic roadmaps, risk identification, and organizational action recommendations. It uses high-density business argumentation: each page gives its conclusion first, then supports it with charts, tables, comparison boxes, case excerpts, or action lists. + +Core design: a dark tech-photo banner carries the title; a white/extremely-light-gray body keeps reading easy; mint green and brand green organize hierarchy; a high-density grid with tiny footnotes maintains the report feel. The reading path is "argument first + evidence unfolded + sources as backstop". + +Underlying principles: +- **Argument takes precedence over decoration**: the top of every page must be a judgment or action-oriented title that stands on its own; charts, tables, and components serve only that judgment. +- **Green only for structure and emphasis**: light green for background zoning and callout blocks, deep green for key numbers, labels, paths, bars, and positive states; green must not be expanded into an arbitrary full-page decorative color. +- **High density must be tamed by the grid**: multiple evidence points must sit in columns, rows, cards, matrices, flows, or tables; avoid free-floating scatter, unaligned collages, and arbitrarily enlarged local elements. + +## 2. Page Skeleton + +- **Canvas ratio**: horizontal 16:9 widescreen, designed for report reading rather than large-type stage presentations. +- **Default background**: content pages use white or extremely light gray; light gray is used for table bases, module bases, or a bottom summary band. Covers, back covers, and a few section/transition pages use darkened tech photography. +- **Title area**: content pages have a fixed dark narrow banner across the top, embedding a darkened photo or near-black base color; the title is left-aligned, white, bold, a complete judgment sentence. Small section numbers or progress labels such as "1a / 1b / 2b" may appear at the lower edge of the title or the upper left of the body. +- **Body area**: located below the banner. Common arrangements include left-right column splits, three-column cards, quadrants/matrices, chart + annotations, table + side notes, and central model + surrounding explanations; margins are compact and strictly aligned, separated by thin lines, light gray bases, or whitespace. +- **Footer**: a tiny gray footnote/source/copyright area at the bottom, left-aligned; a small page number at lower right or along the bottom edge. Footnotes are separated from the body by whitespace or a thin line and never mixed into the body. +- **Logo and branding**: on the cover's upper left, a plain-small-text combination of Organization Name and report name (writing the new topic name) or left blank; on the back cover, the brand wordmark over a darkened photo; neither draws a graphic logo. Content pages do not repeat the logo at large scale — the black banner, green system, and footnote style carry brand recognition. +- **Cover skeleton**: full-bleed darkened photo; a light green brand block at upper left; a horizontal light green semi-transparent title block mid-page toward the left/center; title in black bold; the date at a small serif/italic level. The lower edge of the green block may carry thin vertical striping. +- **Section/transition pages**: a light green block or a darkened photo block on the left carries the section topic, with a bullet list on the right; increase whitespace and keep left alignment. +- **Closing/disclaimer pages**: the disclaimer page uses a white base, light green subheadings, and gray body blocks; the back cover returns to darkened photography and the white brand wordmark. +- **Default reading path**: top banner conclusion → upper-left number/module title → main chart or central model → right-side/below explanation → footnote sources. + +## 3. Content Organization + +- **Title style**: use conclusion sentences, judgment sentences, or action sentences — not mere nouns; express meanings like "what is happening", "why it matters", "how the CEO should act", "where the risks are". Titles may be longer but must stay readable within one to two lines inside the banner. +- **Key message sentences**: below the title or at the upper left of the body, a "number + phrase" stage label may appear; numbers use green or black small labels. +- **Body organization**: micro-points organized as short paragraphs and bullets. Avoid continuous full-bleed long paragraphs; break long explanations into cards, left-right columns, or table rows. +- **Grouping logic**: prefer time/stage progression, left-right contrasts, matrix comparisons, and "three parallel columns", "two-category contrast", "core/non-core", "traditional/new-type", "opportunity/risk/action". +- **Number of points per page**: one main judgment per page, with 3–6 evidence points, bullets, or comparison dimensions inside. If more than 6 parallel points are needed, convert to a table or split into two pages. +- **Keyword emphasis**: use bold, green text, green labels, light green base blocks, rings, or borders; risks or warnings may use small-area magenta/rose marks. Do not use fluorescent multi-color, high-saturation red-blue mixing, or large rainbow emphasis. +- **Numbers and units**: numbers sit directly beside bars, labels, table cells, or key conclusions; units and time frames go in chart titles, axis titles, or footnotes. Growth rates, years, market sizes, and share-type data should be more prominent than explanatory text. +- **Quotes and cases**: external quotes use quotation marks, light green quote blocks, or news-excerpt boxes; quotes serve the evidence and must not replace the page's main conclusion. +- **Source footnotes**: charts, market sizes, case screenshots, and quotes all keep their sources; use extremely small gray text, preferably left-aligned, staying out of the main reading flow. + +## 4. Content Page Layout System + +### A. Top banner + three/multi-column opinion cards + +For concept differences, capability traits, risk categories, and organizational requirements. The body divides into three or four columns, each with a small icon/subheading/short caption/a few bullets; column titles in green, columns separated by light gray vertical lines or whitespace. A key column may add a light green base or a deep green label; each column holds one small point and 2–4 supporting notes. Do not use this layout when continuous data or complex causal chains must be shown. + +### B. Main chart + right-side evidence/explanation card + +For growth trends, market size, adoption rates, and budget changes. The chart takes about half to two-thirds; an explanation box, news excerpt, or key takeaway goes to the right or above. The chart uses a green primary series and gray secondary series with key data directly annotated; cards use a light gray or white base with thin borders and a few green titles. Only one main chart conclusion per page — avoid stacking multiple unrelated charts. + +### C. Large opinion block on the left + action explanation on the right + +For CEO action recommendations, roadmap hints, and core problem definitions. A large light green base block on the left carries the core judgment, question, or classification model; the right side explains action implications with bullets, short paragraphs, or cases. Rings, double circles, arrows, or partition lines may connect them. If the page's focus is data proof, reduce the large opinion block's area to avoid squeezing the chart. + +### D. Comparison matrix/table page + +For comparing technology stages, business use cases, risk dimensions, organizational capabilities, and departmental responsibilities. Use column titles + row dimensions; headers in light green or deep green, cells holding short phrases or bullets. Key columns/rows use a green base, bold, or graphic marks. If there are fewer dimensions than 2×2, use cards instead of a table. + +### E. Central model + surrounding explanation + +For frameworks, capability systems, governance models, or value chains. A circle, ring, or matrix core sits at the center, with 4–8 explanatory nodes around it connected by thin lines, arrows, or spatial relations. The center is usually green, the periphery light gray/light green. This layout emphasizes structural relationships and is not suited for long text passages or precise values. + +### F. Process/roadmap layout + +For action steps such as "discover—select—build—govern—scale". Use a horizontal or vertical step bar, green marking the current/key stage and gray marking auxiliary stages; a short caption sits below each step. Flow arrows should be lightweight and flat — no complex dimensional arrows. If the steps are not sequential, convert to a matrix or parallel cards. + +### G. News/case collage page + +For external events, public sentiment, risk instances, or real-world evidence. News cards, screenshots, or excerpts must obey the grid boundaries and the unified title banner; screenshots should not fill the whole page and should carry explanatory labels. This layout is an evidence page and must not become a regular content template. + +### H. Contact/appendix list page + +For teams, authors, contacts, and disclaimers. Use a headshot or text-card grid; names/titles in bold, with roles, emails, and links at a small level. Reduce charts and strong emphasis. + +## 5. Color System + +- **Near-black / deep charcoal #0B0C0D, #0D0F0F, #191E1F**: for title banners, darkened photo overlays, back-cover backgrounds, and primary body text. Cannot be replaced by a bright brand color — that would destroy the consulting report's authority. +- **White / extremely light gray #F1F1F1, #F2F2F0, #ECEDED**: for main page backgrounds, content bases, table blank areas, and card bases. May switch between white and light gray, but must not become a high-saturation colored background. +- **Mint light green, approximately #9CDDAA, #92C9A0, #8FC49B, #BFEFD0**: for cover title blocks, section blocks, callout boxes, the large left opinion base, and weak table emphasis. Text must stay black/dark; replacement colors must also be low-saturation, light backgrounds. +- **Brand primary green #23B871, #35BA7A, #408A5A**: for key bars, labels, key numbers, icons, current process steps, and core rings. Do not introduce several similar greens at once and create hierarchy confusion. +- **Deep green #26633B, #2E6F47, #5F877B**: for small title labels, dark chart series, emphasis borders, and structural lines; not suitable as the base color for long body text. +- **Mid grays #748687, #A6AB9E, #B7B7B7, #D2D2D2**: for dividers, table lines, axes, auxiliary text, non-key series, and disabled/baseline states; must not replace the primary text color. +- **Magenta/rose, approximately #C2185B, #B0185A**: only for small-area marks of risks, counterexamples, warnings, and negative categories — rings, labels, keywords. Must not be used at large area as a second brand color. +- **Chart series boundary**: the primary hue is green; only gray, light green, and a little magenta serve as auxiliaries. If data series exceed 3–4, prefer distinguishing with green depth steps and grays — do not introduce rainbow colors. + +## 6. Fonts and Text Hierarchy + +- **Font character**: the body uses the QuattrocentoSans family, bold for titles and subheadings, italic for quotes or notes; the cover "Report Name" may use Unna (built-in serif). +- **Page title**: 1.8–2.5x body size, bold, white, placed in the dark banner; long titles may wrap, staying left-aligned with tight line spacing. +- **Cover main title**: 2.5–4x body size, black bold, placed on the light green semi-transparent block; date/series name smaller, may use italic or serif. +- **Key message sentences/lead-ins**: 1.2–1.6x body size, may be bold or green, placed at the upper left of the body or on a light green block. +- **Body text**: defined as 1x, regular QuattrocentoSans, tight line spacing, left-aligned; avoid centered long paragraphs. +- **Subheadings/card titles**: 1.1–1.4x body size, bold, green, or dark; text short and explicit. +- **Table and chart labels**: 0.75–1x body size; numbers may be bold or enlarged to 1.1–1.4x; axis labels and legends smaller, kept gray. +- **Notes/footnotes/sources/page numbers**: 0.45–0.7x body size, gray. Footnotes must not grab attention with green. + +## 7. Chart Language + +- **Types actually present**: mainly bar charts, stacked bars, line/trend charts, donut/bubble-style relation charts, and simplified coordinate charts. +- **Axes and gridlines**: axis lines and gridlines extremely thin, light gray; background grids may be weakened or omitted, but necessary coordinate information is kept. +- **Series colors**: the primary series uses brand green or a combination of green depths; auxiliary series use gray, light yellow-green, or light gray; forecasts, targets, or key years use deeper green with direct number annotations. +- **Data labels**: key bars, endpoints, peaks, or growth rates are directly annotated; numbers in dark or green. Avoid making readers rely on the legend alone for the key points. +- **Legends**: small size, placed above or below the chart. With only 1–2 series, label directly beside the graphics. +- **Annotations and explanations**: use thin lines, arrows, light green boxes, or small text to explain key turning points; news excerpts may serve as supporting-evidence cards. Annotations must not cover the data body. +- **Boundaries**: no 3D bars, gradient fills, heavy shadows, rainbow heat palettes, or complex animated chart effects; chart beauty must submit to data clarity. + +## 8. Tables and High-Density Information + +- **Table role**: for multi-dimensional comparisons, risk lists, action responsibilities, capability assessments, and use-case screening; usually the page's main evidence structure, not decorative layout. +- **Headers**: deep green, light green, or dark text, with backgrounds mainly light green/white/light gray; text short, emphasizing dimension names rather than long sentences. +- **Row/column structure**: many columns are allowed, but strict alignment is required; use thin gray lines or light gray bases to separate rows — do not rely on thick black borders. +- **Base colors and zebra striping**: weak light gray or light green base zones; zebra contrast should not be too strong. +- **Key rows/columns**: emphasize with light green bases, green text, bold, dot ratings, or borders; risk/negative items use small magenta marks. No full-row bright red or high-saturation warning colors. +- **Number and text alignment**: numbers right-aligned or centered, text left-aligned; short ratings, symbols, and dots may be centered; units uniformly stated in the column header or a footnote. +- **Row height and density**: compact row heights; each cell limited to a phrase, short sentence, or 1–2 bullets. If a cell needs a long explanation, convert to a card page. +- **Symbol marks**: minimal symbols such as dots, checks, short dashes, and level-color blocks may be used; a legend is required or semantics must stay consistent. + +## 9. Components and Graphic Elements + +- **Dark title banner**: the core identifying component, spanning the top, containing a darkened tech photo or near-black base, carrying the white conclusion title; the preferred choice for all content pages. +- **Light green title/opinion block**: for cover main titles, section hints, key questions, and action principles; rectangles or large color blocks, no complex effects. +- **Number labels**: such as "1a / 1b / 2b", expressing roadmap progress; green/dark, placed at the upper left of the body. +- **Cards**: white or light gray base, thin border or borderless, containing a subheading, short caption, icon/number; distinguished by alignment and whitespace, no heavy shadows. +- **Dividers**: thin gray lines, light green lines, or whitespace gaps for between columns, between table rows, and isolating the footnote area; lines should be light and not create a caged-grid feel. +- **Ring/double-circle/matrix marks**: for core/non-core, positive/negative, key/non-key; green means core or positive, magenta means non-core/risk/warning. Text inside rings must be short. +- **Icons**: a small number of single-color green/gray linear icons or simplified symbols, only to aid module recognition. Colorful skeuomorphic icons are prohibited. +- **Arrows and flow lines**: express processes, causality, or conversion relationships; flat thin lines, green or gray. Avoid thick dimensional arrows. +- **Screenshot/news cards**: only on case-evidence pages, placed on white cards or light gray areas with short captions; must have boundaries and alignment — never freely tilted or stacked. + +## 10. Texture and Prohibited Items + +A flat, restrained, consulting-report-style tech feel; the brand feel comes from brand green, dark photo banners, the QuattrocentoSans font system, and a rigorous grid — not complex decoration. + +- **Prohibited**: 3D charts, glow effects, heavy drop shadows, complex gradients, rainbow palettes, emoji, cartoon illustrations, colorful skeuomorphic icons, meaningless decorative lines, large blocks of centered copy, full-page grid-free free-form layout, low-contrast light text, and cover-style photo backgrounds abused across content pages. +- **Use with caution**: photos, screenshots, magenta warning color, ring models, flow arrows, large light green base blocks. They must carry an evidence, classification, action, or emphasis function; if they only fill blank space, delete them. +- **Usable on special pages**: covers, back covers, and section transition pages may use large darkened photos and light green blocks; case-evidence pages may use news-screenshot collages; contact pages may use headshot grids. Regular content pages should stay with white bases, the banner, and charts/tables/cards. +- **Rounded corners and shadows**: cards should have only slight corner rounding or be nearly square; shadows are basically unused. Modules are separated by base color, lines, and whitespace. +- **Image dependency**: content pages do not rely on large images to create mood; images appear only in the title banner or evidence cards. Every image needs darkening, cropping, and alignment, and must not break text readability. + +## 11. Generation Checklist + +- Skeleton: is it 16:9; do content pages have the dark top banner; does the body fall into a clear grid; are footer source/copyright/page number at the small bottom level? +- Copy: is the title a conclusion or action sentence; does each page have only one main judgment; are paragraphs broken into short sentences, bullets, cards, or tables? +- Hierarchy: do title, key message, body, subheadings, chart labels, and footnotes form a relative size difference; are specific-point-size dependence and hierarchy-free stacking avoided? +- Color: is the base white/light gray, text black, green the accent; is magenta used only for small risk areas; does each page stay within green + gray + a small amount of warning color? +- Layout: do charts, tables, cards, and flows each do their own job; is competition between multiple unrelated main visuals avoided; are left-right/multi-column arrangements aligned? +- Charts: is the flat green-gray family used; are axes and gridlines light; is key data directly annotated; are 3D, gradients, and excessive series colors forbidden? +- Tables: are headers, rows/columns, separators, key rows/columns, and number/text alignment consistent; do cells avoid long-paragraph overflow? +- Components: do the title banner, number labels, light green opinion blocks, cards, dividers, and ring/flow lines have explicit semantics; are icons single-color and simple? +- Prohibited items: are there no emoji, cartoon illustrations, colorful skeuomorphic icons, glow, heavy shadows, complex decoration, large centered body blocks, or abused photo backgrounds? +- Quality: check for text overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong proportions, footnotes pressing on the body, and template repetition that mismatches the information structure. +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/01_strategy/04/en/red-black-business.md b/skills/open-kimi-ppt/reference/design_system/01_strategy/04/en/red-black-business.md new file mode 100644 index 0000000..a7d2f40 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/01_strategy/04/en/red-black-business.md @@ -0,0 +1,184 @@ +# F030 · Top-Tier Management Consulting and Strategy Full-Package PPT Template STYLE DESIGN SYSTEM + +## 1. Style Positioning + +For management reporting on strategic consulting, cost optimization, operational diagnosis, efficiency improvement, roadmap planning, opportunity assessment, and results review — aimed at management, project owners, or decision committees. It uses a "white consulting-report skeleton + high-saturation red focal point + grayscale data components": the cover is near-black/deep red with an oversized title; content pages use a white or extremely-light-gray base, titles at upper left or upper-left-of-center, chart-based proof, card-based summaries, and roadmap progression. Photos, illustrations, and decorative icons do not form the main visual. + +Underlying principles: +- **One red focal point per page**: it may apply to a main card, a key bar, a keyword, the highest-intensity heatmap cell, or a CTA — do not spread it evenly across multiple areas of the same page. +- **Structure before decoration**: organize pages with left-right column splits, card matrices, chart combinations, timelines, and heat maps; do not rely on textures, shadows, complex graphics, or large images. +- **Data clarity over chart showmanship**: bar charts, donut charts, heat matrices, simple tables, and number cards serve the conclusion directly; weaken axes, legends, and gridlines to highlight comparison relationships and key values. + +## 2. Page Skeleton + +The canvas is horizontal 16:9 business presentation ratio. Content pages default to a white or #F6F6F6-level extremely-light-gray background with relatively wide safe margins. The basic structure is "upper-left title area + central body area + small caption/footnote area", with the reading path running title, red focal point, chart/card/table details. + +Title area: usually at upper left, on a few chart pages at upper right or upper-center-left, carrying the topic, question, or conclusion — no decorative title bars. Below the title, 1–2 lines may state the analysis purpose, scope, or action implications; the body unfolds below or to its right. + +Body area: column-split and modular; common content includes large-type definitions, pie/donut charts, bar charts, heat matrices, roadmap cards, capsule-label flows, number metric cards, and table-style comparisons. Cards stay uniformly aligned and spaced; light gray blocks zone the page; red blocks mark priority. + +Header: not mandatory. A small brand wordmark or tiny mark may sit at upper left; a date, short note, or small caption may sit at upper right; it must keep a low presence and never form a heavy horizontal bar. + +Footer: carries no strong navigation; may hold footnotes, sources, contact information, or a small CTA. If a page number is added, use extremely small black-gray text tucked in a corner — it must not steal from the body. + +Dividers: use thin light gray lines, card boundaries, or background blocks. Avoid thick black lines and complex borders. Axes and reference lines also use pale gray low contrast. + +Cover: near-black/deep-red background, an oversized white bold title, red button-style labels, a dark-red large-character watermark, and a small amount of explanatory text on the right; this treatment must not migrate to ordinary content pages. + +Closing page: a large title with a few contact details/CTA, on a white or light gray base; red may emphasize key action words, but no photo walls or complex decoration should be added. + +## 3. Content Organization + +Titles use question-type, topic-type, or action-type short phrases, such as "Why…Matters", "Objectives…", "Roadmap Overview", "Identifying…Opportunities". Prefer noun phrases or verb-object structures; avoid long full sentences. + +Place 1–2 lines of key message near the title, stating the conclusion, the analysis basis, or the next action — they cannot replace the body charts. Explanatory content is broken into short captions, bullet cards, or footnotes. + +Body content follows "one main point + three to five supporting points". Supporting points may be cards, process stages, metric columns, chart labels, or table rows; each card usually holds one small title and one compressed caption, distinguished by whitespace, a light gray base, and numbering. + +Keywords may use red text, white text on red, black capsule labels, bold subheadings, enlarged numbers, or local red chart elements. Red only corresponds to "key point, current, recommended, high value, risk, or action" — never to ordinary decoration. + +Numbers such as percentages, amounts, improvement magnitudes, savings, and stage numbers stand as independent blocks, with units and explanations immediately adjacent. Keep time, stages, and serial numbers consistent; roadmaps use clear numbering like 01/02/03/04 and do not mix in complex hierarchies. + +Sources and notes use extremely-small-level light gray or dark gray text, placed at the bottom, beside charts, or to the right of the title; they only state data sources, assumptions, or measurement bases — they do not carry key conclusions. + +## 4. Content Page Layout System + +### A. Large-type definition/opinion page +For introducing concepts, defining problems, or stating strategic positions. A small lead-in sits at the top or upper left; the body states the viewpoint in oversized text with keywords marked red; below it may follow a row of metrics, categories, or keyword modules. Information density low to medium. If the text runs beyond a few lines or multiple data groups are needed, do not use this layout. + +### B. Left title + right/center chart analysis page +For current-state, distribution, trend, comparison, and cause analysis. The title and caption sit on the left or upper right; the body holds a donut chart, bar chart, combination bar-line chart, or small metric cards; key sectors, key bars, or current values use red, everything else gray. Suited for 1 main chart + 2–4 annotation points; not suited for cramming in multiple large charts of equal weight. + +### C. Roadmap/stage card page +For showing 3–5 stages, goals, tasks, or execution paths. One large red card marks stage 1, the current stage, or the core initiative; the rest are light gray cards; enlarged numbering sits at the top or on the left. Emphasize stage names, actions, and expected results. Beyond five stages, split across pages or convert to a timeline; not suited for unordered miscellaneous lists. + +### D. Heat matrix / opportunity identification page +For two-dimensional assessments of impact, complexity, priority, or savings headroom. The body is a red–pink–light-pink grid, deep red marking high intensity or priority, with a small legend, axis notes, and a red conclusion card beside it. The matrix serves relative positioning and clustering, not precise value reading; when precise values are needed, switch to a table or bar chart. + +### E. Capsule-label flow + recommendation card page +For process nodes, operational steps, category groupings, or optimization-opportunity lists. Black capsules mark first-level categories or path nodes, red capsules mark key nodes, light gray capsules mark ordinary items; 2–3 recommendation cards may sit at the bottom or on the right. Labels must be short and avoid wrapping; when there are too many labels, group them — no complex connecting lines. + +### F. Multi-metric dashboard / case results page +For results, cases, forecasts, savings, or performance changes. Composed of large number cards, bar charts, mini donut charts, and caption lists; a red number card or red chart element is the results focal point, gray cards provide the comparison. Every large number must come with an explanation — do not stack isolated metrics. + +### G. Simple table / comparison matrix page +For comparing initiatives, departments, cost items, time periods, or opportunity categories. The table occupies the lower-middle part of the body, with a simple header and key columns/rows in red or on a light red base. A title and a conclusion sentence are mandatory — the table must not become an unexplained data pile. + +## 5. Color System + +Background colors: +- **#FFFFFF**: the main content base, card interiors, and large whitespace areas — the largest area. Cannot be replaced by high-saturation colors. +- **#F6F6F6 / #F7F7F7 / #F8F8F8**: full page background, light zoning, table bases, or chart container bases; must keep white cards clearly visible. + +Primary text colors: +- **#070302 / #0F0605 / #1C0B0B**: titles, important body text, cover main title, and key chart text. +- **#2F2929 / #454545 / #484545**: body captions, subheadings, legend text, and table text. + +Primary accent red: +- **#FF4D4D / #FF5454 / #FF5C5B / #FE6464**: for red cards, key numbers, key chart bars, the current stage, important labels, and CTAs. At most one large-area red block per page; other red appears only as point-like echoes. +- May be replaced by the brand primary color, but the "single high-saturation accent + grayscale system" must be kept, and white-text/black-text contrast must hold. + +Auxiliary pink-red: +- **#FED8D8 / #FFC5C4 / #FFDFE0 / #FFF1F1 / #F1CCCC**: heat-map gradients, weak emphasis backgrounds, area-chart fills, and the light level of red cards. Must not be used for small-size primary body text — avoid low contrast. + +Auxiliary gray and separation: +- **#BDBDBD / #C1C1C1 / #D9D6D6 / #DDDBDB / #E7E6E6**: axes, gridlines, card boundaries, ordinary bars, table lines, disabled or secondary states; must not compete with body text. + +Cover dark colors: +- **#070302 / #120706 / #210E0D / #2F0505**: only for the cover or a very few dark-atmosphere section pages' backgrounds and dark-red watermarks. Content pages do not use large dark bases. + +A single page uses only one hue of red + grayscale. Chart series stay mainly red, pink, and gray; avoid introducing multi-color business charts in blue/green/purple, unless source-data states must be distinguished and stay low-saturation. + +## 6. Fonts and Text Hierarchy + +A modern sans-serif business font. Body text mainly uses Liter (Chinese: MiSans); the cover's oversized title uses Archivo Black (an Arial Black-class ultra-heavy sans, brought in via customFonts). Overall clean, compact, rational — no handwriting fonts, decorative serif fonts, or cartoon fonts. + +Relative hierarchy: +- Cover main title: about 5–6x body size, ultra-bold, white, tight line spacing. +- Content-page main title: about 2.5–3x body size, regular or medium-weight, black, at upper left or top. +- Large-type opinion/definition: about 3–4x body size, may span multiple lines, keywords in red. +- Subheading/card title: about 1–1.2x body size, often bold or a deeper black. +- Body captions: body=1x, short lines, low decoration. +- Table text/chart labels: about 0.75–0.9x body size. +- Footnotes, sources, header small text, page numbers: about 0.55–0.7x body size, gray or black-gray. +- Number metrics: about 2–4x body size; units and explanations drop to body or note level. + +Text is mainly left-aligned; large centered passages are not part of the system; the cover may locally use a left-aligned oversized title. Avoid overlong paragraphs and avoid multi-level bullets inside cards. Use one consistent capitalization style within the same page. + +## 7. Chart Language + +The charts actually appearing are mainly donut/pie charts, bar charts, combination bar-line charts, area/trend charts, heat matrices, small gauges, and metric cards — serving consulting analysis, not chasing complex visualization. + +Donut/pie charts: use red, deep red, gray, and black-gray sectors, with a short label or core value in the center; short outer annotations, low-presence legend. The red sector marks the key cost item or key object. + +Bar charts: red bars mark key points, current values, targets, or high values; gray bars are comparisons. Axes are minimal, gridlines pale gray, bar spacing clear; a short value or label may sit atop bars — avoid dense annotation. Lines in combination charts use thin strokes and small nodes as trend or target references. + +Heat matrices: light pink to red expresses intensity; axis text stays simple; grid boundaries are softened. Too many dark blocks defeat priority judgment. A legend or note explaining color intensity is required. + +Metric cards/mini charts: embedded in red cards, gray cards, or white containers. Large numbers stand out, with a short caption explaining why they changed. Mini bar and donut charts are only supplements — they must not become the page's second main focal point. + +Legends and annotations: legends stay small and close to the chart, colors matching the series. Key points may use red capsules, small dots, arrows, or short labels, but no complex callouts. Forecast, target, or baseline lines use pale gray lines or thin red lines with a short note. + +## 8. Tables and High-Density Information + +Tables are used to "prove, compare, break down, and prioritize"; they usually sit in the lower-middle of the body or on the right, paired with a title and a conclusion sentence. + +Headers: light gray base, or white base with thin rules; text bolded or darkened. Key columns may use a red header or a red top bar, but the whole table must not go high-saturation. + +Rows and columns: even row heights, phrased as short sentences. Keep column counts low — prioritize name, metric, impact, action, and status fields. Long explanations should be broken out into cards or footnotes; avoid multi-line crowding inside cells. + +Separators and base colors: use thin light gray lines such as #E7E6E6, #DDDBDB; light gray blocks may group content; zebra striping is not a strong system — if used, keep it very subtle. Key rows/columns may use a light red base or a red bar mark. + +Alignment: text left-aligned, numbers right-aligned or visually aligned on decimals/units. Percentages, amounts, and change values keep consistent units. Status uses red dots, black dots, light gray labels, or short badges — no complex icon sets. + +Summary and key points: summary rows use darker text, a light gray base, or a thin red line. Do not mark levels with multiple colors at once; prefer the red/pink/gray three levels to express high/medium/low or key/ordinary/weak. + +## 9. Components and Graphic Elements + +Title component: a large black title at upper left + a caption below or beside it — no heavy title bars. The cover title is a special oversized white-text exception. + +Red key card: for the current stage, key conclusions, core metrics, recommended actions, or CTAs; may be white text on red or black text on a red-to-lighter base. Keep only one main red card per page; other red elements downgrade to labels or chart points. + +Light gray/white cards: for parallel information, stage explanations, metric notes, and comparison content. Light boundaries, restrained rounding, no shadow dependence; uniform spacing and alignment form the grid. + +Capsule labels: three kinds — black, red, light gray. Black marks categories or main path nodes, red marks key nodes, light gray marks ordinary nodes. Label text is short, holds no long sentences, and does not wrap into multi-line capsules. + +Numbering component: use 01/02/03/04 or large numerals. White-on-red marks the current or primary stage; black-on-gray marks the rest. Numbers must be bound to card titles — never isolated decoration. + +Separators and axis lines: thin light gray lines organize charts, tables, and modules; they must not thicken or turn into decorative borders. + +Badges/buttons: the cover and CTAs may use red button-style labels; content pages may use small red/black labels. Buttons carry no real interactivity — no heavy shadows or highlights. + +Icons: colorful icons are not core to the system. If used, they can only be extremely small single-color functional marks — dots, arrows, plus signs, location points — for guidance or annotation; sets of colorful illustrated icons are forbidden. + +## 10. Texture and Prohibited Items + +Overall flat, restrained, and consulting-report-like, building visual appeal through strong alignment, whitespace, a red focal point, and data structure. + +Prohibited: +- Large-area photo backgrounds, large people images, or scene photography as the main visual of content pages. +- emoji, cartoon illustrations, 3D graphics, glow, glossy glass textures, complex textures. +- Colorful icon sets, mixing multiple brand colors like blue/green/purple, rainbow-style charts. +- Heavy drop shadows, strong gradient backgrounds, complex borders, decorative curves and flourishes. +- Large centered copy, hierarchy-free long paragraphs, full-page bullet lists. + +Use with caution: +- Gradients: only for red-to-light-red card bases, heat maps, or area charts — not for full-page flare backgrounds. +- Shadows: if cards must be distinguished, use an extremely subtle shadow or simply a light gray base instead; do not form a floating-card style. +- Rounded corners: may be used on capsule labels and buttons; cards should have only slight corner rounding; must not turn into internet-UI style. +- Icons/arrows: only for flow direction, key-point annotation, or status dots — few in number, single-color. + +Usable on special pages: the cover may use a dark background, dark-red watermark, oversized title, and button-style red labels; the closing page may use a larger CTA message with contact details. Section divider pages may sparingly adopt the cover's dark atmosphere or large-type-on-white, but cannot replace the content-page system. + +## 11. Generation Checklist + +- Skeleton: is it a 16:9 horizontal business page; are the title area, body area, and caption/footnote area clear; does content keep off the edges? +- Copy: does each page have only one main point; is the title short and specific; are captions controlled to 1–2 lines; is card text phrased as short sentences? +- Hierarchy: do title, key message, body, chart labels, and footnotes show a clear relative size difference; is hierarchy-free text stacking avoided? +- Color: does it keep white/light-gray background + black-gray text + a single red accent; does red only correspond to key points; are multi-color charts avoided? +- Layout: was a suitable scheme chosen among large-type opinion, chart analysis, roadmap, heat matrix, label flow, metric case, or simple table; is unrelated information kept from being forced onto the same page? +- Charts: does red mark only key series; are axes and gridlines softened; are labels readable; is the legend simple and near the chart? +- Tables: are headers, separators, key rows/columns, and number alignment consistent; are long cell paragraphs and overly dense line frames avoided? +- Components: do red key cards, light gray cards, capsule labels, numbering, and separators have clear functions; are no components added merely for decoration? +- Prohibited items: are photo backgrounds, emoji, 3D, glow, heavy shadows, complex textures, colorful icons, and rainbow palettes absent? +- Quality: check for text overflow, truncation, garbled characters, overlap, low contrast, chart occlusion, empty cards, wrong proportions, excessive template sameness, or too many red focal points. diff --git a/skills/open-kimi-ppt/reference/design_system/01_strategy/05/en/moss-green-transformation.md b/skills/open-kimi-ppt/reference/design_system/01_strategy/05/en/moss-green-transformation.md new file mode 100644 index 0000000..26f3ad6 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/01_strategy/05/en/moss-green-transformation.md @@ -0,0 +1,163 @@ +# Organization Name · 2025.08 The GenAI Transformation of the Communications Function STYLE DESIGN SYSTEM + +## 1. Style Positioning + +For consulting-firm data packs, functional transformation assessments, AI/technology impact quantification, methodology explanations, and executive-level reporting. Aimed at business owners, communications/function leaders, and consulting project teams; each page must deliver its conclusion fast, while chart definitions and measurement bases, methodological assumptions, and sources remain traceable. + +Summary in one line: **a dark consulting data-pack style, where deep gray canvas and deep green tech atmosphere carry dense analysis, and teal-green data encoding highlights GenAI transformation opportunities and methodology levels.** + +Stable features: deep gray/deep green full base colors, the QuattrocentoSans font system, conclusion-style titles at upper left, large body charts/matrices, short-paragraph interpretation on the right, a tiny source/copyright line at the bottom, thin-line frames, fluorescent-green/teal-green accents, and the AI-portrait visuals on the cover/closing pages. + +- **Conclusion first, evidence as the body**: the title states the judgment directly; charts, tables, matrices, or flows do the persuading; decoration must not replace evidence. +- **Dark and unified, green layered**: deep gray and deep green define the whole deck; bright green only marks key data, labels, chart series, and states — no meaningless color filling. +- **High density but scannable**: use columns, dividers, headers, labels, footnotes, and alignment to build the reading path; avoid hierarchy-free text stacking. + +## 2. Page Skeleton + +- **Canvas ratio**: widescreen landscape 16:9. All pages reserve bottom space for footnotes, copyright, and the page number. +- **Default background**: content pages sit on deep gray #2C2C2C, overlaid with deep green #0A3021–#0D4430 zones or a green glow at upper right/right side; section divider and disclaimer pages may use near-pure deep gray. +- **Margins**: narrow safe margins; labels and titles at top, sources and page number at bottom, the body filling the middle. +- **Title area**: a small tab/hierarchy label at upper left, followed by the main title and one line of subtitle or key message. Left-aligned, spanning about half to full width at the top of the page; never centered. +- **Body area**: content pages are mainly chart/table on the left or center + interpretation on the right; methodology pages use horizontal flows or matrices; concept pages use multi-column/node relationships. Tight spacing between title area and body. +- **Header/navigation**: a small green label at upper left, such as Function Level, Task Level, Methodology; it only signals the section and analysis level — no large navigation bar. +- **Footer**: fixed at the bottom with sources, assumption notes, and copyright in a size clearly smaller than body text; the page number at lower right. Footnotes may run horizontally across pages or gather below charts. +- **Logo**: the brand mark mainly appears on the cover and closing page; content pages do not enlarge the Logo. +- **Dividers**: thin lines, table lines, axis lines, rectangular outlines; colors in deep gray, gray-green, or low-saturation green — organizational function only. +- **Background graphics**: covers and end pages may use AI portraits/generative visuals; content pages use only abstract green glows or gradients — no large people images. +- **Page-type skeletons**: + - Cover: deep gray brand and title blocks on the left, AI portrait with deep green light effects on the right; the title sits inside a thin-line frame or half-frame area. + - Content data page: title at upper left, large central chart, interpretation on the right, sources at the bottom. + - Methodology section divider: near-pure deep gray, large title at lower left/center-left, a few small squares as visual anchors. + - Methodology content page: label + title at top, flow, matrix, or step cards below, supplementary measurement-basis notes at the bottom. + - Disclaimer page: large title on the left, dense legal text on the right, deep gray background. + - Closing page: brand mark combined with the AI portrait/green light effects, minimal information. +- **Default reading path**: upper-left label → main title/subtitle → main chart or matrix core data → right-side interpretation → bottom sources/measurement-basis notes → page number. + +## 3. Content Organization + +- **Title style**: use consulting-style conclusion sentences that directly state rankings, impact, opportunity, method scope, or comparative judgments; avoid vague titles like "Overview" or "Background". May include percentages, rankings, subjects, and results. +- **Subtitle/key message**: below the main title, a smaller line states the quantification scope, stage, metric definition or basis, or "why it matters"; color in light green or light gray. +- **Body structure**: short paragraphs, short sentences, and bullets; right-side interpretation is generally 2–4 paragraphs, each supporting one finding. Do not use large blocks of centered narrative. +- **Grouping logic**: group by function, task category, impact type, AI type, automation stage, method step, cost pool, or workflow; titles prefer short noun phrases. +- **Number of points per page**: 1 main point per page, paired with 2–4 sub-findings; high-density table pages may add more entries, but one title conclusion must lead them all. +- **Body density**: more labels, footnotes, and data are allowed, layered by column widths, headers, row groups, and color blocks. When text exceeds 4–5 short paragraphs, split the page or switch to a table/matrix. +- **Bullet style**: use short bullets, short dashes, semicolons, or line breaks; start with verbs or noun phrases; avoid complete long paragraphs. +- **Keyword emphasis**: use bright green, teal-green, bold, or local highlights on dark bases for percentages, rankings, target objects, and stage names; no underlines, glowing outlines, or multi-color emphasis. +- **Numbers/units/time frames**: highlight percentages, ranges, approximations, rankings, and stage differences. Numbers and units stay adjacent; annotate directly inside charts wherever possible rather than relying on legends. +- **Source footnotes**: the bottom must keep sources, estimation assumptions, sample scope, copyright, etc.; multiple sources are compressed horizontally with semicolons or short phrases. + +## 4. Content Page Layout System + +### A. Left chart + right interpretation + +For quantitative conclusions such as rankings, cross-sectional comparisons, cost impact, productivity gains, and function benchmarking. The left or center 60–70% holds horizontal bar charts, stacked bars, or range bars; the right 20–30% holds explanatory text; the top carries the conclusion title and measurement basis, the bottom the sources. Target objects use bright green/teal-green, other objects gray-white or deep green; thin vertical lines may mark averages, targets, or stage boundaries. Not suited for scenes with too many dimensions whose labels cannot stay readable, nor for narrative pages needing long explanations. + +### B. Full-width high-density table/matrix + +For task lists, workflows, AI-type comparisons, automation potential, cost pools, and method inputs/outputs. The body nearly fills the width; column headers on a deep green or teal-green base, row groups on a deep gray sidebar or color band. Text columns left-aligned, number columns right-aligned or centered, status columns with dots/checks-crosses/color blocks; emphasis via teal-green bases, bright green numbers, red/green status dots, or bold rows. Do not use this with less data than 3×3 — it would look empty; if the comparison is complex but numeric-light, switch to cards or a flow. + +### C. Stacked-bar / waterfall-style decomposition + +For decomposing the total opportunity. Categories listed on the left, horizontal stacked bars on the right showing stages, types, or potential ranges, with a small swatch legend at the bottom explaining the series. Key row labels or bars use highlight green; non-key parts stay low-saturation. Do not use too many series colors — avoid turning the dark page into colored noise. + +### D. Methodology flow + +For diagnostic models, assessment steps, quantification logic, and input-to-output paths. Use 4–5 horizontal step cards or nodes connected by arrows/lines; each step contains a short title, an icon-like circle or small card, and 2–3 explanatory points. Use green titles, circular nodes, thin-line arrows, and stage labels to express hierarchy. Not suited for carrying large amounts of precise numbers. + +### E. Multi-column concept/comparison + +For impact types, Traditional AI/GenAI/Agentic AI differences, evaluation dimensions, or capability classifications. Use 3–4 columns, one concept per column, with short sentences, status marks, or small matrices inside; column titles use green bars, white cards, or circular color blocks. Suited for medium information density, not for complex financial modeling. + +### F. Section divider / separator page + +For structural transitions such as Methodology and Disclaimer. Use an empty deep gray field, the large title left-aligned or positioned lower-left, keeping only minimal decorative squares/lines. Do not add charts, card groups, or explanatory paragraphs — that would break the section divider's rhythm. + +## 5. Color System + +- **Primary background deep gray #2C2C2C**: the base color of content pages, section dividers, and disclaimer pages; cannot be replaced by a light background — the style would be falsified. +- **Deep green background #0A3021 / #0B3928 / #0D4430**: for gradient zones on content pages, chart base plates, and the right-side atmosphere of cover/closing pages. May be used at large area with low saturation; may be fine-tuned within the same family — do not switch to blue-purple or orange-red. +- **Mid green #125E42 / #176F4E / #197352**: for primary chart series, title labels, module bases, and grouping bars. Replaceable with a similar brand green, but sufficient contrast with the deep green background must hold. +- **Bright teal-green #1A835B / #35AA7E / #74D1A9**: for key data, target objects, emphasized bars, status dots, legend highlights, and a few accent texts. Small-to-medium area — avoid filling entire pages; not for ordinary body text. +- **White/near-white #F2F4F2**: for main titles, body text, table text, and chart labels. Do not replace all body text with plain gray — readability would drop. +- **Light gray #B8B9B9 / #D7D7D7**: for secondary labels, non-key bars, axis labels, and footnotes. +- **Dark gray-green #35594C / #5B7067 / #61746C**: for gridlines, table separation, weakened modules, and boundary lines — structural color only. +- **Status red/pink, around #C83A5A**: only in matrices marking low capability, limitations, risks, or negative states, at very small area. Prohibited as a primary decorative color. +- **Chart series boundary**: a single page stays in the green family with gray/white as reference; status red only as an exception. Do not introduce multiple blue/yellow/purple data series at once; if more series are unavoidable, prefer a brightness ladder of the same green. + +## 6. Fonts and Text Hierarchy + +- **Font character**: the whole deck uses QuattrocentoSans, with QuattrocentoSans-Bold and Italic building hierarchy. Do not mix in serif or handwriting fonts. +- **Hierarchy ratios**: body = 1x; main title about 1.7–2.4x; cover title about 2.5–3.2x; section divider large title about 3–4x; subtitle/key message about 1.2–1.5x; chart axis labels and table body about 0.8–1x; footnotes, copyright, page numbers about 0.45–0.65x. +- **Titles**: left-aligned, tight line spacing, may be partially bolded or wrapped; no more than three lines. +- **Key message/subtitle**: below the title, stating the measurement basis in light green or light gray — do not repeat the title. +- **Body text**: mainly regular weight; key phrases may be bolded or bright-greened; short paragraphs, moderate line width, right-side interpretation left-aligned. +- **Subheadings/labels**: smaller size, on green bases or in green text; keep the text short. +- **Table text**: column headers may be bold, body regular; text columns left-aligned, number/percentage columns centered or right-aligned. No frequent italics inside tables. +- **Chart labels**: axis labels and data labels smaller than body text but must stay clear; key data may enlarge close to body size with bright green emphasis. +- **Notes/footnotes/page numbers**: extremely small level, at the bottom or in the right-edge vertical page-number area; must be legible and never mixed into the body. + +## 7. Chart Language + +Charts are mainly horizontal bar charts, stacked bars, matrix comparisons, and a few flow/node diagrams — no complex multi-chart system. + +- **Bar charts**: dark base, horizontal layout; category labels on the left, bars and values on the right. Use a green ladder or light gray references, key bars in bright teal-green; axis lines and gridlines thin and low-contrast. +- **Range/stage expression**: within the same row, parallel bars or range bars may express current vs. future stages, deploy vs. reinvent. Distinguish with different green brightness steps or gray-green bases, and annotate directly in the legend or on the bars. +- **Stacked bars**: for task composition or workflow decomposition. Segments come from the same green sequence; labels are embedded or kept close to the bars, with a simple legend at the bottom. +- **Matrix charts**: clear row/column headings, column headers may use green bars; cells use dots, checks/crosses, or short text phrases for states. Positive in green, negative/limited in red, ordinary reference in gray-white. +- **Flow/node diagrams**: circular nodes, white cards, and thin-line arrows; nodes may hold simplified icons or initial-letter visuals, but they must serve the step's meaning. +- **Legends**: above, below, or at the bottom of the chart, never at the visual center; swatches small and tidy, text short. +- **Annotations**: use the right-side interpretation text instead of complex bubble callouts; inside the chart keep only necessary numbers, baselines, and stage notes. Floods of floating notes covering bars are prohibited. +- **Chart boundaries**: no 3D charts, pie charts, donut charts, perspective charts, or decorative curve charts; there is no evidence supporting complex animated charts or illustrated charts. + +## 8. Tables and High-Density Information + +- **Table role**: carrying methods, tasks, types, ratings, and multi-dimensional comparisons — the core evidence carrier. +- **Headers**: deep green or mid-green base, white/near-white text, short column names; multi-level headers may use different green steps or thin-line zoning. +- **Row/column structure**: row labels left-aligned, metric/status columns centered, value columns right-aligned or centered. Complex task descriptions get wider columns; ratings/potential get narrow columns. +- **Row height and density**: compact row heights but keep separation; compress long text into short phrases — no full paragraphs in cells. +- **Separators**: thin gray lines, gray-green lines, or dark boundaries to separate row groups, column groups, and headers — no heavy outer frames. +- **Base colors**: deep gray as the base; group rows or key columns may use deep green/teal-green bases; large light bases are generally avoided to protect the dark system. +- **Key rows/columns**: target rows, summary columns, and key percentages may use bright green, bold, base-color blocks, or borders; pick only 1–2 focal points — never highlight the whole table. +- **Zebra striping**: extremely subtle deep gray/deep green alternation is allowed, never obviously showy; omit it when thin-line separation already exists. +- **Symbol marks**: dots, checks/crosses, red-green status dots, and rating color blocks may express capability/risk/automation level; a legend is required or the meaning must be inferable from context. +- **Summary/footnotes**: notes, sources, and assumptions may sit at the bottom of the table; summary rows or result columns must stand out from ordinary rows. + +## 9. Components and Graphic Elements + +- **Upper-left tab**: a small green rectangle or text label showing Function Level, Task Level, Methodology, etc. Width follows the text — no long banner. +- **Title frame / cover thin-line frame**: cover titles sit inside a green/gray-green thin-line frame or half-frame; content pages rarely use large title frames. +- **Right-side interpretation column**: beside the chart, containing short paragraphs, keyword highlights, and a few numbers; it explains "so what" and does not repeat all the data. +- **Cards/step blocks**: methodology pages use dark cards, small white cards, or green title bars holding step names and bullets; boundaries clear, rounding very restrained if any. +- **Circular nodes**: for impact types or method steps, colored green, yellow-green, blue-green, or small red nodes. Few in number — not a flood of decorative bubbles. +- **Separators and outlines**: for chart axes, table boundaries, and module zoning; thin, low-contrast, function-first. +- **Legend swatches**: small rectangles/dots + short labels explaining stages, states, series; kept close to the chart's bottom or top. +- **Page number/copyright vertical sidebar**: page number at lower right or along the right edge, copyright/sources along the bottom. +- **Image frames**: carry the AI portrait only on the cover and closing pages; if an image appears on content pages, it must keep a deep green overlay — no screenshot collages. +- **Icons**: methodology pages may use a few linear/simplified icons or circular icons. Colorful skeuomorphic icon libraries are prohibited; icons must relate directly to steps/states. + +## 10. Texture and Prohibited Items + +The overall texture is **dark, flat, restrained, data-dense, tech-consulting**; visual focus comes from the green glow, data highlights, and structured information. + +- **Prohibited**: large light backgrounds, rainbow palettes, 3D charts, glowing outlined text, complex textures, emoji, cartoon illustrations, social-media-style stickers, meaningless large icons, long centered copy, decorative wave lines, over-rounded cards, strong-shadow floating layers. +- **Use with caution**: gradients, shadows, circular nodes, icons, red states. Gradients only for deep green background atmosphere; shadows, if any, extremely weak; red only for negative/limitation states; icons only for methodology steps. +- **Usable on special pages**: AI portraits/generative images only on the cover and closing page, as the theme visual; section dividers may use minimal geometric squares; the disclaimer page may use dense legal text. +- **Image dependency boundary**: content pages do not rely on photos, screenshots, or illustrations to tell the story unless the image itself is data evidence; otherwise convert to charts, tables, or flows. +- **Brand feel boundary**: the brand mark should not be enlarged and repeated on every page; the brand feel comes from the dark base, the green system, typography, and the footnote structure. +- **Density control**: never sacrifice alignment, contrast, and footnote readability. If text overlaps, tables squeeze, or chart labels become illegible, cut content first rather than shrinking it into unreadability. + +## 11. Generation Checklist + +- Is it a 16:9 dark consulting report page, not a poster, infographic, or social card? +- Is there a clear label/title area at upper left, and is the title a conclusion sentence rather than a vague topic word? +- Does the single page hold only 1 main point, proven by a chart, table, matrix, or flow? +- Is the background mainly deep gray and deep green, with bright green used only for key data/labels? +- Is the body organized as one of: left chart + right interpretation, full-width matrix, flow steps, or multi-column comparison? +- Is the right-side interpretation short paragraphs with keyword highlights, not long-form body text? +- Do charts use horizontal bars, stacked bars, matrices, or flow nodes; are 3D, pie charts, and showy series colors avoided? +- Do tables have clear headers, grouping, alignment, thin separators, and key rows/columns? +- Does the footer keep sources, assumptions, copyright, and page number without overlapping the body? +- Does the type keep the QuattrocentoSans character, with hierarchy expressed through relative size, weight, and color? +- Is photo/screenshot/illustration abuse avoided, with the AI portrait only on the cover or closing page? +- Are there any occurrences of overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong proportions, or mechanical template repetition? +- If the brand color is replaced, do the dark base, high-contrast white text, and single-primary-hue principles still hold? diff --git a/skills/open-kimi-ppt/reference/design_system/01_strategy/06/en/map-strategy.md b/skills/open-kimi-ppt/reference/design_system/01_strategy/06/en/map-strategy.md new file mode 100644 index 0000000..33704cd --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/01_strategy/06/en/map-strategy.md @@ -0,0 +1,125 @@ +# Cartographic Strategy · Map Strategy STYLE DESIGN SYSTEM + +> Intended homepage tag: Strategic Planning / Strategy +> Visual metaphor: contemporary atlas + strategy room + +## 1. Style Positioning + +For internationalization, regional expansion, business portfolios, ecosystem layout, resource allocation, and long-term roadmaps. It is not a traditional consulting blue-and-white template, but a map-style narrative that "puts strategy into space": warm white paper, deep navy, restrained cobalt blue, and vermilion coordinates, building a sense of direction through routes, regions, scales, numbering, and legends. + +Underlying principles: + +1. Every page first answers one decision question, then shows location, path, or priority evidence. +2. Map language serves comparison and sequence — contour lines and lat-long grids are not decorative wallpaper. +3. One main map leads the page; captions, numbers, and labels are organized around it. +4. When geographic information is insufficient, use abstract location diagrams, route maps, or composite maps — never fabricate precise boundaries. +5. Titles read like judgments management would actually say — avoid vague slogans like "strategic blueprint" or "marching into the future together". + +## 2. Page Skeleton + +The canvas is 16:9 landscape. Content pages are mainly warm white; section divider pages may use deep navy. Outer margins stay stable; tiny coordinate ticks may appear at the four corners, but content never touches the edges. + +The top is the title and page-number coordinate zone, about 14%–18% of the page; the middle is the main-map workspace, 65%–72%; the bottom reserves space for sources, assumptions, and the legend. No full-width thick rule under the title — position with short ticks, the page number, and thin lines instead. + +The cover uses "large title + abstract regional map + one main route". The title sits on the left or lower left; the map takes 45%–60% on the right. Content pages switch among maps, matrices, routes, and timelines, but always keep the same coordinate and legend grammar. + +## 3. Content Organization + +Titles use conclusion sentences or explicit questions, e.g., "The Middle East offers the fastest first-entry validation window". The subtitle adds scope, years, evaluation dimensions, or data definitions and measurement basis. + +A single page carries only one strategic judgment, with at most 3 supporting pieces of evidence. Body text uses short sentences, numbering, and direct labels — no long explanatory passages. + +Spatial grouping prioritizes regions, markets, stages, entry modes, capability nodes, and risk levels. Every route must have an origin, a destination, a sequence, and a meaning; every color must be explained in the legend. + +Numbers sit immediately beside their objects, with units, time, and measurement basis. Sources and assumptions go in the footer, not hidden at the visual center. + +## 4. Content Page Layout System + +### A. Strategic map page + +The left 25%–32% holds the conclusion and 2–3 key explanations; the right holds an abstract regional map. Dots mark markets or capability nodes, line width expresses priority, solid/dashed lines distinguish what is in place from what must be built. Suited for market selection, network layout, and resource migration. + +### B. Three-market comparison band + +The page divides horizontally into three parallel zones, each containing a market name, one main number, a small location map, and 2–3 evaluation dimensions. The three columns must be isomorphic; the recommended option may be emphasized with a cobalt edge line or vermilion coordinate point. + +### C. Opportunity–difficulty matrix + +The matrix takes 60%–70% of the page, with the recommendation conclusion on the right. Point labels name the markets directly without depending on a complex legend. Quadrant names are actionable judgments such as "enter first", "build partnerships", "keep watching" — not abstract star/cash-cow clichés. + +### D. Route and stage page + +One main route from lower left to upper right connects 3–5 stages. Each stage carries its timing, key actions, thresholds, and exit conditions. The route may turn corners; equal-width stacked process cards are not used. + +### E. Capability network page + +A central capability anchors the page, connecting channel, delivery, compliance, product, and talent nodes. Connecting lines express dependencies; node size expresses priority. Show only the 5–8 nodes that genuinely affect implementation. + +### F. Decision page + +One large conclusion on the left; on the right, a three-part list of "decide now / conditions to enter / 90-day actions". A scaled-down route map may review the whole journey — this is not an ordinary Thank You page. + +## 5. Color System + +- Warm paper white #F4F0E8: primary content background. +- Deep navy #0B1F33: titles, section bases, the main route, and core text. +- Cobalt blue #2F5BFF: recommended options, key paths, and key numbers. +- Vermilion #E4572E: risks, key coordinates, and must-decide nodes; its area stays strictly smaller than cobalt. +- Mist cyan #9BD5D8: secondary regions, historical stages, and de-emphasized data. +- Graphite gray #5B6570: captions, axes, sources, and unselected options. + +Regular pages use paper white + navy + cobalt; vermilion appears only once. Rainbow maps, fluorescent gradients, and large red-green oppositions are prohibited. + +## 6. Fonts and Text Hierarchy + +Chinese uses MiSans; English uses Liter; page titles and conclusion emphasis use a serif ({latin: Unna, ea: 思源宋体}) as the atlas-style display face, with body and secondary information in sans; never mix more than two font families. + +- Cover title: 4–5x body size, bold, at most two lines. +- Page title: 2–2.6x body size, left-aligned. +- Key numbers: 2.5–3.5x body size, set in bold sans-serif. +- Body text: 1x, short sentences. +- Coordinates, legends, sources: 0.55–0.75x, kept readable. + +Numbers, years, and region codes may use JetBrains Mono (brought in via customFonts). No all-caps long sentences, italic long passages, or multi-layer shadows. + +## 7. Chart Language + +Prefer dot plots, bubble charts, slope charts, path charts, two-dimensional matrices, regional small-multiple maps, and bar charts with direct annotations. + +Chart backgrounds stay transparent or paper white; gridlines use extremely fine mist gray. Key series use cobalt; history/baselines use mist cyan or gray; risk thresholds use a single vermilion line. + +Maps must carry a legend, a direction or scale cue. Abstract maps must be clearly marked as "schematic" — false administrative precision is not allowed. Key differences are annotated directly beside points, reducing standalone legends. + +## 8. Tables and High-Density Information + +Tables serve market scoring, entry conditions, and risk lists. Headers use deep navy text or a light mist-cyan base; thin lines between rows, no heavy borders. + +Recommended rows are emphasized with a cobalt coordinate bar on the left; risk cells use small vermilion dots or text labels — never flood the whole cell red. Numbers right-aligned, text left-aligned, scoring criteria and basis noted at the table bottom. + +High-density content is preferably split into "map/matrix + right-side explanation" — do not crush it into a ten-column-wide table. + +## 9. Components and Graphic Elements + +Stable components include coordinate points, routes, region outlines, short ticks, page-number codes, legends, scale-style separators, and thin-line annotations. + +Nodes use solid circles or concentric circles; lines divide into three types — main path, alternative path, and dependency line. Arrows appear only when direction matters. + +Photos are not a default element. If a city or scene photo is used, allow only one large image with desaturated treatment — no stock-photo collages. + +## 10. Texture and Prohibited Items + +Overall like a contemporary strategy atlas: precise, quiet, clearly directed. The paper base may carry an extremely light texture; dark pages stay pure; no glassmorphism. + +Prohibited: default consulting blue card walls, random world-map watermarks, fake national borders, 3D globes, glowing routes, rainbow heat maps, rounded UI panels, emoji, decorative compasses, and full-page maps with no conclusion. + +## 11. Generation Checklist + +- Can every page state in one sentence what decision it asks for? +- Do the map, matrix, or route genuinely carry comparative relationships? +- Do all colors, line styles, and node sizes have explicit meanings? +- Are regions and paths clearly labeled, with no fabricated precise geographic information? +- Is the recommended option clearly highlighted while alternatives remain visible? +- Does the page keep the stable grammar of paper white, navy, cobalt, and vermilion? +- Are the title, legend, sources, units, and assumptions complete? +- Are card walls, 3D globes, random decorative lines, and template-like slogans avoided? +- Have you checked for overlap, cropping, garbled characters, low contrast, and text wrapping? diff --git a/skills/open-kimi-ppt/reference/design_system/02_business/01/en/honey-orange-memo.md b/skills/open-kimi-ppt/reference/design_system/02_business/01/en/honey-orange-memo.md new file mode 100644 index 0000000..04c4e14 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/02_business/01/en/honey-orange-memo.md @@ -0,0 +1,176 @@ +# Project Report Name — Organization Name Syndication Memo STYLE DESIGN SYSTEM + +## 1. Style Positioning + +A private equity / investment banking memo-type, high-density report style, suitable for syndication memos, investment committee materials, due diligence summaries, deal approvals, financing packages, and management business plan materials. Aimed at finance and industry analysis readers, it supports rapid review of deal terms, investment logic, customer and market evidence, financial projections, valuation, risks, and execution plans; the goal is "reviewable, open to follow-up questioning, and traceable." + +Fixed style: a 16:9 landscape, high-utilization canvas; a light cream-white background; a thin orange vertical line on the left; gray / dark navy segmented section navigation at the top; a small brand wordmark at the upper right (plain small text presenting the new topic name; do not draw a graphic logo); a large orange title; and a gray information sentence under the title. The body uses tables, bar charts, bridge charts, side-by-side modules, rating dots, process boxes, and textual evidence blocks. Fonts are absolutely dominated by the Arial family; bold is used for titles, table headers, field names, and key numbers; italics are used only for notes or special emphasis. + +Underlying principles: + +1. Information completeness comes first, but it must be structured into tables, columns, numbering, colored-block headings, footnotes, and thin divider systems; long passages of text must not float freely. +2. Orange is used only for page titles, the current section, key data, key bars, the left vertical line, and a small number of labels; it is not used as a large-area decorative fill and does not sacrifice body readability. +3. The body area may vary; the navigation, title area, identity mark, left boundary, and footnotes / page numbers remain stable. Chart aesthetics must be subordinate to data clarity, comparability, and traceability. + +## 2. Page Skeleton + +The canvas is 16:9 landscape widescreen with narrow page margins, and the body area occupies the vast majority. The default background is a light cream-white / near-white, approximately `#FCF8F5`, `#FEFBF7`, `#F4F0EC`; a very faint brand geometric watermark or light gray graphic is allowed, but at low opacity so it does not affect the reading of figures. + +The cover uses a full-bleed deep blue city night-scene photograph overlaid with semi-transparent deep blue brand geometry. The title group sits in the right-middle area: the main title in white bold, the subtitle in white regular, and the date placed inside a small orange label; vertical confidentiality / time / email information is placed on the left, and the orange brand wordmark at the upper right (plain small text presenting the new topic name; do not draw a graphic logo). The cover does not use the content-page top navigation. + +Section dividers use the light cream-white background, a left orange line, an identity mark at the upper right (plain small text presenting the new topic name; do not draw a graphic logo), and generous whitespace. The section number is a large orange numeral, and the section title is large dark navy type; they only switch sections and do not carry complex argumentation. Examples include "Industry and Company Overview", "Business Plan", "Valuation and Exit", and "Financing, Diligence & Key IC Findings". + +Standard content-page skeleton: + +- Top navigation: a horizontal segmented arrow / band at the very top of the page; the current section has a dark navy background with white text, the other sections a light gray background or low-contrast gray text. Its height is very low and it serves only for orientation. +- Upper-right identity mark: a small orange brand wordmark (plain small text presenting the new topic name; do not draw a graphic logo), fixed at the top right with clear space reserved around it, not overlapping chart titles or navigation. +- Left orange line: most content pages keep a thin orange vertical line from top to bottom; content begins to its right. +- Title area: left-aligned below the navigation; the main title is usually orange bold, followed by a single gray / dark gray information sentence. +- Body area: immediately below the title, carrying tables, charts, modules, processes, side-by-side evidence, or long text, with a narrow footnote band reserved at the bottom. +- Footer: sources, notes, confidentiality wording, and page numbers at the bottom. Footnotes are significantly smaller than body text and light gray; the page number is usually at the lower right or bottom edge. + +Reading path: top navigation → orange title → information sentence → body area left to right, top to bottom → bottom footnotes. + +## 3. Content Organization + +Titles use judgment-type or topic-type phrases, such as "Deal Summary", "Executive Summary", "Why We Like Organization Name", "Customer Overview", "Business Plan: M&A"; strong conclusions may be stated directly, e.g., "Strong game release pipeline driving game development spend" — no marketing slogans. + +The information sentence under the title is usually one line, used to state the conclusion, the data basis, or the significance of the page; it is lighter in color than body text and professionally restrained in tone, with no exclamations, rhetoric, or large centered passages. + +Body rules: + +- Long text uses bold subheadings + body explanations + bullet / numbered points; every paragraph must have an explicit subheading or left-side label. +- Summary pages may use a left vertical navigation card or numbered boxes with dense bullets on the right; each bullet gives a bold keyword first, then the explanation. +- Group by professional dimensions such as deal terms, investment highlights, industry / customers, financials, valuation, risks, financing, and due diligence. +- Compress a single page into 3–6 modules or 4–8 table rows; a page containing only one big statement is discouraged. +- Use bold, orange numbers, dark blue table headers, light-filled boxes, or dots for emphasis; no fluorescent highlighting, hand-drawn circles, or exaggerated stickers. +- Keep numbers, units, and time bases adjacent to the data, e.g., FY, CY, 24E, 25E, CAGR, EV, EBITDA, bps, %; table column headers explain the basis. +- Source footnotes go at the bottom in small light-gray type; multiple bases are connected with superscripts or parentheses — do not pile long notes into the body. + +## 4. Content Page Layout System + +### A. Deal Summary / Term Sheet Type + +Used for deal overviews, capital structure, valuation, sources & uses, and key terms. The body is a large table: the left column holds dark or gray field names, the right side holds explanations and data; a small valuation table or sources & uses table with an orange header may be embedded in the middle. The reading order is field name → value → note. Suitable for multi-basis facts; not suitable for complex causality or multi-stage processes. + +### B. Executive Summary / Multi-Conclusion Long-Text Type + +Used for investment highlights, key risks, and argument summaries. Vertical section cards / numbered modules sit on the left, dense bullets on the right; dark navy cards mark the major categories, orange cards mark the current or key item. Each bullet opens with a bold keyword. Suitable for scanning by professional readers; not suitable for non-professional audiences or talk-style presentations. + +### C. Investment Rationale / Itemized Argument Type + +The typical page is "Why We Like Organization Name". The body organizes horizontal argument bands with circular A/B/C/D numbering or labels; each band contains a dark navy subtitle bar, an orange number, body bullets, and key figures. Suitable for 3–5 parallel reasons; not suitable for more than 6 items or content where each item requires complex charts. + +### D. Horizontal Comparison Table / Peer Matrix Type + +Used to compare companies, customers, products, competitors, or peer metrics. The left column holds company names or category labels, the top holds the metrics, and the cells hold numbers, text, rating dots, or short labels. Headers may use light orange / dark blue; key rows and columns may use light blue or light orange fills. Suitable for horizontal comparison; not suitable for long qualitative explanation. + +### E. Chart + Explanation Mixed Type + +Used for revenue trends, market size, growth rates, customer penetration, financial projections, bridge charts, and operating KPIs. The main chart occupies most of the width, with a conclusion bar / title above and an explanation box below or on the side. Orange highlights the core series, dark blue / teal is used for comparison series, and gray for background or historical items. Suitable for data argumentation; not suitable for conceptual diagrams without a clear data basis. + +### F. Process / Business Plan Type + +Used for M&A pipelines, operational initiatives, and value creation plans. Built from horizontal process boxes, stage arrows, small tables, and a bottom chart; dark blue bars serve as stage titles, orange nodes mark key actions or key results, and light boxes carry explanations. Suitable for stages, paths, funnels, and execution levers; it should not be abused for ordinary lists. + +### G. High-Density Side-by-Side Module Type + +Used for customer overviews, management / advisor viewpoints, risk mitigation, and due diligence findings. The page is divided into multiple same-size cards or horizontal modules, each containing a subtitle, short bullets, icon-style markers, or micro charts; module spacing is small, with thin lines and light fills for separation. Not suitable for a single large image or emotional storytelling. + +## 5. Color System + +- Background colors: light cream-white / near-white `#FCF8F5`, `#FEFBF7`, `#F4F0EC`. Used for the large-area base of content pages; may be replaced with a warm white of the same lightness — do not switch to a high-saturation background. +- Main text: dark gray `#4D4E53`, `#3E3E42`. Used for body text, table text, and note text; must maintain high contrast and must not be replaced with light gray. +- Title / brand accent orange: `#C4794A`, `#D8752A`, `#F07A00`. Used for main titles, the left vertical line, date labels, current items, key numbers, important bars, and table headers; small-to-medium area. May be replaced with the brand primary color, but the warm-accent role must be retained. +- Structural dark navy: `#12234E`, `#263660`, `#293B60`. Used for the current navigation section, dark sidebars, table headers, process stage bars, and cover overlays; usually paired with white text. May be replaced with a deep brand blue, but it must remain serious and high-contrast. +- Auxiliary grays: `#BEB6B3`, `#D9D5D5`, `#E8E3E1`, `#C6C6C9`. Used for dividers, table borders, non-current navigation, fills, axes, and gridlines. +- Auxiliary light blue / teal: `#5E9BB9`, `#9BA8AF`, `#C6CED6`. Used for secondary chart series, customer / competitor comparisons, key row blocks, or status areas; it must not compete with orange for the primary accent role. +- Positive/negative / status colors: mainly orange, dark blue, teal, and gray, with a small amount of green for growth or positive figures. Green should be used cautiously for positive change; red is not part of the stable primary color system. + +Control the main hues of a single page to orange, dark blue, gray, and a small amount of teal-blue. Chart series should not expand into rainbow colors; status colors serve judgment only, not decoration. + +## 6. Fonts and Text Hierarchy + +Fonts are dominated by Arial / Arial Bold. Helvetica Bold is used only for the cover or special confidentiality overlay text; Calibri, Segoe UI, and the like are not part of the main system. Prefer Arial or an equivalent sans-serif. + +- Cover main title: 3–4x body text, white bold. +- Content-page main title: 2.5–3x body text, orange bold, left-aligned. +- Section divider title: 3–4x body text, dark navy; the section number may be larger, in orange. +- Information sentence / subtitle: 1–1.2x body text, gray regular or semi-bold, positioned under the title. +- Body text: 1x, dark gray; line spacing is tight but must not overlap. +- Subheadings / field names / table headers: 1–1.15x body text, bold; may be white text on a dark blue background or dark gray text on a light background. +- Table and chart labels: 0.75–0.95x body text; compress when necessary but keep legible. +- Notes, sources, page numbers: 0.55–0.7x body text, light gray. + +Text is predominantly left-aligned; table numbers are right-aligned or visually aligned by decimal point; column headers are centered or left-aligned according to data type. Large centered body passages are prohibited. + +## 7. Chart Language + +Use stacked columns, grouped columns, horizontal bars, bridge charts, time-series column-line combinations, small rating / dot matrices, and mini charts inside matrix tables; charts are embedded in the body area of content pages rather than being full-screen single charts. + +Axis lines and gridlines use light gray; legends sit near the top of the chart or inline beside the title, using small color swatches + short labels. Data labels are placed directly at column or bar ends or inside table cells. + +Orange marks the core series, the current item, or key growth; dark blue marks baseline / historical / primary comparison; teal-blue marks the second comparison; gray marks background, other items, or non-key data. Forecast, target, and estimate years are expressed through E, FY, CY, dashed lines, light-shaded areas, or explicit labels and definitions in column headers — not through complex visual effects. + +Key data may use orange numbers, bold, annotation boxes, or dark labels. Do not use 3D charts, gradient columns, dimensional pie charts, heavy shadows, or decorative graphics without data labels. If a chart cannot express a comparison more clearly than a table, prefer the table. + +## 8. Tables and High-Density Information + +Tables carry terms, financials, peers, customers, due diligence conclusions, and model assumptions. Headers use a dark navy background with white text, an orange background with white text, or a light orange background with dark text; the left field column uses a dark gray / dark blue background with white text, or a light gray background with bold text. + +Rows and columns are compact with low row height; borders are thin light-gray lines. Backgrounds alternate among white, light cream-white, light gray, light orange, and light blue to form zones; wide tables may use zebra striping, but it should not be too strong. Key rows and columns use orange headers, light orange fills, dark blue sidebars, or bold numbers; summary rows use a darker fill or a top border line. + +Amounts, percentages, multiples, and years are right-aligned or centered within their columns wherever possible; text is left-aligned; units are written in column headers or the first row, not repeated in every cell. Rating dots, circles, checkmarks, or short labels are visually centered within the same column. + +Footnotes and superscripts move down to the bottom and do not squeeze the data area. Avoid stuffing multi-line long sentences into cells; when explanation is necessary, use a note below the table or an explanation box on the right instead. + +## 9. Components and Graphic Elements + +- Top section navigation bar: the current section is dark blue, the others gray; it must not be turned into a large menu or icon navigation. +- Left orange vertical line: a brand boundary that carries no content; kept on most content pages. +- Orange main title: the entry point to the page topic; must be left-aligned with clear spacing from the body. +- Information sentence: a one-line judgment statement under the title. +- Dark blue subtitle bars: used for groupings, argument bands, process stages, and table module titles, carrying short white-text titles. +- Orange numbering / circular badges: used for A/B/C/D, steps, key points, or emphasized items. +- Light-filled cards / module boxes: used for side-by-side evidence, customer modules, risks and mitigations; light gray borders, filled light cream / light gray / light orange. +- Process arrows and connectors: used for M&A, pipelines, and value creation steps; lines are flat, with no shadows. +- Company identifiers: used in the left column of tables on customer, peer, and competitor pages; presented as text names or neutral placeholder blocks at a uniform size, avoiding overshadowing the content — do not draw graphic logos. +- Footnote / source band: located at the bottom, in small light-gray type. + +Colorful icons are not a stable language; if they must be used, use very few, in a single color or brand color, serving table recognition. Matrix markers, dot ratings, and checkmarks may be used but need a unified style. + +## 10. Texture and Prohibited Items + +Overall, stay flat, restrained, professional, and lightly branded. Apart from the cover photo, content pages rely on almost no large image backgrounds; photos, screenshots, and illustrations are not the main language. Rounded corners are used only on a few labels or cards, with small radii; shadows, gradients, glows, 3D, and complex textures are not part of this style. + +Prohibited: + +- Large photo backgrounds on content pages or low-contrast text pressed over images. +- 3D charts, gradient columns, glowing borders, heavy drop shadows, skeuomorphic buttons. +- emoji, cartoon illustrations, social-media-style stickers, hand-drawn doodles, high-saturation rainbow icons. +- Large stretches of centered copy, unstructured long paragraphs, pure-slogan pages. +- Too many primary colors on one page, or strong colors that conflict with the orange / dark navy system. + +Use with caution: + +- Company identifiers and customer identifiers: only on comparison tables and customer pages, presented as text names or neutral placeholder blocks at a uniform size — do not draw graphic logos. +- Light watermarks / brand geometry: may serve as a low-opacity background, but must not pass through text or tables. +- Green / red status colors: used only with clear semantics such as growth, decline, or risk. +- Rounded labels and small icons: they may only aid recognition; they do not replace textual evidence. + +Special pages: the cover may use a full-bleed deep blue photo with a semi-transparent geometric overlay; section dividers may use generous whitespace and large numerals; content pages must return to the tabulated, evidence-based, navigation-consistent system. + +## 11. Generation Checklist + +- Skeleton: is it 16:9; do content pages keep the top navigation, upper-right brand wordmark, left orange line, title area, and bottom footnotes / page numbers? +- Copy: are titles short and professional; does the information sentence state the judgment in one line; is the body organized with fields, bullets, tables, or modules? +- Hierarchy: do orange titles, dark blue groupings, body text, and notes have clear relative size differences; is dependence on specific font sizes avoided? +- Color: is the background light cream-white; are the primary colors limited to orange, dark blue, gray, and a small amount of teal-blue; is orange used only for emphasis? +- Layout: is the body scannable left to right, top to bottom; does high-density content have columns, headers, numbering, and dividers? +- Charts: are flat columns / bars / bridges / matrices used; are axes and grids light gray; is key data labeled directly; are 3D and rainbow colors avoided? +- Tables: are headers, field columns, borders, fills, key rows and columns, number alignment, and unit bases consistent? +- Components: are the navigation bar, dark blue title bars, orange numbering, light-filled cards, and footnote sources unified, not arbitrarily reshaped from page to page? +- Prohibited items: are there no emoji, illustration-style icons, heavy shadows, gradients, glows, complex textures, or large-area photos on content pages? +- Technical quality: check for no overflow, truncation, garbled text, overlap, low contrast, occlusion, empty content, or wrong proportions; when the same template is used consecutively, the body structure should vary while the skeleton does not. +- No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions. +- No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion. diff --git a/skills/open-kimi-ppt/reference/design_system/02_business/02/en/lake-blue-memo.md b/skills/open-kimi-ppt/reference/design_system/02_business/02/en/lake-blue-memo.md new file mode 100644 index 0000000..95969e6 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/02_business/02/en/lake-blue-memo.md @@ -0,0 +1,124 @@ +# PJ Mountain — Investment Memo (Organization Name Style) STYLE DESIGN SYSTEM + +## 1. Style Positioning + +A high-density professional PPT style for private-equity investment committees, deal approvals, due diligence reporting, and investment memos, adapted for readers with backgrounds in finance, strategy, operations, and accounting. Each page builds a traceable "conclusion–evidence–assumption–source" chain, emphasizing data density, comparison dimensions, and reviewability. + +The core is a white-background full canvas, an upper-left title, an italic conclusion line under the title, purple structural bars, blue/teal/gray classification colors, thin-grid tables, compact QuattrocentoSans fonts, and bottom footnotes and page numbers. The body consists mainly of charts, tables, process boxes, side-by-side modules, and a small number of evidence images; decoration is minimal, and color only serves section, classification, data-series, and risk-alert functions. + +Underlying principles: + +1. Clarity over whitespace: prioritize keeping key conclusions, data, measurement bases, sources, and comparison dimensions, maintaining order through dividers, header bars, light-gray fills, and hierarchy. +2. Color is an information dictionary, not decoration: purple is used for structure and titles; blue/teal/gray for business categories or chart series; red only for risks, differences, sensitive assumptions, or boxed emphasis. +3. Pages may be complex, but the skeleton must stay stable: the body may mix charts, tables, flows, maps, and images, but the title area, conclusion line, bottom sources, page numbers, and color grammar stay consistent across the whole deck. + +## 2. Page Skeleton + +The canvas is 16:9 landscape with a default white background; content pages use narrow margins and high content utilization. The top is the title area, the bottom is the footnote and page-number area, and the middle is the main evidence area. Reading path: upper-left section label/title → italic conclusion line under the title → main area left to right, top to bottom → bottom footnotes → lower-right page number. + +Cover page: on the left, a plain-text small-type identity mark (write the new topic name; do not draw a graphic logo), the project name, document type, and date; on the right, a large blue line-art abstract graphic; at the lower left, a red italic confidentiality note. It uses generous whitespace and brand line art, and does not adopt the content-page footnote system; this abstract linework suits only the cover and should not spread into content-page backgrounds. + +Disclaimer page: a large upper-left title; the body is a single column of dense small-type paragraphs with almost no color or graphics, keeping only the page number. Full disclosure takes priority; it must not be forced into display-type modules. + +Content pages: the upper left may hold a thin-bordered rectangle or a small numbered section label; the main title sits below it or to its right, in purple or dark gray; below the title, one italic gray conclusion line. The body divides into 2–4 modules, whose titles use purple horizontal bars or thin-bordered title bars. The bottom keeps sources, notes, and assumption statements, with a tiny page number at the lower right. + +Section/divider pages keep the white background and the upper-left title logic, with no large image backgrounds. There is no persistent top header navigation, no full-page watermark, and no large photo backgrounds. Sources and footnotes are a fixed bottom information layer and must not be covered by charts or tables. + +## 3. Content Organization + +Titles use declarative, analytical "topic + judgment dimension" phrasing, such as company overview, market outlook, benchmarking analysis, structural solution, etc.; avoid advertising-style short titles. Under the title, one or two italic information lines express the most important judgment, finding, or question; they do not carry the full function of body text. + +The body is organized into evidence blocks. Every module must have a clear subtitle stating the comparison object, the metrics, or the direction of the conclusion; inside, use bullets, short sentences, numbers, tables, or charts. A single page may carry multiple points, but they must belong to one main question; when parallel points exceed 4 groups, use numbering, color bands, or columns to establish a path. + +Paragraphs should be short, preferring bullets and abbreviated expressions; each bullet contains one action/judgment + one factual basis; do not write continuous prose. Keywords may be emphasized with bold, purple, red boxes, or background color, but no more than two emphasis levels per page. + +Numbers, units, and time bases stay adjacent to the data and are stated in chart titles, table headers, or footnotes. Financial and operating data keep column alignment; percentages, multiples, years, and currency units must not be mixed. Source footnotes go at the bottom in small gray type; multiple external data sources are ordered by chart or module. + +## 4. Content Page Layout System + +1. **Text-based summary page**: suited to Executive Summary, investment theses, and key findings. Structure: big title + italic overview + multiple groups of purple subtitles + bullets; each group carries only one judgment category, with subtitles, bold keywords, and sparse numbering providing emphasis; do not insert complex charts that break summary reading. + +2. **Left numbered navigation + right conclusion list**: suited to presenting side by side about 4 due-diligence topics, investment theses, or risk responses. The left side holds vertical color blocks or numbered labels; the right side holds the corresponding conclusions and bullets. Color blocks represent sections or question categories and must not be purely decorative; if the topics have no clear grouping relationship, do not use this layout. + +3. **Multi-chart dashboard page**: suited to multi-metric comparisons such as market size, business mix, cost benchmarking, and growth drivers. The body uses a 2×2 grid or a one-large-two-small vertical arrangement, each block with a purple title bar; short annotation boxes beside may explain outliers. Avoid collaging unrelated charts; all charts must jointly answer the information line under the title. + +4. **Chart + right-side explanation/annotation page**: suited to trend lines, column charts, box plots, and waterfall charts. Place the main chart on the left or in the middle; on the right, use light-filled boxes, red boxes, or short bullets to flag conclusions; red strokes, arrows, labels, or contrasting data points may be used for emphasis. If the chart itself is already crowded, move the explanatory text to the bottom or split the page. + +5. **Table/matrix page**: suited to financial models, comparable companies, deal structures, due diligence checklists, and earnings bridges. The body is a large table or several small tables; purple headers establish the primary grouping, and light-gray fills serve secondary headers or summary rows. Use only for information that naturally has row-column dimensions; do not force narrative text into tables. + +6. **Flow/structure diagram page**: suited to deal structures, financing paths, organizational relationships, or value-creation paths. Use rectangular boxes, thin-line arrows, and small amounts of color to distinguish stages or parties. Arrows represent real processes or capital/information flows and must not be used as decorative motion lines. Complex structure diagrams keep legends and footnote explanations. + +7. **Evidence image / name-text mixed page**: a small number of maps, office locations, people, customer name text lists, or business screenshots may be placed. Images must be constrained by borders, titles, and captions, and are usually smaller in area than the chart/table body; they are not emotional backgrounds or full-page visual protagonists. + +## 5. Color System + +- **Background: #FFFFFF**. The absolute main background of all content pages, summary pages, and table pages. Cannot be replaced with a dark background; if modules need distinction, use light-gray fills rather than recoloring the whole page. +- **Main text: #333333–#4A4A4A**. Used for body text, table content, and chart labels; may be slightly darkened per output device, but should not use pure black, which feels too oppressive. +- **Title/structure purple: #470D59**. Used for content-page titles, section labels, module title bars, table headers, and key dividers, at small-to-medium areas; should not carpet entire pages. May be replaced with a dark brand color, but must keep high contrast and a financial-institution seriousness. +- **Cover/business deep blue: #0020AC / #0126AE**. Used for the cover's abstract linework, some classification colors, column chart series, and emphasis blocks; may serve as a section color or main chart-series color, but its area on content pages should stay below the white and gray backgrounds. +- **Auxiliary blue: #3E58B5 / #7B8DC7**. Used for secondary chart series, stacked columns, labels, and light-toned categories; must not compete with purple for the title role. +- **Teal/blue-green: approximately #00A6B2–#20B8C6**. Used for business categories, process stages, chart series, and some module color bars; may be replaced with a brand auxiliary color, but must stay distinguishable from purple and deep blue. +- **Light-gray backgrounds/table fills: #F2F2F3, #F6F7F7, #E8EAEB**. Used for table shading, module backgrounds, chart plot areas, and light zoning; may occupy large areas. Cannot be replaced with high-saturation colors. +- **Divider/grid gray: #C8CACE, #D0D4D7, #BBBBBB**. Used for table lines, axes, module borders, and dividers; should be thin, light, and low-presence — avoid thick black lines. +- **Emphasis/risk red: approximately #B00020–#C00000**. Used for the cover confidentiality note, negative alerts, sensitive assumptions, and red-box annotations; small areas only, not a regular series color. + +Keep a single page's main hues to purple + blue/teal + gray, with red for warnings only. Chart series colors keep a consistent dictionary on the same page; avoid the same color meaning different businesses or states. + +## 6. Fonts and Text Hierarchy + +Fonts are dominated by QuattrocentoSans (Chinese: MiSans). Cover and large titles use Regular at large sizes, body and tables use Regular, key words and table headers use Bold, and conclusion lines and disclaimers use Italic. Do not introduce serif fonts, handwriting fonts, or strongly individual Chinese fonts. + +With body text = 1x: cover main title approx. 3–4x; content-page main title approx. 2–2.8x; page information line approx. 1.1–1.3x and mostly italic; module titles approx. 1–1.2x, often set inside color bars; body bullets at 1x; table content and chart labels approx. 0.75–0.9x; notes, sources, and page numbers approx. 0.45–0.65x. Disclaimer-page body text may be below normal body size, but must remain readable. + +Text is predominantly left-aligned. Numbers in tables are right-aligned or aligned by decimal place; years, categories, and metric names may be centered or left-aligned. Large stretches of centered copy do not belong to this style; outside of parts of the cover, it is not used. + +## 7. Chart Language + +Real charts are mainly stacked columns, grouped columns, line charts, box plots/distribution charts, scatter/bubble charts, bridge charts, area/composition charts, and benchmark comparison charts. Charts are embedded in module frames, with a short title or purple title bar above, and data sources and measurement bases noted at the bottom. + +Axes and gridlines use light-gray thin lines; avoid thick black axes. Legends sit above, below, or to the right of the chart, using small-type text with series color swatches. Column chart series are led by deep blue, light blue, teal, gray, and purple; the stacking order stays stable. Line charts may place multiple lines in parallel, but color, line style, and end labels should reduce reading cost. + +Key data uses red stroke boxes, red annotation boxes, arrows, small labels, or dark data labels. Forecasts, targets, and baselines use dashed lines, light-colored lines, or separate labels, and must not be confused with actual data. Chart beautification must not sacrifice numerical clarity: avoid 3D, gradient columns, shadows, exaggerated rounded corners, and meaningless icons. + +## 8. Tables and High-Density Information + +Headers use a deep-purple background with white text or a light-gray background with dark text; first-level grouping uses purple horizontal bars, second-level grouping uses light-gray fills. Row-column dividers are thin and light; table row height is compact, but text must not overlap itself. + +Number columns are right-aligned or aligned by decimal place; text columns are left-aligned; years, stages, and rating symbols may be centered. Important columns, summary rows, key assumptions, or output results may be emphasized with light-gray fills, purple text, bold, or borders. Negative values, risk items, or differences needing attention may use red, but the whole table must not turn red over large areas. + +Zebra striping is not mandatory; with many rows, extremely light gray alternating backgrounds may be used. Matrix-type pages may use dots, checkmarks, rating symbols, color blocks, and short labels, but every symbol must have a legend or be intuitively understandable. Tables carry the "evidence and model" role and must not be used as pure layout decoration. + +## 9. Components and Graphic Elements + +- **Title bar / section label**: a small rectangular label at the upper left, often carrying a number, section name, and a purple/blue/teal border or fill. Its function is to locate the deck's structure; do not move it freely from page to page. +- **Module title bar**: a deep-purple or section-color horizontal bar with white or dark text; compact bar height, width matching the module. +- **Card/boxed modules**: white or light-gray backgrounds with thin gray borders, used for charts, explanations, maps, and process nodes. Rounding is imperceptible or absent; no drop shadows to create a card feel. +- **Annotation/flag boxes**: red or purple thin borders with a short sentence explaining an anomaly, assumption, or risk. Only for locally high-value information; do not box every conclusion. +- **Flow arrows**: thin-line arrows connecting rectangular nodes, indicating real sequence, causality, capital flow, or organizational relationships; colors follow the section color or gray. Avoid thick decorative arrows. +- **Image frames and name grids**: images need boundaries, titles, and captions; customer, partner, or comparable-company names are arranged as plain-text small-type grids (or replaced with neutral placeholder blocks) as evidence — no graphic logos are drawn. Colorful icons as decorative selling points are forbidden. +- **Dividers**: light-gray thin lines for tables, the upper edge of footnotes, and module separation. Thick purple lines are used only in table headers or module titles. + +## 10. Texture and Prohibited Items + +Overall flat, restrained, institutional, high-density; almost no reliance on photos, illustrations, textures, light effects, or dimensional effects. Brand feel comes from purple structural bars, the blue cover line art, the fonts, and the footnote system. + +Prohibited: large-area image backgrounds, 3D charts, glows, complex gradients, heavy shadows, emoji, cartoon illustrations, decorative colorful icons, large stretches of centered copy, data charts without sources, low-contrast light text, and information-irrelevant background textures. + +Use with caution: photos, screenshots, maps, portraits, customer name text, red annotations, rounded cards. They must appear as evidence or explanatory tools, with area and quantity controlled. + +Special pages allowed: the cover may use large-area blue abstract linework and more whitespace; the disclaimer may use extremely high-density single-column legal text; appendix/model pages may use denser tables, but must still keep the title, sources, and page number. + +## 11. Generation Checklist + +- Is it 16:9, white background, narrow margins, high content utilization, with the top title area and bottom footnote/page-number area preserved? +- Is the title an analytical topic, with one clear italic conclusion line or page thesis under it? +- Is purple used only for titles, sections, headers, and structural emphasis, with blue/teal/gray used stably by category or data series? +- Do the page's points revolve around one main question, with clear grouping logic between modules? +- Do charts have titles, legends, axes/labels, sources, and measurement bases, without 3D, gradients, shadows, or other decoration? +- Are tables row-column aligned, with clear headers, light dividers, and restrained emphasis on key rows and columns? +- Do components carry information functions: labels for positioning, color bars for grouping, frames for aggregation, arrows for flows, red boxes for risk alerts? +- Are photo backgrounds, emoji, illustrative icons, complex textures, glare, and meaningless large color blocks avoided? +- Have you checked for overflow, truncation, garbled text, overlap, low contrast, occlusion, empty modules, missing page numbers, wrong proportions, and missing sources? +- Do template variations serve the information structure rather than making pages merely look different? +- No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions. +- No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion. diff --git a/skills/open-kimi-ppt/reference/design_system/02_business/03/en/xuan-paper-annual.md b/skills/open-kimi-ppt/reference/design_system/02_business/03/en/xuan-paper-annual.md new file mode 100644 index 0000000..d8172fd --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/02_business/03/en/xuan-paper-annual.md @@ -0,0 +1,179 @@ +# Organization Name — Report Name 2025 STYLE DESIGN SYSTEM + +## 1. Style Positioning + +An editorial annual-research-publication PPT style: warm rice-white paper, ultra-heavy black opinion headlines, section-color fluorescent highlighting, dense data charts, and a stable footer. Suited to industry annual reports, investment research, technology trends, market landscapes, and policy/ecosystem analysis. Every page gives the judgment first, then the evidence. + +Fixed characteristics: 16:9 landscape canvas; the body mostly uses a #F2EFE6-like warm-white background; a small section label at the upper left; a strong opinion headline at the top; keywords backed by section-color rectangles; the body uses charts, tables, timelines, cards, or case grids; the bottom carries a fixed brand wordmark, source, and copyright. Section dividers use dark/high-saturation backgrounds with pixel blocks, while content pages stay restrained. + +1. **Opinion first, evidence right behind.** Every page must have a judgment title that stands on its own; charts/tables/modules exist only to prove the judgment; no slogan pages without evidence. +2. **High density comes from structure, not piled-up text.** Use columns, tables, cards, legends, notes, and footnotes to layer information, clearly separating the title area, the body area, and the footer area. +3. **Color carries information roles.** Warm white, black, and gray handle reading; section colors handle recognition and emphasis; chart series colors distinguish data. Brand colors must not sacrifice the readability of axes, labels, and body text. + +## 2. Page Skeleton + +**Canvas and margins**: standard widescreen 16:9. Content pages use stable, fairly narrow left, right, and top safety margins, with a footer band reserved at the bottom; the body spreads horizontally, avoiding centered narrow-column long text. + +**Default content-page skeleton**: +- A small section label at the upper left: a small color block/short bar or small heading + an uppercase section name. +- The upper-left title area occupies about 15%–25% of the page height; the ultra-heavy black judgment sentence may wrap, and keywords may be highlighted with semi-transparent section-color rectangles. +- Below the title is the body area, carrying charts, tables, matrices, left-right columns, or case modules. +- The footer spans the bottom: brand wordmark at the lower left, Source/Sources at the lower center-left, copyright at the lower right. +- Reading path: upper-left section label → big-title judgment → highlighted keywords → body evidence → legend/annotations → source and copyright. + +**Cover**: warm-white background with horizontal green pixel blocks across the middle; an oversized black title stacked and centered, with `of` in italic serif; the year centered below. A few light-blue/purple semi-transparent squares may be overlaid. No photos, no textures, no complex backgrounds. + +**Disclosure/statement page**: a full-page high-saturation green background; a small periodical name at the upper left and an oversized black title; multiple small-type long-text paragraphs cover the lower-middle area. Only for legal disclosure — do not migrate to ordinary content pages. + +**Table of contents page**: warm-white background; a large CONTENTS title and green pixel blocks on the left; the right side holds the section list made of numbers, section names, thin rules, and small section-color blocks at the ends. No thumbnail-style table of contents. + +**Section dividers**: solid backgrounds in deep blue, purple, green, etc.; the left or middle holds the section number and a large title; pixel blocks may sit at the upper right or in a corner; no complex data. + +**Watermark/background graphics**: except for the pixel blocks on the cover, table of contents, and section dividers, content pages use no watermarks or large background graphics. + +## 3. Content Organization + +**Title writing**: use complete opinion sentences, not noun labels, such as "a certain trend is growing/converging/dominating." Keep to two or three lines, highlight only one key phrase or word, and avoid coloring the whole sentence. + +**Information lines and body text**: use short paragraphs or small notes, placed beside or below charts or inside cards; they state the measurement basis, sample scope, exceptions, or what the conclusion means. Avoid large stretches of centered copy. + +**Grouping logic**: trend charts explain change over time, stacked charts explain composition, tables explain comparison, cards explain cases, and timelines explain stages. Multi-module pages use equal-width columns, equal-height cards, or unified table frames. + +**Number of points per page**: one main judgment per page, with 2–4 subordinate supporting points; do not place multiple unrelated conclusions in parallel. + +**Body density**: high density is allowed, but text blocks must be short, and chart labels and sources must be kept. Beyond one main chart, prefer left-right columns or two stacked evidence areas. + +**Bullet writing**: use traditional dot lists sparingly; prefer chart side-notes, card titles, table column headers, legends, and labels. Emphasize keywords with bold, color-block backing, or locally colored text — no underlines or fancy markers. + +**Numbers/units/time bases**: numbers stay close to charts or cards; units, time ranges, and estimation bases go into the subtitle, axes, or footnotes. Estimated ranges may use high-visibility colored text or leader lines. + +**Source footnotes**: every data page must have Source/Sources at the bottom; local chart annotations cannot replace the footer source. + +## 4. Content Page Layout System + +**A. Single large chart + right explanation column** +The left/middle holds a large line, area, stacked-area, or column chart; the right narrow column holds a bold conclusion, key numbers, or legend explanations. Use title highlighting, in-chart annotation points, end labels, or a colored explanation box on the right for emphasis. Not suited to comparing multiple charts with different measurement bases. + +**B. Top opinion + full-width chart** +Title on top, chart spanning the full body width, with clear axes and gridlines. Suited to time series, market share, and long-term change; do not overlay too many cards on the chart. + +**C. Left-text-right-chart / left-chart-right-text two columns** +Used for "judgment + evidence + explanation." The text column holds short paragraphs, key numbers, and source supplements; the chart column is the main evidence, and the ratio may favor the chart. The text column must not turn into a long article — at most a few key notes. + +**D. High-density side-by-side modules/card grid** +Used for cases, companies, process chains or linkages, products, or metric comparisons. Cards are uniform in size, separated by light fills or thin lines; titles are bold black, interiors hold small images, numbers, or short notes; section-color small labels or card background colors may provide emphasis. If every card needs a long explanation, split the page. + +**E. Table/matrix-type page** +Used for multi-entity, multi-metric comparison. Clear headers, thin lines and light fills distinguishing rows and columns; key columns may use section color, dark fills, or icon dots. The table is the evidence protagonist and does not compete with a large chart for the same page. + +**F. Semi-circle/gauge-style estimation chart** +Used to express range estimates, hierarchical relationships, and nesting from a large population down to a smaller active group. Must pair with numeric labels and leader lines on the left; not suited to precise trend comparison. + +**G. Chart + case note card** +Place a specific project/case beside a trend chart. Case cards have light or white backgrounds with slightly rounded/near-rectangular corners, containing the project text name/product image, a short paragraph, and 2–3 key metrics. Case cards are auxiliary evidence and must not overshadow the main chart. + +## 5. Color System + +**Background — warm rice-white #F2EFE6 / #F5F2E9**: used for page bases, light table fills, and chart backgrounds. Cannot be replaced with pure white or cool gray unless the source image/embedded chart requires it. + +**Main text — near-black #111111 / #1A1A1A**: used for titles, body text, key axis text, and the footer brand wordmark. Main titles must not be replaced with light gray. + +**Auxiliary text/lines — gray #83817D / #9B9D9D / #C5C0BA**: used for footnotes, sources, gridlines, table separators, and secondary labels; does not carry main conclusions. + +**Brand/section green — #52DA92 / #79D497**: used for cover pixel blocks, the disclosure-page background, table-of-contents pixel blocks, section colors, and title keyword highlighting. Large-area use is limited to the cover, table of contents, disclosure, or section pages; on content pages it serves only as small-area highlights, labels, and chart series. + +**Deep blue/section dark tones — approximately #342B56 / #39374F / #0B2D3A**: used for section-divider backgrounds, dark chart series, and emphasis blocks. Dark backgrounds use white or bright-colored text; use large areas cautiously on content pages. + +**Blue series — #2351EC / #4168C5 / #A4C9FE**: used for chart series, range fills, section colors, and emphasis labels. Light blue may fill large graphic areas; deep blue is used for lines and key series. + +**Orange series — #F6A031 / #F6931C / #F9961F**: used for important chart series, labels, positive growth, or one asset/category identifier. Should not appear alongside too many other high-saturation colors on one page. + +**Purple/magenta series — approximately #DB76ED / #9D8C7F / #7B3FF2**: used for section dividers, chart series, and label cards; pairs well in contrast with orange/blue, with area controlled on content pages. + +**Green chart series — approximately #70AF87 / #2FBF72**: used for area charts, growth trends, and status emphasis. Brand green is for sections/highlighting; data green is for series. + +**Per-page color boundary**: content pages are limited to 1 section color + 2–4 data series colors. High-saturation colors are only for data distinction, not casual decoration. No strong system of positive/negative status colors; when expressing rises and falls, prefer legend text explanations and avoid adopting the red-green finance convention. + +## 6. Fonts and Text Hierarchy + +A strong sans-serif publishing system: titles in Archivo Black (via customFonts; Chinese titles in MiSans Bold), extremely bold, compact, and black; body and footnotes in Liter (Chinese: MiSans); `of` on the cover in Oranienbaum italic. + +- **Main title**: approx. 2.5–4x body text, ultra-heavy, tight leading, mainly left-aligned; the cover may be larger. +- **Section-divider title/number**: may exceed 4x body text, bold black or white. +- **Small section label**: approx. 0.7–0.9x body text, all caps or short phrase, often with a small color block. +- **Body explanation**: body = 1x, black or dark-gray short paragraphs with relaxed line spacing; avoid long dense columns. +- **Chart title/subtitle**: approx. 0.9–1.2x body text, bold or semi-bold, placed above the chart. +- **Table text/legend labels**: approx. 0.75–0.95x body text; numbers may be semi-bold. +- **Notes/sources/footer**: approx. 0.55–0.7x body text, gray or low-weight black; must remain readable. +- **Page numbers**: not a prominent navigation device; if added, they should be subdued and folded into the footer — they must not become a visual focus. + +## 7. Chart Language + +Main chart types: stacked area charts, line charts, column charts, combined column-line charts, semi-circular nested/gauge-style estimation charts, small time series, and comparison charts. + +**Axes and grids**: thin, gray axes; light, regular gridlines; warm-white or light backgrounds. Axis labels are small and clear; time axes usually run horizontally. + +**Legends and labels**: legends sit at the chart's inner edge or beside the chart, using color blocks/line samples + category names. Key data is labeled directly on the chart or in the right explanation column. + +**Series colors**: use high-distinction colors such as orange, blue, purple, green, and light blue. Stacked area charts must keep boundaries discernible; emphasis lines in line charts may be thicker or more saturated. + +**Emphasis annotations**: use section-color highlighting, horizontal baselines, explanation boxes, key-number labels, or local colored cards; annotations stay close to the relevant data points and do not float as decoration. + +**Forecast/target/baseline lines**: new forecasts use dashed lines/light-shaded ranges and are explained in the legend; do not confuse them with solid historical lines. + +**Boundaries**: no 3D charts, perspective charts, glowing charts, or overly skeuomorphic gauges. Axes and sources must not be omitted. + +## 8. Tables and High-Density Information + +Tables are used for professional evidence and multi-entity comparison. Headers use bold text, light fills, or a top separator line; rows and columns are divided by thin gray lines; fills are warm white, light rice, or light gray; key cells may use section color or dark blocks. + +**Row and column rules**: compact row height without crowding; long text left-aligned, numbers right-aligned or visually aligned by decimal point/unit; column titles kept short; multi-column metrics keep unified units and time bases. + +**Emphasis treatment**: use highlighted columns, colored labels, bold numbers, dark summary rows, or small dot markers. Highlighting is only for key comparisons — do not pattern the whole table. + +**Zebra striping and separation**: prefer thin lines and light-fill zoning; if zebra striping is used, it must be very light. Avoid heavy borders. + +**High-density modules**: side-by-side cards, metric blocks, case grids, and tables must all have unified sizes, title levels, and spacing; each module holds only the necessary numbers, notes, and legends. + +## 9. Components and Graphic Elements + +**Pixel blocks**: made of stepped rectangular blocks, commonly used on the cover, table of contents, and section dividers, and sparingly for navigation. Large-area use is limited to structural pages; on content pages, do not repeatedly carpet pixel blocks as background ornament. + +**Section labels**: a small color block + uppercase section name, fixed at the upper left for section positioning. + +**Title highlight bars**: semi-transparent or solid rectangles laid behind keywords, with straight edges like a highlighter pen. Highlight keywords or phrases only; never highlight entire body paragraphs. + +**Cards/callout boxes**: used for cases, legend explanations, key numbers, and category notes. Rectangular or slightly rounded corners; fill may be orange, purple, dark, or light, with high-contrast text; placed near the corresponding chart. + +**Dividers**: thin gray lines for the table of contents, tables, chart grids, and module boundaries. Lines are restrained and straight; no decorative curves. + +**Icons/identity marks**: used only sparingly as small category icons; brand/project identifiers are presented as plain small text (write the new topic name) — no graphic logos are drawn. Colorful icons are not a global language; they may only be used in case cards, legends, or project text identifiers. + +**Flow arrows/matrix markers**: used for flow or stage explanations; keep them flat, thin-lined, and few-colored; do not build complex flowcharts. + +**Image frames**: a small number of product/device images placed inside cards or beside charts, auxiliary only — never full-page backgrounds. + +## 10. Texture and Prohibited Items + +Overall flat, publication-grade, restrained, high-density, with strong brand-color accents; recognition comes from type weight, the warm rice-white paper, pixel blocks, and section colors — not from photo spreads or dimensional textures. + +**Prohibited**: large-area photography backgrounds, complex illustration backgrounds, emoji, 3D charts, glow effects, glassmorphism, strong drop shadows, complex textures, lace ornament, casual gradients, large stretches of centered copy, unsourced data charts, low-contrast light text, and pure-image pages with no title judgment. + +**Use with caution**: colorful icons, product screenshots, rounded cards, full-page dark backgrounds, gradient fills, strongly saturated multi-color charts. They must serve an information function and be confined to case/chart/section-page scope. + +**Special pages allowed**: full-page high-saturation green for disclosure; full-page deep blue/purple/green backgrounds for section dividers; large-area pixel blocks on the cover and table of contents; a small number of physical/product images on case pages. Ordinary content pages still center on warm-white backgrounds and data evidence. + +## 11. Generation Checklist + +- Skeleton: is it 16:9; does it keep the upper-left section label, the top opinion title, the body evidence area, and the bottom brand wordmark/source/copyright? +- Copy: is the title a complete judgment sentence; is there one main point per page; is keyword highlighting restrained? +- Hierarchy: do the title, chart titles, body text, notes, and footer have clear relative size differences; page numbers are not used as primary navigation. +- Color: is the background warm rice-white; are section colors used only for recognition/emphasis; are there too many high-saturation colors on one page; is text contrast sufficient? +- Layout: are charts, tables, and cards aligned; are margins stable; is the footer not squeezed by the body? +- Charts: do they have axes, legends, units, time ranges, and sources; are emphasis annotations close to the data; no 3D/glow/meaningless decoration used? +- Tables: are headers, dividers, number alignment, and unit bases clear; is highlighting used only for key rows and columns? +- Components: are pixel blocks used only on the cover/table of contents/section dividers or for sparse navigation; do cards serve explanation; do icons have real-object meaning? +- Prohibited items: no large image backgrounds, emoji, complex illustrations, heavy shadows, glassmorphism, excessive gradients, or large stretches of centered copy. +- Quality: check overflow, truncation, garbled text, overlap, low contrast, occlusion, empty content, wrong proportions, and mechanical template repetition. +- No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions. +- No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion. diff --git a/skills/open-kimi-ppt/reference/design_system/02_business/04/en/lead-gray-quarterly.md b/skills/open-kimi-ppt/reference/design_system/02_business/04/en/lead-gray-quarterly.md new file mode 100644 index 0000000..5f0b6e1 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/02_business/04/en/lead-gray-quarterly.md @@ -0,0 +1,192 @@ +# Design System: Consumer Trend Monitor · Landscape Presentation Edition + +> Reverse-engineered from: the real visual evidence of a 36-page portrait (US Letter 612×792) investment-monitoring quarterly (cover + page-by-page images of all 35 pages). +> This system keeps only its **visual methodology** — newspaper-style grids, serif headlines mixed with data charts, a teal/amber/crimson chart language, and paper-beige footers — +> it does not copy any third-party logo, brand name, trademark, or source text; per the task requirements, the portrait report grammar is converted into a 16:9 landscape presentation system. +> Any value that cannot be confirmed precisely from pixel evidence is marked "approximate." + +--- + +## 1. Visual DNA (One Sentence) + +**A financial-newspaper-style data-monitoring report**: a restrained black-on-white layout + large serif headlines + dense column-line combination charts + a deep-sea-blue cover and beige footers; the overall temperament is a "trustworthy industry dashboard," not a marketing poster. + +Four executable principles: +1. **Conclusions spoken in italic serif, evidence given by charts** — every information block is a pairing of "italic serif conclusion sentence + chart/body text." +2. **Charts are the protagonists**: page area goes to charts first; text is the charts' annotation. +3. **Color only encodes, never decorates**: teal = primary series, dark teal = secondary series, amber/yellow = comparison lines, crimson = warning or second theme, beige appears only in the footer and separator bands. +4. **Dense but not crowded**: small type, multiple columns, tight leading — but with clear whitespace between modules. + +--- + +## 2. Canvas and Grid (16:9 Landscape Conversion) + +| Item | Value | Note | +|---|---|---| +| Canvas | 960 × 540 px | 16:9 presentation standard | +| Left/right margins | 44 px | Source portrait margins ≈ 7% of page width, carried into landscape (approximate) | +| Content area | y = 20 ~ 508 | Above the beige footer band | +| Footer band | y = 512 ~ 540 (28 high) | Beige horizontal band, see §9 | +| Column system | 12-column mental grid, commonly split into 2 / 3 columns; gutter 24 px | Source body uses a fixed 3 narrow-column layout | +| Baseline rhythm | multiples of 4 px | All spacing takes multiples of 4 (approximate) | + +Portrait → landscape conversion rules: +- Source "full-page large image + three-column body below" → landscape becomes "left 60% chart + right 40% text column" or "chart on top, text below, chart spanning the full width." +- Source 2×2 chart-matrix pages (vertically arranged) → landscape becomes a natural 2×2 grid — a native fit. +- The source's only landscape page (regional map + stacked bars on both sides) proves this system supports landscape; align density to that page. + +--- + +## 3. Font Hierarchy + +Map Chinese fonts as follows (font names must exactly match the library): + +| Role | Font | Size / style | Usage | Evidence | +|---|---|---|---|---| +| Display serif | `{latin: Oranienbaum, ea: 思源宋体}`, bold | cover 40~48 / page title 26~28 | Cover main title, each page's large headline | Source titles are Georgia-type bold serif (approximate mapping) | +| Conclusion line / chart title | same as above, italic + bold | 14~15 | Each page's conclusion line, each chart's italic title | Source chart titles are italic serif (approximate) | +| Sans-serif body (Sans) | `MiSans` | 10~10.5, line height 1.45~1.5 | Multi-column body, legends, axis labels | Source body ≈ 9px sans-serif in three columns (approximate) | +| Eyebrow | `MiSans`, letterSpacing 2~3 | 9~10, all-caps feel replaced with bold | Column identifier above the page title | Source "DEALS BY SECTOR"-style small-type eyebrows | +| Data labels | `MiSans` bold | 9~10 | Values inside columns / on lines | Source white bold values inside columns | +| Big numbers (Stat) | display serif bold or MiSans bold | 28~36 | Key metric cards | Source back-cover and inner-page big-number treatment (approximate) | +| Footer / source note | `MiSans` | 8~9, gray | Footer-band text, under-chart source notes | Source footer's small uppercase gray type | + +Rules: +- Within one page, serif is used only for "titles + conclusion lines + chart titles"; body text and chart annotations are always sans-serif. +- No fonts beyond the two families above; no calligraphic/handwritten faces. + +--- + +## 4. Color Tokens (Hex; all are pixel-sampled approximations) + +| Token | HEX | Role | Sampling basis | +|---|---|---|---| +| `ink` deep sea blue | `#06223F` | Cover/section-page base, table headers, darkest chart series, emphasis text | Cover base #051C38, header #2C4057, darkest map state #001830 | +| `ink-soft` | `#14324F` | Deep-blue auxiliary (cards, secondary headers) | approximate | +| `teal` | `#2FBFC4` | Primary-series column color, main line, emphasis icons | Main-chart columns #30C0C0~#3CC0C0 | +| `teal-dark` dark teal | `#1B6E72` | Secondary-series columns, second stacked segment | Dark-teal columns #186C6C~#246C78 | +| `teal-pale` light teal | `#BFE5E6` | Lightest stacked segment, light area-chart layer, chart background blocks | Light-teal segment #C0E4E4 | +| `amber` | `#D9A62E` | Comparison line (the "line" in column-line combos), growth-rate annotations | Gold line #CCA80C~#E4C09C | +| `yellow` bright yellow | `#DCC83C` | Single-series yellow columns (industry-page primary color), stacked segments | Yellow columns #D6D470~#CCA80C | +| `orange` | `#E5862E` | Third-theme column color, stacked segments | Orange columns #E48430 | +| `crimson` | `#76101A` | Warning / second-theme column color, dark stacked segments | Deep-red columns #6C0000~#780C0C | +| `salmon` | `#F0A89A` | Middle stacked segment (between crimson and light teal) | Pink-segment sample #FEF1EE brightened estimate (approximate) | +| `slate` slate blue | `#5E84A0` | Map/chart mid-tones, auxiliary lines | Mid-tone map state #60849C | +| `paper` paper white | `#FFFFFF` | Content-page base | — | +| `beige` | `#EDE7D6` | Footer band, horizontal separator bands, note-box fills | Footer band #EFEBDE | +| `beige-line` | `#D8D2C2` | Top edge of beige band, thin table lines | Band edge #D2D1C9 | +| `text` body ink | `#262626` | Body text | approximate | +| `muted` gray | `#8A8A8A` | Axis labels, legends, source notes, footer text | approximate | +| `grid` grid gray | `#E7E7E7` | Table outer frames, thin dividers | approximate | + +Contrast floor: on `ink`, only white/light-teal text; data labels on deep `teal`/`crimson`/`orange` columns are white or placed above the column in dark gray; on the beige band, only text at `#6B6B6B` depth or darker. + +--- + +## 5. Page Skeleton (Common to Content Pages) + +``` +┌─────────────────────────────────────────────────────────────────────┐ +│ ▪ wordmark "Specialty Coffee Consumption Monitor" │ ← header row y≈20~44 +│ version at right: 2026 Annual Insights · sample setting │ +│ │ +│ Eyebrow (9px, wide letter spacing, gray) │ ← y≈56 +│ Serif display headline 26~28px │ ← y≈74~104 +│ Italic serif conclusion line 14px (the page's only conclusion) │ ← directly under the title +│ │ +│ ┌────────────────── content area y≈130~486 ────────────────────────┐ │ +│ │ chart / multi-column body / table / cards (choose layout per §6) │ │ +│ └──────────────────────────────────────────────────────────────────┘ │ +│ page number (centered, 9px serif gray) │ ← y≈496 +│ ▔▔▔▔▔▔▔▔▔▔ beige footer band: report name centered 9px ▔▔▔▔▔▔▔▔▔▔ │ ← y≈512~540 +└─────────────────────────────────────────────────────────────────────┘ +``` + +- Header left wordmark: a solid teal small square (10×10) + the bold sans-serif report name; on the right, a small gray version identifier. **Any real brand logo is forbidden.** +- The page number is centered just above the beige band (source style); the footer band holds the centered full report name in small type. + +--- + +## 6. Reusable Layouts (8) + +1. **Cover (deep sea blue)**: full-bleed `ink` base + concentric thin arcs/thin-line signal pattern on the right (low-opacity blue-gray elliptical strokes, entirely within the canvas) + large serif headline (may mix italic and roman) + one line of version info + a bottom key-numbers band (3 stats, teal/white text). +2. **Conclusion page (cover variant)**: same skeleton as the cover, but the headline is the page's conclusion sentence, with 3~4 data stat bands below as evidence. +3. **Large chart + text column**: left 55~60% holds one column-line combination chart (with italic chart title + legend + source note); right 40% holds one body-text column + one stat card or small chart. +4. **Full-width chart + three-column body**: a full-width combo chart on top (occupying 45~50% of the height), three columns of 10px body text below, each column optionally opening with a bold lead-in sentence. +5. **2×2 chart matrix**: one small chart per quadrant, each with "italic serif chart title + small-type subtitle + chart + source note," with 24px whitespace between quadrants. +6. **Horizontal bars + right stat track**: left 60% a horizontal-bar ranking chart; right 40% a vertical stack of 2~3 stat cards (beige or light-teal fills, large serif numbers + small-type notes). +7. **Comparison paired columns + interpretation column**: left-of-center comparison chart with 2~4 large columns (values labeled above and outside the columns), one interpretation-text column on the right + one "x-fold difference" arrow annotation. +8. **Table page / card page**: a dark-teal-header white-text table (see §7) or 2~3 equal-width action cards (card = light-teal top bar + serif subtitle + sans-serif body + bottom data-anchor chip). + +--- + +## 7. Chart and Table Language + +### Charts in general +- Chart title: italic serif bold 14px `ink`, left-aligned; the line below is a 9px gray subtitle (metric basis). +- Axes: no y-axis gridlines (`gridLine: false`), no axis lines or only a thin `#E7E7E7` baseline; axis labels 9px `muted`; currency axes carry unit abbreviations. +- Legend: horizontal below the chart, small color swatches + 9px gray text. +- Source note: 8px gray text at the chart's lower right — "China Specialty Coffee Consumption Trend Monitor · sample data (internal estimates)." +- Value labels: 9~10px; column-series labels preferably white bold inside the column, or dark gray above the column when they do not fit (if the renderer does not support position control, place them uniformly above and outside, treated as an approximation of the source). +- Line-series labels sit above the endpoints, in `muted` gray. + +### Chart-type recipes (ordered by evidence frequency) +1. **Column-line combination (this system's signature chart)**: solid columns (one of `teal` / `crimson` / `orange` / `yellow`) + a contrasting thin line (`amber` or `teal`), dual axes; columns labeled with amounts, the line labeled with counts/ratios. +2. **Multi-line**: 4~5 thin lines of 1.5~2px, color order `ink`→`teal`→`amber`→`crimson`→`slate`, with endpoint values labeled directly at the right ends. +3. **100% stacked bars**: segment colors per theme from `teal`/`teal-pale`/`salmon`/`crimson` or `teal`/`teal-dark`/`ink`, with white % text inside segments. +4. **Horizontal-bar ranking**: single color family (`teal` or `ink`), values labeled at bar ends, category axis on the left. +5. **Layered area**: `ink`→`teal-dark`→`teal`→`yellow` bottom to top, used only for "stock accumulation" semantics. +6. **Comparison paired columns**: two same-family columns in dark and light, with a "x-fold difference" arrow and text between them. + +### Tables +- Header: `ink` background, white bold 9~10px text, left-aligned (numeric columns right-aligned). +- Data rows: white background, only a `#E7E7E7` 0.75~1px baseline between rows, no vertical lines, no zebra striping (source tables have no zebra striping). +- Row height 22~26px, cell padding 8px left and right. +- Tables also get a source note below. + +--- + +## 8. Image Cropping and Graphic Components + +- **Images**: only covers/section pages may use full-frame images, always `fit: cover` full-bleed cropping; portrait images in landscape take only the middle band (`crop: {top, bottom}` trimming 15~25% each); content pages use no photos — charts and graphic components substitute. Source portraits are right-column small squares (about 120×150) + a gray-text bio; use a same-spec placeholder only when genuinely needed. +- **Signal pattern (cover decoration)**: 3~4 concentric elliptical thin strokes (`slate`/`teal`, opacity 0.15~0.3), all bounds within the canvas; or one 2px teal "pulse" polyline. +- **Stat cards**: `teal-pale` or `beige` fill (no stroke, no shadow), large serif `ink` number + 9px gray note; on deep-blue pages switch to a transparent fill + teal big numbers. +- **Action cards**: white base + a 4px `teal` solid top bar + serif subtitle + 10px body + bottom data chip (`beige`-filled rounded small type). +- **Icons**: only Font Awesome free solid (`fas:`), single color `teal` or `ink`, 16~20px, no mixed styles. +- **Separation**: always a 1px `#E7E7E7` thin line or whitespace; no shadows, no gradient blocks (except the cover signal pattern). + +--- + +## 9. Density, Spacing, and Footers + +- Information density aligns with the source: 1 conclusion + 1~2 charts + no more than 3 columns of body text per page; body 10px, line height 1.45, paragraph spacing 6~8px. +- Module spacing: title area → content area 20~24px; chart-matrix quadrants 24px apart; cards 16~20px apart. +- Footer: a beige band (`beige`, 28px high) spans the full width, holding the centered 9px `muted` report name "China Specialty Coffee Consumption Trend Monitor · 2026"; the page number is 9px serif gray centered 6px above the band. +- The lower-right chart note on every page uses the unified §7 source-note phrasing. + +--- + +## 10. Do-Nots + +1. No third-party logos, brand names, sponsor marks, trademarks, or source-manuscript original text. +2. No pie/donut charts for share rankings (the source has no pie charts at all); shares always use 100% stacked bars or horizontal bars. +3. No shadows, gradient fill blocks, frosted glass, 3D charts, or animation-flavored chart decoration. +4. No cards with corner radius greater than 8px; chart columns stay right-angled. +5. No text pressed over images, and no chart elements bleeding outside the canvas (all bounds must stay within 960×540). +6. No large-area beige fill in body areas outside the beige footer band; beige is only a "band," never a "block." +7. No fabricated numbers: all values must come from the task query; qualitative judgments must be marked "internal judgment." +--- + +## 11. Pre-Delivery Checklist + +- [ ] Every page has one and only one explicit conclusion, presented as an italic serif sentence directly under the title. +- [ ] The 6 pages form a complete narrative: conclusion → market structure → consumer segmentation → channel and membership economics → opportunity map → action recommendations. +- [ ] Every number can be traced one-to-one to query.md; nothing fabricated, no external data. +- [ ] All colors come from the §4 tokens; chart coloring follows the §7 recipes; no gradients/shadows. +- [ ] Only two font families: serif `{Oranienbaum, 思源宋体}` and sans-serif `MiSans`; sizes follow §3. +- [ ] The header wordmark, beige footer band + page number, and under-chart source notes are present on every page at consistent positions. +- [ ] `kimi-ppt check` reports no errors; page-by-page screenshots show no overlap, no cropping, no overflow, no unexpected line wraps; dark-background white-text contrast passes. +- [ ] Final directory: `deck.pptx` (the only PPTX) + the complete PPTD bundle + `final-screenshots/pages/1.jpg~6.jpg`. + +- No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions. +- No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion. diff --git a/skills/open-kimi-ppt/reference/design_system/02_business/05/en/ink-green-market-trends.md b/skills/open-kimi-ppt/reference/design_system/02_business/05/en/ink-green-market-trends.md new file mode 100644 index 0000000..cdac101 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/02_business/05/en/ink-green-market-trends.md @@ -0,0 +1,163 @@ +# Organization Name — Q2 2025 Crypto Industry Report STYLE DESIGN SYSTEM + +## 1. Style Positioning + +A dark, data-driven PPT design system for quarterly crypto-industry research reports, aimed at professional readers fluent in metrics across markets, assets, trading volume, ETFs, DeFi, NFTs, and exchanges, supporting high-density data, longer explanatory text, and multi-series charts. The body adopts a dark research dashboard with Organization Name's green visual identity; the cover, section dividers, and product/closing pages use high-saturation green or purple frames, large rounded cards, and mascot illustrations. + +The whole deck is a 16:9 landscape canvas; content pages use a near-black background with white ultra-heavy sans-serif titles (Archivo Black, via customFonts), body and footnotes in Inter (via customFonts); the header holds a fixed small brand wordmark; the footer contains the report name, copyright, sources, and page numbers. Main content includes line, column, stacked-column, and area charts, timelines, tables, and text lists/avatar matrices; accent colors are fluorescent green, purple, pink, yellow, and other high-saturation colors. + +Underlying principles: + +1. **Data over decoration.** Pages prioritize charts, tables, numbers, and explanatory text; illustrations, borders, bright colors, and identity marks are used only for brand recognition, classification, emphasis, or section transitions. +2. **Body-skeleton consistency over layout showboating.** Ordinary data pages keep the black background, upper-left brand mark, white title, insight line on the right or above, and bottom sources and page numbers; large-area green/purple brand pages appear only at the cover, section dividers, product, or closing positions. +3. **Accent colors must carry semantics.** Fluorescent green is used for the brand, positive/growth values, key series, or button-like components; purple/pink for insight lines, section transitions, and special annotations; red only for negative change or risk-type data. If bright colors hinder reading values, prioritize the clarity of axes, labels, units, and legends. + +## 2. Page Skeleton + +The canvas is 16:9 landscape widescreen. Content-page backgrounds are pure black or near-black; covers/section/closing pages use a bright-green outer background, or a purple outer frame with a dark rounded inner card. Keep stable margins with no key data at the outer edges; high-density pages may approach full-bleed, but the header, title, and footer must keep their safety zones. + +**Cover page**: bright-green outer background with a large deep-green rounded card at the center, and a notch-style split or dual-card structure at the top. The upper left holds the identity mark — plain small text with the new topic name, or left blank; no graphic logo is drawn. The main title is huge, the year or keywords may be layered with a dark-green/light-green gradient feel, and the report name is in white/light green; the lower middle holds the Organization Name mascot illustration, a thin-line trend line, and halftone dots; the sponsor text list sits at the right or lower right, smaller in area than the main title and the mascot. + +**Table of contents page**: black background with a large "Content"-style title at the upper left; the body is a multi-column contents list, with level-one section titles larger and white, entries in small white/gray text, and page numbers right-aligned; author avatars, names, and titles may sit below. The contents page uses no large charts and little decoration. + +**Section dividers**: a bright-green or purple outer frame/background, with a large deep-green or deep-blue-black rounded card inside. The left holds the section name and a small label; the right or bottom holds the large Organization Name mascot and theme graphics. Section titles take the dominant level, with minimal information. + +**Content data pages**: a fixed small brand wordmark at the upper left, with the white page title below it or to its right; the title area occupies a compact horizontal band at the top. The insight line sits to the right of the title, at the page's upper right, or atop the explanation column, usually opening in purple and continuing in gray-white text. The body may use a single large chart, left-right columns, chart + explanation column, a timeline, a table, or a matrix. The bottom left holds the report name/copyright, Source sits below the chart or at the lower left, and the page number sits at the lower right. Reading path: brand and title → purple insight line/key information line → main chart or table → explanatory text/legend → source and page number. + +Dividers are used only for chart axes, table lines, card borders, and timeline rules — no heavy header rules are set. Content pages use no watermarks or large background graphics; backgrounds stay clean. + +## 3. Content Organization + +Titles are object-type or metric-type, such as "a certain asset's price and trading volume," "a certain market share," "notable events," or "exchange trading volume," responsible for topic positioning; conclusions are expressed by the insight line. Titles should be 1 line, 2 lines if necessary; avoid more than two lines, which compresses the chart area. + +Each page prioritizes one information line, located to the right of the title or atop the explanation column, structured as "key change/conclusion + data definitions and measurement basis/time range + cause or impact." Use purple to highlight the opening phrase or core number, with the rest in gray-white. Do not stack multiple conclusions into one paragraph; each page prioritizes one main judgment. + +The body uses short paragraphs and bullets, usually in the narrow column to the left or right of a chart; each paragraph explains one cause, data finding, or impact. Keep paragraphs broken and line lengths moderate; the text column in left-right layouts exists to explain the chart and does not become a long article on its own. + +Group by market category, asset class, time, platform, chain, exchange, or metric definition and basis. High-density pages use subtitles, labels, legends, colored series, and thin-line separation. A single page carries one core question; it may contain multiple data series, but must not discuss multiple unrelated topics at once. + +Numbers and units stay close to data labels or axes, retaining the relevant formats and units — percentages, dollars, multiples, dates, and quarters. Time axes remain continuous and readable; big numbers may be highlighted in the insight line or chart annotations. Source footnotes sit below charts or in the footer, in small gray-white text that does not compete with the main data. + +## 4. Content Page Layout System + +**A. Left explanation column + right large chart** +Suited to single-theme time series such as price, trading volume, index, and capital flows. The left column holds the title, insight line, 2–4 explanation paragraphs, and the source; the right large chart occupies most of the body width, complete with axes, legend, and data annotations. Emphasize with bright lines, peak labels, vertical annotation lines, or key-point text. Not suited to table-type content requiring extensive categorical comparison. + +**B. Top title-and-insight + full-width chart below** +Suited to horizontal time-axis charts such as multi-series lines, stacked columns, and market-share change. A compact title and one insight line sit on top; the main chart spans the page; the legend stays near the chart's top or right, and series colors keep high contrast. If there is too much explanation, switch to left-right columns to avoid compressing chart height. + +**C. Large chart + right annotation/sponsor/note column** +Suited to pages needing supplementary event background, such as IPOs, ETFs, and trading volume. The main chart sits on the left or in the middle; the right narrow column holds short notes, wordmarks, or secondary legends; the right column must not exceed the main chart in width. This layout is not suited to multiple long paragraphs or multiple unrelated wordmarks. + +**D. Timeline/event-band layout** +Suited to "Notable Events"-type content. Use multiple rows of horizontal date bars; date blocks distinguish periods or categories with high-saturation green, pink, purple, etc., with small-size event notes beneath; the title area is minimal. Do not add complex charts; event copy must be short — long explanations break the timeline rhythm. + +**E. Table/ranking/matrix page** +Suited to asset returns, stablecoins, exchanges, chain ecosystems, and team or platform comparisons. The body uses dark tables, ranking bars, text lists, or multi-column cards; a note column may sit on the left, and colored bars, dots, icons, or text color highlight positive/negative change inside the table. This layout suits high-density classification, not continuous trends. + +**F. Brand/product/section-style body variant** +Uses green or purple cards, buttons, screenshot-style interfaces, and the mascot for product promotion, section intros, or closing pages; lower information content than data pages. Must not be abused as a template for ordinary research pages. + +## 5. Color System + +**Background black / near-black #000000–#080808**: the main background of content pages, largest in area. Cannot be replaced with light colors; even if the new theme uses a brand color, keep body backgrounds dark. + +**Deep-green cards #183F2D / #1A412E**: the main base color of covers, section dividers, and brand cards, usually paired with bright-green outer frames. Brand pages may use it over large areas; ordinary content pages use only small amounts for labels or borders — it should not replace the black background over large areas. + +**Fluorescent green #A6F05F / #9EE45A / #4BCC00**: used for the cover outer base, section frames, identity marks, positive values, key data lines, button-like labels, and a few chart series. Area may be large on brand pages and small-to-medium on content pages. It may be replaced with a new brand primary color, but must keep dark-background high contrast and consistent "positive/key" semantics. + +**White #FFFFFF / light gray-white #DDE5E0**: used for titles, key labels, main axis text, and high-priority numbers. Cannot be replaced by low-contrast colors. + +**Gray-blue/gray-green text #8A9492 / #B9BCA6 / #808963**: used for body text, notes, secondary legend text, axis labels, sources, and footers; low brightness, but never so low as to be unreadable. + +**Purple #7A54FF / #6B4CFF**: used for section dividers, insight-line openings, key lines, labels, and brand variants, at small-to-medium areas; it does not represent positive/negative status by default. + +**Pink #F19EE2 / #F4A0E5**: used for event timelines, chart series, and emphasis blocks, at small areas, expressing categories. Avoid large simultaneous use with purple, which becomes garish. + +**Yellow #FAEB6A / #E7D84A**: used for column charts, key values, event or return-type series; not for long text passages. + +**Red/coral #FF5A6A / #BE827F**: used for negative returns, declines, risks, or negative values. For status/data only, never as decoration. + +Content pages keep their main hues to black-white-gray + 1 brand accent + 2–4 data series colors. Multi-series charts may add colors, but legends must stay clear; color serves classification/status only — no meaningless decoration. + +## 6. Fonts and Text Hierarchy + +Fonts are modern sans-serif: titles use Archivo Black (via customFonts); body is dominated by Inter (via customFonts), with weights handled through the bold field. Do not mix in serif or handwritten fonts; special sponsor/logo fonts exist only as images or marks. + +With body note text = 1x: + +- **Cover main title/year**: approx. 4–6x, bold or semi-bold, tight letter spacing allowed. +- **Section titles**: approx. 3–5x, white or light green, usually 1–2 lines. +- **Content-page titles**: approx. 2–3x, white, medium-bold to bold. +- **Insight line/information line**: approx. 1.4–2x, usually medium-bold, purple keywords + gray-white continuation. +- **Subtitles/group titles**: approx. 1.1–1.4x, medium-bold or semi-bold, white/light gray. +- **Body paragraphs and bullets**: 1x, regular weight, gray-white or gray-blue. +- **Table text/chart labels**: approx. 0.7–1x, compress per space, keeping numbers readable. +- **Footnotes, sources, footers, page numbers**: approx. 0.6–0.8x, gray, low-level but never absent. + +Numeric labels use the same fonts as body text, with increased weight or a different color; no ornamental numeral forms. Titles and body build hierarchy through size, weight, and color, without relying on shadows or strokes. + +## 7. Chart Language + +Core charts include line charts, column charts, stacked columns, area charts, dual-axis price/volume charts, horizontal-bar rankings, timelines, share/market-share charts, donut/pie mini-widgets, and tabular leaderboards. + +Charts use dark bases; axes and gridlines are low-brightness gray thin lines; no white-background chart boxes. Main data lines use high-contrast colors such as fluorescent green, yellow, purple, pink, and cyan; secondary series lower saturation or line width. Column charts use bright columns against the dark grid, and volume columns may combine with price lines. Multi-series stacked columns need clear legends, placed above the chart, to the right, or in empty chart areas. + +Key data uses peak/trough labels, vertical event lines, endpoint values, local text annotations, color brightening, and red for negative values. Annotations stay close to their points and should not form long passages. Forecasts, targets, or baselines use dashed/thin lines and explicit labels, distinguished from historical data; never let a forecast line blur into an actual line. + +Axes keep units and time bases — especially dollars, percentages, quarters, dates, and trading volume. Gridlines must be thin, dark, and few; no heavy borders. The page title states the chart's subject; the chart itself keeps only the necessary subtitle and legend, avoiding repetition. + +## 8. Tables and High-Density Information + +Tables are used for rankings, asset comparisons, exchange/chain/protocol metrics, returns, market share, and team/author information. They adopt a dark-base, high-density style: headers in white or light-gray medium-bold text, row-column dividers in low-brightness thin gray, and cells usually without obvious fills; when necessary, use dark gray/deep green for light zoning. + +Number columns are right-aligned or visually aligned by decimal point; text columns left-aligned; name columns may add small icons or circular token placeholder blocks. Positive/negative values are distinguished in green/red; rankings or strength may use horizontal bars, color-block lengths, heat colors, or small dots. Summary rows or key rows use brighter text, thin borders, or a light fill — but no heavy highlight fills. + +High-density side-by-side modules use cards, column groups, text lists, or small chart collections. Each module keeps a title, a key value, and one minimal explanation; modules are separated by alignment, spacing, and thin lines — no large shadows. Zebra striping is not a primary language; extremely low-contrast dark gray may be used cautiously, and where dividers suffice, no zebra striping is added. + +If a table exceeds what one screen can scan, split it into multiple pages or focus on the Top N — do not compress it into illegibility. + +## 9. Components and Graphic Elements + +**Brand wordmark header**: fixed at the upper left of content pages, small in size, white brand word + green "Research." Keep it on new pages; do not enlarge it into decoration. + +**Insight line component**: purple keyword/opening + gray-white explanation, located to the right of the title or atop the body column; at most one main insight per page — avoid multiple purple sentences competing. + +**Rounded brand cards**: covers, section pages, and product pages use large rounded deep-green/deep-blue cards with bright-green or purple outer frames. Content data pages do not by default frame all content in large cards. + +**Labels/badges**: used for section codes, asset symbols, button-like CTAs, or chart categories; outlined rounded rectangles or bright fills with short text. Cannot carry long sentences. + +**Thin dividers and axis lines**: low-brightness gray lines for tables, charts, and timelines; thin and restrained — no decorative thick lines. + +**Event timeline blocks**: horizontal date color blocks + event notes beneath, colored by date period or category. Suited to event lists, not numeric trends. + +**Text lists/avatar matrices**: used for contents-page authors, sponsors, exchanges, ecosystem projects, etc.; institution names are presented as text lists or neutral placeholder blocks, avatars may remain; unified sizes, alignment, and label text. Do not mix in colorful icon decoration; no graphic logos are drawn. + +**Mascot illustrations**: the Organization Name green/purple character is used on covers, section dividers, and closing pages. On ordinary data pages it may appear only on special brand/product pages, and must not cover charts. + +## 10. Texture and Prohibited Items + +Overall flat, dark, data-driven, and restrainedly branded; content pages rely on color contrast, type-size hierarchy, chart density, and alignment — not photography, complex textures, shadows, or 3D. + +**Prohibited**: on ordinary content pages, large-area photo backgrounds, complex gradient backgrounds, 3D graphics, glowing strokes, emoji, garish illustrations, decorative colorful icons, large stretches of centered copy, heavy shadows, low-contrast gray text, unsourced charts, unit-less numbers, or decorations covering axes. + +**Use with caution**: rounded cards, large-area bright-green bases, large purple blocks, text lists, avatars, screenshot-style interfaces, donut mini-charts, zebra-striped tables. They must serve an information function or a brand-node function — never added just to fill whitespace. + +**Special pages allowed**: covers, section dividers, product pages, and closing pages may use the mascot, large rounded cards, bright-green/purple outer frames, halftone dots, trend-line backgrounds, and sponsor text lists. Even on special pages, keep the title readable and never let brand elements overshadow the main information. + +Images/screenshots are not the core language of the body; if they must be used, place them within fixed boundaries with a title and a source — no fullscreen photographic storytelling. If gradients appear, they are limited to subtle treatment of the cover title or brand atmosphere, not a body-background system. + +## 11. Generation Checklist + +- Skeleton: is it 16:9; are content pages black-based; is there a small brand wordmark at the upper left; does the footer include the report name/copyright, sources, and page numbers? +- Copy: is the title a clear object/metric; is there only one main insight per page; is the body in short paragraphs or bullets; do numbers carry units, time ranges, and measurement bases? +- Hierarchy: are the title, insight line, body, chart labels, and footnotes separated by relative sizes and colors; is dependence on specific font sizes avoided? +- Color: does it stay at black-white-gray + fluorescent green/purple + necessary data colors; are positive/negative states clearly green/red; are there too many bright colors on one page? +- Layout: does the main chart/table occupy the largest area; does the explanation column assist the chart; is there meaningless whitespace or overcrowding? +- Charts: are axes, units, legends, gridlines, data labels, and emphasis annotations complete; are multi-series colors distinguishable; are forecasts/baselines marked? +- Tables: are headers, alignment, dividers, key rows/columns, and positive/negative colors consistent; is text readable; is over-compression avoided? +- Components: do rounded cards, labels, timelines, wordmarks, and the mascot appear only on appropriate pages; do they serve information rather than decoration? +- Prohibited items: no photo backgrounds, emoji, 3D, glow, heavy shadows, complex textures, meaningless icons, or large stretches of centered copy. +- Quality: check overflow, truncation, garbled text, overlap, low contrast, occlusion, empty content, wrong chart proportions, missing page numbers, missing sources, and mechanical template repetition. +- No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions. +- No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion. diff --git a/skills/open-kimi-ppt/reference/design_system/02_business/06/en/orange-tech.md b/skills/open-kimi-ppt/reference/design_system/02_business/06/en/orange-tech.md new file mode 100644 index 0000000..1da304b --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/02_business/06/en/orange-tech.md @@ -0,0 +1,172 @@ +# F001 · Tech-Style Orange Annual Report & Business Insight Plan Proposal PPT Template STYLE DESIGN SYSTEM + +## 1. Style Positioning + +Suited to formal business reports such as annual performance reviews, business insights, business retrospectives, strategic plan proposals, and investor/management updates. Aimed at readers with business and data backgrounds, it presents conclusions through large titles, key numbers, charts, tables, and short explanatory paragraphs. + +Information density is moderate and restrained: white-background content pages keep generous whitespace, usually holding only one main chart or structured module with short cards beside it; table pages and roadmap pages may be locally high-density, but avoid full-bleed packing. + +- White/light-gray content pages are used for data analysis; +- Orange is the only high-saturation primary accent, used for charts, key numbers, circular relationship diagrams, nodes, and light effects on black backgrounds; +- Black-background pages use orange gradient light bands, concentric-circle/arc wireframes, and minimal text, for covers, transitions, quotable lines, and closing pages. + +Underlying principles: +- **One page sets only one visual anchor.** A large title, a core percentage, a circular relationship diagram, a column chart, a donut, a table, or a quotation takes the lead — the rest is an explanation layer. +- **Brand orange serves information hierarchy, not decorative stacking.** It is used first for data series, key rows, nodes, keywords, and important numbers; large-area backgrounds use white, near-black, or light gray. +- **Structural clarity over information exhaustiveness.** Keep the conclusion, key metrics, and a few supporting points; complex details are split into separate pages or demoted to notes — do not fill the picture with body paragraphs and small labels. + +## 2. Page Skeleton + +The canvas is 16:9 landscape widescreen. It uses wide margins, low-noise backgrounds, and left-right columns; the common reading path is "upper-left title → center/left main visual → right explanation cards/numbers → bottom footnotes." The main body sits in the middle of the picture with clear whitespace on all sides, avoiding edge-hugging arrangements. + +### Cover/closing page skeleton +- A near-black full-page background, with an orange gradient light band at the bottom or at the top and bottom edges; locally overlaid dark rectangular frames, thin-line concentric circles, or arc textures. +- A small brand mark sits at the upper left; the main title is centered or nearly centered, may break into multiple lines, and may include slight type variations; the tagline and signature sit at the bottom or lower right, far smaller than the main title. +- A central dark transparent frame may carry the title, but must not form a heavy border. + +### Black-background section/quotable-line page skeleton +- Near-black background, orange glow, text centered or nearly centered, extremely low content volume. +- Low-contrast concentric-circle wireframes may form a focus, without competing with the text's level. +- Does not carry complex charts, tables, or dense small type. + +### Regular content page skeleton +- White or very light gray-white background; the upper left is the title area, with a short note allowed under the title. +- Charts or structural diagrams go on the left/in the middle; explanation cards, key numbers, or short paragraphs go on the right. +- Light-gray thin lines, table lines, and timeline lines serve organization only — they are not the decorative protagonists. +- Page numbers have no stable, prominent style and should not be force-generated; sources/footnotes use tiny gray text at the bottom or near the chart. + +### Table of contents/navigation and watermarks +The source file shows no strong table-of-contents page and no persistent header navigation; do not add progress bars, section navigation, page-number bars, or large watermarks by default. Section cues use black-background transition pages, not top navigation on every page. + +## 3. Content Organization + +Titles lean toward concise business phrases, usually noun groups of 2–3 words or short topic names, such as overview, financials, revenue breakdown, timeline, product performance, next steps, etc. The tone is calm — no exaggerated questions or marketing slogans; regular-page titles sit at the upper left, while section/quotable-line pages may be centered. + +Information comes in three layers: +- **Manifesto/quotation lines:** used for the opening after the cover, quotable lines, and closing pages; significantly larger than body text, may break into 2–4 lines, local italics allowed. +- **Short explanatory paragraphs:** under the title or beside the chart, explaining the page's purpose, the conclusion's background, or metric meanings. +- **Card key points:** in the right explanation area, usually 2–4 items, each a subtitle/keyword + one sentence of explanation. + +One page = 1 main conclusion + 2–4 supporting points. Lists should not exceed 4 items; timelines are most stable at Q1–Q4 or 3–4 stages; circular relationship diagrams center on 3 circles or 3 nodes. The body stays in short paragraphs, avoiding long stretches of centered layout. Keywords may be emphasized with orange text, small black capsule labels, bold sans-serif, orange numbers, or light-orange row fills. + +Percentages, currencies, quarters, years, and growth rates should stay near their corresponding figures or conclusions; main numbers are larger than body text, with units and notes smaller and adjacent. Sources, notes, and measurement bases use low-contrast gray text at the page bottom or near the chart, without breaking the main reading path. + +## 4. Content Page Layout System + +### A. Left title + center chart + right explanation cards +Suited to financial overviews, revenue composition, costs and profits, and market performance. The upper left holds the title and a short lead-in, the middle holds a column chart, donut, area chart, or horizontal bars, and the right holds 2–4 light-gray explanatory cards; the chart provides evidence and the cards explain causes, actions, or impacts. Use primary-orange graphics, small black labels, and orange numbers for emphasis. If data dimensions exceed 5 groups or explanations exceed 4 items, split the page. + +### B. Central circular relationship/capability model +Suited to non-precise comparison content such as company overviews, capability portfolios, team composition, and strategic relationships. The main body uses 3 semi-transparent orange circles intersecting, or a single glowing circular node, with text placed at the circle centers or near the intersections; the right may hold one large percentage and a short note. This layout emphasizes relationships and combinations, and is not suited to precise numeric rankings or complex process dependencies. + +### C. Timeline/milestone page +Suited to quarterly results, phase progression, and key-event reviews. The left holds the title and background notes; the body separates stages with thin light-gray lines; Q1–Q4 nodes use light-orange quarter markers and light-gray event cards. Keep a single-line narrative, left to right or top to bottom. Do not expand it into a multi-project Gantt chart, and do not place multiple paragraphs at every node. + +### D. Large chart + side-note explanation page +Suited to profit curves, trend changes, and ranking comparisons. The large chart occupies the left half or the central main area; side notes explain peaks, inflection points, growth rates, and management implications. Area charts use deep-to-light orange tiers, bar charts use orange bars sorted by length. Side notes stay short and must not outshine the chart. + +### E. Table comparison page +Suited to product performance, metric comparisons, and capability checklists. Title at the upper left; the table spreads center-left or centered; a brief conclusion may sit at the right or above. Keep only key columns; key rows or key cells use light-orange fills. If there are too many details, use a summary table + notes instead of shrinking type to fill the page. + +### F. High-density side-by-side module page +Suited to multi-dimensional summaries such as team structure, cost distribution, and capital deployment. Multiple light-gray cards, short lists, or small number blocks sit side by side, with unified widths, row heights, and alignment baselines; each module carries one metric or one group of short text. Do not mix in too many icons, photos, or complex borders. + +### G. Black-background mood/transition page +Suited to covers, section breaks, strategic quotable lines, and closing thanks. The core is a near-black background + orange glow + a small amount of centered copy, usually one statement or thank-you line plus a tiny signature. Not suited to regular data pages, table pages, or small-type note pages. + +## 5. Color System + +- **Near-black background #1D1D1D / #191919**: used for full-page backgrounds of covers, transitions, quotable lines, and closing pages. White content pages must not use near-black over large areas — only for small labels, legend dots, or high-contrast text. +- **Main text black #111111–#222222**: used for content-page titles, key notes, table body text, and main labels; it must not be replaced by orange for long body text. +- **Neutral gray #5B5B5B / #837571 / #A09C9A**: used for explanatory text, chart auxiliary labels, footnotes, and secondary information. Must keep contrast against the white base; not for key numbers. +- **Light-gray backgrounds #F7F7F7 / #F1EFEF / #E9E9EA**: used for card fills, table areas, light page zoning, and information containers; area may be medium, but must not outweigh the white space. May be replaced with a same-lightness brand light gray. +- **Divider gray #D0D0D1 / #E1DEDC**: used for table lines, timelines, card borders, and auxiliary axis lines. Thin and low-contrast — no thick black frames. +- **Primary orange #FC7C3D / #F16736 / #FA8555**: used for column charts, donut primary series, key numbers, nodes, key words, and button-like small labels. On white pages it serves as a local main visual and must not carpet large background areas. May be replaced with a brand primary color, provided high recognizability and sufficient lightness difference are kept. +- **Deep orange/red-orange #DC4A21 / #C22B0C / #BF5732**: used for chart high-value areas, deep area-chart layers, donut segments, and the dark parts of black-base light effects; not for long text. +- **Light orange #FECEAA / #FDAA74 / #FCC8B3 / #FBE6DC**: used for semi-transparent circles, secondary chart series, table key rows, soft background blocks, and forecast or de-emphasized series. Area may be slightly larger than primary orange, but must stay light — never let the page turn orange-based. +- **White #FFFFFF / near-white #F8F8F9**: used for content-page main backgrounds and reversed-white text on black pages. + +Within one page, use only orange + neutrals — do not introduce extra primary hues such as blue, green, or purple. Data series are distinguished by orange's shades and tints; no independent red-green system for positive/negative states — if positive/negative must be expressed, prefer label text and arrows/symbols, and do not add vivid green or warning red on your own. + +## 6. Fonts and Text Hierarchy + +A modern sans-serif business style, with Liter as the main body and Archivo Black (via customFonts) for page titles, plus small amounts of light and italic faces for the cover or quotations. For Chinese, use MiSans; avoid calligraphic, handwritten, and strongly decorative fonts. + +- **Cover main title:** approx. 5–7x body text, centered, multi-line phrasing, local light or italic parts allowed. +- **Section/quotable-line big sentences:** approx. 3–4x body text, relaxed line spacing, low word count. +- **Content-page titles:** approx. 2.5–3.5x body text, upper-left aligned, in the Archivo Black ultra-heavy weight — the strongest visual anchor on the page, no thick strokes. +- **Key information numbers:** approx. 2–3x body text, may be slightly smaller than the title or on par, with small unit/note text. +- **Subtitles/card titles:** approx. 1–1.2x body text, bolded; keep them short. +- **Body notes:** 1x, the proportional baseline; control line length and avoid full-width long paragraphs. +- **Chart labels/table text:** approx. 0.8–1x body text; keep legible — do not shrink excessively to cram content. +- **Notes/sources/footers:** approx. 0.55–0.7x body text, low-contrast gray. + +Text is predominantly left-aligned; black-background mood pages and the cover may be centered. Keep clear spacing between title and body; do not mix too many weights on one page — usually regular, bold, and italic suffice. + +## 7. Chart Language + +Main chart types are column charts, horizontal bars, donuts, area/waterfall-feel trend charts, circular relationship diagrams, and a few small metric charts. Charts are simplified, with few grids and little axis decoration, highlighting orange areas and direct labels. + +- **Column charts:** mostly 2–4 columns with square or slightly rounded corners; main columns in primary orange, secondary columns in light orange. Value labels sit atop or beside the columns; small black capsules may mark key amounts/values. Axes and gridlines are extremely weak — direct labeling takes priority. +- **Donuts:** for composition ratios, center left empty, segments in primary orange, deep orange, and light orange. Legend at the bottom or beside, using small color dots + short labels. Do not introduce too many segments — beyond 4–5 categories, recognition drops. +- **Area/trend charts:** use deep orange, primary orange, and light orange for layering or a fading effect, annotating growth rates, inflection points, or key stages; gridlines barely visible, horizontal-axis labels short. Suited to trends and profit structures, not precise readings. +- **Horizontal bars:** orange bars sorted by length, with short labels or values beside; keep to 3–5 bars. +- **Circular relationship diagrams:** semi-transparent orange circles overlapping to express intersections, portfolios, and capability relationships. They are not strict data charts — do not attach precise axes or complex scales. + +Chart emphasis is achieved through color shades, label positions, and local big numbers; do not use 3D charts, heavy shadows, dimensional pie charts, rainbow series, dense gridlines, or complex legends. + +## 8. Tables and High-Density Information + +Tables serve "management comparison" and "metric summaries" — they are not detail databases. Headers are light-gray or white with bold black text and short column names; the body uses black/dark-gray text. Text columns left-aligned, numbers and percentages neatly aligned, numeric columns may be centered or right-aligned. + +- Dividers use light-gray thin lines; avoid thick black borders and fully enclosed heavy frames. +- Row heights are relaxed, with obvious whitespace around the table — not edge-to-edge. +- Key rows, key cells, or the current item use light-orange fills, with restrained emphasis area. +- A pale-gray base may carry the table area, but do not cover the whole table with a high-saturation fill. +- Zebra striping is not a strong feature and may be omitted; if used, only extremely light gray alternation. +- Summary/conclusion rows may be bolded or given light-orange fills, but no complex multi-level headers. + +High-density side-by-side information uses light-gray cards, short lists, quarter nodes, and metric blocks. Blocks keep unified sizes and alignment, with short titles and explanations within one sentence. Symbols use small black dots, small color dots, thin lines, and short labels — no large sets of colorful icons or emoji. + +## 9. Components and Graphic Elements + +- **Small black capsule labels:** mark key amounts, chart highs, or small categories; reversed-white text, small area. They should not pile up in groups across the page. +- **Light-gray explanatory cards:** used for right-side explanation lists, timeline events, and supplementary notes; light-gray fill with no obvious shadow, containing a subtitle and one sentence. Keep the count to 2–4. +- **Orange circles/semi-transparent circles:** used for relationship models, nodes, and key visuals; they may overlap into intersections, but text must stay readable. Do not turn the circles into complex bubble charts. +- **Thin dividers/timelines:** used for stage separation, table rows and columns, and layout zoning; light colors, thin lines. +- **Ring/concentric-circle wireframes:** used on black-background transitions, tech-feel pages, or a few centered-visual pages; low contrast, never the main body of an infographic. +- **Orange light bands/glow:** only for black-background covers, section pages, closings, and other mood pages. White content pages use no large-area light effects. +- **Title bars/navigation:** no persistent header navigation has been established and must not be forced onto every page. The title itself is the primary navigation. +- **Image frames:** only a slight tendency toward placeholder rectangles/gray blocks is seen — this is not a photo-driven style. If images are used, keep them restrained rectangular aids that never seize the level of charts and text. + +## 10. Texture and Prohibited Items + +Overall flat, restrained, and businesslike; black-background pages may use subtle tech light effects, while content pages rely on typesetting, whitespace, charts, and orange emphasis. + +Prohibited: +- 3D charts, dimensional pie charts, perspective columns, glowing stroked text, strong drop shadows, metallic textures, large glassmorphism components; +- rainbow palettes, mixed multi-brand colors, emoji, cartoon illustrations, hand-drawn arrows, exaggerated icon stacking; +- large stretches of centered body text, full pages of dense small type, complex multi-layer borders, heavy table lines; +- large-area image backgrounds or black-background small-type tables on regular data pages. + +Use with caution: +- Gradients: only for black-base orange glow, soft area-chart layering, and light-orange transitions; never full-page colorful gradient backgrounds. +- Shadows: the source file does not rely on shadows; if hierarchy must be distinguished, use only extremely subtle shadows or switch to light-gray fills. +- Rounded corners: may lightly soften cards or columns, but this is not a heavy rounded-card style. +- Icons: if they must be used, only minimal line icons or small symbols, in black/gray/orange — no multi-colored icons. +- Photos/screenshots: may serve as auxiliary evidence or placeholders, but are not the core language; they need rectangular cropping, low decoration, and no full-bleed backgrounds. + +Special pages may use black-base light effects, concentric circles, low-contrast tech wireframes, centered quotable lines, minimal italics, and reversed-white text — only for covers, sections, quotations, and closing pages. + +## 11. Generation Checklist + +- Skeleton: is it 16:9; are content pages white/light-gray-based, and covers/transitions near-black + orange light effects; are margins sufficient? +- Copy: are titles phrasal; does each page have only 1 main conclusion; is explanation controlled to short paragraphs or 2–4 cards? +- Hierarchy: do the title, main number, body text, and footnotes have clear relative proportions; are specific font-size dependencies and hierarchy confusion avoided? +- Color: only orange + neutrals used; is orange used for emphasis rather than flooding the page; is low-contrast gray text still readable? +- Layout: is there a clear reading path; do the main visual, explanation area, and footnotes each do their job; are multiple competing anchors avoided? +- Charts: are simplified columns/donuts/area charts/horizontal bars/circular relationship diagrams used; are 3D, rainbow colors, dense grids, and complex legends avoided? +- Tables: are the header, rows and columns, and key rows clear; are lines light and thin; are numbers aligned; is detail overload avoided? +- Components: do light-gray cards, black capsules, orange nodes, and thin lines serve information; were page numbers, navigation, and watermarks never force-added? +- Prohibited items: no emoji, cartoon illustrations, heavy shadows, complex decoration, large image backgrounds, thick borders, or glowing text. +- Quality: check for text overflow, truncation, garbled text, overlap, low contrast, occlusion, empty content, wrong proportions, and an overly repetitive template feel. diff --git a/skills/open-kimi-ppt/reference/design_system/03_work/01/en/sky-blue-wayfinding.md b/skills/open-kimi-ppt/reference/design_system/03_work/01/en/sky-blue-wayfinding.md new file mode 100644 index 0000000..590d6c0 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/03_work/01/en/sky-blue-wayfinding.md @@ -0,0 +1,128 @@ +# Civic Brief · Public Service Brief STYLE DESIGN SYSTEM + +> Intended homepage tag: Work report +> Visual metaphor: civic wayfinding system + public-service operations brief + +## 1. Style Positioning + +Suitable for quarterly reviews, public-service operations, project progress updates, cross-department reports, and grassroots work summaries. Pages should feel like a clear, trustworthy civic wayfinding system: a warm-white base, deep indigo text, sky-blue routes, and sparing safety-yellow cues, using stations, routes, numbers, and statuses to make clear "what was done, what worked, and what to change next." + +Underlying principles: + +1. A work report leads with the operating conclusion, then gives evidence on coverage, efficiency, problems, and actions. +2. Wayfinding language must carry location, sequence, responsibility, or status; it must not degrade into decorative icons. +3. One page carries only one management question and highlights at most 3 numbers or actions. +4. Achievements, problems, and pending decisions use distinct but stable visual semantics. +5. Do not imitate government official documents, emblems, or the red-and-gold ceremonial style; do not manufacture a false sense of authority. + +## 2. Page Skeleton + +The canvas is 16:9 landscape. Content pages are predominantly warm white; section divider or conclusion pages may use deep indigo. Pages keep wide safe margins; a narrow "route number strip" may run down the left side, with the title, quarter, and page number at the top, and data-definition, measurement-basis, and responsibility information at the bottom. + +The title zone takes 15%–20%, the main work area 65%–72%, and the footer 6%–8%. Do not use a thick horizontal bar under the title; locate it instead with a short blue line segment or a station number. + +The cover uses "a large title + one service route + 3 key stations." Content pages switch among the coverage map, demand band, operating route, problem diagnosis, and action list; avoid repeating a three-column card layout on every page. + +## 3. Content Organization + +Titles use management conclusions, for example "Demand is now covered district-wide, but Monday morning remains the most pronounced congestion point." Subtitles state the region, period, audience, and data definition or measurement basis. + +Each page is organized as "current state — evidence — implication — next step." Achievements must state what they mean for the people served; problems must be linked to a cause or the accountable process step or owner; actions must carry a deadline, an owner, or acceptance criteria. + +Numbers sit next to their corresponding station, process, or population, and must keep units, period, and denominator. Do not compare visit counts, ratios, and percentage points on the same scale. + +## 4. Content Page Layout System + +### A. Operations Overview Page + +Use one horizontal service line to connect the 4 nodes of coverage, processing, resolution, and feedback. Each node holds only one primary number and one judgment; the end of the line gives the overall assessment for the quarter. Suited to the opening; do not build a KPI card wall. + +### B. Coverage and Foot Traffic Page + +Place a simplified district map or service-point network on the left, and the foot-traffic structure and peak hours on the right. The map only conveys hubs, mobile stations, and pressure points; do not fabricate precise geographic boundaries. + +### C. Demand Composition Band + +Use a horizontal band whose width varies with share to show the main service types; below it, use 2–3 direct annotations to explain where demand concentrates. Merge minor categories into "Other" to preserve the primary–secondary hierarchy. + +### D. Service Process Page + +Treat resident arrival, ticket pickup, case handling, transfer, and completion as one continuous path. Times or pass rates appear above the nodes, obstacles below. Draw connecting lines before the nodes; lines must not cross text. + +### E. Problem–Responsibility Page + +The left side lists three problems with their evidence; the right side links each problem to material, system, or coordination responsibility. Use safety yellow for matters needing attention; reserve vermilion orange only for issues that genuinely block service. + +### F. Next-Quarter Action Page + +Use 3 action routes to present "action / owner / deadline / acceptance criteria"; list items requiring leadership sign-off separately in the bottom-right corner. End with a clear work decision rather than a generic thank-you page. + +## 5. Color System + +- Warm white #F5F2EA: main background of content pages. +- Deep indigo #17324D: titles, body text, section dividers, and the main route. +- Sky blue #3D8CC9: normal operation, primary routes, and key data. +- Safety yellow #F2C14E: points of attention, waiting states, and matters pending coordination. +- Service green #4D8B72: completed items, effective pilots, and stable states. +- Vermilion orange #D95D39: blockages, complaints, and issues that must be escalated; area strictly limited. +- Road gray #A8AFB5: secondary lines, baselines, and sources. + +A single page typically uses indigo plus one status color. Red and green must not be the only differentiator; they must be paired with text or symbols. Large red backgrounds, blue-violet gradients, and five-color status lights are forbidden. + +## 6. Typography and Text Hierarchy + +Use MiSans for Chinese and Liter for English; numbers, codes, and times may use JetBrains Mono (brought in via customFonts). No more than two font-family roles across the deck. + +- Cover title: 4–5x body size, at most two lines. +- Page title: 2–2.6x body size, left-aligned. +- Primary numbers: 3–4x body size, with the unit immediately adjacent. +- Action headings: 1.2–1.5x body size. +- Body text: 1x, in short sentences. +- Footers, data-definition and measurement-basis notes, and route codes: 0.6–0.75x, but must remain legible. + +Hierarchy relies primarily on font size, weight, and position — not colored rounded backing boxes. Never shrink a title into small text to fit a long sentence; trim the copy first. + +## 7. Chart Language + +Prefer service-route diagrams, directly labeled bar charts, time-heat bands, dot plots, slope charts, simplified coverage networks, and 100% stacked bars. + +Use sky blue or service green for normal operation, safety yellow for pressure points, and vermilion orange only for severe blockages. Gridlines are extremely thin gray lines; chart titles must state the finding. + +Time and ratios must not share the same axis. State percentage-point changes explicitly as "percentage points"; do not write them as percentage growth. Every chart must indicate its period, sample definition, and sampling basis. + +## 8. Tables and High-Density Information + +Tables are used only for service-center comparisons, problem lists, and action ledgers. Headers use deep indigo text with a thin bottom rule; leave breathing room between rows; do not use closed heavy borders. + +Status is expressed jointly by small squares, short labels, and text; problem rows may get a safety-yellow left marker, and vermilion orange is reserved for overdue or blocked rows. Owner, deadline, and acceptance criteria must sit on the same reading line. + +If a table exceeds 6 columns, prefer splitting it into "a main-conclusion chart + a condensed ledger"; do not cram the full backend table into one page. + +## 9. Components and Graphic Elements + +Stable components include route lines, station dots, service numbers, directional arrows, status squares, short ticks, district outlines, and responsibility tags. + +Station size indicates hierarchy, not arbitrary aesthetics; line styles distinguish normal, pilot, and not-yet-connected routes. Keep the icon count low; use only clear public-service line symbols. + +Photos are not a default element. If a service-scene photo is used, place a single documentary crop and label whether it is illustrative or a real source; do not use staged stock-photo collages. + +## 10. Texture and Prohibited Items + +The overall feel is a modern urban-service operations brief: restrained, clear, accountable to the public. The visual center of gravity is routes and actions, not decoration. + +Prohibited: red-and-gold government templates, fake badges and seals, leadership-speech-style covers, KPI card walls, rounded SaaS panels, cartoon characters, rainbow icons, 3D maps, dial gauges, full-page slogans, and reporting achievements without problems. + +## 11. Generation Checklist + +- Does each page first state one operating conclusion or management question? +- Do coverage, efficiency, problems, and actions form a complete review chain? +- Do all routes, stations, and statuses carry business meaning? +- Do numbers carry period, unit, denominator, and correct percentage-point phrasing? +- Are problems linked to accountable process steps or owners, and do actions carry owners and acceptance criteria? +- Are colors supplemented with text/symbols to avoid relying on red-versus-green alone? +- Is the stable grammar of warm white, indigo, and a single status color maintained? +- Are official-document imitation, card walls, dashboards, and empty achievement slogans avoided? +- Have overlap, cropping, line wrapping, low contrast, garbled characters, and undersized footers been checked? + +- No cards by default: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the better solution +- No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part structures such as three columns + a heading + a conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/03_work/02/en/mist-blue-travelogue.md b/skills/open-kimi-ppt/reference/design_system/03_work/02/en/mist-blue-travelogue.md new file mode 100644 index 0000000..d6e7332 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/03_work/02/en/mist-blue-travelogue.md @@ -0,0 +1,187 @@ +# Report Name STYLE DESIGN SYSTEM + +## 1. Style Positioning + +An editorial-style research-report PPT aimed at readers in travel, hospitality, destinations, and industry decision-making. It organizes "viewpoint — evidence — explanation" with a magazine reading experience: travel/hotel scene photography sets the context, light blue and deep navy blue form the report interface, and paragraphs, expert quotes, survey data, and chapter narratives advance in alternation. It is neither a sales-oriented presentation nor a pure data dashboard. + +It employs a landscape widescreen canvas, a brand-custom low-ornamentation sans-serif typeface, brand colors of deep blue/bright blue/light report blue, large rectangular photos and color blocks, an understated footer, oversized Part numbers with half-screen photography on section dividers, a contents page of list items with jump arrows, blue-violet graphics, and hairline-separated data pages. Relatively high information density is allowed, but clarity is maintained through rectangular zoning, wide margins, title hierarchy, and photographic whitespace. + +Underlying principles: + +1. **Scene first, information embedded**: use real travel/hotel photos to build the scene; place text, quotes, and data on separate color blocks or white cards, avoiding laying them directly on complex photos. +2. **Brand blue serves reading, never steals it**: deep blue is used for the highest emphasis and reversed-out zones, light blue carries long text and chapter base plates, and bright blue is used only for navigation, labels, and small-area accents; body readability must not be reduced. +3. **Publication consistency beats page showmanship**: photos, two-column layouts, tables, and charts may vary, but title position, footer, rectangular zoning, typographic hierarchy, and the cool blue palette must stay consistent across the deck. + +## 2. Page Skeleton + +- **Canvas ratio**: a uniform landscape widescreen report page, close to PDF/magazine typesetting; do not use big-type, wide-whitespace presentation templates. Keep visible outer margins; content never touches the page edge. +- **Base margins**: content pages keep a stable white or light-blue border on all four sides; left, right, and top margins preserve the magazine feel, and the bottom margin reserves room for the footer, report name, or page number. Large images may approach the edge of the content area but must not break the safe boundary. +- **Title zone**: body titles sit at the top-left or top, using short question sentences, chapter names, or conclusive short sentences; section-divider titles may occupy the left half of the screen or a large light-blue field; cover titles are set in a deep-blue info card overlaid on a photo. Layering is achieved only through font size, position, background color, and horizontal rules. +- **Body zone**: organized on a rectangular grid — commonly left/right two columns, upper/lower two bands, photo + text card, deep-blue sidebar, a full light-blue base plate, and multi-column text/chart combinations. Separate blocks with whitespace or hairlines; do not stack floating elements. +- **Header**: regular content pages have no complex header navigation; chapter information blends into the title or footer as small text. Do not add a persistent top navigation bar. +- **Footer and page number**: the bottom of content pages stably carries the brand-insight mark, report name, and page number. The type is clearly smaller than body text, in deep blue/gray-black; the page number sits near the bottom edge and does not compete with the main charts for attention. +- **Logo**: an identity mark appears at the top-left of the cover, rendered as small plain text (write the new topic name), with no graphic logo drawn; interior pages de-emphasize it via small footer text or brand information; the back cover/closing page may strengthen the brand wordmark. Do not place a large logo on every page. +- **Contents navigation**: a narrow blue-gradient/abstract curved-surface graphic on the left + a contents list on the right. Entries consist of the chapter name, a numeric page number near the start or in a left-side column, and a "↗" on the right/at the trailing end; entries are separated by hairlines. +- **Divider lines**: thin gray/light-blue lines are used in the contents, between columns, in tables, for quote attributions, and in data lists; they are hairline-weight and low-contrast, not decorative heavy borders. +- **Watermarks and background graphics**: light-blue section dividers may use very faint arc/curve shading; deep-blue pages may use low-contrast textures or linear backgrounds. These serve only as background and must not impair legibility of body text and photos. +- **Default reading path**: top-left title or Part number → main photo/dark emphasis zone → body text or charts → footnotes and footer. Two-column layouts read left to right, top to bottom; in photo + sidebar layouts, the photo comes first, followed by key data or a quote. + +## 3. Content Organization + +- **How titles are written**: the cover uses a main title + subtitle + series/brand label; the contents page lists chapters; section dividers use "Part X" + one sentence of chapter theme; body pages use question sentences or clear topic sentences. Be specific and readable; no exaggerated marketing slogans. +- **Information sentences**: viewpoint and quote pages may use full report-style paragraphs rather than being chopped into many clipped slogans. Highlighted sentences use oversized quotation marks, a light-blue quote box, or a deep-blue reversed-out zone. +- **Body organization**: short paragraphs, narrow line lengths, and clear paragraph spacing; foreword/methodology pages may be densely set in 2–3 columns. Do not stretch long paragraphs across the full page width. +- **Grouping logic**: the deck is divided into chapters by Part; each page is organized as "topic title — explanatory paragraph — photo/quote — data or list." Every page revolves around one main question; no unrelated topics are mixed in. +- **Number of viewpoints per page**: a regular content page carries 1 main viewpoint, optionally accompanied by 1 expert quote or 1 set of data; a data-composite page may juxtapose 2–4 metrics/charts, but they must share the same question, definitions, and measurement basis. +- **How bullet points are written**: prefer short headings, percentages, hairline separators, icons/small markers, or side-by-side cards — not traditional large bullet dots; keep items similar in length and avoid any single item growing into a long paragraph. +- **Keyword emphasis**: use bold, color blocks, font size, position, and enlarged data; use in-text color highlighting sparingly. Italics are used only for report names, quote sources, or tonal emphasis — never over large areas. +- **Number/unit/time basis**: percentages, years, sample sizes, and their explanations stay adjacent; large numbers must come with a short explanation of their definition and measurement basis. Units are set smaller than the number but must remain legible. +- **Source footnotes**: chart sources, survey sample definitions, and methodology notes are placed below the chart, at the bottom of the page, or at the bottom of a sidebar; low-contrast but clear, and not to be confused with the footer. + +## 4. Content Page Layout System + +### A. Large Photography + Deep-Blue Info Sidebar + +Used for expert viewpoints, key findings, ranked lists, and percentage data. One side holds a travel/hotel scene photo; the other side is a deep-navy rectangular sidebar set with white text, thin light-blue lines, small icons, or a percentage list. The key point goes at the top; a quote may open with oversized quotation marks, with the attribution at the bottom. + +It carries 1 quote or 4–6 short data items; the photo and sidebar must not overlap each other. If the text needs a long-form explanation or a complex table, do not use this layout. + +### B. Light-Blue Base Plate + Photo/Text Two Columns + +Used for chapter openers, personal quotes, longer explanatory passages, and methodology notes. Light report blue serves as a full-page base plate or a half-page carrier layer, with a photo on one side and title, paragraphs, and attribution on the other; text is deep blue/near-black, with a divider line separating the attribution from the body. + +Emphasis comes from large titles, left alignment, and light-blue space. If the page contains multicolored data charts, reduce the light-blue area or switch to a white background to avoid color mixing. + +### C. White Report Page + Multi-Column Body + +Used for forewords, introductions, methodology, and explanatory chapters. A large title goes at the top or top-left; the body is set in 2–3 columns, optionally flanked by a portrait photo, a light-blue author info box, or a small note card; columns are separated by whitespace or hairlines. + +Keep column width under control; avoid full-width long lines. This layout is not suited to emotional chapter transitions, nor to presenting large numbers that need strong visual impact. + +### D. Section Divider: Oversized Part Number + Half-Screen Photography + +Used to separate chapters. An oversized "Part X" sits on a light-blue field on the left or upper layer, with the chapter theme sentence below; the right side or half of the screen carries a portrait/travel-scene photo. The light-blue field may include very faint curves. + +It serves only navigation and chapter atmosphere — no complex body text, charts, footnotes, or multiple viewpoints. The Part number is clearly larger than the chapter theme. + +### E. Data-Composite Page: Topic Explanation + Multiple Charts/Metrics + +Used for survey results, investment directions, and preference comparisons. The top holds the topic title and a brief description; the body divides into a chart zone, a numeric-metric zone, and an explanatory-text zone. Common elements include donut charts, bar lists, percentage cards, and small icon lists, colored mainly in blue-violet and deep blue. + +Emphasis comes from large percentages, white text on deep-blue grounds, and bright-blue/purple series colors. If the data definitions or measurement bases are complex or annotations are numerous, split the page or convert it into a table/methodology page. + +### F. High-Density Parallel-Module Page + +Used for horizontal comparison of multiple findings, multiple markets/segments, or multiple strategic dimensions. Use 2–4 equal-width cards or columns, each containing a subheading, a short paragraph, a number, or a small chart; align strictly, organize with light divider lines, and alternate background colors between white and light blue. + +Not suitable for large emotional photos; photos may appear only as small thumbnails to aid classification. All modules must share the same grammar, or the report's consistency breaks. + +## 5. Color System + +- **Deep navy blue #000735 / #020D3E / #051954**: used for cover info cards, deep-blue sidebars, emphasis zones, the back cover, dark chart backgrounds, and title text; area can range from small labels to half-page/full-page dark blocks. It may be replaced with another brand dark color, but white text must keep high contrast, and the color must not shift so gray or black that its blue identity is lost. +- **Light report blue #C6D4F9 / #C7D5FA**: used for section-divider base plates, quote-page backgrounds, methodology/note boxes, light table fills, and large carrier layers — up to half a page or even a full page. It may be replaced with a low-saturation brand light color, but it must stay cool-toned with sufficient lightness. +- **Bright brand blue #1E77F8 / #3781F9 / #5D8DF4**: used for the abstract graphic on the left of the contents page, labels, small accents, link-styled arrows, and chart series colors; it serves only as small-area guidance. It must not be spread over large areas in place of light blue, or the result becomes overly tech-flavored and loses the magazine feel. +- **White #FFFFFF / near-white #F1F3FA**: used for content-page backgrounds, cards, chart backgrounds, and whitespace areas; text on them is deep blue or near-black. +- **Primary text near-black-blue #030208 / #07090F / #2B3A5C**: used for body text, titles, table text, and chart labels. Light gray must not be used as the primary body color. +- **Neutral gray #8D92A1 / #9FA0A9 / #B3B6C3**: used for divider lines, auxiliary labels, axes, footnotes, and non-essential information; small in area, low-contrast but discernible. It must not carry critical information. +- **Photo warm tones #A87C39 / #C06712 / #CB9742 / the tan-brown family**: these come mainly from travel/hotel photography and are not system primary colors; they may only echo a chart or local accent in small amounts — do not promote them to primary brand colors. +- **Purple/blue-violet auxiliary colors**: used for a small number of chart series, key metrics, or comparison groups; their area is controlled and must not compete with bright blue and deep blue at the same time. + +Each single page centers on the blue family; apart from the natural colors of photos, system colors should number no more than 2–3 hues. Positive/negative states are explained first through light/dark contrast, label text, arrows, or legends; introduce red and green cautiously, and never use highly saturated red-green combinations that break the report's cool tone. + +## 6. Typography and Text Hierarchy + +Use a modern sans-serif typeface: Liter (Chinese: MiSans). Regular accounts for the overwhelming majority; Bold is used sparingly for titles/emphasis, Regular Italic for report names or quote emphasis, and Medium/Light only rarely. Regular weight dominates; avoid over-bolding. + +- **Cover main title**: 3.5–4.5x body size, set inside the deep-blue info card or in a clearly defined area above the photo; line spacing tight but not crowded. +- **Cover subtitle / series label**: the subtitle is 1.5–2x body size; the series/label is 0.7–0.9x body size, often set inside a bright-blue or light-blue bar. +- **Section-divider Part number**: 4–6x body size, in a light or regular weight — it need not be bold. +- **Chapter theme sentence**: 1.6–2.5x body size, left-aligned, breaking naturally across multiple lines. +- **Content-page title**: 1.5–2.2x body size, usually in regular weight; short titles may be enlarged. Do not use overly heavy titles that create a commercial-poster feel. +- **Body text**: 1x; generous leading with clear paragraph spacing. +- **Subheadings / card titles**: 1–1.2x body size, may be Bold or Medium. +- **Chart labels / table text**: 0.75–0.95x body size; key numbers may be enlarged to 1.5–3x. +- **Quote text**: long quotes are 1–1.2x body size; quotation marks may be enlarged to 2–3x and set in deep blue. +- **Notes, sources, footers, page numbers**: 0.55–0.75x body size, understated but clear. Footnotes must not become too small to read. + +Text is left-aligned by default. Except for localized areas of the cover info card, do not use large blocks of centered copy. Titles may use title case or sentence case, but the same level must be uniform. + +## 7. Chart Language + +Charts are evidence components embedded in the report narrative, not dominant dashboards. Styles include donut/ring percentages, bar/ranking lists, multi-metric cards, small icon lists, tabularized comparisons, and a small number of coordinate charts. + +- **Chart types**: prefer percentage rings, horizontal bars, ranking bars, metric cards, simple columns/lines, and comparison tables. Avoid complex interactive dashboards, radar charts, 3D pie charts, and line charts with too many series. +- **Axes and gridlines**: use light-gray/light-blue low-contrast lines; gridlines only aid reading. Axis labels are smaller than body text, in neutral gray or deep blue. +- **Labels and legends**: label values directly near the graphic wherever possible and minimize distant legends; keep percentages close to their metric names; legend swatches are small and tidy. +- **Series colors**: use deep blue, bright blue, light blue, and blue-violet, and control the number of series per page. Photo warm tones do not enter regular data series unless they echo local content. +- **Key data**: use large numbers, white text on deep-blue grounds, thick lines, or high-saturation blue-violet. Do not stack multiple emphases such as shadows, exploded pie charts, and fluorescent colors at the same time. +- **Forecast/target/baseline lines**: use thin dashed or thin solid lines with short labels. Do not add complex gradient fills. +- **Annotations**: use white cards or light-blue boxes with thin lines, and use arrows sparingly; they must not obscure the chart's primary readings. + +Keep charts few and refined; if the amount on one page cannot be grasped quickly, split the page or move it to an appendix table. + +## 8. Tables and High-Density Information + +Tables are used for methodology, sample descriptions, market/metric comparisons, and condensing high-density information. They use light borders, subtle background tints, and report-style typesetting — not the default heavy grids of office software. + +- **Header**: use light blue, near-white, or white-on-deep-blue; text may be slightly bolded, at a size close to body text or slightly smaller; keep sufficient height and whitespace. +- **Row/column structure**: allocate column widths by content function; the left side usually holds categories/dimensions and the right side values or explanations; separate with hairlines or whitespace. +- **Divider lines**: use thin light-gray/light-blue lines and avoid heavy all-black borders. Horizontal rules are more common than vertical ones; keep vertical separators only when strong comparison is needed. +- **Background fills**: use white, light blue, or subtle zebra striping; zebra striping must be low-contrast and only aid scanning. +- **Key rows/columns**: highlight with deep-blue text, a light-blue fill, bold, or a small label. Do not fill large areas with highly saturated colors. +- **Summary rows**: distinguish with a slightly deeper light-blue fill or a thin rule above — not heavy borders. +- **Number alignment**: right-align or decimal-align percentages, amounts, years, and the like; left-align text; units follow the number immediately or move into the column header. +- **Symbol markers / rating dots**: small dots, checkmarks, arrows, or short labels may be used, staying within a monochrome blue/gray system. Colorful icons are not the default table markers. + +Keep titles, descriptions, and footnotes; do not let the table fill the entire page. Tables compress evidence; they do not replace narrative. + +## 9. Components and Graphic Elements + +- **Deep-blue info card / sidebar**: used for key conclusions, quotes, and data lists; white text and thin light-blue lines inside, no shadows; well suited to sit alongside photos. +- **Light-blue carrier box**: used for long quotes, chapter themes, explanatory paragraphs, and methodology information; text is deep blue/near-black; it may have no outline, with zones defined by color blocks and whitespace. +- **Cover title card**: a deep-blue rectangular card overlaid on the photo, optionally with a bright-blue/light-blue label strip on top; right-angled, positioned right-of-center or center-right, avoiding covering people's faces. +- **Contents entries**: composed of page number, chapter name, hairline separator, and "↗"; may be used sparingly for navigation, but should not flood every list in the body. +- **Oversized quotation-mark component**: used for expert quotes or viewpoint excerpts; the quotation marks are deep blue or white and significantly larger than body text; the paragraph follows, with the attribution at the bottom. +- **Percentage / metric list**: each item contains a small icon or short label, a percentage, and explanatory text; items are separated by hairlines or whitespace; suited to deep-blue sidebars or white cards. +- **Image frame**: rectangular, right-angled crops, often occupying half a page or a large area; subjects are people, hotels, nature, transport/travel scenes. Separated from text by straight edges, with no photo-frame shadows. +- **Abstract blue curved surfaces / curves**: the contents and section-divider pages may use blue-gradient curved surfaces or faint lines; these are for chapter/navigation atmosphere only, not decoration on every page. +- **Hairline dividers**: low-contrast, with lengths following the width of the content block; never full-page heavy decorative lines. + +## 10. Texture and Prohibited Items + +The overall texture is flat, restrained, and editorial-magazine-like, with pages organized through photography, rectangular color blocks, typographic hierarchy, and the blue system. + +**Prohibited**: +- 3D charts, perspective text, glowing outlines, neon effects, complex textures, heavy shadows, and glassmorphism. +- emoji, cartoon stickers, large numbers of colorful icons, and social-media-style emoticons. +- Large blocks of centered copy, poster-style slogan stacking, and full-page unstructured oversized text. +- Laying long body text directly over complex photos, or covering the people/scene subject with low-contrast text. +- Using highly saturated red, green, or yellow as large-area status colors that break the blue report system. + +**Use with caution**: +- Gradients: limited to contents-page abstract graphics, blue curved surfaces, or extremely subtle backgrounds; not for buttons or large-area body grounds. +- Shadows: the source style barely relies on shadows; if a white card must be distinguished, use only a very light drop shadow or switch to whitespace/background color. +- Rounded corners: the source files are dominated by right-angled rectangles; rounded corners must not become a system feature. +- Icons: small monochrome line icons may be used in data lists; large colorful icons are unsuitable. +- Illustration: not observed as a core language; it must not replace real photography. + +**Allowed on special pages**: +- Large-area photographic backgrounds may be used on covers, section dividers, closing pages, or a few emotional transitions; long-text body pages should not use full-image backgrounds. +- Abstract blue-gradient shapes may be used on contents or navigation pages; ordinary content pages should be restrained. +- Full-page or half-page deep blue may be used to emphasize conclusions/quotes/the back cover, but content volume must be small and reversed-out text must remain legible. + +## 11. Generation Checklist + +- Skeleton: is it a uniform landscape widescreen? Are outer margins and the bottom footer preserved? Are the title zone, body zone, and footnote zone clearly divided? +- Copy grammar: are titles concrete topics/questions/chapter sentences? Does each page carry only one main viewpoint? Are paragraphs too long or stretched too wide? +- Hierarchy: are the relative sizes of cover, Part, content-page titles, body text, chart labels, and footnotes clearly defined? Is Bold being overused? +- Color: is the core palette deep blue, light report blue, bright blue, and white/near-black? Are there too many system colors on one page? Is text contrast on dark grounds sufficient? +- Layout: are photos, text, and charts aligned to the rectangular grid? Is there any random floating, covered faces, or inconsistent margins? +- Charts: are charts simple and readable? Are percentages and their definitions and measurement bases adjacent? Are legends, axes, and gridlines understated? Is there any 3D or excessive decoration? +- Tables: are headers, rows/columns, divider lines, number alignment, and footnotes standardized? Are heavy black grids or highly saturated fills used? +- Components: do deep-blue sidebars, light-blue carrier boxes, contents arrows, quotation marks, and metric lists carry information rather than mere decoration? +- Prohibited items: are emoji, complex illustrations, large colorful icons, strong shadows, glows, 3D, complex textures, and large blocks of centered copy avoided? +- Readability: are there problems such as overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong image aspect ratios, or the footer pressing into the body? +- Consistency: pages may vary, but do they still keep the blue system, footer, right-angled rectangles, left alignment, and the report-magazine character? Avoid making each page an unrelated template. +- No cards by default: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the better solution +- No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part structures such as three columns + a heading + a conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/03_work/03/en/warm-jade-annual-report.md b/skills/open-kimi-ppt/reference/design_system/03_work/03/en/warm-jade-annual-report.md new file mode 100644 index 0000000..6fe6e13 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/03_work/03/en/warm-jade-annual-report.md @@ -0,0 +1,170 @@ +# Organization Name AR 23 24 · Annual report 2023 24 STYLE DESIGN SYSTEM + +## 1. Style Positioning + +A landscape report-style PPT for listed-company annual reports, investor relations, ESG and governance disclosure, financial notes, and audit statements. It serves investors, boards, regulators, and internal management, emphasizing long-form reading, quick navigation, reviewability, and traceability. Body text, tables, footnotes, and charts are organized with a warm off-white paper background, a stable grid, small-size dense typesetting, QuattrocentoSans/Unna, black-gray text, thin gray lines, and a small amount of golden brown. Photography is used only on the cover, contents/section pages, or a few brand pages; body pages are dominated by multi-column text, data metrics, donut/column charts, wide tables, and governance matrices. + +Underlying principles: +- **Disclosure reading beats visual performance**: titles, body text, data, footnotes, and sources must read continuously along the grid; decoration, images, and color blocks must not break the review path. +- **Low-saturation consistency beats strong stimulation**: the deck is dominated by off-white, black-gray, light gray, and golden brown; only the black back cover, photography pages, and necessary charts may show stronger contrast. +- **Information is layered through position, size ratios, lines, and whitespace**: use few large-area color modules and no strong shadows or complex graphics; high-density pages organize information through column widths, hairline dividers, subheadings, and table headers. + +## 2. Page Skeleton + +- **Canvas ratio**: a landscape widescreen report page, close to 16:9; treat it as a "printable annual-report page," not a stage-presentation page. +- **Default background**: the entire body page is warm off-white, approximately `#FBF9ED`; textures, gradients, or patterns are generally not layered onto the background. +- **Margins**: stable whitespace on all four sides; the top margin holds a small chapter/report mark, the bottom margin the page number and report name; the body is inset as a multi-column grid. +- **Header**: the top-left commonly shows a three-short-bars/chapter-name mini navigation; an "Annual Report 2023/24"-style report mark sits at the top center or top-right; extremely small and low-contrast. +- **Footer and page number**: a small page number, page name, or report information sits at a bottom corner, in black-gray or light gray. The footer must be light and must not compete with the body for attention. +- **Title zone**: the title sits at the top-left or upper left; body pages use short report-style titles, while chapter/contents pages may overlay photography or sit alongside it. Data or text follows the title directly, with no exaggerated decoration. +- **Body zone**: a 2–4 column grid. Text pages use equal-width multi-column; data pages put key metrics on the left and explanations/charts/tables on the right; wide tables occupy the lower-middle of the page or a large zone on the right. +- **Divider lines**: thin lines are used between columns, in tables, footnotes, metric zones, note boxes, and chart baselines; light gray/medium gray, with restrained weight. +- **Logo**: the identity mark (small plain text spelling the report name; no graphic logo is drawn) appears mainly on the cover/back cover or a few brand positions. Body pages must not enlarge the logo on every page — at most it appears as extremely small report information. +- **Navigation**: the contents page is composed of chapter titles, entries, and page numbers; section pages may use a large image + a contents-style list. Body pages keep only a light header — no colorful progress bars. +- **Watermarks/background graphics**: body pages have no stable watermark; circular product/brand thumbnails or photos appear only as elements on a few pages. +- **Default reading path**: top-left header/chapter and title → key metrics on the left or the first body column → left to right, top to bottom → charts, table notes, and footer sources. + +Page-type skeletons: +- **Cover**: a full-page or large-area interior/product photograph with an oversized title overlaid slightly left of center, white text at high contrast, and the identity mark at the bottom (small plain text spelling the report name; no graphic logo is drawn). +- **Contents page**: a vertical photography column on the left carrying an overlaid title, and a off-white zone on the right holding a multi-column contents list; chapter titles are bold, entries are small, and page numbers are right-aligned. +- **Body report page**: off-white background, light header and footer, top-left title, multi-column text/charts/tables. +- **Chapter/Notes page**: photography or a tonally unified image on the left, and a contents-style entry list on the right. +- **Back cover / special closing page**: may use a black background with a white identity mark (small plain text; no graphic logo is drawn); this is a special page and must not be applied to body pages. + +## 3. Content Organization + +- **How titles are written**: short, objective, report-style — such as overview, outlook, region names, governance topics, audit/notes titles. Avoid marketing slogans, long question sentences, and overly emotional wording. +- **Information sentences**: 1–3 lines of description or summary may sit under the title; do not make a large block of centered copy the main body of a content page. +- **Body organization**: use short paragraphs, subheadings, and necessary bullets. Long financial, governance, and audit texts are split into 2–4 columns; avoid single-column long lines. +- **Grouping logic**: organize by annual-report chapters, management review, strategic outlook, governance, financials, notes, and audit; information at the same level uses unified title styles, column widths, and spacing. +- **Number of viewpoints per page**: a regular business page carries one main theme + 3–5 subsections/metrics; pure disclosure pages may add more text, but every column must have subheadings or paragraph breaks. Large-type viewpoint pages are not the mainstream and must not be overused. +- **How bullet points are written**: use dashes, dots, or indentation with no more than two levels; group with whitespace and thin lines, and use colorful icons sparingly. +- **Keyword emphasis**: use bold, position, enlarged numbers, golden brown, or table background fills. Do not use fluorescent highlighting, stacked underlines, or multicolor emphasis. +- **Numbers/units/time**: key numbers form independent blocks and are larger than their explanatory text; units stay tight against the number or sit as small labels above/below it. Financial ranges, percentages, DKK, years, and the like must retain their definition and measurement-basis notes. +- **Source footnotes**: footnotes, asterisks, parenthetical notes, and regulatory citations are placed at the bottom or below tables, set smaller than body text, low-contrast but readable. + +## 4. Content Page Layout System + +### A. Multi-Column Report Body Page + +Suited to audit opinions, governance statements, policy notes, ESG disclosure, financial notes, and other long texts. A short title at the top-left; the body is 3–4 equal-width columns of text, each column using subheadings + dense paragraphs; columns are separated by whitespace or thin lines, not color blocks. Emphasis relies on bolded subheadings, first-paragraph position, and paragraph spacing. If the content needs strong visual storytelling, a single large viewpoint, or many images, do not use this layout. + +### B. Company/Topic Overview Page + +Suited to "at a glance"-style summaries, business composition, product categories, and channel/market profiles. A donut chart or core explanation goes in the middle; key numbers, short descriptions, category labels, or minimal graphics sit to the left and right. The donut chart expresses compositional relationships and is not responsible for precise comparison; use column charts/tables instead when precise trends, rankings, or multi-dimensional comparison are needed. + +### C. Outlook and Assumptions Page + +Suited to annual outlook, target ranges, assumptions, sensitivities, and risk notes. A vertical key-metrics zone on the left holds 2–4 large numbers/ranges; the right side is split into "assumptions," "notes," "sensitivities," or small tables. Golden brown is used for target ranges or key values; gray-filled boxes carry additional conditions. Do not force content into an outlook page when there is no clear quantified conclusion. + +### D. Region/Business Review Page + +Suited to reviews of regions, business units, or business lines. Region names and key data go on the left, small column charts/metric comparisons in the middle, and 2–3 columns on the right explaining causes, actions, and results. The entry point is the region name and numbers, not photography. If there is only narrative without metrics, switch to a multi-column body page. + +### E. Wide-Table Disclosure Page + +Suited to financial statements, governance matrices, board information, and compensation/audit details. A short title and description go at the top; the horizontal wide table takes the largest area; when necessary, explanation on the left and the table on the right. Key columns, total rows, or headers use gray fills, bold, or darker gray rules. If a table is compressed to unreadability, it must be split across pages. + +### F. People/Governance Card Page + +Suited to information on directors, management, and committees. Use equal-width vertical cards: a black-and-white or low-saturation portrait at the top, with name, role, tenure, responsibilities, and committee information below, and thin vertical lines between cards. Photos are uniformly cropped and grayscaled/low-saturated; no colorful avatar-wall social-media style. + +### G. Photography Section Page + +Suited to the cover, contents, Notes, and chapter openers. Interior/product photography fills the left side or the whole page, with the chapter title and a contents list on the right or in an overlay zone. The photography must have low-noise areas to carry text, and its tone must agree with off-white/golden brown. Body disclosure pages must not rely on large image backgrounds. + +## 5. Color System + +- **Paper-background off-white `#FBF9ED` / `#FEFCF0`**: the main background of body pages. It must not be replaced with pure white or a highly saturated light color; when migrating brands, it may be replaced with an equally low-saturation warm white. +- **Primary text black-gray `#171717`–`#2B2B2B`**: the main text of titles, body, and tables. Light gray must not replace body text, to avoid low contrast. +- **Auxiliary text gray `#5A5E6B` / `#7D7A72`**: headers, footers, notes, chart labels, and secondary notes. Used to lower hierarchy; should not be used for the main body of long paragraphs. +- **Divider light gray `#D9D7CB` / `#C6C4BB`**: column rules, table gridlines, chart axes, and note-box boundaries. Avoid thick pure-black lines. +- **Table/note-box gray fill `#A09C93`, light gray fill `#E5E3D8`**: used for headers, summary areas, sensitivity boxes, or tables needing emphasis; the deeper gray fill pairs with light text, the light gray fill provides secondary differentiation. Do not cover an entire page at large scale. +- **Brand golden brown `#B59D71` / `#AB8F62` / `#97754C`**: key numbers, donut-chart emphasis, some chart series, and echoes of photographic tones; small to medium in area. It may be migrated to the brand's primary color, but must remain low-saturation, warm-toned, and harmonious with off-white. +- **Deep gold/brown-black around `#6F5435`**: used only for deeper levels within the golden-brown system or for chart contrast; use cautiously. +- **Black special color `#000000` / deep black-gray**: the background of the back cover or a very few closing pages, paired with a white identity mark (small plain text; no graphic logo is drawn)/text. Large black backgrounds are forbidden on body pages. +- **Chart series colors**: use golden brown, dark gray, light gray, and black-gray; usually no more than 2 primary hues per page, varying by lightness and transparency. If positive/negative states appear, differentiate them first with text/symbols and light/dark contrast; do not introduce a red-green strong-contrast system unless data compliance requires it. + +## 6. Typography and Text Hierarchy + +- **Type character**: Unna (serif body) and QuattrocentoSans (humanist sans) are the mainstays — both built-in — with QuattrocentoSans Bold for subheadings/section emphasis. The type does not pursue a tech or handwritten feel. +- **Body = 1x**: the deck-wide baseline; high-density, compact but readable; long text uses regular weight. +- **Footnotes/headers/page numbers = 0.75–0.9x**: report name, page numbers, notes, sources, and regulatory citations, in lighter colors. +- **Subheadings/table headers = 1.2–1.6x**: subsections within chapters, table headers, card names, or contents chapter names; may be bolded. +- **Body-page title = 2–3x**: top-left aligned, black-gray; no exaggerated decoration needed. +- **Chapter/cover large title = 4–6x**: used only on the cover, the contents photography zone, and Notes/chapter-opening pages; may be white text overlaid on imagery or black text in a off-white zone. +- **Key numbers = 2.5–4x**: used on outlook, overview, and region pages; units and notes are 0.8–1x, sitting tight against the number. +- **Chart labels = 0.8–1x**: axes, legends, and data labels are small and clear; key ones may be bolded or use golden brown. +- **Table text = 0.8–1x**: may be slightly smaller than body text, but must never become too small to read; headers and summary rows may be bolded. + +## 7. Chart Language + +Mainly donut charts, small column charts, tabularized data, and a small number of metric zones — no complex visualization systems. + +- **Donut charts**: used for compositional shares or category proportions. Place in the middle or lower part of the page; golden brown marks the key categories, gray/black-gray the others. Labels wrap around the ring and lines are few; avoid exploded pie charts, 3D pie charts, and too many slices. +- **Column charts**: used for regional or yearly comparisons. Bars are narrow and clean, layered in golden brown, black-gray, and light gray; axes and gridlines are extremely faint. Small column charts may corroborate metrics but do not carry the visuals of an entire page. +- **Metric zones**: large number + small note + unit/time basis, usually on the left; key values may use golden brown. Explanatory text must sit tight against the number — avoid leaving numbers isolated. +- **Axes and grid**: axis lines, ticks, and gridlines are low-contrast; chart frames are kept light wherever possible. +- **Legends**: placed near the chart, with small text and simple swatches. A legend must not become an independent colorful decorative strip. +- **Annotations**: forecasts, targets, and baselines use thin lines, light-gray boxes, or small notes; do not use big arrows, glowing markers, or exaggerated callouts. +- **Boundaries**: do not introduce colorful infographics, complex maps, animated graphics, or skeuomorphic dashboards. Chart aesthetics defer to data clarity and complete definitions, scope, and calculation bases. + +## 8. Tables and High-Density Information + +- **Table role**: as precise disclosure and evidentiary tools for financials, governance, board, compensation, audit, ESG metrics, and the like; they may carry the main body of a page. +- **Header**: use a light-gray or medium-gray fill with bolded text; a dark-gray header pairs with light text. Compact in height and clearly distinguished from data rows. +- **Row/column structure**: light-gray thin gridlines; narrow number columns and wide text columns. Avoid heavy borders and excessive zebra striping. +- **Row height**: high-density but not crowded; long text may wrap and must not be force-compressed into truncation. +- **Key rows/columns**: totals, key years, committee affiliation, or status columns may use bold, gray fills, or darker divider lines. Do not mark them with multiple bright background colors. +- **Number alignment**: numbers right-aligned or aligned by decimal place/unit, text left-aligned; percentages, currencies, and years use consistent formats and measurement bases. +- **Symbol markers**: understated symbols such as small dots, asterisks, and checkmarks/rating dots may be used; Wingdings/Symbol characters are auxiliary only, not a colorful icon system. +- **Zebra striping**: if used, only an extremely shallow gray/off-white lightness difference. Large dark row fills are reserved for headers or summary areas. + +## 9. Components and Graphic Elements + +- **Light header component**: top-left mini navigation/three short bars + chapter name, with the report name at the top-right or top; used only for orientation and must not be bolded or enlarged. +- **Contents component**: bold chapter titles, small entries, right-aligned page numbers, arranged in multiple columns; suited to contents and Notes pages, and may combine with a photography column on the left. +- **Key-number component**: large number, unit, and short note combined vertically; used on overview, outlook, and region pages. Use black-gray and golden brown, with whitespace forming the entry point. +- **Hairline divider component**: horizontal lines, vertical lines, table grids, and column rules establish order — they are not decorative filigree. +- **Gray-filled note box**: used for assumptions, sensitivities, footnote reinforcement, or local table notes; low-saturation fill, small text, clear boundaries. Multiple strongly colored alert boxes must not be stacked. +- **Cards/people columns**: portrait on top, text below, thin lines between columns; no visible shadows — boundaries are defined by grid and whitespace. +- **Image frame**: photography uses rectangular crops with clean edges, no rounded corners or shadows; used on covers, contents, section pages, and a few brand/people pages. +- **Icons**: only a small number of minimal symbols/social marks/status dots. Colorful icons, emoji, and illustrations do not belong to this system. +- **Process arrows/SmartArt**: not a stable primary component. If a process must be expressed, use only thin lines, numbering, and text boxes; avoid dimensional arrows and templated SmartArt. + +## 10. Texture and Prohibited Items + +The overall feel remains flat, restrained, paper-like, and low-saturation; rounded corners, shadows, gradients, glows, 3D, and complex decoration are not evidence of the primary style. + +**Prohibited:** +- Large-area gradients, glows, 3D, drop-shadow cards, glassmorphism, or complex textures on body pages. +- Rainbow charts, fluorescent highlighting, emoji, cartoon illustrations, and social-media-style colorful icons. +- Typesetting long paragraphs centered, or replacing report content with presentation-poster-scale giant text. +- Repeatedly enlarging the logo on body pages, using full-page black backgrounds, or covering the off-white paper system with strong color blocks. +- Truncated, overlapping, or low-contrast text in tables, or sacrificing data definitions or measurement bases for decoration. + +**Use with caution:** +- Photography: only on covers, contents, chapters, people, or brand-related pages; body disclosure pages should use it sparingly. +- Golden-brown emphasis: may be used for key numbers and chart series, but do not sprinkle it all over a page. +- Gray-filled boxes: for notes/headers/summaries; do not turn them into a dense card wall. +- Icons and symbols: for orientation or status support only; keep them monochrome and small. + +**Allowed on special pages:** +- The cover may use a full-image background with a large white title. +- The back cover may use a black background with a white identity mark (small plain text; no graphic logo is drawn). +- Chapter openers/Notes may use large photography on the left + a contents list on the right. + +## 11. Generation Checklist + +- Skeleton: is it a landscape report page; is the off-white background dominant; are header, footer, and page number lightweight and aligned? +- Copy: are titles short and report-like; is body text organized by subheadings, paragraphs, and lists; are marketing slogans and large blocks of centered copy avoided? +- Hierarchy: is body=1x clear; do titles, key numbers, subheadings, and footnotes build hierarchy by relative proportions, without exaggerated changes beyond the size logic? +- Color: is each page controlled around off-white, black-gray, light gray, and golden brown; are highly saturated multicolor and purely decorative colors avoided? +- Layout: is a 2–4 column grid used; are the functions of key metrics, text, charts, and tables each clearly defined; does the reading path flow smoothly from top-left to bottom-right? +- Charts: are only the source style's donuts, small column charts, metric zones, and tabularized data used; are axes, legends, and labels understated and readable? +- Tables: are headers, grids, number alignment, summary rows, and footnotes clear; is there no truncation, garbled characters, overlap, over-density, or low contrast? +- Components: do hairlines, gray-filled boxes, contents, key numbers, and people cards serve information; is there no templated SmartArt or stacked colorful icons? +- Prohibited items: no shadows, gradients, glows, 3D, emoji, complex illustrations, social-media card style, or large black-background body pages? +- Completeness: check for no empty content, occlusion, wrong proportions, low-quality stretched images, misplaced page numbers, overflowing titles, or meaningless pages caused by repeated templates. +- No cards by default: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the better solution +- No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part structures such as three columns + a heading + a conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/03_work/04/en/color-stripes-documentary.md b/skills/open-kimi-ppt/reference/design_system/03_work/04/en/color-stripes-documentary.md new file mode 100644 index 0000000..fde904e --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/03_work/04/en/color-stripes-documentary.md @@ -0,0 +1,167 @@ +# T035 · The 2023 Impact Summary STYLE DESIGN SYSTEM + +## 1. Style Positioning + +Suited to long-form, externally communicated PPTs such as listed-company impact summaries, responsibility reports, ESG/AI governance, social value, skills outreach, and environmental action, aimed at policymakers, investors, partners, media, and employees. It builds institutional accountability through "a credible report + human stories + data evidence," not sales-roadshow-style visual shock. + +Content pages allow 3–5 columns of text, footnote links, quotes, and small data cards to coexist. Core visuals: a `#FFF9F3` off-white background, Arial sans-serif body text, occasional Times New Roman serif display titles, colored chapter strips/capsule navigation, photos of real people or scenes, and flat rectangular data cards. + +Underlying principles: +- **Credibility beats visual showmanship**: persuade with text, sources, attributions, photos, and data; decoration defers to reading — no complex backgrounds or a sense of motion. +- **Chapter colors serve navigation, not chromatic display**: each topic has one primary color used for the top strip, the current navigation item, data cards, or quote backgrounds; avoid multiple highly saturated colors competing on the same page. +- **High density must be structured**: split content with columns, hairlines, cards, subheadings, and footnotes; do not pile on content by shrinking text or compressing line spacing. + +## 2. Page Skeleton + +- **Canvas ratio**: landscape widescreen 16:9. +- **Global background**: main pages use warm off-white `#FFF9F3` / `#FFFAF4`; do not change it to pure white, dark, or gradient backgrounds. Section divider pages and some viewpoint pages may use a solid-color strip occupying the top 20%–30% of height. +- **Margins**: a relatively wide starting margin at the top-left, relaxed outer margins and clear column gaps; no edge-to-edge typesetting; small space for a page number or small symbol reserved at the top-right. +- **Title zone**: + - Chapter/methodology pages: a top colored strip carries the chapter title, a short description, and capsule navigation, left-aligned. + - Case/viewpoint pages: a large title on the left or top-left, a photo on the right or right half; the title may be set in a serif face. + - Regular content pages: a top-left title followed by multi-column body or a card zone, with clear spacing. +- **Body zone**: multi-column body text, left/right splits, text-image juxtaposition, and embedded data cards; reads left to right, top to bottom. +- **Header navigation**: rounded capsule labels along the top; the current chapter uses a filled or highlight color, the others a white/off-white ground with a thin outline. Low in height so it does not steal title hierarchy. +- **Footer and page number**: the page number sits at the top-right corner or a corner, at an extremely low level; the cover/back cover may carry a plain-text identity mark (write the new topic name; no graphic logo is drawn) and a date. Content pages do not require a large logo and have no heavy footer bar. +- **Identity mark**: the identity mark (small plain text spelling the organization name; no graphic logo is drawn) appears mainly on the cover, back cover, or report identity pages; on content pages it should be small and quiet — avoid brand-watermark-style repetition. +- **Sources/links**: placed at the end of body text, the bottom of cards, or the lower part of the page, at a smaller level with blue/purple underlines. +- **Background graphics**: no persistent geometric textures, watermarks, or decorative patterns; rely on solid colors, photos, and rectangular color blocks. The cover may use a colorful photo wall of square tiles. + +Default path: top chapter color and navigation → top-left title/question sentence → columned body → photos, quotes, data cards, and footnote links on the right. + +## 3. Content Organization + +- **How titles are written**: short sentences, question sentences, or action statements, such as "How we work," "Our approach to responsible AI," "How can we protect fundamental rights?"; do not stack marketing subtitles. +- **Information sentences**: one line of context, a person's name, or a role note may sit under the title — supplementing context without repeating the title. +- **Body organization**: mainly report paragraphs with a few bullets; left-aligned, narrow columns, small gaps between paragraphs. +- **Grouping logic**: organize by commitment, action, progress, case, and outlook; parallel modules usually number 3–5, each containing a subheading, body text, a link/source, or a small piece of data. +- **Number of viewpoints per page**: a high-density content page may contain 3–5 parallel topics; a case page focuses on one question, one photo, one quote, or one piece of data evidence; a large-type viewpoint page keeps only one core question/position. +- **How bullet points are written**: subheadings are short, body text uses complete sentences; do not turn a whole page into fragmented slogans. Bullets should be short — avoid multi-level indentation. +- **Keyword emphasis**: use Arial Bold for local bolding; links use blue/purple underlines. Avoid highlighter effects, outlined text, and rainbow-style emphasis. +- **Number definitions and measurement basis**: large-number cards present important figures; the number is tightly grouped with its unit — millions, billions, currency symbols, percentages — with one explanatory sentence below. Do not mix figures with different definitions or measurement bases in the same number card. +- **Time and sources**: years, reporting periods, and source links use small levels; footnotes must be readable. Quotes need a name/title/attribution or a supporting photo. + +## 4. Content Page Layout System + +### A. Colored Chapter Strip + Multi-Column Commitment Page + +Used for methodology, working principles, annual priorities, and responsibility frameworks. The top 20%–30% is a chapter-colored strip containing capsule navigation, a title, and a short description; below are 4–5 body columns, each with a subheading, paragraphs, links, or footnotes. Emphasis comes from the current navigation item, highlighted links, and local bolding. Do not use it for single-story pages or content needing large-image emotional impact. + +### B. Off-White Multi-Column Body + Embedded Data Cards + +Used for "action + results + investment" evidence pages. The body is 3–4 columns of text, with 1–2 colored data cards embedded at the lower right or lower middle; each card holds an oversized number, a short explanation, and a small icon/marker. If there are more than 3 data points needing horizontal comparison, switch to a table or chart — do not cram the page with cards. + +### C. Left-Text/Right-Image Case Page + +Used for cases about people, communities, education, environment, and philanthropy. The left off-white zone holds a large title/question sentence, short paragraphs, a link button, or a quote; the right 40%–55% holds a real photo, either full-height or as a large rectangle. The photo must be directly related to the case — no unrelated stock imagery. + +### D. Viewpoint Question Page / Large Serif Page + +Used for chapter transitions, core questions, and value positions. The serif title is far larger than body text and left-aligned; it may be paired with a short colored underline or a color-block button, with a photo on the right and only a small amount of explanation. Do not place 4-column body text or complex charts here. + +### E. Signed Letter / Leadership Message Page + +Used for opening positions and messages from leaders. Two- or three-column long text, paired with a circular portrait, name and title, and a handwritten signature; the large title may be serif, the body is Arial. Do not apply this layout when there is no signature, portrait, or clearly identified speaker. + +### F. Cover and Back-Cover Identity Pages + +The cover holds a plain-text identity mark (write the organization name; no graphic logo is drawn), the report title, and a date on the left, and a colorful photo wall of square tiles on the right; the back cover or closing page closes with a narrow photo wall and links/report name. Used only for opening and closing pages — not replicated repeatedly inside the body. + +## 5. Color System + +- **Background paper color `#FFF9F3` / `#FFFAF4`**: the deck-wide main background. It must not be replaced with pure black or strong gray; in print it may approach white but must retain its warm tone. +- **Primary text black `#131323` / `#1E171F`**: the primary color of body text, titles, and table text. Light gray must not replace body text. +- **Neutral grays `#9E9E9F`, `#C5BFBB`, `#EDE8E4`**: hairline dividers, table rules, secondary notes, photo boundaries, and weak backgrounds; they do not carry primary information. +- **Chapter purple `#6F2572`**: top strips, current navigation, quotes, or emphasis cards for AI/responsibility chapters; in body text it appears only as links, labels, or data emphasis. When replacing it, keep sufficient depth and white-text contrast. +- **Chapter yellow `#FFB901`**: top strips, data cards, and right-side emphasis blocks for skills/learning chapters; paired with black text — avoid low-contrast white text on yellow. +- **Light purple `#C6B3E4` / `#C5B3E3`**: quote boxes, auxiliary data cards, and soft emphasis zones; it carries black or deep-purple text and is not spread at large scale as the base of main body text. +- **Blue `#0978DE`**: links, a small number of chart series, emphasis marks, or the brand color within cover photos; small in area. +- **Green/teal `#6D7A62`, `#B8DCD2`, `#152C27`**: environment or sustainability chapters, data cards, and photo echoes; deep teal card grounds pair with light text, light teal serves as an auxiliary ground. +- **Orange-red family (near `#FF5A3D`)**: chapter strips, labels, or emphasis lines; use one primary color per page and do not let it compete at large scale with yellow and purple at the same time. + +One page should have only 1 chapter primary color + off-white + black-gray; data cards may add 1 auxiliary color. Do not invent a red-green up/down system out of thin air. Brand colors may replace chapter colors, but the "top strip/navigation/cards" roles remain unchanged. + +## 6. Typography and Text Hierarchy + +- **Type character**: body text is dominated by Arial; titles and viewpoint pages occasionally use Times New Roman. Do not mix decorative or handwritten fonts into body text. +- **Body text**: 1x — the baseline for multi-column paragraphs, table notes, and case text. +- **Subheadings/column headings**: about 1.1–1.3x, commonly Arial Bold. +- **Page titles**: regular content pages about 2–3x; chapter-strip titles may reach 3–4x, left-aligned. +- **Serif display titles**: Times New Roman titles may reach 3.5–5x, with tight but non-overlapping line spacing. +- **Data numbers**: about 4–6x; units grouped with the number; explanatory text at 0.8–1x. +- **Information sentences/attributions**: about 0.9–1x. +- **Footnotes/links/page numbers**: about 0.55–0.75x; page numbers extremely weak, footnotes readable. +- **Emphasis methods**: prefer Bold, color-block grounds, and link colors; do not use outlined text, drop-shadow text, gradient text, or large blocks of centered typesetting. + +## 7. Chart Language + +Charts are kept simple, dominated by data cards, small tables, and a small number of simplified graphics. +- **Type boundaries**: suited to small column/bar charts, progress bars, simple comparisons, and data-label cards; not suited to complex dashboards, radar charts, 3D pie charts, or multi-axis financial charts. +- **Axes and grid**: gridlines are extremely faint, in neutral gray; axes are de-emphasized — avoid thick black axis lines. When values can be labeled directly, a legend is not mandatory. +- **Series colors**: the current chapter's primary color + light gray/light auxiliary colors; a single chart should not exceed 3–4 colors. +- **Data labels**: key values sit close to the graphic or on cards; key data uses the chapter color or oversized numbers. +- **Baseline/target lines**: use thin lines with short callouts — avoid red-alarm-style thick lines. +- **Legends**: small, close to the chart, with simple swatches; do not build a large standalone legend zone. + +## 8. Tables and High-Density Information + +- **Header**: subheading-level and Bold; background is off-white, light gray, or a light chapter tint. Avoid dark headers dominating the visual. +- **Row/column structure**: thin light-gray lines, separating with whitespace and hairlines; row height remains readable, not compressed into a dense-database feel. +- **Background fills**: large areas of off-white; key cells may be card-ified in light purple, yellow, light green, or blue. +- **Number alignment**: numbers right-aligned or unified by decimal point/unit, text left-aligned; large numbers may become standalone cards. +- **Key rows/columns**: use small chapter-colored labels, light fills, or Bold; avoid filling entire rows with highly saturated color. +- **Zebra striping**: not a strong rule; if used, only an extremely shallow gray/off-white difference. +- **Symbols and ratings**: small dots, dashes, checkmarks, or short color bars may be used, but must not develop into a complex icon system. +- **Overflow control**: rather split into multiple columns or two pages than let text touch the edge, footnotes overlap, or a table cover the page number. + +## 9. Components and Graphic Elements + +- **Capsule navigation**: small rounded labels across the top; the current chapter is filled with the chapter color or highlighted, the others have white/off-white grounds with thin outlines. Text is extremely short — it must not become a secondary contents list. +- **Chapter color strip**: about one-fifth to one-third of the page height at the top, carrying title, description, and navigation. Do not stack multiple large color strips on the same page. +- **Data cards**: rectangular or slightly rounded, filled with yellow, light purple, green, blue, etc.; containing a large number, a short explanation, and a small marker. Suited to 1–2 core numbers — not suited to being piled into a nine-square grid. +- **Quote boxes**: light purple, off-white, or chapter-colored blocks containing quotation marks, a short sentence, and a name/portrait/signature; they must have a source. +- **Photo frames**: real photos in rectangular crops, often occupying a large zone on the right, and may be spliced with color blocks. Photos get no thick borders, shadows, or complex masks. +- **Link buttons/source bars**: small colored rounded bars or underlined text, sitting close to the relevant body text — never floating. +- **Divider lines**: thin gray lines or short colored lines, used between columns, for title emphasis, and at table boundaries; lines should be light and must not form a caged grid. +- **Portraits and signatures**: used on leadership-message and quote pages; must not be overused on ordinary data pages. +- **Icons**: only a few small markers/simple symbols; they must not expand into a large colorful icon collection; they must support labels and must not express complex concepts alone. + +## 10. Texture and Prohibited Items + +The overall feel is flat, restrained, and report-like — typesetting, color blocks, photos, and data — without relying on visual effects. + +**Prohibited:** +- Large-area gradient backgrounds, glows, 3D, skeuomorphic buttons, thick shadows, glassmorphism, and complex textures. +- emoji, cartoon illustrations, unsourced decorative icons, and social-media-poster-style large centered slogans. +- Pressing large amounts of body text directly onto full-image backgrounds, or using low-contrast light-gray body text. +- Multiple highly saturated chapter colors juxtaposed on the same page competing for the main visual. + +**Use with caution:** +- Rounded corners: navigation capsules, buttons, and data cards may be slightly rounded; large body containers should not all become rounded cards. +- Photos: should be evidence of real people/scenes; no staged stock shots unrelated to the content. +- Colorful icons: only as extremely small auxiliary markers — they cannot become the main visual system. +- Tables/charts: used only when a genuine data-comparison need exists, keeping light lines and direct labels. + +**Allowed on special pages:** +- Cover/back cover may use a colorful photo wall of square tiles or large-image collages. +- Viewpoint pages may use oversized serif titles, short colored underlines, and half-page photos. +- Leadership-message pages may use portraits, signatures, and long-text typesetting. + +## 11. Generation Checklist + +- Is it a 16:9 warm off-white report ground, without mistakenly using pure white/dark/gradient backgrounds? +- Does the page have a clear top-left title, a body reading path, and sufficient outer margins and column gaps? +- Do section divider pages use a single chapter-colored strip with capsule navigation, and is the current item highlighted? +- Is the copy issue-styled short titles + report paragraphs/parallel subheadings, rather than stacked marketing slogans? +- Is body text based on Arial 1x, with title, number, and footnote levels relatively clear and free of absolute font-size dependencies? +- Is the single-page primary color controlled to 1 chapter color + a neutral base, with restrained link/data emphasis? +- Is the multi-column body free of edge-touching, overlap, truncation, garbled characters, over-tight line spacing, or low contrast? +- Are photos real, relevant, and rectangularly cropped, without thick shadows or complex masks? +- Do data cards highlight only a few key numbers, with number/unit/explanation complete? +- Are charts light-gridded, weakly axised, and directly labeled, without 3D, multiple axes, or too many series colors? +- Are tables thin-lined and lightly filled, with text left-aligned/numbers uniformly aligned, without excessive filling? +- Do components come from the system — capsule navigation, chapter strips, data cards, quote boxes, photo frames, hairline dividers — rather than newly added decoration? +- Are emoji, complex illustrations, glows, gradients, thick shadows, large blocks of centered body text, and empty-content placeholders avoided? +- Do cover, body, chapter, case, and closing pages vary while still keeping the same report skeleton? +- No cards by default: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are the better solution +- No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part structures such as three columns + a heading + a conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/03_work/05/en/moon-white-imagery.md b/skills/open-kimi-ppt/reference/design_system/03_work/05/en/moon-white-imagery.md new file mode 100644 index 0000000..30b1a8d --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/03_work/05/en/moon-white-imagery.md @@ -0,0 +1,157 @@ +# C007 · 2023 Organization Name impact report highlights STYLE DESIGN SYSTEM + +## 1. Style Positioning + +Suited for corporate impact reports, ESG/sustainability summaries, and technology-product-and-environmental-data narratives, aimed at investors, media, policy/industry observers, and internal management. Information density is medium to slightly high, alternating between "readable report pages" and "immersive photography pages." Core visuals: near-white background, black/gray sans-serif text, extremely thin light-gray lines, low-saturation green accents, real automotive/factory/nature/crowd photography, minimal decoration, generous whitespace. + +Underlying principles: +- **Credibility over decoration**: pages should feel like a formal report rather than a marketing poster; elements must serve the argument, the data definitions and measurement basis, or real-scene evidence. +- **Whitespace over filling**: when there is too much information, split pages, use columns, or use tables — do not shrink font size or cram in components. +- **Green is used only for positive/environmental/data emphasis**: it must not expand into a large decorative background color or meaningless highlighting. + +## 2. Page Skeleton + +- **Canvas ratio**: widescreen 16:9 landscape. Content pages are mostly near-white/white backgrounds; the cover, section transitions, and closing page may use full-bleed dark photography or a black background. +- **Margin system**: wide margins on all four sides — content never touches the edge; titles, body text, charts, and photos all have a clear outer boundary. Photos may approach half the page width but must retain breathing room. +- **Title area**: located at upper left or center-upper-left, using a black/dark-gray short phrase or a complete judgment sentence; followed by 1–2 paragraphs of light-gray explanation. The title area does not use colored bars, bold frames, or large background panels. +- **Body area**: carries photos, charts, metric groups, product relationship diagrams, or multi-column text. Common structures: text left / image right, image left / text right, title on top / chart below, a central relationship diagram, or horizontal metric cards. +- **Header**: at the very top, an extremely small light-gray report name/section name/auxiliary navigation aligned left or centered — no prominent navigation bar. +- **Footer and page number**: page numbers usually sit at the upper right or edge, rendered extremely small and light gray; footnotes/sources sit at the bottom or near the chart. +- **Logo**: the brand logo does not repeatedly appear as a large logo on every page. +- **Cover/section pages**: full-bleed or large-scale photography, with text overlaid at lower left/left side. The cover may separate the large title and year; section pages may use a darkened photo overlaid with white text. +- **Dividers**: used only between chart axes, tables, metric cards, or text columns, using extremely thin light-gray lines. Thick lines, colored horizontal bars, and decorative borders are prohibited. +- **Watermarks/background graphics**: by default, no abstract watermarks, textures, or geometric backgrounds are used; dark atmosphere comes from photography or a pure black background. +- **Default reading path**: top-left title → subtext/metric explanation → evidence area on the right or below → footnote source. + +## 3. Content Organization + +- **Title style**: use a self-contained conclusion sentence, action sentence, or thesis sentence, e.g. "a product delivers a certain impact" or "an action reduces a certain footprint." Avoid vague slogans and word-stacking. +- **Key message sentences**: below the title, use a short, report-style explanation of background, measurement basis, or causation, in a color lighter than the title. +- **Body text organization**: use short paragraphs, 2–3 text columns, or a small number of bullet points; long policy/explanatory content may be split into columns with generous line spacing and column gaps. +- **Number of points per page**: one core point per page, supplemented by at most one photo, one chart, or one group of metrics. Multiple sub-points use horizontal cards, columns, or tables rather than scattered placement. +- **Bullet style**: use traditional bullet lists sparingly; prefer short paragraphs, subheadings, metric cards, and table cells; when bullets must be used, the markers should be small, light, and restrained. +- **Keyword emphasis**: use large numbers, dark/light contrast, low-saturation green, and whitespace. Do not use neon highlighting, underlines, or multi-color emphasis within body text. +- **Numbers/units/time frames**: key numbers may be enlarged and stand alone; units follow directly after the number or appear as a small label. Percentages, tonnage, mileage, years, etc. must retain their definitions and measurement-basis notes; timelines or years should align with data charts. +- **Source footnotes**: data pages must include an extremely small light-gray footnote or source note, placed at the bottom or below the chart; it only supplements the measurement basis and does not carry the main narrative. + +## 4. Content Page Layout System + +### A. Text-left/image-right or image-left/text-right type +For product scenarios, manufacturing facilities, energy facilities, and evidence involving people or locations. The text side holds a title, 1–2 explanatory paragraphs, a footnote, or a small status dot; the image side holds one real photo occupying about 40%–55% of the page's visual width. Images are rectangular or slightly rounded, cleanly cropped. Text delivers the conclusion; the photo delivers scene evidence. Not suitable for multi-set data comparison, complex processes, or long body text. + +### B. Large-image immersive type +For covers, section pages, theme transitions, manifesto-style closings, and mood pages. The photo fills the entire page or most of the canvas, with text overlaid at lower left/left side; darken the photo when necessary to ensure white text remains readable. May use a larger title and year/section information. Not suitable for large amounts of numbers, tables, or fine-grained charts. + +### C. Title + horizontal metric group type +For summaries such as climate impact, emissions share, cumulative results, and efficiency metrics. Place the title and a brief explanation at the top or upper left, with 4–6 metrics arranged horizontally below; each contains a large number and a small unit/explanation, separated by extremely light backgrounds or thin lines. Highlight key numbers in mint green, others in dark or light gray. Should not be used when metric definitions or measurement bases differ too much or explanatory text is too long. + +### D. Chart-argument type +For a single quantitative argument such as trend change, cumulative impact, amount avoided, or efficiency decline. The title sits at upper left or top, with the chart occupying the lower half or a large area on the right. Use light-gray grids, extremely thin axis lines, few series colors, and direct labels; a green trend line/baseline expresses the core conclusion. Do not use multi-color business-dashboard-style charts; split the page or simplify when there are more than 2–3 series. + +### E. Central relationship / product-substitution diagram type +For product ecosystems, substitution relationships, and energy-system composition. Built around a central node, small product images, or simplified objects, connected by extremely thin light-gray lines; text labels are very small, background is white. Rely on central position, whitespace, and connection relationships for emphasis — do not use colored icons. Should not be used when there are too many nodes, complex crossings, or many process steps. + +### F. Multi-column report text type +For reading-oriented content such as policy explanations, supply chain, ethics, workforce, and materials. Title placed at upper left, body text split into 2–3 columns with balanced column widths and wide column gaps; a small photo may be added at the side or bottom. Use subheadings or green numbers to extract key points — do not use large background color blocks. Not suitable for presentation scenarios or quick-scan pages. + +### G. Table / high-density comparison type +For structured comparisons such as vehicle models, metrics, regions, or project status. Title on top, table centered or occupying a large area below; organize with light-gray lines and light background colors, using heavy borders sparingly. Highlight only key columns, summary rows, or status dots. If the explanatory text exceeds the table itself, switch to a multi-column text page instead. + +## 5. Color System + +- **Primary background white / near-white**: #FAF9F7, #F8F8F8, #F5F6F6, #F1F2F2. Used for most content pages and occupies the largest area. Must not be replaced with a colored background; branding may only slightly adjust the warmth/coolness of the white. +- **Primary text black/gray**: #111111, #111215, #23272E, #262F35. Used for titles, key numbers, axis labels, and body emphasis; titles are near-black, body text may be dark gray. Must not be replaced with colored titles. +- **Secondary text gray**: #64726D, #93A299, #ABB3B1, #BCC8C5. Used for subtitles, paragraphs, footnotes, weak labels, and axis text; must not be so light that it disappears. +- **Dividers / grid gray**: #EDEFEE, #ECEDED, #D6DAD9, #C6C9C9. Used for chart grids, table lines, card dividers, and light backgrounds; contrast must be low to avoid a heavy, table-like feel. +- **Environmental accent green / mint green**: #95BFA9, #BBE6D1, #65A889, #2E9B73. Used for key percentages, environmental metrics, trend lines, positive status dots, and small labels. Small-to-medium area; not used as a full-page background color or ordinary decoration. +- **Dark photo / black-background pages**: #060608, #0D1708, #121C25, #202611, #404720. Used for night scenes, forests, factories, darkened photos, immersive pages, and manifesto pages; text uses white/light gray. +- **Natural photo colors**: forest green, road black, sky blue-gray, factory gray, and vehicle white/black/red come from real photography and are not elevated to component colors. Photo colors must not be arbitrarily extracted as chart series colors. +- **Chart series color boundary**: keep a single page's main hue within black/gray + green; for multiple series, use different gray brightness levels plus one green accent. Avoid multi-color legends such as red/orange/purple/blue unless the original data states genuinely require distinction. +- **Positive/negative status**: positive/improving uses green; negative/risk defaults to dark-gray text or annotation notes — introduce red cautiously. + +## 6. Fonts and Text Hierarchy + +Use a modern sans-serif typeface with a clean, technological, report-like feel, consistent with the visual tone of the organization or an industrial-technology brand. Serif fonts, handwriting fonts, cartoon fonts, or decorative fonts must not be used. + +- **Body text = 1x**: paragraph explanations and table body text, dark gray or medium gray, with relatively loose line spacing. +- **Titles = 2.5–4x**: the page's main point, black/dark gray, medium-to-slightly-bold weight; cover/section pages may be larger. +- **Key message/subtitle = 1.1–1.4x**: below the title, in a color lighter than the title. +- **Subheadings/group titles = 1.1–1.6x**: used above tables, chart titles, and column lead-ins, with slightly stronger weight. +- **Key numbers = 3–6x**: paired with units and small labels; no additional bold frame is needed. +- **Chart labels/table text = 0.8–1x**: clear but weaker than body titles; chart axis labels may be even lighter. +- **Annotations/footnotes/page numbers = 0.5–0.7x**: extremely small, light gray, near the edge. +- **Text layout**: text-heavy or numeric pages are mostly left-aligned; avoid large centered blocks. Title line breaks follow semantic divisions. + +## 7. Chart Language + +Uses report-style concise line charts, bar/small metric charts, share indicators, and a small number of relationship diagrams — no business dashboards. + +- **Chart types**: line trends, simple horizontal/vertical bars, percentage metric cards, a single baseline or comparison line. Relationship diagrams use small product images + thin connecting lines. +- **Axes**: extremely thin axis lines, in light gray or dark gray with low opacity; few tick marks, avoiding dense scales. +- **Gridlines**: extremely light thin gray lines, only to aid reading values, not forming a grid background. +- **Labels**: prefer labeling key values directly or placing small labels near data points, reducing legends; use gray, dark gray, and green for emphasis. +- **Series colors**: the core series uses a mint/green line, comparison series use light gray or dark gray. Do not use large numbers of highly saturated colors in the same chart. +- **Key data**: emphasize via a green line, an enlarged number, local bolding, or a side note. Do not use explosion shapes, glow, or thick arrows. +- **Forecast/target/baseline lines**: use thin dashed lines or light-gray lines, with small explanatory text near the line. Do not add gradient forecast bands. +- **Chart boundaries**: keep ample whitespace and a clear title. This style is not suitable when long legends, multi-layer filters, or complex interaction explanations are required. + +## 8. Tables and High-Density Information + +- **Headers**: use light-gray text or slightly heavier weight, with a near-white/extremely-light-gray background. Headers do not use a dark background with reversed white text. +- **Row/column structure**: separate with thin light-gray lines, weaken outer borders, and give ample whitespace between columns to avoid crowding. +- **Row height**: relatively loose; even high-density pages should not be compressed into a dense financial-statement-style grid. +- **Base colors**: extremely light-gray blocks may distinguish headers, summaries, or card areas; zebra striping, if used, must be very subtle. +- **Key rows/columns**: mark with green numbers, small status dots, a light background, or bolder weight. Avoid filling an entire row with a strong color. +- **Number and text alignment**: text is left-aligned; numbers are right-aligned by column or aligned by decimal place; units, definitions, and measurement bases are consistent for percentages, tonnage, quantities, etc. +- **Symbol markers**: small dots, short dashes, or minimalist status symbols may be used; do not use colorful, complex icons. +- **Page role**: a table must have a clear point-of-view title above it, and may have a footnote below explaining the measurement basis. + +## 9. Components and Graphic Elements + +- **Title bar/header micro-navigation**: an extremely small light-gray report name, section name, or page number at the top edge, used only for orientation. +- **Metric cards**: composed of a large number, a small label, a light background, or a thin divider; suitable for 3–6 parallel metrics; green is used only for key numbers or positive values. +- **Small status dots/badges**: small green dots or simplified marks, paired with a footnote, explanation, or positive status; small in size — must not develop into a large icon system. +- **Photo frames**: real photography uses a rectangular or slightly rounded frame, cleanly cropped; rounded corners should be small and modern. Photos have no thick borders or shadows added. +- **Tip/explanation blocks**: grouped with a light-gray background or whitespace, reducing the text's visual weight by using a lighter gray. Colorful warning boxes or speech-bubble dialogs must not be used. +- **Dividers**: extremely thin light-gray lines used for tables, charts, column separation, and relationship connections. All lines stay lightweight — no thick arrows or heavy strokes. +- **Process/relationship arrows**: use thin lines, faint arrows, or node connections to express substitution relationships or flow; prioritize reducing nodes and line crossings. +- **Product images/small objects**: use real product renders or cropped photo objects as nodes, in preference to generic icons. Colorful illustration-style icons should not replace them. + +## 10. Texture and Prohibited Items + +Overall keep it flat, restrained, report-like, and driven by real photography, creating page variation through layout and photos. + +**Prohibited:** +- Large gradient backgrounds, glow, 3D decoration, glassmorphism, complex textures, neon lines. +- Cartoon illustrations, emoji, social-media stickers, exaggerated colorful icons, hand-drawn arrows. +- Heavy borders, strong shadows, thick colored title bars, full-page brand-color backgrounds. +- Large centered blocks of copy, large numbers without a source, data decorated without a stated definition or measurement basis. +- Multi-color legend stacking, dashboard-style complex charts, low-contrast text overlaid on bright areas of a photo. + +**Use with caution:** +- Rounded corners: only for photo frames or light cards, with a small radius — must not become cartoonish. +- Shadows: the source file shows no stable shadow system; do not use by default; if needed for image layering, keep it extremely subtle. +- Colorful vehicle/photo colors: may come from real photography, but must not expand into the page's color system. +- Dark pages: used only for the cover, sections, closing, or strong emotional transitions — should not be widely used for content data pages. + +**Usable on special pages:** +- A full-bleed photo background with overlaid white text, for cover/section/closing pages. +- A black-background manifesto page, for the final summary or a strong point-of-view statement. +- High-density multi-column text pages, for report-reading scenarios, but must keep clear column spacing and footnotes. + +## 11. Generation Checklist + +- Is it 16:9 landscape, with content pages defaulting to a near-white background and wide margins? +- Is the title a clear point-of-view sentence, positioned at the upper-left/left reading start point? +- Does each page carry only one core point, with the evidence area choosing just one of photo, chart, metric group, or table as the primary element? +- Is the body text organized in short paragraphs/columns, avoiding large centered blocks and dense lists? +- Is color kept within black/gray/white + low-saturation green, without introducing an unfounded multi-color system? +- Is green used only for environmental, positive, or key-data emphasis, with a restrained area? +- Do charts use thin axis lines, light grids, few series, and direct labels, avoiding a dashboard feel? +- Do tables use thin lines, light backgrounds, and generous row height, with emphasis limited to green numbers or light background marks? +- Are photos real, cleanly cropped, free of thick borders or shadows, with sufficient contrast where text overlays them? +- Are the header, page number, and footnotes small and light, without becoming prominent decoration? +- Are gradients, glow, 3D, complex illustrations, emoji, strong shadows, and thick borders avoided? +- Have you checked for overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong proportions, and mechanical template repetition? +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: lines, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/03_work/06/en/red-white-business.md b/skills/open-kimi-ppt/reference/design_system/03_work/06/en/red-white-business.md new file mode 100644 index 0000000..d74172d --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/03_work/06/en/red-white-business.md @@ -0,0 +1,186 @@ +# Organization Name · Business Report STYLE DESIGN SYSTEM + +## 1. Style Positioning + +A landscape PPT aimed at consulting-firm employer branding, talent attraction, corporate culture, and organizational-capability messaging. The audience is external candidates, employees, or a general business crowd; it conveys a credible, global, people-centered brand image through a small number of facts, awards, maps, photos, and strong slogans. + +- **One thesis per page, evidence serves the thesis**: each page sets only one explicit headline or conclusion; photos, maps, awards, logos, charts, or triptych components all revolve around that conclusion — do not let multiple points compete. +- **Red is used for brand tone-setting and conclusion landing points**: it may be used for the cover, transitions, title bands, bottom conclusion bars, or icon cores, without fragmenting into many small decorative dots. +- **Readability over decoration**: black-and-white/grayscale visuals, white-background information areas, and QuattrocentoSans bold large titles form high contrast; photos, badges, and charts must not overpower the text conclusion. + +## 2. Page Skeleton + +- **Canvas ratio**: landscape widescreen presentation ratio; primarily full-bleed landscape composition, alternating between white-background content pages, red-background slogan pages, black-and-white photo pages, and mixed collage pages. +- **Margin system**: red bars, photos, and cover diagonal-cut color blocks may approach the canvas edge; body text, logo walls, maps, and badge groups keep clear outer margins. The bottom red bar often spans most of the width, carrying the conclusion. +- **Title area**: + - A top red horizontal bar with a white, all-caps, bold title, used for sections/themes. + - A large red title at upper left on a white background, used for opinion or vision pages. + - Special slogan pages use large white text centered or at the bottom, without relying on a traditional header. +- **Body area**: uses black-and-white photos, maps, award badges, logo walls, circular triptychs, simple line/area charts, or large numbers; a single page retains only one primary visual logic. +- **Header/footer**: a few consulting content pages may place an extremely small confidentiality notice, document description, or footer information at the bottom edge; communication pages usually have no complex header navigation. +- **Page numbers**: no explicit page-number system; new pages may omit them, or place them only at a weakened footnote level. +- **Logo**: the brand logo is used on identity pages such as the cover and closing page. The closing page is a red background with a centered white logo and a small tagline; the logo is not repeated and enlarged on every page. +- **Navigation/watermark**: there is no stable table-of-contents navigation, section progress bar, or watermark system — none should be forced in. +- **Dividers and background graphics**: use solid red rectangles, diagonally cut red blocks, black horizontal bands, and circular crops; do not use complex wireframe backgrounds, gradient textures, or abstract decorative networks. +- **Default reading path**: first read the red title band or large slogan, then view the primary visual evidence, then read small annotations/footnotes. On image-left/text-right pages, view the photo first, then read the bullets and bolded keywords on the right. + +## 3. Content Organization + +- **Title style**: mostly concise, action-oriented verb or noun phrases, often set in all caps when appropriate. Usually 1 line, at most 2; avoid long sentences, Q&A-style titles, and stacked multi-level subtitles. +- **Key message sentences**: QuattrocentoSans Bold carries short labels, quote-style slogans, or small group names — not formal long body text. +- **Body text organization**: left-aligned bullets, 3–5 items per page, each spanning 1–3 lines; keywords are locally bolded with QuattrocentoSans Bold, not relying on colored highlighting. +- **Grouping logic**: three-way groupings are used for parallel evidence, awards, or result categories; two-way groupings are used for photo + text, red block + photo, or title + proof; logo walls are arranged by visual weight rather than a strict grid. +- **Number of points per page**: by default 1 main point + 1 category of evidence; complex pages may have 2–4 evidence points, but they must all revolve around the same conclusion. Do not simultaneously place vision, metrics, process, cases, and multiple charts. +- **Numbers and units**: key numbers use oversized bold text, combined with the conclusion phrase into "quantity + object + scope"; may be placed on the bottom red bar or at the page center. +- **Source footnotes**: confidentiality notices, sources, and annotations are placed at the bottom or near the chart, using extremely small text that only explains the source and limitations without expanding into business narrative. + +## 4. Content Page Layout System + +### A. Image-left/text-right intro page + +For institutional facts, capability scope, or background information. The left side holds a black-and-white or low-saturation photo; the right side, on a white background, holds a bold small heading and a bullet list, with black body text and bolded key phrases. Suitable for a moderate amount of text; not suitable for complex tables, multiple charts, or too many small icons. + +### B. Map + bottom red conclusion bar + +For global coverage, offices, or regional distribution. The body is a light-gray dot-matrix/line-drawn map, with locations marked by red dots and thin lines, and city labels in small black/gray text; the bottom red bar carries a large-number white-text conclusion. Not suitable for precise geographic analysis or dense route explanations. + +### C. Red-background large slogan page + +For section transitions, thematic emphasis, or value propositions. A large solid-red background, with large white QuattrocentoSans Bold text centered or off-center, possibly paired with a large symbol or short phrase. Expresses only one thesis; bullets, long paragraphs, or complex charts must not be layered on. + +### D. White-background opinion + red block/photo collage page + +For talent vision, culture statements, and emotional expression. A large red title on a white background at the top; below, red rectangular text blocks and black-and-white portrait photos placed side by side. Red blocks carry short white bold phrases; not suitable for fine-grained data explanations. + +### E. Award badge/logo evidence wall page + +For external endorsements, partners, or recognition. Primarily white background, with a red bar at top or bottom stating the theme; badges/logos arranged in 2–3 rows, sizes fine-tuned by brand visual weight. Very little text explanation, preserving whitespace. Not suitable for long explanations or forcing logos to equal size, causing crowding. + +### F. Three-circle parallel evidence page + +For three categories of results, three challenges, or three types of recognition. Three circular visual objects divided evenly horizontally, with bold labels at the top; the circles may hold black-and-white photos, red graphic icons, or grayscale portraits. Suitable for up to three items; more than three should switch to a list or grouped wall. + +### G. Chart + horizontal emphasis band page + +For a small amount of trend data. A short heading-style explanation at the top, with a concise line/area chart as the body, overlaid with a black horizontal band carrying a white-text conclusion. The chart serves as evidence, the band as explanation; do not use when there are too many data series or precise readings are needed. + +### H. Black-and-white photo slogan page + +For culture statements or emotional closure. The photo fills the body or most of the frame, with large bold white all-caps text placed over a dark area, possibly paired with a bottom red bar. Must ensure the photo is dark enough and text contrast is sufficient; white text must not sit directly over a bright area. + +### I. Text + bottom red conclusion page + +For support systems, principle lists, or action commitments. A red bold title at the top or left, with bullets beside it; the bottom red bar carries the final commitment. Used to converge supporting points into one slogan; not suitable for listing more than 5–6 sub-items. + +## 5. Color System + +- **Background white: #FFFFFF** + - Used as the primary background for content pages, evidence walls, map pages, badge pages, chart pages, and most information pages. + - Do not add warm paper textures, light color gradients, or complex background patterns; must not be casually replaced with a brand light color. + +- **Brand primary red: #CC0001 / #C00000 / #CE2222** + - Used for cover overlays, full-page red backgrounds, title bars, bottom conclusion bars, key graphics, and red text titles. + - May be used as a small accent or across the full page; transitions/back covers may be dominated by it, while content pages typically use it for 10%–30% of the area. + - Do not compete with other highly saturated primary colors; do not use for long body text. + - When migrating brands, it may be replaced by the new brand's single primary color, but high saturation, strong contrast, and consistent use must be maintained. + +- **Primary text black: #111111 / #1B1B1B / #292929** + - Used for body text, bullets, labels, chart text, and dark text on photo pages. + - Avoid using light gray for body text; black text is placed only on white or light-gray backgrounds; colored body text is not recommended. + +- **Neutral gray: #4B4B4B / #747474 / #B6B5B5 / #D7D7D7** + - Used for black-and-white photos, map background textures, chart coordinates, city labels, and divider auxiliary elements. + - May be used across large areas on photo and map pages; grayscale should only be supportive — it should not make the overall page low-contrast, nor turn into a colorful illustration background. + +- **Black accent band: #222222 / #2A2A2A** + - Used for horizontal explanatory bands on chart pages and some photo text overlays, carrying white conclusion text. + - Do not use it as a title of equal rank alongside the red bar, to avoid competing focal points. + +- **Evidence green: #53951A / #306937** + - Used only as the genuine source color of award badges — it is the original color of external certifications. + - Not a global accent color; must not be expanded into a chart's primary color or a title color. + +- **Chart/status color boundary**: a single page's main hue is usually only red plus black/white/gray; badges/logos may keep their original colors but must not be expanded further. Positive/negative status prefers text, arrows, and red emphasis rather than a multi-color traffic-light system. + +## 6. Fonts and Text Hierarchy + +- **Font character**: the whole deck uses QuattrocentoSans (a Verdana-class humanist sans, built-in), layered through Regular/Bold; no handwriting-style fonts. +- **Title hierarchy**: main titles use QuattrocentoSans Bold, all-caps, about 2.5–4x the body size; red backgrounds use white text, white backgrounds usually use red text; line spacing is tight. +- **Slogan/large-number hierarchy**: covers, transitions, map conclusions, and photo slogans may reach 3–5x the body size, and must be short and bold. +- **Key message/subtitle**: about 1.2–1.8x the body size, may be regular or bold, must not overpower the main title. +- **Body bullets**: body text = 1x, primarily QuattrocentoSans regular, with key phrases bolded in QuattrocentoSans Bold at the same size; bullet markers are simple with shallow indentation. +- **Subheadings/group labels**: QuattrocentoSans Bold, about 0.9–1.3x the body size. +- **Table/chart labels**: about 0.55–0.8x the body size, in black/gray, must not compete with the main title for attention. +- **Annotations, footnotes, confidentiality notices**: about 0.25–0.35x the body size, placed at the bottom, in gray-black, extremely low visual weight. +- **Page numbers**: if present, at the same level as footnotes, not constituting a visual element. + +## 7. Chart Language + +- **Chart types**: use a single trend chart, or an overlaid line/area chart, to prove "results changing over time"; do not build complex multi-chart dashboards. +- **Axes and gridlines**: axes are thin, gray-black; gridlines are weakened or minimal; axis labels are small. +- **Series colors**: the data body uses a red area/line, paired with a black/gray baseline when necessary; do not introduce multiple series colors. +- **Key data**: emphasize with a red data area, a peak marker, or a horizontal black explanatory band; avoid a large number of callout bubbles. +- **Legends**: omit or keep extremely minimal wherever possible; when there are only one or two data categories, label directly within the chart. +- **Forecast/target/baseline lines**: there is no stable forecast-line system; if needed, use a thin gray or black line — do not use flashy dashed lines. +- **Annotation language**: white-text horizontal bands may express short conclusions; charts serve as proof, not as the full narrative. + +## 8. Tables and High-Density Information + +There is no traditional large-table system; high-density information is mainly carried by bullet lists, logo walls, city-labeled maps, and badge collections. + +- **Table usage boundary**: when a table must be used, keep a white background, black/gray text, and thin gray dividers; red is used only for the header or summary conclusion, without heavy borders or multi-colored backgrounds. +- **Headers**: may use a red background with white text, or black/gray bold text; kept compact, avoiding decorative gradients. +- **Rows and columns**: row height prioritizes readability, column count should not be excessive; text is left-aligned, numbers are right-aligned or aligned by decimal place. +- **Dividers**: use thin light-gray lines; do not use heavy black grids or many vertical lines. +- **Base color**: default white background; extremely light gray may distinguish groups; overly strong zebra striping is not recommended. +- **Key rows/columns**: highlight summaries with a red bar, red title text, or bold — do not fill many parts of the table with red. +- **Symbols/rating dots**: there is no stable rating system; if needed, limit to black, gray, and red, paired with text explanation. +- **Page role**: a table can only serve as an evidence module — it should not replace the one-page-one-thesis structure. + +## 9. Components and Graphic Elements + +- **Red title band**: a horizontal rectangle carrying a white, all-caps, bold title, placed at the top or bottom; used to state the theme or conclusion, not for ordinary section decoration. +- **Bottom red conclusion bar**: used on map, award, and support-system pages, holding a large number or one promise; serves as the reading endpoint, kept as a short, high-contrast phrase. +- **Diagonally cut red cover block**: a red block covering the left side, cutting into the photo along a diagonal edge; suitable for cover/identity pages, not for repetition on every page. +- **Black-and-white photo frames**: grayscale portrait or scene photos, which may be full-bleed rectangular, half-page, or circularly cropped, serving the red-black-white brand contrast. +- **Circular crop components**: used for three-way parallel evidence, may hold photos, headshots, or red graphic symbols; evenly spaced with no heavy outlines added. +- **Handwriting-style labels**: used for group names, emotional phrases, and chart horizontal-band captions; used only for short phrases — cannot replace formal titles and body text. +- **Badge/logo wall**: preserves external logos in their original form, arranged around the red theme bar; logo sizes adjusted by visual weight. +- **Simple graphic icons**: including red arrows, grids, and flattened, simplified symbols such as people/globe; icons must be large, few, and conceptually clear; avoid colorful icon sets. +- **Map annotations**: gray map base + red dots + thin lines + city labels; not suitable for complex geographic data encoding. +- **Dividers and overlays**: use black horizontal bands, red rectangles, and dark areas of photos; do not use shadowed cards or glassmorphism. + +## 10. Texture and Prohibited Items + +Keep it flat, high-contrast, and consulting-style restrained; decoration comes only from color blocks, photo cropping, circular composition, and font hierarchy. + +- **Prohibited**: + - Large colorful illustrations, emoji, 3D graphics, glow, neon, complex textures, glassmorphism, skeuomorphic buttons. + - Multi-color icon sets, rainbow-style charts, fancy gradient backgrounds. + - Large centered blocks of copy, long paragraphs filling a red background, low-contrast gray body text. + - A large logo repeated on every page, complex navigation bars, social-media-card-style sticker decoration. + +- **Use with caution**: + - Shadows: the source file barely relies on shadows; do not add them proactively except for effects already inherent in external badges. + - Rounded corners: circular crops are usable, but rounded card corners are not the primary style. + - Colorful logos/badges: preserved only as external evidence in their original form; not expanded into the page's color scheme. + - Handwriting-style font: used only for short labels and emotional slogans; overuse weakens the consulting feel. + - Large-area photos: must be black-and-white or low-saturation, ensuring text readability. + +- **Usable on special pages**: + - Full-page red background: used for transitions, back cover, and strong slogans, not for carrying information-dense body text. + - Full-bleed black-and-white photo: used for culture statements or emotional closure, paired with large white text or a red conclusion bar. + - Diagonally cut red cover block: used for establishing identity at the opening; should not become the template for all content pages. + +## 11. Generation Checklist + +- Skeleton: is it landscape widescreen; is the white-background/red-bar/black-and-white-photo structure preserved; is there no forced table-of-contents navigation or watermark. +- Copy: is there one thesis per page; is the title short, direct, and inclined toward all-caps; is the body text bulleted, with keywords bolded rather than randomly colored. +- Hierarchy: do the main title, slogan/number, body text, labels, and footnotes form a clear relative proportion; is key information avoided in small, hard-to-read text. +- Color: is red + black/white/gray the primary palette; are external logo/badge colors confined to the evidence area; is there no competition among multiple primary colors. +- Layout: is a real layout chosen based on content — image-left/text-right, map+conclusion bar, red-background slogan, three-circle parallel, logo wall, chart+band, etc.; is mixing multiple templates avoided. +- Charts: are they concise, with few series, weak grids, and red emphasis; has a promotional page avoided becoming a complex dashboard. +- Tables: if a table is used, is it white-background with thin gray lines, with red only highlighting the header/summary; is there no heavy grid or multi-colored background. +- Components: do the red title band, bottom conclusion bar, circular crops, and black-and-white photos serve information function rather than piling up as decoration. +- Prohibited items: is there no emoji, 3D, glow, complex gradients, colorful icon sets, glassmorphism, or large centered copy. +- Quality: check for text overflow, truncation, garbled characters, overlap, low contrast, photos occluding text, empty placeholders, stretched proportions, distorted logos, and monotonous rhythm from template repetition. diff --git a/skills/open-kimi-ppt/reference/design_system/04_promotion/01/en/cream-collage.md b/skills/open-kimi-ppt/reference/design_system/04_promotion/01/en/cream-collage.md new file mode 100644 index 0000000..55ebd44 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/04_promotion/01/en/cream-collage.md @@ -0,0 +1,127 @@ +# Culture Collage · Cultural Collage STYLE DESIGN SYSTEM + +> Intended homepage tag: Promotion +> Visual metaphor: contemporary culture poster + tactile editorial collage + +## 1. Style Positioning + +Suitable for culture festivals, city events, brand collaborations, exhibition recruitment, community promotion, and partner invitations. The pages feel like a series of contemporary culture posters that can be flipped through continuously: bold typography, cropped imagery, paper-piece color blocks, offset numbering, and handcrafted textures together build the mood, while information can still be found quickly. + +Underlying principles: + +1. Each page first creates a clear feeling, then lets the date, venue, programs, and actions fall naturally into place. +2. The collage must be organized around a theme, a route, or a rhythm — no piles of random stickers. +3. Type, color blocks, and image scale must form a clear hierarchy; key facts must not hide inside artistic effects. +4. A single page uses at most one primary color and one contrast color — avoid equating "youthful" with full color. +5. When the event is a fictional concept, use only original abstract imagery, licensed assets, or honest placeholders — do not appropriate existing brand visuals. + +## 2. Page Skeleton + +16:9 landscape. Elements may have controlled bleed and offset, but all key information must stay within the safe area. The background switches among cream white, ink black, and a single high-saturation color. + +Pages do not fix a traditional title bar. The title may run vertically, span columns, or sit close to the main image, but every page still needs a clear first reading point. Dates, page numbers, and route numbers serve as stable navigation, fixed at edges or corners. + +The cover is like the main poster: the event name occupies 35%–55% of the frame, paired with one original key visual and one concrete invitation. The body forms a fast-slow rhythm among program collages, route posters, schedule strips, ticketing info, and partner actions. + +## 3. Content Organization + +Titles use invitations or statements the audience could say out loud, such as "Seven nights to hear the city anew." Subtitles add the date, venue, or how to participate. + +Each page carries at most one main narrative and 3–5 essential facts. Use short sentences, dates, verbs, and direct labels — no long brand manifestos. + +Content is organized as "get attracted — understand the experience — choose a route — plan participation — check participation requirements or eligibility — act now". Production notes, promotional strategies, and design remarks from the organizer's perspective must not appear on audience-facing pages. + +## 4. Content Page Layout System + +### A. Main Poster Page + +The event name, date, and one invitation sentence form the large typography, with the key visual occupying more than half. Information is sparse and clear — do not list every program and partner on the cover. + +### B. Program Collage Page + +Form a group of 3–5 images or color blocks at different scales, with program counts and categories embedded in the composition as large numerals. Each category keeps only its name, count, and one representative action. + +### C. Themed Route Page + +Present the three themed routes as three visual trajectories in different directions, each with one experience description, its main programs, and the suitable audience. The three routes need not be equal-width cards, but they must be comparable. + +### D. City Schedule Page + +Organize dates and venues with a horizontal seven-day rhythm strip or a four-zone map. Highlight key sessions by enlarging type size or using cropped color blocks — do not use dense calendar tables. + +### E. Participation Info Page + +Ticket prices, free-admission ratio, capacity, and how to register are arranged around one main image. Numbers must be clear — rotation, textures, or occlusion must not sacrifice their readability. + +### F. Partners & Action Page + +The left side states what partners can take part in; the right side gives promotional assets, deadlines, and a clear contact action. The ending must be a concrete verb such as "Register / Submit / Contact / Attend" — no vague thank-yous. + +## 5. Color System + +- Cream paper #F3E8D4: the light main background. +- Ink black #171717: titles, body text, and dark pages. +- Poster orange #F05A38: main invitations, dates, and energy focal points. +- Ultramarine #2557D6: routes, nighttime content, and contrasting information. +- Acid lime yellow #D9F04A: very small amounts of highlight, stickers, and action prompts. +- Pink mist #E8A7B3: secondary paper pieces and soft backgrounds. +- Paper gray #B8B0A4: captions, page numbers, and textures. + +A page uses cream paper/black as its base and picks only orange or ultramarine as the primary color; acid lime yellow covers less than 5% of the page. Rainbow gradients, purple-pink neon, and multiple high-saturation colors evenly distributed are forbidden. + +## 6. Fonts and Text Hierarchy + +Chinese pairs MiSans Bold with MiSans; English titles use Archivo Black (a compact ultra-heavy grotesk, via customFonts), body uses Liter; when necessary, Unna may serve as very short cultural footnotes. At most three typeface roles. + +- Event name: 6–9x body text; may break across lines, but the main word must not be split. +- Page title: 2.5–4x body text. +- Dates and key numbers: 3–6x body text. +- Program labels: 1–1.3x body text. +- Descriptions and ticketing: 1x; must remain comfortably readable. +- Page numbers and footnotes: 0.6–0.75x. + +A small amount of text may be rotated 90 degrees as navigation, but body text, prices, dates, and action information must never be rotated. Do not use handwriting-style fonts to carry key information. + +## 7. Chart Language + +Promotional pages do not use business charts by default. Quantitative relationships are preferably expressed through big numbers, proportional strips, program matrices, time rhythms, and zone distributions. + +When comparison is needed, use directly labeled single-series bars, stacked strips, or bubbles, with no redundant axes. Data graphics should blend into the poster layout, but values must remain precise. + +Do not use 3D pie charts, dashboards, complex radar charts, or waveform decorations that carry no information. + +## 8. Tables and High-Density Information + +Schedules and partner information use editorial-style lists: generous line spacing, clear dates, venues, and program names — no Excel-style full borders. + +Key sessions may be emphasized with a poster-orange block or a thick black underline; other items stay black and white. A full schedule of more than 10 entries should not be shrunk to cram into one page — present selectable main threads and the registration entry instead. + +Ticket prices and capacity must appear in normal orientation at large type sizes. Partnership benefits are not built into a pricing-card wall. + +## 9. Components and Graphic Elements + +Stable components include cropped photo frames, torn-edge paper pieces, misregistered overprints, route arrows, date stamps, oversized numerals, short underlines, and small starbursts. + +Use at most two texture techniques per page. Torn edges, grain, and misregistration are only light tactile touches and must not reduce the clarity of text or photos. + +The key visual may consist of original abstract photography, object close-ups, paper sculpture, or geometric constructions. If people appear, they must come from usable assets, without fabricated identities, quotes, or stories. + +## 10. Texture and Forbidden Items + +The whole should feel like a complete visual identity from an independent cultural institution: tactile, rhythmic, with a clear invitation. The anti-template feel comes from composition and scale, not deliberate messiness. + +Forbidden: random sticker packs, full-page torn paper, stacked retro filters, purple-blue neon, emoji arrays, social-media UI mockups, rounded-card walls, irrelevant trendy people, stolen brand posters, occluded key information, and mood with no way to participate. + +## 11. Generation Checklist + +- Does the cover communicate the event name, date, and appeal within 3 seconds? +- Do the six pages form a continuous path from attraction to actual participation? +- Does every image, color block, and numeral in the collage serve the theme or navigation? +- Are date, venue, price, capacity, and actions complete and readable? +- Does each page keep a single primary color without devolving into a rainbow poster? +- Are original/usable visuals used, without appropriating existing brands or fabricating people's stories? +- Are card walls, social UI, random stickers, and vague brand manifestos avoided? +- Have bleed safety, text occlusion, rotation misuse, overlap, cropping, and garbled text been checked? + +- No cards by default: unless the user explicitly requests them, it is strictly forbidden to use rounded-rectangle or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are better solutions +- No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part conclusions such as a three-way split plus a title plus a conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/04_promotion/02/en/silk-yellow-magazine.md b/skills/open-kimi-ppt/reference/design_system/04_promotion/02/en/silk-yellow-magazine.md new file mode 100644 index 0000000..e2df625 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/04_promotion/02/en/silk-yellow-magazine.md @@ -0,0 +1,161 @@ +# Organization Name Trend Report 2025 STYLE DESIGN SYSTEM + +## 1. Style Positioning + +A landscape magazine-style PPT / PDF design system for creative-industry trend reports, award insights, case studies, and annual reviews, aimed at visually sensitive readers who can accept high information density — designers, advertising creatives, brand owners, agency managers. It organizes body text, case images, quotes, statistics, and thematic groups in the manner of an "editorial magazine + awards archive + trend commentary", establishing order through strong color blocks, bold titles, column layouts, and hard-edged cards. + +Franklin Gothic sans-serifs form the typographic core; black, off-white, and brand yellow form the identity base, combined with coarse-grain / halftone imagery, hard-edged color blocks, magazine-style columns, and small navigation labels. Black and off-white backgrounds alternate; yellow serves as the brand anchor; large titles use extra-heavy sans-serifs and may occupy half a page; body text is split into narrow columns, cards, or quote blocks; images use case screenshots, work images, on-site photos, or grained imagery; headers and footers carry the report name, section labels, page numbers, and a small yellow identity mark. + +Underlying principles: + +1. **Establish page structure with strong contrast first, then fill in content.** Black / off-white / yellow / theme color blocks do the zoning; thin lines and shadows are not the primary structural means. +2. **High density is allowed; anchorless long text is not.** Every page includes at least one scanning entry point: a title label, a bold information sentence, a card boundary, an image, or a quote. +3. **Brand identity takes priority over decorative variation.** Keep the small yellow identity mark, the Franklin Gothic character, hard-edged rectangles, and grained imagery consistent; vary through layout and theme colors — do not add new effects. + +## 2. Page Skeleton + +The canvas is a landscape widescreen ratio, close to 16:9. Use left-right zoning, three-column grids, half-page text-image layouts, or full-page section visuals; keep narrow safe margins on all sides. Images may be cropped to full height or full width; text and the identity mark need edge clearance. + +**Cover / section divider:** a large image or grained background overlaid with an oversized title. The title sits left or occupies the left half; the image covers the full page or sits on the right. The cover may include partner names (plain text) and the report name; the section divider keeps the theme label, the giant title, and the small yellow identity mark at the bottom. Reading path: small label → giant title → background image mood → footer identity mark. + +**Table of contents / trend overview page:** a multicolor hard-edged card grid; each card contains a trend name and a short description; no rounded corners, no shadows — differentiated by hue and position. The top keeps the section label or report name, the bottom keeps the identity mark; scan left to right, top to bottom. + +**Content interpretation page:** off-white or black background; the top carries a section label as a rectangular block or short text navigation; the body contains body columns, quote columns, image areas, or case cards. Keep at least one explicit visual anchor. Reading path: header label → large title / information sentence → main image or main card → body explanation → quote / source. + +**Case text-image page:** the image occupies half to two-thirds of the page; the other side holds short body text, a quote, or captions. On black backgrounds, images are embedded as hard-edged rectangles; on off-white backgrounds, images may be full-height and center-cropped. Text and image are separated by whitespace or color-block boundaries, rarely by thin lines. + +**High-density parallel-module page:** use multi-column rectangular cards or side-by-side text blocks with narrow, clear spacing; title, body, and author / source are clearly graded. When content exceeds 4–6 modules, group with color blocks first instead of shrinking body text further. + +The header's top-left holds the section label or theme name; the top-center / top-right may hold a report name such as "TREND REPORT 2025" in small type. The footer carries a page number, small vertical side text, or the small yellow identity mark at bottom-center. The identity mark stays small — not a large watermark. Structure relies on background switching, card boundaries, image cropping, and whitespace, not on divider lines; there are no stable large watermarks or complex background graphics. + +## 3. Content Organization + +Titles are short and conceptual, often 2–5 words, in Title Case or all-caps labels; trend titles use noun phrases, contrast phrases, or attitude-laden concept words — no explanatory sentences. A page carries only one main concept. + +The information sentence is a complete judgment sentence or a short lead paragraph, at about 1.3–1.8x body size, in regular or Heavy weight; no longer than one short paragraph, used to explain the page's value. + +Body text is paragraph-based, rarely using traditional round bullets; it is split into 2–3 narrow columns or embedded in cards. For enumerations, use hard-edged cards with short titles + short body paragraphs — no ordinary bullet lists. + +Grouping may be organized by trend theme, case / opinion / quote, reader segment, awards or statistical entries, or color cards. A section divider holds 1 theme; an opinion page holds 1 main judgment + 1–2 pieces of evidence; an overview page juxtaposes 4–6 theme cards; a case page holds 1 case image + 1 interpretive paragraph + 1 quote. + +Keywords are emphasized with Heavy weight, yellow background, white-on-black, or theme-color cards. Do not use underlines, italics, highlighter smears, or mixed fonts. Numbers may be enlarged and combined with bold keywords; units, years, and award names sit right next to the numbers, not scattered into footnotes. Sources, authors, titles, and page numbers use small type, placed below quotes, in the footer, or at the side. + +## 4. Content Page Layout System + +**A. Black-background data / awards card page** +For annual results, key figures, award entries, and list-style information. The left side holds an introduction or background; the right side uses yellow hard-edged rectangular cards to carry numbers and entries. Main numbers are 2.5–4x body text; keywords use Heavy; cards are tightly packed with black gaps between them. Do not use for content needing delicate, long explanations — overly long body text on black reduces reading comfort. + +**B. Multicolor trend overview grid** +For 4–6 peer-level themes. The body is a horizontal collage grid; each block uses a different background color and contains a short title and a summary paragraph; titles Heavy, body regular weight. Color blocks have similar areas — avoid enlarging one theme without justification. This layout is unsuited to carrying many case images or complex data. + +**C. Off-white three-part text-image page** +For in-depth interpretation, case explanations, and juror opinions. The structure is a left body column, a large image in the middle or right, and a quote / supplementary note on the other side. Off-white background, black or dark-gray text, hard-edge cropped images. If no high-quality case image is available, use a quote card or a theme color block to complete the visual anchor. + +**D. Section big-type visual page** +For opening a trend section. A full-page grained photo or duotone halftone image overlaid with an oversized Heavy title. The title is left-aligned, occupies about half the page, and is colored white, pink, yellow, or a light tone depending on the underlying image. Use only for section transitions or strong statements — not for several consecutive pages, or the rhythm becomes too heavy. + +**E. Black-background case screenshot page** +For mobile screenshots, video stills, and on-site work. Screenshots are juxtaposed as hard-edged rectangles or at device aspect ratios, with a short interpretation and quote on the right or above; the small yellow identity mark serves as the footer anchor. Do not add realistic shadows or device frames to screenshots — keep the editorial-archive feel. + +**F. Quote / commentary card page** +For expert opinions, creator quotes, and concluding paragraphs. Quotes sit inside light-green, pink, or white color blocks, paired with grained graphics or case images; the quote text is slightly larger than body text, and the author info is markedly smaller than the quote. Do not make the entire page one big centered quote — keep the header label, source, and layout structure. + +## 5. Color System + +**Background black #070809 / #1D1D1B**: for section dividers, data pages, and case screenshot pages, up to full-page. Text on black uses white, off-white, or yellow; avoid dark-gray small type. + +**Off-white / warm gray #E3E2DD / #DAD8D0 / #DCDBD6**: for reading-oriented content pages and quote pages, up to full-page. May be replaced by a brand neutral close to warm gray, but never blue-white or bright cool white. + +**Brand yellow #FFD200 / #FFD900**: the core brand accent, used for labels, data cards, key numbers, the small yellow footer identity mark, and a few whole-block backgrounds, ranging in area from small badges to half-page cards. When yellow is used in large areas on a page, reduce other high-saturation colors. Not freely replaceable; if migrating to another brand, keep an equally recognizable primary accent color. + +**Primary text black #181917 / #232A31**: for titles and body text on off-white and light-color cards. Do not use overly light gray as the primary body color. + +**White / near-white #F5F3EA**: for text on black, reversed-out labels, and cards; its area is usually smaller than the black base, or it serves as the text color; ensure small text on black stays clear. + +**Theme pink / coral #F8B3A6 / #DB5B52**: for trend cards, section image overlays, and accent modules — not the primary brand color of the whole report. May be swapped per section for a theme color of equal saturation, but no more than 1–2 theme colors per page. + +**Theme blue #004370 / #114691 / #6D8BB0 / #8BBFE6**: for case images, section color blocks, and calm-tech themed pages; deep blues may serve as text or background, light blues as card fills. Do not place yellow, pink, green, and blue all at high saturation side by side, except in the overview grid. + +**Theme green #A3B9A3 / #7A876D / #E0FDBA / #E3FDBE**: for nature, design, and quote-type modules; light fluorescent green as an accent fill, gray-green as an image or background aid. Avoid staying too close to off-white, which causes low contrast. + +A regular page uses black / off-white / yellow + 1 theme color; overview pages may juxtapose multiple colors, but each block keeps a single-color base + black text. Do not invent a red-green up/down system; states are expressed first with text labels and bold — no new traffic-light color schemes. + +## 6. Fonts and Text Hierarchy + +Fonts are centered on Liter (body) and Archivo Black (titles, via customFonts), matching the source's FranklinGothicATF-Regular/Heavy grotesque system of moderate width and solid letterforms; avoid rounded tech fonts, serif fonts, or handwriting fonts. + +- **Giant section title**: 6–10x body text, Heavy, tight leading, left-aligned; may span an image or occupy half the page. +- **Page main title / key numbers**: 2.5–4x body text, Heavy or Regular + Heavy mixed, with emphasized words in Heavy. +- **Information sentence / lead**: 1.3–1.8x body text, mostly Regular; key phrases may be Heavy. +- **Body text**: 1x, Regular, paragraph-style typesetting, with controlled narrow-column line length. +- **Subheading / card title**: 1–1.3x body text, Heavy, placed above a paragraph or at the top of a card. +- **Quote text**: 1–1.5x body text, may be Regular; author and title at 0.55–0.75x. +- **Table / card entries**: 0.8–1x body text, titles Heavy, descriptions Regular. +- **Headers, footers, page numbers, sources**: 0.45–0.65x body text, Regular, all-caps or short labels. + +Text is mainly left-aligned; large centered blocks are not the norm. Report navigation and labels lean all-caps, trend titles lean Title Case, and body text uses ordinary sentences. Leading keeps magazine density; small text on black gets slightly more leading. + +## 7. Chart Language + +Prefer statistics, cards, case images, and editorialized information blocks over complex data charts. Traditional bar, line, and pie charts are used only when trend comparison truly requires them. + +The stable vocabulary includes: big numbers + text explanations, yellow data cards, peer-level entry cards, and theme rectangle grids. Axes, gridlines, legends, and complex multi-series colors are not default elements. + +When a chart must be generated: use a black or off-white background; thin, understated axis lines; very few light-gray gridlines; 1–3 series colors chosen from yellow, black, blue, pink, and green; labels close to data points or bars, minimizing standalone legends; key data marked with yellow fill, Heavy weight, or enlarged numerals. Do not use gradient bars, 3D pies, glowing lines, complex dashboards, or rainbow series. + +If forecasts, targets, or baselines must be added, use thin lines + small all-caps labels; they must not overpower the main title or the data itself. + +## 8. Tables and High-Density Information + +High-density information preferably uses hard-edged cards, color-block grids, and list entries; tables serve archiving and side-by-side comparison, not decorative data walls. + +Headers use Heavy, small all-caps, or short titles, with a yellow, black, or light-gray background. Rows and columns are separated by background blocks, spacing, and thin lines of consistent weight — no complex borders. Row height is compact but not cramped; text may wrap fully. Numbers are right-aligned or sit next to their units; text is left-aligned. When a column holds too much text, split it into cards instead of compressing the column width further. + +Key statistics or award items may be highlighted with yellow focus rows / focus cards; total rows use white-on-black or black-on-yellow. Zebra striping is not a primary feature — if used, it should be very subtle, close to the difference between off-white and warm gray. Symbol marks and rating dots do not appear stably and should not be added by default. High-density parallel modules must include title, body, and source / author levels — avoid giving all text the same weight. + +## 9. Components and Graphic Elements + +**Rectangular section label**: a small hard-edged rectangle at top-left, with yellow, white, light-green, light-blue, or black fill and small all-caps text; used for navigation and section positioning, not scattered in quantity as decorative stickers. + +**Yellow footer identity mark**: a small yellow identity point at bottom-center or a bottom corner, presenting the new theme name as plain small text — no graphic logo is drawn. When migrating brands it may be replaced by an identity mark of equal weight, but do not enlarge it into a watermark. + +**Hard-edged color-block card**: for trend summaries, data entries, quotes, and lists. No rounded corners, no shadows, no stroke or an extremely weak stroke; the interior uses title + body, title Heavy, body Regular. + +**Coarse-grain / halftone image treatment**: for covers, section dividers, and some case pages; applicable to photos, work images, and abstract textures. Must not impair body-text readability; text areas need a solid-color base or sufficient contrast. + +**Quote block**: a standalone paragraph or light-color card with author info; no exaggerated quotation-mark graphics needed. + +**Small side text / vertical navigation**: for page numbers, sections, or supplementary sources, placed near edges; avoid filling both sides of every page. + +**Image frame / screenshot frame**: hard-edged rectangular crop; may juxtapose two mobile screenshots or one large image. Do not add glassmorphism, rounded device shells, or drop-shadow overlays. + +Process arrows, matrix marks, and colorful icons are not stable core components; processes use simple hard-edged arrows or numbered cards, staying within the black / yellow / off-white system. + +## 10. Texture and Forbidden Items + +Overall: flat, hard-edged, print-grain, editorial-magazine texture; visual impact comes from large titles, black-yellow contrast, theme color blocks, and coarse-grain imagery — not from three-dimensional effects. + +**Forbidden:** 3D charts, glowing strokes, glassmorphism, complex gradient backgrounds, flashy shadows, skeuomorphic buttons, emoji, cartoon illustrations, generic colorful icon libraries, rounded business cards, large centered text blocks, low-contrast light-gray body text, full-page ungrouped long text, and decorative fonts that clash with the Franklin Gothic character. + +**Use with caution:** large image backgrounds, colorful theme colors, halftone textures, vertical side notes, traditional charts, process arrows. They must serve section atmosphere, case evidence, or navigation; if they impair body-text readability, fall back to solid-color bases and hard-edged cards. + +**Allowed on special pages:** covers and section dividers may use full-bleed grained imagery, oversized titles, and strong color overlays; overview pages may use multicolor collages; case pages may devote large areas to screenshots or work images. Content pages must form a rhythm between black-background impact and off-white reading — cover-level intensity should not be sustained indefinitely. + +Photos / screenshots / work images must have case value or texture value — do not fill space with irrelevant stock photos. Large image backgrounds suit only covers, section dividers, and a few transition pages. Gradients, shadows, glow, and 3D do not belong to this system. Rounded corners may be kept when inherent to a screenshot, but layout containers are hard-edged by default. + +## 11. Generation Checklist + +- Is it a landscape widescreen page with narrow safe margins, with no content touching edges, overflowing, or being cropped? +- Does the header have a small section label / report name, and the footer a page number or small brand anchor, without competing with the body? +- Does each page hold only one main viewpoint or a clear group of peer-level modules, avoiding flat piles of text? +- Are titles short and conceptual, and is the body split into columns, cards, or paired with images — rather than full pages of continuous long text? +- Do fonts keep the Franklin Gothic sans-serif character, with levels distinguished by relative size and Heavy / Regular? +- Is coloring based on black, off-white, and yellow, with per-page theme colors controlled and text contrast sufficient? +- Are images cases, works, screenshots, or grained material, avoiding irrelevant stock and over-decoration? +- Are charts restrained, preferring big numbers / cards; if axes and gridlines exist, are they understated enough? +- Do tables and high-density information use hard-edged cards, clear headers, aligned numbers, and readable row heights? +- Do components use system elements such as rectangular labels, hard-edged cards, quote blocks, and the small yellow identity mark — rather than newly invented styles? +- Are 3D, glow, complex gradients, emoji, colorful icons, soft rounded business templates, and large centered text blocks avoided? +- Have garbled text, overlap, occlusion, low contrast, empty content, wrong proportions, stretched images, misplaced page numbers, and mechanical template repetition been checked? +- No cards by default: unless the user explicitly requests them, it is strictly forbidden to use rounded-rectangle or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are better solutions +- No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part conclusions such as a three-way split plus a title plus a conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/04_promotion/03/en/pine-soot-pictorial.md b/skills/open-kimi-ppt/reference/design_system/04_promotion/03/en/pine-soot-pictorial.md new file mode 100644 index 0000000..9a2c9fe --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/04_promotion/03/en/pine-soot-pictorial.md @@ -0,0 +1,171 @@ +# Report Name · Trend Report 2025 STYLE DESIGN SYSTEM + +## 1. Style Positioning + +Suitable for commercial-film trend reports, creative-asset library introductions, ad-film direction proposals, and PPTs studying directing/cinematography styles. Aimed at readers with a film aesthetic and commercial creative context: build the feeling with cinematic images, then complete the judgment with short titles, short paragraphs, and characteristic tags. + +Medium-high information density: a content page typically contains 1 trend viewpoint, 2–3 groups of narrow-column text, 1 group of Characteristics tags, and either a single large image or a multi-image collage. It uses black backgrounds, white text, bold titles, narrow body columns, and large-area imagery; strong colors come mainly from the images, not from a decorative system. + +Underlying principles: +1. **Images first, words summarize**: images supply mood, color, and evidence; titles name the trend, body text explains — decorative graphics are not a substitute for image evidence. +2. **Black base first, readability above image integrity**: core text must sit on black or a sufficiently dark carrier; when necessary, sacrifice image area to keep white text clear. +3. **One trend per page, one skeleton for the whole report**: the collage approach may vary, but each page serves only one core concept and stably keeps the header, page number, title, body, and characteristic tags. + +## 2. Page Skeleton + +- **Canvas ratio**: landscape widescreen 16:9. Images may be full-height, full-width, or edge-to-edge collaged — the traditional white canvas is not kept. +- **Base background**: black or dark-toned imagery. Content pages use either "pure-black info zone + image zone" or "full dark image with overlaid text". White page backgrounds and light-gray office-template bases do not belong to this system. +- **Margins**: outer margins are narrow — header, page number, and images approach the edges; body text keeps stable inner padding. Image collages use hard cuts or extremely narrow gaps. +- **Title zone**: located left, center-left, or in the upper half of the black info zone; may overlap images but must land on dark areas. Trend-page titles usually break compactly into 2–3 lines. +- **Body zone**: composed of a "text explanation zone + image evidence zone". The text zone takes about one-third to one-half; the image zone may be a single image, dual zones, or a multi-image grid. +- **Header**: small all-caps navigation is stably placed at top-left, top-center, and top-right — e.g., the brand name, COMMERCIAL, FILMMAKING, TREND REPORT. Slightly letterspaced, low-level — it does not carry primary information. +- **Footer/page number**: a small white page number at bottom-left, close to the edge but not touching it. Do not use large page numbers, watermark page numbers, or complex footer bars. +- **Logo**: a small identity mark may sit at top-right, presenting the new theme name as plain small text or left empty — no graphic logo is drawn; white and extremely small. Do not enlarge it into a key-visual logo. +- **Sources/footnotes**: if sources are added, place them at the bottom of the body zone or near the footer, below the body text — do not build a standalone footnote bar. +- **Navigation**: no TOC-style sidebar, breadcrumbs, or section color blocks; continuous reading relies on the small top navigation and page numbers. +- **Divider lines**: explicit lines are rare; zones are divided by black-block boundaries, image cut lines, and text-column spacing. +- **Watermarks/background graphics**: the cover may have high-saturation pink vertical stripe blocks; content pages build no repeating watermark system. Background graphics must not expand into routine decoration. +- **Default reading path**: large title → large image/collage → short body → Characteristics tags → header/page number. + +## 3. Content Organization + +- **Title style**: use phrasal trend names or strong opinion sentences. Trend titles may be 2–4 words, such as "Analog Footage", "Docu-style", "One Shot Ads", "Bold, Saturated Colors"; an intro page may use a full sentence. Avoid long subtitle-style titles. +- **Title line breaks**: hard line breaks are allowed, each line forming a forceful phrase; leading is tight and the text block is heavy. Do not set the title as one long, thin line spanning the page. +- **Information sentence**: an opening or closing page may use one strong statement; content trend pages need no extra large subtitle — avoid weakening the trend name. +- **Body organization**: small type in narrow columns, usually 2–3 short paragraph blocks; explain the trend's background, visual characteristics, and commercial use value — no list-style long-form argumentation. +- **Grouping logic**: "trend name → explanation paragraph → Characteristics tags → image evidence". Multiple images are merely multiple samples of the same trend — they do not act as parallel sections. +- **Viewpoints per page**: each page covers only one trend or one report action. Do not juxtapose multiple unrelated concepts, and do not compress multiple trends into a comparison table. +- **Body density**: block the text in narrow columns; long runs of continuous text must not span most of a page. If there are more than 3 paragraph blocks, reduce the image count or split the page. +- **Key-point style**: use capsule tags, not traditional bullets; be cautious when adding bullets or numbered lists. +- **Keyword emphasis**: use bold titles, all-caps subheadings, capsule tags; inside body text use no colored highlighter marks and no underlines. +- **Numbers/units/time**: numbers are mainly inline in body text; no giant-number pages or KPI dashboards, and no expansion into chart-based components. +- **Source footnotes**: white/light-gray text smaller than body, placed at the bottom of the same text zone; no long URLs, long quotes, or footnote numbering systems. + +## 4. Content Page Layout System + +### A. Black text column + single large image on the right + +For report introductions, service descriptions, and single-trend explanations. A black info column on the left or center-left takes about one-third to one-half; the right side is a full-height image. The title sits on top; the body sits below in 1–2 narrow columns. People or light sources should face/lead toward the text zone, avoiding visual escape. Unsuitable for pages that need multiple samples or complex classification. + +### B. Left text + right multi-image collage + +For showing multiple applications of the same visual style. The left black base holds the title, body, and tags; the right uses a 2–3 column irregular or gridded collage — images edge-to-edge, no rounded corners, no shadows. Close-ups, environments, materials, and people may be mixed, but the color tone must serve the same trend. Unsuitable for linear reasoning, step flows, or data comparison, because multiple images break the reading order. + +### C. Full dark image with overlaid text + +For trend pages with strong atmosphere and strong emotion. The image bleeds full-page; text sits in naturally dark areas or black-overlay zones; the title may be center-left or center-right, with the body right beneath it. Do not place body text directly on bright skin, sky, or complex textures. Unsuitable for images with even brightness, dense detail, and no readable area. + +### D. Multi-zone image montage + central/side text + +For summarizing multiple clips into one trend. Images are spliced top-bottom, left-right, or in large-medium-small modules; text sits on black zones or dark image blocks; zones are hard-cut — avoid rounded-card styling. The title anchors the visual center; tags sit at the bottom of the text block. Unsuitable when each image's theme differs too much or when per-image captions are needed. + +### E. Large image background + CTA closing + +For closing pages and licensing/service notices. A strongly atmospheric large image is the background; the left side or a dark area holds the title, a longer description, and one small white button. The button is only an action entry — do not turn it into a marketing landing-page mega-button. Unsuitable for too much body text, multiple action entries, or pricing/package information. + +### F. Cover split composition + +The cover consists of a large image, black fields, and high-saturation vertical stripe blocks; the title is large and fractured — partial glyphs may be sliced — paired with small theme words. Only for covers or strong section openings; do not copy it frequently onto ordinary content pages, or the report's rhythm breaks. + +## 5. Color System + +- **Structural black #000000 / #080204 / #0B0A0A**: for base color, info columns, dark masks, and header/footer carrier color — the largest area. Cannot be replaced with white or light gray; brand replacement may only use a near-black that is dark enough. +- **Primary text white #FFFFFF / #F5F5F2**: for titles, body, header, page numbers, and tag text. Must contrast strongly with the background; do not introduce multiple text colors on the same page to create hierarchy. +- **Auxiliary gray #9A9A94 / #6E6F6D**: for low-level navigation, secondary notes, or faint text on dark areas. Small area — cannot be used for main body text; avoid low contrast. +- **Cover/strong accent pink #FC1AED / #F018D8**: for the cover's vertical stripes — not a general-purpose highlight for body pages; content pages must not casually use pink buttons, titles, or icons. +- **Warm red-orange image colors #EF1721 / #D46D49 / #9E3C26**: from lighting, skin tones, sunsets, and warm interiors. Must not be artificially expanded into chart series colors or large color blocks unless the image itself provides them. +- **Deep blue-cyan image colors #02213C / #0B4F73 / #3F92A6**: from water, night scenes, and cool-toned imagery. May guide image selection, but are not a standalone UI primary color. +- **Natural green/olive #12260C / #555948 / #6D6B5B**: from nature, grassland, and documentary-feel pages. Appears in large areas only within image zones; text stays white-on-black. +- **Tag stroke white/light gray #FFFFFF / #CFCFCB**: for Characteristics capsule borders and small tags — keep linework restrained. + +A page's dominant hue is decided by its images; beyond black and white, do not actively introduce more than 1–2 high-saturation hues. No data/state color system exists — do not add red-green up/down, traffic-light, or multi-series chart palettes. Brand replacement may only affect the cover accent blocks or the local image color direction — it cannot change the black-background, white-text skeleton. + +## 6. Fonts and Text Hierarchy + +Use sans-serif fonts. Body text centers on Liter (Chinese: MiSans), titles use Archivo Black extensively (via customFonts), and navigation/some small text uses Liter. When replicating, pair an ultra-heavy black sans with a regular sans-serif; small navigation uses narrow letterspacing / all-caps. + +- **Giant cover title**: 8–9x body text; may be broken across lines, locally compressed, or offset; cover only. +- **Content page main title**: 4–4.5x body text, ultra-heavy weight, tight leading, usually 2–3 lines — the highest level. +- **Intro/CTA title**: 3.5–4.5x body text; may be a full sentence; keep bold and short lines. +- **Subheading/column word**: 0.85–1.1x body text, often all-caps or bold, e.g., Characteristics. +- **Body text**: 1x, regular weight, narrow columns, slightly tight leading but not crowded. Do not bold large stretches of body text. +- **Capsule tag text**: 0.7–0.85x body text, often all-caps, bold or semibold, inside stroked small capsules. +- **Header navigation**: 0.7–0.85x body text, slightly letterspaced, all-caps, low-contrast but readable. +- **Footnotes/page numbers**: 0.6–0.75x body text, small white type. +- **Chart/table labels**: if they must be added, keep them at or below 0.8x body text, following white-on-black. + +Serif body text, handwriting fonts, cartoon fonts, and excessive italics are forbidden. Italics may only mark very few quotes or special words — not as a hierarchy rule. + +## 7. Chart Language + +The source files have no data-chart system of bars, lines, pies, axes, legends, or gridlines. **Do not proactively turn trend content into a data dashboard**. + +If charts must be added: +- Charts serve only as secondary proof; their area must not exceed the image key visual; place them in the black info zone or on dark cards. +- Axes and gridlines use extremely thin light-gray, low-contrast lines; data labels use small white sans-serif. +- Series colors never expand into rainbow — at most white/gray + one accent color from the page's imagery. +- No 3D charts, glowing lines, gradient area charts, complex legends, or decorative data icons. +- Key data may be marked with bold white text or small capsules — no large-area colored callouts. + +Prefer juxtaposed image frames, Characteristics tags, and short paragraphs over complex quantitative charts. + +## 8. Tables and High-Density Information + +The source files have no traditional table system. High-density information is presented as narrow-column body text, multi-image collages, and capsule keywords; comparison topics prefer "tag groups + short paragraphs + image samples" over large tables. + +- **Tag groups**: the Characteristics zone is multiple small capsules arranged horizontally, wrappable; white/light-gray stroke, transparent fill on black, all-caps text. Used for keywords, shooting techniques, and visual traits — not long sentences. +- **Text columns**: body may split into 2 or 3 columns, each of short paragraphs with clear column spacing; left-aligned; tops may align to the title baseline or the body start. +- **Image matrix**: multi-image collages act as a "sample table"; no header, no numbering — unified theme and tone form the set. + +If a table must be used: the header is small all-caps white text; lines are extremely thin light gray; the base stays black or dark gray; no zebra striping, colored cells, thick borders, or Excel-style grids. Numbers right-aligned, text left-aligned; total rows are distinguished only by bold or thin lines. The table's area must be controlled — it cannot replace the image key visual. + +## 9. Components and Graphic Elements + +- **Small top navigation text**: repeats near the top edge — white/light gray, all-caps, low-level. Do not add icons, underlines, or colored selected states. +- **Top-right identity mark**: presents the new theme name as plain small text — white, vertical or tight against the corner — as a brand signature only; no graphic logo is drawn. +- **Page number**: small white type at bottom-left, appearing stably. Must not be enlarged into a decorative numeral. +- **Characteristics module**: a subheading + multiple capsule tags. The subheading may be all-caps; capsules use thin strokes, rounded/capsule shapes, transparent-on-black fill. 3–6 tags are appropriate — more looks like a filter panel. +- **Black info block**: a page structure zone, not a card; hard-cut, no shadow, no stroke, no rounded corners — carries the title and body. +- **Image collage frame**: images are directly cropped and aligned — no rounded corners, no drop shadows, no photo frames; sizes may vary, but no decorative borders are added. +- **CTA button**: only on the closing page — a small white-background black-text rectangle or lightly rounded button. It must not flood every page. +- **Divider lines**: not a routine component; if separation is needed, use only image boundaries or extremely thin lines. No thick lines, colored lines, or dashed process arrows. +- **Icons/arrows/matrix marks**: if used, they must be extremely small, white, linear, label-auxiliary — never become a colorful icon system. + +## 10. Texture and Forbidden Items + +Visual richness comes from the light-and-shadow, grain, color, and composition of real imagery — not from PPT effects. + +**Forbidden:** +- Large white office templates, light-gray background pages. +- Colorful icon sets, emoji, cartoon illustrations, 3D graphics, skeuomorphic buttons. +- Gradient title text, glowing strokes, neon text effects, complex shadows, glassmorphism. +- Stacked rounded cards, drop-shadow photo frames, heavy borders, decorative geometric patterns. +- Large centered text blocks, full pages of bullets, traditional TOC/process-arrow pages. +- Multicolor data charts, red-green status lights, rainbow legends. + +**Use with caution:** +- Large high-saturation color areas: should come only from images or cover accent blocks — content UI does not actively spread color. +- Buttons: only on CTA/closing pages; keep the count at one. +- Tables and charts: only as secondary modules when the topic truly needs quantitative proof — they cannot replace images. +- Icons: only small linear aids — never colorized. +- Transparent masks: may improve text readability, but should be near-black with natural edges — no obvious gradient effects. + +**Allowed on special pages:** +- The cover may use strong pink vertical stripes, split titles, and large black fields. +- The closing page may use a CTA button and longer explanatory text. +- Full-image pages may let the image fill the canvas, but must keep a readable dark zone. + +## 11. Generation Checklist + +- Skeleton: is it a 16:9 dark cinematic report page? Are the small top navigation, bottom-left page number, and small top-right identity mark kept? +- Copy: does each page express only one trend/theme? Is the title short and forceful, and the body short paragraphs in narrow columns? +- Hierarchy: are titles markedly larger than body, and is Characteristics below body explanations but above the footer? Is confusion over specific font sizes avoided? +- Coloring: is black-background white-text the core? Do high-saturation colors come from images or the cover, rather than arbitrary UI decoration? +- Layout: do images carry the main emotional evidence? Does text land on black zones or dark areas? Is white text over complex bright images avoided? +- Charts: if present, are they minimal, low-contrast, secondary proof? Are 3D, rainbow colors, and complex legends avoided? +- Tables: if present, are they black-based with thin lines and no Excel feel? Have tables not replaced image samples? +- Components: are small navigation, capsule tags, hard-cut image collages, and black info blocks used? Are shadowed cards and decorative lines avoided? +- Forbidden items: no emoji, colorful icons, illustrations, gradient glow, complex textures, 3D, thick borders, or large centered text blocks? +- Quality: check text overflow, truncation, garbled text, overlap, low contrast, images covering titles, empty tags, distorted proportions, missing page numbers, mechanical template repetition, or overly identical page layouts. +- No cards by default: unless the user explicitly requests them, it is strictly forbidden to use rounded-rectangle or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are better solutions +- No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part conclusions such as a three-way split plus a title plus a conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/04_promotion/04/en/gold-orange-type-journal.md b/skills/open-kimi-ppt/reference/design_system/04_promotion/04/en/gold-orange-type-journal.md new file mode 100644 index 0000000..5d3788f --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/04_promotion/04/en/gold-orange-type-journal.md @@ -0,0 +1,152 @@ +# Organization Name Type Trends 2025: Re:Vision STYLE DESIGN SYSTEM + +## 1. Style Positioning + +Suitable for type-trend reports, design-research releases, creative case collections, and brand/type-industry insights — long-form narrative PPTs/reports aimed at design, brand, creative, and type professionals. The report alternates between low-density visual pause pages and high-density editorial content/case pages, forming a landscape visual-magazine rhythm. + +A modern neo-grotesque sans-serif skeleton (Liter for body, Archivo Black via customFonts for titles), combined with giant bold titles, high black-white contrast, full-bleed case images, restrained footers, and per-page theme colors. + +- **Type as the key visual**: titles, section names, letterform specimens, and custom wordmarks carry identification first; graphic decoration must relate to letterforms, typography, or case presentation — never information-free decoration. +- **One visual center per page**: full-bleed images, black-white geometry, three-column long text, and case galleries are all usable, but each page has only one entry point: the giant title, the main image, a geometric symbol, or the body title. +- **Black-white base + per-page theme color**: white, black, and gray unify the report; strong colors such as orange, blue, pink, and green serve only as the theme color of an individual trend/case page or as local accents — never mixed across the report into a rainbow system. + +## 2. Page Skeleton + +- **Canvas ratio**: landscape 16:9. Primarily white-based editorial layouts, pure-black/pure-white opinion pages, or full-bleed image pages; do not change to portrait-poster or social-card ratios. +- **Global margins**: content pages keep wide outer margins; case images may approach the body-zone boundary, but the footer anchor stays at the bottom. Full-bleed cover/section images may fill the whole page. +- **Title zone**: covers, section dividers, and opinion pages use oversized titles that may occupy the upper half or span the whole page, often a short sentence with a period. Content-page titles sit center-left, upper-left, or in the middle of the body zone — no fixed header bar. +- **Body zone**: uses horizontal columns, side-by-side text and image, case collages, full-bleed images, and geometric-symbol pages. Long text uses narrow columns; on case pages images dominate, with text at edges or below. +- **Header**: no stable traditional header bar. A few case pages may place tiny caption/source text or column labels at the top, but this must not be upgraded into a fixed top bar for the whole report. +- **Footer**: content/case pages use a stable small footer: "Re:Vision" or the report mark at bottom-left, tiny section/column text at bottom-center or bottom-left-center, and a small page number or black numeral mark at bottom-right. Smaller than body text — not a decorative strip. +- **Brand mark**: the cover shows the brand as small wordmark text (plain text only — write the new theme name; no graphic logo is drawn); body pages carry the brand through the footer and the type system. Do not enlarge the logo on every page. +- **Navigation and TOC**: the table-of-contents page juxtaposes multiple "bold section title + smaller explanatory phrase" items; section entries use full-bleed images or minimal geometric pages. +- **Divider lines and watermarks**: no routine rule-line headers, vertical-line borders, or watermark system; separation relies on column spacing, whitespace, image boundaries, and geometric shapes. +- **Default reading path**: largest title/main image or geometric key visual → subtitle/information sentence → narrow-column body or case caption → footer page number and section. + +## 3. Content Organization + +- **Title style**: use short sentences, imperatives, judgments, or two-word phrases, often with a period — e.g., "Future Typography.", "Create something new.", "This is a new kind of trends report.". Section names may use an "X & Y." structure. +- **Information sentence**: a section divider explains its theme with one subtitle line, placed below the title or at bottom-left; size sits between title and body, usually bold or high-contrast white/black. +- **Body organization**: a modern sans-serif at regular weight, short line length, split into 2–3 columns; narrow columns, paragraph spacing, and whitespace support reading long passages. +- **Grouping logic**: advance by trend/theme; each chapter may contain a section cover, a lead-in, case showcases, analytical body, and quote/specimen pages. Do not mix too much chapter logic on the same page. +- **Viewpoints per page**: an opinion page carries only 1 core sentence; a content page revolves around 1 theme; a case gallery shows 3–6 works with short captions — avoid a long paragraph per case. +- **Key-point style**: prefer paragraph narrative. When listing points, use minimal short lines — no complex numbering, colored checkmarks and crosses, or multi-level indents. +- **Keyword emphasis**: rely on type size, bold, position, image scale, and the page's theme color; inside body text do not rely on highlighter marks, underlines, stroked text, or multi-color highlights. +- **Numbers/units/time conventions**: numbers serve page numbers, years, case annotations, or source info; new data uses small labels and clear units — numbers are not turned into business dashboards. +- **Source footnotes**: cases, images, and quotes are credited at top or bottom in very small type. The Credits/sources page may use multi-column dense small text; links or key nouns may be blue. + +## 4. Content Page Layout System + +### A. Full-bleed image + giant title overlay + +For covers, section entries, and building trend mood. The image fills or nearly fills the page; oversized bold white/black text overlays the top or middle, with the subtitle below the title or at bottom-left. Rely on the tension between title scale and image — no shadows or strokes. It must not carry long body paragraphs, charts, or multi-case captions; overlaid text must avoid the image's most complex areas. + +### B. Black-white geometric opinion page + +For pauses between sections, manifesto-style short sentences, and the report's stance. A pure-white or pure-black background with a large black-white geometric shape at center — ellipse, double circle, eye shape, bracket shape — with the sentence embedded at center. The geometry is the subject, not a corner mark; information density is extremely low. Do not add long paragraphs, legends, tables, or clusters of small icons. + +### C. Editorial lead-in / long-text page + +For trend explanations, background discussion, and research passages. The title or subheading takes one column; the body splits into 2–3 narrow columns, keeping generous whitespace and the footer; bullets are rare. Emphasis comes from bold titles, first-paragraph position, and column-width variation; long text must not be spread as a single full-width column, and decorative illustrations must not be forced in. + +### D. Left text right image / right text left image juxtaposition + +For case analysis, work descriptions, and concept explanations. The image zone is larger than the text zone and may hold 1 main image or 2–3 juxtaposed images; the text zone holds a short title, several body paragraphs, and a small source. The image is the visual focus. To compare many works, switch to the gallery grid; if image detail is complex, text must not cover the image. + +### E. Case gallery grid + +For work collections, trend evidence, and type-specimen comparisons. Images use horizontal arrangements, loose grids, or uneven-width collages with ample whitespace; one large image + several small ones may establish hierarchy. Captions are extremely short; sources sit at edges. Do not make every thumbnail an equal-weight card, and do not give every image a long caption — that makes the page feel like a database. + +### F. Letterform/symbol key-visual page + +For typeforms, sound waveforms, letter specimens, and abstract symbols. Enlarged letters, wordforms, waveforms, or mirrored symbols occupy half to a full screen, with a short title and explanatory text beside them; emphasize letterform structure and rhythm — no extra icon decoration. If the topic is not type, logos, or visual language, giant letters must not be abused. + +### G. Credits / sources multi-column page + +For closing acknowledgments, references, and lists of institutions and people. Use 4–6 narrow columns of small text at high density; subheadings are bold; links or highlights may be blue. This layout suits only appendix-type information — not core opinion pages or pages meant to be read aloud live. + +## 5. Color System + +- **Near-white/white #FFFFFF, #FEFEF6, #F9F9EF**: for content pages, case pages, and source pages. May be replaced by an extremely light warm white, but never an obviously colored paper — unless as a single page's theme. +- **Pure black/near-black #000000, #111113, #161616**: for primary text, black-page backgrounds, and geometric key visuals. Pair with white text over large areas; do not mix with dark gray at low contrast. +- **Neutral gray #9C9C9C, #CFCFCF, #E5E5E5**: for auxiliary text, image boundaries, light-base separation, and neutral transitions; information level below black and white — must not serve as the primary body color. +- **Theme orange #FE9900, #FFCB7F, #FBE7C8**: for large letterforms, waveforms, local backgrounds, and accent shapes on sound/waveform/section case pages. Acts as a single page's primary color — it does not compete with other strong colors on the same page. +- **Theme blue #3178C8, #3B83CE, #37536D, #426B85**: for section images, case primary color, link/source emphasis, or visual specimens; the body-text link blue stays small in area. +- **Wine red/mauve #714D55, #886065, #743C3F, #A5888D**: for mood backgrounds or dominant tones of photography/case images — not recommended as a general-purpose accent for large-area replacement. +- **Bright pink/green and other strong colors**: only for the theme backgrounds or graphics of individual trend pages or case images — no global status-color system is established. +- **Per-page hue control**: apart from the case images' own colors, structural colors stay black-white-gray + 1 theme color. If gallery images are already colorful, text and components must return to black-white-gray. +- **Status-color boundary**: no red-green up/down system exists. If new content must express states, use small-area labels with clear explanatory text — no large red-green dashboards. +- **Brand color replacement**: white, black, and gray are irreplaceable; a single page's theme color may be replaced by one high-saturation color of the new brand, but the "one theme color per page" rule still holds. + +## 6. Fonts and Text Hierarchy + +- **Typographic character**: body text uses Liter (the source's Helvetica Now Text), titles use Archivo Black (the Display bold, via customFonts), and subheadings, footers, and labels use Liter Bold. Small amounts of serif or handwriting/experimental fonts appear only as case content itself — never as report-wide fonts. +- **Body baseline**: body = 1x; relaxed leading, narrow column width. +- **Large titles**: 4–5x body text or larger, bold Display; on covers and opinion pages they may scale up to become the page's key visual. +- **Content-page titles/subheadings**: 2–3x body text, bold, left-aligned or aligned with the main graphic or visual element; no decorative title bars. +- **Information sentences/subtitles**: 1.5–2x body text, immediately following the giant title or at bottom-left, keeping short lines. +- **Body paragraphs**: 1x regular weight, mainly black; paragraphs separated by space — first-line indent is not the main rule. +- **Table/chart labels/case captions**: 0.65–0.8x body text, black or dark gray; must stay readable — no overly light gray. +- **Footnotes, footers, page numbers**: 0.5–0.65x body text; page numbers usually at bottom-right. +- **Alignment**: mainly left-aligned; centering is only for single sentences on black-white geometric opinion pages. Large centered text blocks are forbidden. + +## 7. Chart Language + +The source files have no stable data-chart system; new charts must embed into editorial pages: + +- **Allowed chart directions**: minimal line charts, few-series bar charts, or timelines — no business dashboard pages. +- **Axes and gridlines**: thin gray lines or weakened axis lines; avoid heavy borders, colored grids, and complex backgrounds. +- **Labels**: small and clear, preferably black/dark gray; key data may use the page's theme color, but no more than 1 accent color. +- **Legends**: reduce series; place legends close to the chart or label directly beside lines/bars; no large legend boxes. +- **Forecasts/targets/baselines**: dashed or thin lines, with notes near the lines; no glow, gradient areas, or 3D charts. +- **Boundary**: unsuited to complex KPI dashboards, multi-axis charts, pie arrays, large heatmap matrices, and other heavy business-report contexts. Chart aesthetics must yield to data clarity and editorial whitespace. + +## 8. Tables and High-Density Information + +High-density information mainly uses Credits/sources multi-columns, small text notes, and case collages; tables follow editorial-restraint principles: + +- **Headers**: black or dark-gray bold text, white or extremely light-gray background; dark header bars are not the default. +- **Row/column structure**: thin gray lines or whitespace separation; reduce full grid borders; keep the column count within readable range. +- **Row height and density**: may be compact, but inter-row air must remain; appendix tables may be denser — core content pages should not be too dense. +- **Base color**: white is primary; light gray for grouping or headers; zebra striping is not a global feature — use cautiously. +- **Key rows/columns**: highlight with bold, small marks in the page's theme color, or light base blocks; no multicolor conditional formatting. +- **Number/text alignment**: text left-aligned; numbers right-aligned by decimal places or units; keep units consistent. +- **Symbols and ratings**: no stable rating-dot, check-cross, or status-symbol system; if they must be used, use minimal symbols in black-white or a single theme color only. +- **Role**: tables serve appendices, sources, and reference information — they must not become the report's main visual language. + +## 9. Components and Graphic Elements + +- **Giant title component**: built from bold sans-serif, a short sentence, a period, and extreme scale; may overlay an image or stand alone on a white/black background. +- **Black-white geometric symbols**: eye shapes, double circles, mirrored brackets, semicircles, etc., for section pauses; one main symbol per page — never repeated as small decorations filling the page. +- **Letterform specimen component**: an enlarged single letter, wordform, or waveform as the subject — must be clearly tied to the text explanation. +- **Case image frame**: rectangular with square corners, no visible rounding, shadows, or borders; organized by size and whitespace, not card shadows. +- **Footer navigation**: report mark at bottom-left, small column text at the bottom, page number at bottom-right; small size, black or dark gray, no base bar. +- **Source/caption small text**: close to image edges or the footer, providing copyright and context. Must not be enlarged into a primary information level. +- **Labels/badges**: no stable colored badge system. If labels are needed, use small black text or short single-theme-color labels — no stacked rounded capsules. +- **Process arrows/SmartArt**: no traditional flowcharts, org charts, or SmartArt. Processes convert to editorial columns or minimal arrows — avoid templated node diagrams. +- **Icons**: colorful icons are not a stable element. Apart from icons contained within case images, no icon libraries should be introduced. + +## 10. Texture and Forbidden Items + +Overall flat, editorial, restrained, and type-driven; visual intensity comes from typographic scale, black-white contrast, real case images, and per-page theme colors. + +- **Forbidden**: 3D charts, glow, glassmorphism, complex shadows, heavy strokes, gradient buttons, emoji, colorful icon libraries, business-template SmartArt, large decorative textures, irrelevant illustrations, low-contrast light-gray body text, large centered text blocks, and repeating a large logo on every page. +- **Use with caution**: photos/screenshots/illustrations. The source files use many case images and photography, but they carry case evidence or section mood — they are not arbitrary decoration; there must be a clear thematic relationship and high-quality cropping. Rounded corners, zebra striping, and colored labels should also be used sparingly. +- **Allowed on special pages**: full-bleed photography backgrounds for covers and section entries; experimental fonts, handwriting, and exaggerated colors as case content; multi-column ultra-dense small text for Credits/sources pages; white-on-black for opinion pages and strong pause pages. +- **Should not be used**: large image backgrounds carrying long-text reading; tiny body text overlaid on images; making every case a shadowed card; replacing the type key visual with gradients or decorative patterns. + +## 11. Generation Checklist + +- Skeleton: is it a 16:9 landscape report page? Are wide margins, the body zone, and the small footer anchor kept? +- Copy: are titles short sentences/phrases that may carry a period? Does each page have only one core viewpoint or visual entry? +- Hierarchy: are titles, information sentences, body, and footnotes clearly distinguished by relative proportion? Are business-template title bars avoided? +- Coloring: does it use the black-white-gray base + one theme color per page? When case images are very colorful, does structural text return to black-white-gray? +- Layout: does the page belong to one of: full-bleed title, black-white geometry, long-text columns, text-image juxtaposition, case gallery, letterform key visual, or Credits multi-column? +- Charts: if present, are they minimal, few-series, weak-grid, directly labeled? Are dashboards and 3D effects avoided? +- Tables: white/light-gray base, thin separators, aligned numbers, little conditional color? Are they used only for reference or appendix information? +- Components: are authentic style components used — giant titles, geometric symbols, letterform specimens, rectangular images, restrained footers? +- Forbidden items: have emoji, colorful icons, glow, complex shadows, gradient buttons, thick borders, and template SmartArt been removed? +- Readability: have overflow, truncation, garbled text, overlap, low contrast, images covering text, empty content, wrong proportions, and footer-position drift been checked? +- Consistency: do page variations serve the section rhythm rather than vary for its own sake? Can the whole report still be recognized as the same type-trend report? +- No cards by default: unless the user explicitly requests them, it is strictly forbidden to use rounded-rectangle or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font-size differences are better solutions +- No evenly divided compositions: unless no other layout is available, do not default to thirds, quarters, or two-by-two matrices. This includes three-part conclusions such as a three-way split plus a title plus a conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/04_promotion/05/en/silver-gray-luxury-magazine.md b/skills/open-kimi-ppt/reference/design_system/04_promotion/05/en/silver-gray-luxury-magazine.md new file mode 100644 index 0000000..a58ba9d --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/04_promotion/05/en/silver-gray-luxury-magazine.md @@ -0,0 +1,253 @@ +# Organization Name Group — Corporate Presentation STYLE DESIGN SYSTEM + +## 1. Style Positioning + +Aimed at listed-company investor communication, luxury-group corporate introductions, and financial disclosure, switching between "premium brand-narrative pages" and "rigorous IR data pages": the former uses full-bleed photography, large serif titles, and semi-transparent information bars to present history, brand, channels, and stores; the latter uses a white background, thin black rules, charts, tables, and small-print annotations to complete financial proof and disclosure of reporting bases. + +Suitable for corporate roadshows, investor days, results communications, group strategy introductions, brand-portfolio explanations, and financial appendices. Pages may be high-density, but must remain formal, restrained, and verifiable. + +- Titles use a serif typeface; body text, annotations, tables, and chart labels use a sans-serif typeface. +- Brand narrative pages use full-bleed photography, overlaid with a darkening mask or a light-gray semi-transparent bar; text appears in white or black for high contrast. +- Financial pages use a white background, thin black horizontal rules at top/bottom, a title at upper left, an identity mark at upper right (the group name rendered as plain small text, no graphic logo), a page number and footnote at the bottom. +- Aside from photography's natural colors, information is organized using black, white, gray, brownish-gold/bronze-brown, and a small amount of light-blue table background. +- Data uses bar charts, pie charts, stacked bars, financial tables, footnotes, and source notes rather than fancy infographics. + +Underlying principles: + +1. Brand, history, store, craftsmanship, and strategy pages may use full-bleed photography; revenue, profit, balance-sheet, cash-flow, and reporting-basis disclosure pages must use a white-background chart/table, avoiding photos that interfere with reading the data. +2. On photography pages, text must sit in a darkened area, a semi-transparent bar, or a high-contrast empty area; on financial pages, prefer black/white/gray over sacrificing the clarity of numbers, labels, and footnotes for the sake of brand color. +3. You may switch between photos, timelines, cards, charts, and tables, but the title area, identity mark, page number, footnotes, lines, and color roles must remain consistent. + +## 2. Page Skeleton + +The canvas is 16:9 landscape widescreen, using the following skeletons: + +### 2.1 Cover skeleton + +- Full-bleed architectural or spatial photography fills the frame, overall dark and cool-gray, emphasizing glass and architectural texture. +- The group name is placed at the top left, in extra-large white serif type with wide letter spacing. +- A large white serif main title is centered in the lower-middle area; the date below is noticeably smaller than the main title. +- No top/bottom black rules, no complex footer, no charts. +- Reading path: group name → main title → date → background spatial atmosphere. + +### 2.2 Disclaimer/legal-text page skeleton + +- White background, with a thin black horizontal rule spanning the body's width at the top. +- A serif title at upper left, an identity mark at upper right (the group name rendered as plain small text, no graphic logo). +- The body consists of dense multi-paragraph small print, with bolded paragraph headings, body text left-aligned. +- A thin black horizontal rule at the bottom, which may carry the page number or auxiliary document information. +- No images, icons, or color-block decoration; this is a reference-type page, not a presentation-type page. + +### 2.3 Brand/strategy photography page skeleton + +- Full-bleed photos of architecture, stores, workshops, garments, nature, or brand scenes. +- The section or theme title is at upper left: white serif type over dark images, black serif type over light images or semi-transparent bases. +- A white identity mark (the group name rendered as plain small text, no graphic logo) is often placed at upper right; a small, low-distraction page number at lower right. +- The body may overlay semi-transparent light-gray horizontal bars, white cards, local charts, short manifesto sentences, or a timeline. +- If the photo is visually complex, a dark mask or a light-gray carrying bar must be added; long text must not be placed directly over a highly textured background. + +### 2.4 Standard financial/appendix white-background skeleton + +- Pure white background, with stable margins on all sides. +- A thin black horizontal rule at the top; a serif title at upper left; an identity mark at upper right (the group name rendered as plain small text, no graphic logo). +- The body carries charts, tables, parallel data modules, or explanatory bullets. +- A thin black horizontal rule at the bottom; the page number sits at the lower right or bottom edge; footnotes/sources sit below the chart or near the bottom rule. +- Reading path: title → chart/table primary evidence → explanation to the side or below → footnote/source → page number. + +### 2.5 Section/transition page + +- Uses a full-bleed photographic background with minimal text; the section name sits at upper left or center-left. +- No data stacking, no multiple components; it only switches the narrative stage. +- A darkening mask may be used to ensure the title is readable. + +Absent or unstable items: no stable table-of-contents navigation, breadcrumbs, multi-level header navigation, watermarks, or complex background textures observed. Aside from the cover and photography pages, background graphics should not be added. + +## 3. Content Organization + +Title style: + +- Titles use declarative thematic sentences, which may include a brand name, strategic theme, financial metric, or time range. +- Brand-page titles are short, in serif type, often in caps or title case. +- Financial-page titles state the metric name, its evolution, its measurement basis, or an annotation number, which may be explained in parentheses after the title. + +Key message sentences and body text: + +- Brand pages carry 1 core judgment, expressed as a single large-text manifesto sentence, 3–4 horizontal entries, or one timeline. +- Financial pages may carry 1 main chart + several small charts/pie charts + annotations, but they must revolve around the same metric system — do not mix unrelated data. +- Long-text pages are used only for disclaimers, measurement-basis explanations, or appendices, not as regular narrative pages. + +Grouping logic: + +- A horizontal timeline expresses history and milestones; parallel cards express brand/channel/strategy modules; a chart plus footnote expresses financial trends; a table expresses appendix line items. +- Group labels use short noun phrases or metric names. +- Key numbers may be enlarged and paired with units and a time basis; never show a number alone without stating its measurement basis. + +Number of points per page: + +- Photography opinion pages: 1 main point, at most 3–4 supporting points. +- Chart pages: 1 main conclusion, 2–4 supporting metrics. +- Table pages: may be high-density, but must have a clear header, dividers, and footnotes. + +Keyword emphasis: + +- Use bold, brownish-gold/bronze-brown, black titles, white contrast, and positional hierarchy — do not use neon colors, underlines, or exaggerated outlines. +- Number emphasis must match the chart's color, avoiding introducing an extra accent color on the same page. + +Numbers/units/time basis: + +- Financial pages must retain the year, quarter, year-over-year figure, growth rate, unit, and reporting-basis explanation. +- Footnotes use small sans-serif type, placed close to the data area or in the footer, never far from the data. + +## 4. Content Page Layout System + +### 4.1 Full-bleed photo + centered manifesto sentence + +For brand philosophy, customer experience, store/craft atmosphere, and section introductions. The background image fills the frame; the title sits at upper left or upper-center; the core sentence is centered or off-center, in large white text, darkening the overall background if necessary. Not suitable for complex financial data, multiple measurement bases, or content requiring precise comparison. + +### 4.2 Full-bleed photo + semi-transparent bars/card list + +For strategic priorities, success factors, channel actions, steps, or comparisons. 3–4 light-gray semi-transparent horizontal bars or white rectangular cards are overlaid on the photo, each holding a short title, a number, or one explanatory sentence; a numbered block may be added on the left. Emphasis relies on entry order, a brown fill bar, or bolded text. If there are more than 5 entries or the text is too long, switch to a white-background parallel-module page instead. + +### 4.3 Timeline/historical milestone page + +Year nodes are arranged along a semi-transparent horizontal band, each node containing a brand/event/short explanation. The year's font size is noticeably larger than the explanatory text; connect the nodes with thin lines or organize them with clear separators; the background may use an architectural/spatial photo. Do not turn the timeline into a complex curve or a multi-layer decorative path. + +### 4.4 White-background single main chart page + +For revenue evolution, growth rate, composition, and trends. Keep the standard header/footer; the main chart — a bar chart or stacked bar chart — is placed centrally; a small pie chart, legend, and footnote sit below or under the chart. The chart occupies most of the page area; explanatory text should not crowd the graphic. Emphasize with a brown main series, black/gray labels, and an oval or small color block annotating year-over-year figures or growth rates. + +### 4.5 White-background chart + right-side explanation column + +For "data evidence + management explanation." The main chart sits on the left or center, with short bullets or key metrics on the right. The right-side explanation column should not turn into long paragraphs; each item is kept to one or two lines. The chart is primary, the explanation secondary. + +### 4.6 High-density financial table page + +For income statement, balance sheet, cash flow, segment detail, and appendix reporting-basis disclosures. Standard white-background skeleton, with the table occupying most of the body area. Headers, group rows, and summary rows are layered using light-blue/light-gray backgrounds and thin lines. Information density may be high, but photos, icons, or large color blocks must not be layered on. + +### 4.7 Parallel module/brand-portfolio page + +For comparing brands, channels, or business units. Uses equal-width columns and white or semi-transparent cards, each column containing a small title, a key number, a brief explanation, or an image. 2–4 columns is preferable. If a large amount of text is needed, switch to a table or split across multiple pages instead. + +## 5. Color System + +Role-based palette: + +- Background white #FFFFFF / #F8F7F7: primary background for standard financial pages, appendices, and table pages. A colored background must not replace the white background of financial pages. +- Deep black/near-black #08070A / #1A1A1A: primary body text, titles, thin lines, axes, and table borders. Used for high-contrast information, not as a large decorative color area. +- Neutral gray #7A8180 / #949494 / #B8B8B8: photo masks, secondary text, table lines, secondary data, and background cards. Should not be used for key small print, to avoid low contrast. +- Light-gray semi-transparency #E5E5E5 / #DFDFDF / #EBEBEB: information bars on photography pages, card bases, light table backgrounds, used to carry text over complex photos. +- Brand brown/bronze-brown #9C5A37 / #9B5834: main accent color, primary bar-chart series, channel/business emphasis, horizontal emphasis bars. May be replaced by a new brand's primary color, but the replacement must be low-saturation, steady, and compatible with black/white/gray. +- Golden-brown #CA9814: a small amount of identity-mark text, growth labels, or secondary emphasis. Usable only in small areas, must not become a second primary color. +- Light-blue table background approximately #DCEEF6 / #EAF6FB: used for headers, groups, or financial-detail backgrounds in later appendix financial tables. Must not be overused on brand narrative pages. +- White text #FFFFFF: used on dark photos, dark masks, dark chart blocks, and cover titles. The background must be dark enough. + +Aside from photography's natural colors, keep a single page's information layer within black/white/gray + 1 accent color. Financial charts may use functional colors such as brown, gray, and light blue, but should not exceed 3 meaningful series colors. + +Positive/negative status colors: the source file shows no stable red/green rise-fall system. Growth, year-over-year, and share figures more commonly use golden-brown ovals, black/gray labels, or text annotations; if positive/negative status is added, do so cautiously and without disrupting the brown/gray primary system. + +## 6. Fonts and Text Hierarchy + +Titles use Unna (built-in, Georgia-class serif); cover display titles may use Oranienbaum (built-in) for high contrast. Body text, charts, tables, and annotations use QuattrocentoSans (built-in humanist sans); no other families. + +Relative hierarchy: + +- Cover group name: about 5–7x the body size, white serif, with very high visual weight and prominence. +- Cover main title/section large title: about 3–4x the body size, serif, may be all-caps. +- Standard page title: about 2.5–3x the body size, black serif, positioned at upper left. +- Key message sentence/page's main judgment: about 2–3x the body size, may be white or black, centered or within a bar. +- Subheading/module title: about 1.2–1.8x the body size, using bold sans-serif or a small serif heading. +- Body bullets/explanations: body text = 1x, sans-serif, left-aligned. +- Table text/chart labels: about 0.8–1x the body size, readability first. +- Annotations, sources, page numbers: about 0.55–0.75x the body size, low weight but must remain clear. + +Typesetting rules: + +- Do not mix too many font weights between titles and body text; hierarchy relies mainly on font category, size multiple, and position. +- Large centered blocks of copy are suitable only for photography manifesto pages; body text and footnotes on financial pages are always left-aligned or table-aligned. +- Numbers may be bolded or enlarged, but units, years, and measurement bases must sit directly beside them. + +## 7. Chart Language + +Uses IR-standard bar charts, stacked bar charts, pie charts/small circular charts, combination financial charts, and tabular data, emphasizing easy reading of values and clearly stated measurement bases. + +- Bar charts: the main series uses bronze-brown, secondary or historical/comparison portions use gray, light brown, or black-gray. Bars may be labeled directly with values. +- Stacked bars: used for compositional breakdowns, distinguished with brown, gray, black, and light color blocks; the legend sits near the bottom or right of the chart, small but clear in size. +- Pie charts/small circular charts: serve as a compositional supplement below the bar chart, not the page's primary visual. Used for channel/region/brand share; not suitable for more than 4–5 slices. +- Axes and gridlines: use thin gray-black lines, weakening or reducing gridlines. Do not add heavy grids or complex backgrounds. +- Labels: placed close to bars, pie slices, or nodes, in small black/dark-gray text; key year-over-year figures or growth rates may use a golden-brown oval or small label. +- Legends: compact and close to the chart, not occupying the primary visual. Color meaning must match the chart. +- Annotations and baselines: keep a thin-line and small-label style. No stable forecast/target/red-green status-line system was observed — do not fabricate one. +- Chart-page footnotes: every financial chart should retain the measurement basis, unit, and annotation number, placed below the chart or in the footer. + +## 8. Tables and High-Density Information + +Tables are the "verifiable data container" for financial appendices and detail disclosures, not a decorative module. + +- Headers: use a light-gray or light-blue background, bolded text, short and clear column names. Header lines are thin, without heavy borders. +- Rows and columns: allocate column width by number length and text explanation; number columns are right-aligned, text columns are left-aligned; years/periods are centered or right-aligned consistently. +- Dividers: mainly thin gray lines; outer borders should not be too heavy; key groupings may be separated by a slightly darker line or a light background color. +- Row height: compact but not crowded, allowing high density; numbers in adjacent rows must never touch. +- Base color: mostly white background; light blue/light gray for headers, group rows, summary rows, or appendix blocks; zebra striping is not mandatory, and if used should be very subtle. +- Key rows/columns: may be emphasized with bold, a light background, or a thin top/bottom rule; do not fill an entire row with a highly saturated color. +- Summary rows: numbers may be bolded, dividers slightly stronger; keep the same font system as the detail rows. +- Symbols and rating dots: the source file has only a few symbol marks, not forming a primary system; do not add complex rating icons. +- Footnotes: a measurement-basis explanation, abbreviation explanation, or source must be placed below the table, in a font size smaller than the table text. + +## 9. Components and Graphic Elements + +Stable components and usage: + +- Top thin black rule: the header boundary of a standard white-background page, spanning the content width. The line is thin, without decorative thickening. +- Bottom thin black rule: the footer boundary of a standard white-background page, carrying the page number and footnote area. +- Upper-right identity mark: the group name rendered as plain small text, no graphic logo; black text on white-background pages, usually white text on photography pages. Keep it small and clear, not competing with the title for visual center. +- Page number: located at the lower-right corner or bottom edge, in small white/black text depending on the background. Photography pages may use white, financial pages use black or dark gray. +- Semi-transparent information bar: a text-carrying component on photography pages. Uses a light-gray/white semi-transparent base, spreads horizontally, carries short sentences, steps, strategic points, or data. Long paragraphs must not be placed on it. +- White cards: used for timeline nodes, parallel modules, or small charts over photos. Clean edges, sparing rounded corners, essentially no shadows. +- Brown accent bars/color blocks: used for channels, strategy, or a chart's main series, small-to-medium area, functioning as emphasis rather than decoration. +- Numbered blocks/year nodes: used for timelines, steps, and key milestones. The number is larger than the explanatory text, and the explanatory text is short. +- Small legend color blocks: used for chart series explanations, with colors strictly matching the data series. +- Process arrows/complex flow graphics: not observed as a stable primary language; if a process must be expressed, prefer horizontal entries and thin connecting lines, avoiding fancy arrows. +- Icons: colorful icons are not a characteristic of this style; if icons must be used, only extremely minimal black-and-white linear symbols in a small size as an auxiliary, not as the primary visual. + +## 10. Texture and Prohibited Items + +Overall adopts a flat, restrained, formal, low-decoration corporate IR style; brand pages rely on real photography, financial pages rely on whitespace, lines, tables, and typography. + +Prohibited: + +- Emoji, stickers, cartoon illustrations, 3D icons, glowing text, neon colors, complex textures, exaggerated shadows, thick outlines. +- Using large photo backgrounds or complex pattern bases on financial chart pages. +- Replacing the existing brown/gray system with highly saturated red/green for ordinary emphasis. +- Large centered blocks of text on financial or legal pages. +- Isolated large numbers without a stated measurement basis, multi-color charts without a legend, or financial tables without footnotes. + +Use with caution: + +- Gradients: the source file does not treat gradients as a primary style; aside from a photo's natural light and shadow, gradient backgrounds should not be artificially added. +- Shadows: cards and information bars are essentially flat; if hierarchy needs distinguishing, use only extremely subtle shadows, preferring base color and lines instead. +- Rounded corners: not a prominent feature; cards should have square or slightly rounded corners. +- Colorful icons: used cautiously only in small explanatory auxiliary scenarios, must not become systematic decoration. +- Large areas of brand brown: would reduce the sense of refined restraint; should be used mainly in charts and emphasis bars. + +Usable on special pages: + +- Full-bleed photo background: usable on covers, section pages, brand narrative pages, and store/craft/history pages; text contrast must be high. +- Large centered manifesto text: used only on low-information-density brand opinion pages, not on appendix or financial pages. +- Semi-transparent overlay: used on photography pages to improve readability, not on white-background financial pages. + +Absent items: no stable use of complex illustrations, social-media-style large icons, infographic figures, animated arrows, decorative watermarks, background geometric patterns, or large areas of colorful gradients observed. + +## 11. Generation Checklist + +- Skeleton: is the full-bleed photography skeleton or the white-background IR skeleton chosen based on page type? Do financial pages have top/bottom thin rules, an upper-left title, an upper-right identity mark (the group name rendered as plain small text, no graphic logo), a page number, and a footnote area? +- Copy: is the title a clear thematic sentence? Does each page express only one main point or one metric system? Do numbers carry a year, unit, and measurement basis? +- Hierarchy: are serif titles and sans-serif body text clearly distinguished? Are the relative sizes of the title, key message sentence, body text, table, and footnote reasonable? +- Color: is it kept within black/white/gray + a brown main accent + necessary light-blue table backgrounds? Is meaningless multi-color avoided? Does white text sit on a sufficiently dark background? +- Layout: does text on photography pages have a darkening or semi-transparent carrier? Do charts/tables dominate white-background pages, with explanatory text subordinate? +- Charts: are series color, legend, labels, units, and footnotes consistent? Are heavy grids, fancy 3D, and meaningless gradients avoided? +- Tables: are headers, groups, summaries, number alignment, dividers, base color, and footnotes complete? Is it still readable at high density? +- Components: are the identity mark, page number, thin rules, information bars, cards, and legend positioned consistently? Is icon and arrow overuse avoided? +- Prohibited items: are emoji, cartoon illustrations, 3D, glow, complex shadows, neon colors, and large decorative backgrounds avoided? +- Technical quality: check for text overflow, truncation, garbled characters, overlap, low contrast, occlusion, empty content, wrong proportions, stretched images, misaligned chart labels, and excessive template repetition. +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: lines, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/04_promotion/06/en/fresh-brand.md b/skills/open-kimi-ppt/reference/design_system/04_promotion/06/en/fresh-brand.md new file mode 100644 index 0000000..e8b9f52 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/04_promotion/06/en/fresh-brand.md @@ -0,0 +1,152 @@ +# L014 · Organization Name Equity Impact Report 2022 STYLE DESIGN SYSTEM + +## 1. Style Positioning + +Suited for brand-style annual impact reports, ESG/DEI/social-responsibility disclosures, and corporate culture and governance reports — long-form landscape digital reports. Aimed at the public, employees, partners, and reviewers, it adopts a report-style PPT that is easy to navigate, browse, and read in depth: many pages, medium-to-high body-text density, persistent navigation, with key sections switching rhythm via full-bleed, highly saturated soft colors. + +Centered on brand green, overlaid with flat color blocks in pink, purple, deep green, and yellow, combined with a thin top navigation, wide-margin text columns, rounded-corner card grids, and a small amount of flat illustration. + +Underlying principles: +- **Long reports navigate first, individual pages express second**: consistently retain the top report name, section list, current section, and page number, establishing section position clearly before presenting text, cards, or tables. +- **Sections use color blocks, body pages use white backgrounds**: covers, section title pages, and opinion pages may be full-bleed light green/pink/purple/deep green; explanation, data, and appendix pages prefer white backgrounds and light-colored cards, avoiding colored backgrounds swallowing small-print text. +- **Illustration and curves handle identity, the grid handles information**: illustrations, wave lines, and music symbols do not replace titles, tables, text columns, or card grids. + +## 2. Page Skeleton + +- **Canvas ratio**: landscape 16:9, aimed at web-report/PDF landscape reading, not a traditional live-presentation template. +- **Global margins**: content pages keep wide whitespace on all sides; the left side holds the logo, title, and body start point, the right side is used for a second/third text column, illustration, card, or data module. Content never touches the edge; even full-bleed color-background pages retain a safe area. +- **Header system**: white-background content pages consistently place a small brand mark, report name, section navigation, current section/subsection, and page number at the top. The header is light and understated; a thin wave/path line may run through the top-center. +- **Footer system**: no prominent regular footer; footnotes, sources, and explanations are placed below the body or near tables, in small, low-contrast text. Do not build a heavy footer bar. +- **Title area**: content-page titles sit in the upper-left body area, mostly short words or phrases. Section pages use "number + section name" or a standalone section name, noticeably enlarged and placed at left/left-center, not stacked in the center. +- **Body area**: uses text columns, card grids, image-text pairing, opinion manifestos, and tables/data disclosure. Default path: upper-left title → left body/main point → center-right cards/illustration/chart → bottom annotation. +- **Cover/section pages**: may be full-bleed light green, light pink, purple, or deep green, with a large wave-terrain graphic at the bottom or side, and a flat illustration at the right/corner. The logo is small and restrained, the title on the left. +- **Table-of-contents page**: white background; a small "Content" heading on the left, a large-font table-of-contents list in the middle, section numbers and page numbers clearly arranged in columns; navigation and page number retained on the right/top, with a small illustration only as an accent. +- **Dividers and watermarks**: no heavy straight-line borders; use thin wave lines, light-gray thin lines, card boundaries, and color-block boundaries. No stable watermark system observed — none should be added. +- **Logo**: the brand logo sits at the upper-left corner, in a small size in black or white, ensuring contrast. Do not enlarge it into a decoration. + +## 3. Content Organization + +- **Title style**: use report-style noun phrases or short section phrases, such as "Content," "Focus Areas," "Key Actions 2022," "Strategy." Section pages add a number prefix. Titles avoid marketing-slogan-style long sentences; aside from opinion pages, do not write multi-line manifestos. +- **Key message sentences**: opinion pages may hold a larger, left-aligned manifesto paragraph spanning from upper-left to center; ordinary content pages use a title + paragraph. +- **Body text organization**: organized in short paragraphs, commonly 2–3 columns side by side, separated by blank lines and column gaps, using dense bullets sparingly. Body text may be relatively long, but each column stays readable, without a full-width long line. +- **Grouping logic**: parallel themes use rounded-corner cards, commonly 2×2, 2×3, or text-left/card-right. Card titles sit at the upper left, body text is brief; cards in the same group use similar colors or alternate light green/purple. +- **Number of points per page**: section/opinion pages carry only 1 main point; content explanation pages are 1 main title + 2–4 paragraph groups; card-grid pages hold 4–6 parallel themes; data pages maintain searchability through headers and dividers. +- **Keyword emphasis**: use card background color, dark titles, local button labels, and weight/size hierarchy. Do not use large-area neon highlighting or multi-color underlines. +- **Numbers/units/reporting period and measurement basis**: years, page numbers, percentages, and metrics are aligned in columns within tables or the table of contents; explanations sit close to the data itself, not detached into a separate decorative large number, unless the source page itself is an opinion-type emphasis. +- **Source footnotes**: footnotes are smaller than body text, low-contrast but readable; large amounts of explanation, disclaimers, and audit information are concentrated in the appendix/data pages at the end. + +## 4. Content Page Layout System + +### A. Full-bleed section title page: color background + numbered title + illustration/wave terrain +For section openings and mood transitions. Uses a full-bleed background of light pink, light green, purple, or deep green; the left side holds a number and section name or a manifesto paragraph; a dark wave-terrain graphic sits at the bottom/side, with a flat illustration of a hand, megaphone, star, or music symbol at the right or corner. Relies on a large title and background color for emphasis, not complex decoration. Not to be used for tables, long disclaimers, or multi-conclusion pages. + +### B. White-background multi-column long-text page: left title + 2–3 columns of body text + light illustration +For strategy explanations, project explanations, and background introductions. Navigation is retained at the top, a short title sits at upper left, the body is arranged in 2–3 columns with compact paragraphs and wide column gaps; a small illustration may sit at the lower right or edge. Organizes emphasis through subheadings, paragraph spacing, and column width. If comparing multiple metrics or displaying many numbers, do not rely on multi-column text alone — switch to a table or cards instead. + +### C. Card-grid page: title/lead-in + 2×2 or 2×3 rounded-corner cards +For focus areas, action lists, value dimensions, or a four-quadrant strategy. Cards occupy the center-right area, with explanatory text or a title on the left; uses backgrounds of light green, purple, pink, or deep purple with pronounced rounded corners, text aligned at the upper left. One dark card or a stronger saturated background may mark the current theme. Do not let each card carry a long paragraph; split across pages when there are more than 6 modules. + +### D. Image-text pairing page: text column + large flat illustration + button-style label +For key annual actions, project actions, supplementary links, or reading guidance. The left/center holds the text column, with an illustration of a megaphone, hand, heart, or leaf on the right; a blue rounded-corner button such as "More key actions" may be used. Illustrations must not cover navigation or body text, and should not serve as the core of data explanation. Not used on formal audit or table-disclosure pages. + +### E. Full-bleed opinion page: large value manifesto + side column/annotation + illustration +For value statements within a section. The background may be light purple or deep green; a large block of left-aligned text is higher in size than body text but lower than the cover title; a short explanation or annotation column sits on the right, with an illustration at the center/lower-right. Retain only one main point and one set of supplementary explanation. Do not fill the page with centered long text. + +### F. Table/data-disclosure page: white background + compact table + understated title +For data, metrics, principles, and explanations at the end of the report. Navigation is retained at the top; the body is a grid table with aligned numbers and small-print annotations, reducing or removing illustrations and large color blocks. If the table is too wide, prefer splitting into multiple tables or horizontal groups rather than compressing it into illegibility. + +## 5. Color System + +- **Primary background light green #C3F0C9 / #C5F3CB**: used for the cover, section pages, card backgrounds, and brand identity, may be used full-bleed. A replacement color must keep high lightness, suitable for black/deep-purple text. +- **Deep green #00634F / #007A5A**: used for wave terrain, dark section backgrounds, local titles, or illustration bodies, medium-to-large area. When deep green is full-bleed, use white or light-colored text; do not overlay low-contrast green text. +- **Deep purple-black #4F374F / #463347**: used for primary text, dark cards, wave-terrain and illustration shadows, may replace pure black; must not be overlaid low-contrast with small deep-green/deep-blue text. +- **Light pink #FFCDD2 / #FBCED2**: used for section backgrounds, card backgrounds, and illustrations, may be full-bleed; may be replaced with a warm color of similar lightness, but not used for large-area fills on serious data-table backgrounds. +- **Bright pink #F573A1 / #F673A1**: used for illustration highlights, hearts, and local emphasis, small area; must not be used as the background for large body-text blocks or overused across multiple chart series simultaneously. +- **Light purple #CDB8E3 / #D3BDE9**: used for opinion-page backgrounds and card backgrounds, may be used over a large area paired with deep-purple text; should not be used as the background for small, dense tables. +- **Blue #2D46BA**: used for button-style jumps and a small amount of chart/component emphasis, small-to-medium area; must not replace the primary brand green as the whole report's main color. +- **Yellow/orange-yellow around #F3C64E**: used as a warm background or secondary color for some sections/illustrations. Use cautiously, avoiding large-area competition with light green, pink, and purple simultaneously. +- **White #FFFFFF / near-white #F8F8F8**: the base background for content pages and table pages, the largest area; content pages prefer a white background. +- **Light gray #D2D0D1 / #E6E4E5, gray #909791**: used for table lines, auxiliary labels, weak navigation text, and dividers, small area. + +Keep a single page to 1 primary background color + 1 dark text color + 1–2 illustration/card accent colors. Data/status colors should not expand into a rainbow chart; if positive/negative status must be added, prefer deep green/pink or deep purple/light gray, relying mainly on text explanation. + +## 6. Fonts and Text Hierarchy + +- **Font character**: the primary typeface is Coda (rounded sans-serif, built-in; Chinese: MiSans); cover/section large titles use the same family in bold. Overall sans-serif, rounded, low-decoration. Do not mix in a serif font as a regular title. +- **Body baseline**: body text = 1x, used for paragraphs, card explanations, and navigation text. +- **Footnotes/page numbers/top navigation**: about 0.65–0.8x, low contrast, near the header or bottom of tables; must be readable but not compete with body text. +- **Card body/table body**: about 0.8–1x; tables may be slightly smaller but keep line spacing and alignment. Card titles about 1–1.2x. +- **Body subheadings/module titles**: about 1.2–1.5x, left-aligned, distinguished through position and spacing, not heavily bolded. +- **Page titles**: about 2–3x, mostly short words, placed at upper left. +- **Section titles/cover titles**: about 4–5x or higher, the largest tier on the whole page. +- **Opinion manifesto**: about 2–3x, multi-line left-aligned, with compact but not crowded line spacing. +- **Text alignment**: left-alignment as the core; table-of-contents page numbers may be right-aligned/column-aligned, table numbers aligned by column. Avoid large centered blocks. + +## 7. Chart Language + +The source file is primarily report text, cards, and tables, without a strong data-visualization system — do not fabricate a complex chart style. + +- **Type boundary**: prefer simple bar/line/tabular metrics; do not use 3D, colorful area fills, complex radar charts, or decorative infographics. +- **Axes and grids**: use thin gray axes and light-gray gridlines with a presence lower than the data; do not use heavy black axis lines. +- **Labels and legends**: labels use body-text or table-sized small text near the data points; legends sit above or to the right, avoiding the main title area. +- **Series colors**: use brand colors — deep green, light green, deep purple, blue, pink — with few series. Do not exceed 4 strong-color series on one page. +- **Key data**: mark with deep-purple/blue emphasis, rounded-corner labels, or annotation arrows; key explanations must be verbalized in text, not conveyed by color alone. +- **Forecast/target/baseline lines**: use gray or deep-purple thin dashed/solid lines with brief labels. Do not use glowing lines, gradient fills, or heavy shadows. + +## 8. Tables and High-Density Information + +- **Table role**: carries data disclosure, report principles, and audit/appendix explanations — it is "searchable evidence," not a visual protagonist. +- **Headers**: use a light-gray or white background, with text slightly larger or one hierarchy level above the table body; deep purple-black may provide emphasis. Headers do not use a heavy dark bar, unless matched consistently with a dark section page and kept readable. +- **Row/column structure**: use thin gray dividers; text columns are wider than number columns. Long text may wrap, but must not be compressed into overly tight line spacing. +- **Row height and density**: keep high density and readable line spacing. Do not let multiple lines of text overlap or truncate just to fill a page. +- **Base color and zebra striping**: near-white, light gray, or extremely pale light-green backgrounds may group rows; zebra striping, if used, must be very subtle. Avoid large areas of pink/purple spread across dense tables. +- **Key rows/columns**: use a light-green background, deep-purple text, or a thin border; summary rows may be slightly bolded or given a light background — do not use strong red/yellow warnings. +- **Number/text alignment**: text is left-aligned, numbers are right-aligned by column or aligned by decimal place, and percentages/units use a consistent measurement basis within the same column. Footnote markers use small superscripts or symbols, with the explanation placed below the table. +- **Symbol markers/rating dots**: the source file shows no stable icon-rating system — do not add complex red/yellow/green lights or star ratings. + +## 9. Components and Graphic Elements + +- **Top navigation bar**: the most important global component, containing the logo, report name, section/subsection list, current position, page number, and a thin wave line; must be light, thin, and small. +- **Table-of-contents list**: large section names + numbers + a column of page numbers, with a small circle/link symbol optionally on the right. Used only on the table-of-contents page — do not repeat a large table of contents on regular pages. +- **Rounded-corner cards**: used for parallel themes, strategy dimensions, and key actions. Pronounced rounded corners, backgrounds mostly light green/purple/pink, text aligned at the upper left; even spacing, no shadows added. +- **Button-style labels**: used for jumps or supplementary actions, such as a blue rounded-corner button; small area — do not turn every small heading into a button. +- **Wave terrain/curves**: used on the cover, section pages, and header. A large wave at the bottom serves composition; a thin wave in the header serves navigation. Do not add a large wave to data-table pages, which would disrupt reading. +- **Flat illustrations**: including megaphones, hands, hearts, stars, leaves, and music symbols, using the brand color palette with black/deep-purple outlines; placed at the right, bottom, or corner, not carrying complex information. +- **Small icons/symbols**: music notes, arrows, and stars may serve as accents; the colorful icon system is not stable and cannot replace text labels. +- **Tip boxes/side columns**: use light-colored rounded-corner boxes to carry supplementary information or annual highlights; layered apart from the body text, avoiding confusion with the main cards. +- **Dividers**: use thin gray lines, wave lines, and card boundaries; do not use heavy borders, double-line frames, or strong shadow boundaries. + +## 10. Texture and Prohibited Items + +Overall adopts a flat, friendly, branded, lightly decorated texture, establishing identity through color blocks, illustrations, rounded-corner cards, and the navigation system, with almost no real photography or complex textures used. + +**Prohibited**: +- 3D graphics, dimensional buttons, glow, metallic texture, strong shadows, glassmorphism. +- Large photo backgrounds, real-people photo collages, or screenshot stacking as the primary visual. +- Complex gradients, textured backgrounds, noise decoration, heavy borders. +- Emoji, social-media-sticker-style icons, rainbow-style icon sets. +- Large centered blocks of copy, a full page of body text with no navigation, body text pressed onto illustrations or complex dark backgrounds. + +**Use with caution**: +- Illustrations: usable on sections, opinion, and image-text pages; should be reduced on table/audit/high-density data pages. +- Full-bleed colored backgrounds: suitable for covers, sections, and value manifestos; not suitable for long tables and dense small print. +- Blue buttons: used only for jump/action prompts, not as a universal accent color. +- Multi-color cards: control the number of hues on a single page, avoiding one strong color per card. + +**Usable on special pages**: +- Covers and section pages may use large wave terrain, full-bleed color backgrounds, and large illustrations. +- Opinion pages may use full-bleed deep green or light purple, paired with a large manifesto in white or deep-purple text. +- Appendix/data pages may sacrifice visual interest, returning to a white-background, thin-line table. + +## 11. Generation Checklist + +- Skeleton: is it 16:9; do content pages have wide margins, an upper-left logo, top navigation, page number/current section; is a heavy footer avoided? +- Copy grammar: is the title short and report-style; are sections numbered; does the opinion page make only one main point; is body text organized in left-aligned short paragraphs? +- Hierarchy: body text = 1x; is navigation/footnote smaller than body text; is the page title about 2–3x; are section/cover titles the largest; has no specific font size been hardcoded? +- Color: is light green/deep green/deep purple primary, with pink/purple/blue secondary; does any single page avoid exceeding 1 primary background color + 1–2 accent colors; is text contrast sufficient? +- Layout: is a layout chosen based on content — multi-column, card grid, image-text pairing, opinion page, or table page; is stuffing a long table into a section title page avoided? +- Charts: are they restrained, with thin grids and few series; are 3D, colorful gradients, and excessive status colors avoided? +- Tables: are headers, rows/columns, number alignment, and footnotes clear; is there no overcrowding, truncation, or low contrast? +- Components: do rounded-corner cards, wave lines, buttons, and illustrations serve a clear informational function; is icon overuse in place of text avoided? +- Prohibited items: is there no photo background, emoji, complex decoration, strong shadows, glow, textures, glassmorphism, or large centered long text? +- Output quality: check for no overflow, garbled characters, overlap, occlusion, empty cards, low contrast, or wrong proportions; navigation should not mechanically repeat to the point of covering body text, and illustrations should not press onto text. diff --git a/skills/open-kimi-ppt/reference/design_system/05_academic/01/en/pink-purple-diagnosis.md b/skills/open-kimi-ppt/reference/design_system/05_academic/01/en/pink-purple-diagnosis.md new file mode 100644 index 0000000..193f693 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/05_academic/01/en/pink-purple-diagnosis.md @@ -0,0 +1,146 @@ +# Soft Cloud-Layer Diagnostic Narrative · PPT Design System (brand-free, reusable version) + +This document is reverse-engineered from a 32-page technical talk source deck, retaining only the visual language and narrative method for reuse in any technical-proposal-style presentation. The full text contains no third-party logos, brand names, people, product screenshots, source-deck body text, or original data; any value that could not be precisely sampled is marked "approximate." + +Applicable scenarios: performance diagnostics, monitoring proposals, technical methodology talks — narrative-style presentations that follow "pose the problem → establish metrics → give the method → show evidence → close the loop." + +## Visual DNA + +- Primary tone: **white background + bold dark-blue titles + a single accent color bar**. Pages have abundant whitespace, low-to-medium information density, one point per page. +- Character keywords: clean, restrained, soft, engineering-feel. All decoration serves the narrative — decoration is never added for its own sake. +- Two cover moods: + - The opening cover uses a **soft pink-purple cloud-layer gradient** (approximately `#F7CDD8` → `#DCC8F2`), creating a light, friendly first impression. + - The closing page uses a **deep-purple gradient** (approximately `#3A1D6E` → `#5C40A8`) with large white text, closing out the whole talk. +- Recurring identity element: a **short, thick underline** below and to the left of the title (about the width of the title's first word, about 4–6px tall), whose color switches with the current section's theme color (a yellow-green or bright-yellow family). This is the entire deck's only "brand anchor" and may be replaced with any theme color. +- On-page emphasis relies on **font weight and bolded keywords**, occasionally seasoned with a single emoji (at most one per page); icon-stacking is not used. + +## Canvas and Grid + +- Aspect ratio: **16:9** (1280×720 or equivalent), landscape projection preferred. +- Safe margins (approximate): about 5% on left and right each (≈64px @1280), about 6% at the top, about 8% at the bottom (footer zone). +- Grid: an implicit 12-column grid. Body text defaults to a left-aligned single column, occupying the left 7–8 columns; image-text pages commonly use a "text left, image right" 7:5 split, or a centered large image spanning 10 columns. +- Baseline rule: titles consistently start from the same y-coordinate (approximately 8–10% from the top); the body's starting point is consistently about 48–64px below the title underline, with no drift across the deck. +- Bottom diagonal color band: some section pages place a **large-angle diagonal color band** at the bottom edge or lower right (height about 15–25% of the canvas, diagonal angle about 5–10°) as a visual signal for section separation; content pages usually stay pure white. + +## Font Hierarchy + +Font family: Liter (English) and MiSans (Chinese), approximating a system sans-serif; use JetBrains Mono (via customFonts) for code and other monospace needs. Do not use serif or other decorative fonts. + +| Tier | Purpose | Font size (approximate, 1280-width baseline) | Weight | Color | +|---|---|---|---|---| +| H1 page title | The single title per page | 34–40px | Bold | Deep-blue ink | +| Cover main title | Opening cover | 40–48px | Bold | Deep purple | +| Cover subtitle | Byline/date line | 20–24px | Italic/Regular | Deep purple (lighter) | +| Subheading/definition question | "What is X?"-style lead-in sentence | 18–22px | Bold | Deep-blue ink | +| Body/list | Points, paragraphs | 16–18px | Regular, keywords Bold | Dark gray | +| Annotation/footer | Copyright, source, small print | 10–12px | Regular | Medium gray | + +Rules: +- Titles are mostly **questions or assertive statements** (e.g., "What are our goals?", "Context is everything"), advancing the narrative directly through the title. +- Body emphasis uses inline Bold, not color changes or underlines. +- Definition pages follow a fixed sentence pattern: a subheading question + a definition paragraph (keywords bolded) + one "goal sentence" summarizing the experience goal that metric corresponds to. + +## Color Tokens + +The following are reverse-sampled approximate values; fine-tune on implementation, but maintain the relationship of "a low-saturation base color + one high-saturation accent color." + +- `--ink` (titles/emphasized text): deep-blue ink, approximately `#1C2B4A` +- `--body` (body text): dark gray, approximately `#333A45` +- `--muted` (annotations/footer): medium gray, approximately `#8A93A0` +- `--paper` (base color): pure white `#FFFFFF` +- `--accent-lime` (theme accent A, green-family sections): approximately `#8CC63F`, used for title underlines, diagonal color bands, and loop diagrams +- `--accent-yellow` (theme accent B, yellow-family sections): approximately `#F2A900`, used for title underlines, diagonal color bands, and task bars +- `--cover-gradient`: pink `#F7CDD8` → pale purple `#DCC8F2` (cover cloud-layer base) +- `--end-gradient`: deep purple `#3A1D6E` → purple `#5C40A8` (closing-page base) +- `--purple-title` (cover title): approximately `#6E2E7E` +- Three-state status colors (rating/threshold legend, approximate): `--ok` `#3FBF6F`, `--warn` `#F5C400`, `--bad` `#F05A5A` +- Timeline bar colors (approximate): task segment `--task` `#F5D76E`, event segment `--event` `#B98FE0` + +Usage constraint: each page has **one and only one** accent color (green-family or yellow-family, determined by the section); the three-state status colors appear only grouped within rating legends and are not mixed with the section accent color for decoration. + +## Page Skeleton + +The whole deck is organized around a "diagnostic narrative arc," with a reusable skeleton sequence: + +1. **Cover**: gradient cloud-layer base + left-aligned main title/subtitle, with a slot at the upper right for an event or institution mark (leave blank when reusing, or place your own mark). +2. **Quote page**: pure white background, an oversized quotation-mark character (theme color) + a quote paragraph + an em-dash byline, with a diagonal color band at the bottom. Used to establish thematic authority. +3. **Goals page**: a question-style title + a bullet list of up to 4 items, answering "what are we pursuing." +4. **Section title page**: pure white or with a diagonal color band, a large short-phrase title (e.g., "Common metrics"), serving as a section divider. +5. **Metric definition pages** (repeated in groups, 1–3 pages per metric): + - Definition page: a question-style subheading + a bolded-keyword definition + a goal sentence. + - Problem page: a "Some issues with X"-style list of limitations. + - Calculation/measurement page: a formula or diagram + a wireframe illustration such as a phone outline. +6. **Method turning-point page**: a large-text question (e.g., "So… what should we measure?") + one witty answer line, picking up from the first half's setup. +7. **Context/method page**: a checklist-style question ("Do we care about…?"), pulling absolute metrics back to a concrete scenario. +8. **Implementation page**: text-left/code-right, full-width code, or a step list, explaining the means of implementation. +9. **Evidence page**: a timeline diagram, Before/After comparison, or rating bar, presenting the measurement results. +10. **Closed-loop page**: a loop diagram (Measure → Analyze → Improve), making the point of a "continuous process." +11. **Recap page**: a "Recap" summary of 5–6 bolded-keyword points. +12. **Closing page**: deep-purple gradient + large white "Questions?"-style text. + +## Reusable Layouts + +- **L1 pure list page**: title + underline + bullet list (≤6 items, each within one and a half lines). Applicable to: goals, limitations, summaries. +- **L2 text-left/image-right page**: 40% text on the left (definition/list), 60% large image or diagram on the right. Applicable to: concept explained with an illustrative screenshot-style diagram, code explanation. +- **L3 centered large-image page**: title on top, a centered image below spanning 60–80% of the width (timeline diagram, waterfall chart, curve chart). Applicable to: evidence presentation. +- **L4 comparison page**: two groups of matching wireframe diagrams (e.g., phone wireframes, task bars) arranged left-right or top-bottom, connected by a middle arrow, labeled Before / After. Applicable to: before/after optimization, two alternative solutions. +- **L5 formula page**: title + a centered formula line + an illustrative example below + one line of calculation result. Applicable to: metric algorithms. +- **L6 quote/question page**: a single large-text sentence, centered or left-offset, paired with a theme-color symbol (quotation mark, ellipsis). Applicable to: transitions and tone-setting. +- **L7 code page**: title + a dark rounded-corner code block (positioned right or full-width), with 2–4 lines of explanation on the left. Syntax highlighting within the code block uses a soft color scheme, not a pure-black background (approximately deep charcoal-gray `#2B2F38`). +- **L8 loop-diagram page**: a centered ring/loop-arrow diagram (3 nodes: Measure, Analyze, Improve), with one sentence at the ring's center. Applicable to: methodology closed-loop. + +## Chart/Table/Image/Component Rules + +- **Timeline/waterfall chart**: horizontal bands express stage duration, with stages distinguished by soft fill colors (yellow = task, purple = event, approximate), thin leader lines connecting to stage-name labels; the vertical or horizontal axis retains only necessary tick marks. +- **Before/After task bars**: two horizontal bars — the top row "before optimization" as one long bar, the bottom row "after optimization" split into several short bars, with arrows marking event-handling points; colors as above. +- **Rating-bar component**: a large metric abbreviation (theme color or deep blue) + three color bars below (green/yellow/red) labeling Good / Needs Improvement / Poor and their thresholds, with three placed side by side for comparison. When reusing, replace with any three-tier rating semantics. +- **Wireframe device illustration**: use a simple rounded-rectangle wireframe to represent a phone/browser viewport, with only gray block placeholders inside to express content layout, and red/blue dashed lines and arrows marking displacement or regions; **do not embed real product screenshots**. +- **Curve chart**: a single smooth curve + sparse axes (a three-tier scale like 0%/50%/100%), no gridlines, mostly whitespace. +- **Loop diagram**: a ring divided into three equal arrow segments, node words arranged along the outside of the ring, a short sentence at the ring's center, arrows using a theme-green gradient. +- **Tables**: the whole deck almost never uses data tables; if one is needed, use a minimalist style with no vertical rules, thin dividers between rows, and a bolded, background-free header. +- **Images**: always placed centered with a thin gray border or no border; using third-party product-interface screenshots, real website photos, or photos of people is prohibited. +- **List symbols**: dots are the default; "recommended/satisfied"-type lists may use a green checkmark (✅) instead of a dot. + +## Density and Spacing + +- **One core message per page**: the title is the conclusion, and the body only supports that conclusion. +- List-page body text does not exceed 6 items; definition-page body text does not exceed 120 words; code-page code does not exceed 25 visible lines. +- Paragraph spacing (approximate): title underline → body text 48–64px; between list items 12–16px; image → caption text 24–32px. +- Whitespace ratio: on pure-white content pages, the effective content area occupies about 50–65% of the canvas, with the rest as whitespace; prefer splitting across pages over compressing line spacing. +- Overall page-count rhythm reference (32 pages): setup 40% (goals + metric definitions), turning point 10%, method and evidence 35%, closing 15%. + +## Footer and Page Numbers + +- Footer position: lower-left corner, a single line of 10–12px medium-gray small text (approximate), containing a copyright line like "© Year Institution Name. All rights reserved."; replace with your own institution when reusing, or remove it. +- A **small mark slot** may be placed on the left side of the footer (approximately a 16×16px colored-dot/graphic placeholder); when reusing, place your own logo or leave it blank — do not reuse the source deck's mark. +- The source deck **does not display page numbers explicitly**; if page numbers are needed, a medium-gray number at the lower right in 10px is recommended, on the same baseline as the footer. +- The cover and closing gradient pages carry no footer or page number. + +## Prohibited Items + +- Do not copy any third-party logo, conference mark, brand name, trademark, or mascot graphic. +- Do not use real product/website screenshots, real data, or the original charts and specific values from the source deck. +- Do not quote sentences from the source deck's body text; definitions and copy must be rewritten following this system's sentence patterns. +- Do not include photos of people or a speaker's likeness. +- Do not mix multiple decorative colors: each page is limited to one section accent color for decoration (except the three-state status legend). +- Do not use shadows, gradient text, outlined large text, 3D effects, or complex textured backgrounds (except the specified gradients on the cover and closing pages). +- Do not use serif or handwriting fonts, and do not introduce decorative variants beyond the specified Regular/Bold weights and limited italic usage. +- Do not add a large color-block background on pure-white content pages; color blocks are allowed only in the bottom diagonal band, the title underline, and inside charts. + +## Delivery Checklist + +- [ ] 16:9 aspect ratio, with margins and title baseline consistent throughout. +- [ ] Each page has only one title and one core message; the title is a question or an assertive statement. +- [ ] The title underline is present and its color matches the current section's accent color. +- [ ] The entire deck uses only the font size/weight/color combinations from the font hierarchy table. +- [ ] The section order follows the "problem → metrics → turning point → method → evidence → closed loop → recap → closing" skeleton. +- [ ] Metric-related content uses the "definition page + limitations page + calculation/evidence page" grouped structure. +- [ ] At least one Before/After comparison page and one closed-loop diagram page are included. +- [ ] Chart colors are drawn from the tokens, with no extra decorative colors outside the charts. +- [ ] The cover is a soft pink-purple cloud-layer gradient; the closing page is a deep-purple gradient + large white text. +- [ ] The footer copyright line has been replaced with your own institution or removed; no source-deck marks remain; page-number style is compliant. +- [ ] The document contains no third-party brands, screenshots, people, original text, or original data; approximate values have been calibrated to actual needs. +- [ ] Pure-white pages retain ≥35% whitespace, with no crowded pagination; code line counts and list-item counts stay within the limits. + +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: lines, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/05_academic/02/en/teal-green-academic-defense.md b/skills/open-kimi-ppt/reference/design_system/05_academic/02/en/teal-green-academic-defense.md new file mode 100644 index 0000000..52e18b0 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/05_academic/02/en/teal-green-academic-defense.md @@ -0,0 +1,147 @@ +# Academic Thesis Defense Design System (brand-free, reusable) + +> Applicable scenarios: long academic thesis defenses / research presentations / paper talks (100+ page scale). This system abstracts only visual and layout rules and contains no brand, person, institution, title, original text, original figure, or real data. + +--- + +## 1. Visual DNA + +- **Character**: restrained, academic, white-background minimalism. Information density is high but whitespace is generous, winning through typographic hierarchy rather than decoration. +- **Base color**: a pure white canvas, with full-bleed color blocks appearing very rarely; color is used only as functional coding (emphasis, categorization, progress), never as decoration. +- **Line quality**: core illustrations use a hand-drawn/line-art style (thin black lines, gray fills), contrasting with the sans-serif body font to create a "rigorous framework + approachable diagram" feel. +- **Progressive narrative**: the same composition is built up progressively across multiple pages (frame-by-frame highlighting, graying-out, adding elements) — this is the deck's single most important expressive device, so static pages must reserve room for "step-by-step reveal." +- **Dual-engine structure**: main-thread sections are driven by a full-width navigation footer; side-thread/backup slides (extra slides) use a simplified footer, with one stable page skeleton unifying 140+ pages. + +## 2. Canvas and Grid + +- **Ratio**: 16:9 landscape. +- **Safe margins**: about 4–5% of the canvas width on left and right, about 6% at the top, with about 10–12% reserved at the bottom for the footer zone. +- **Main grid**: mostly a single column; for two-column comparisons, equal widths on both sides (48/48, with a 4% gap in between); for a four-column card grid, four equal-width columns with consistent column gaps. +- **Alignment**: titles, body text, and charts are all left-aligned; only cover secondary info, divider-page large text, and the acknowledgments page may be centered or center-left. +- **Content area**: title area (top, one line) + body area (middle, about 70% of the height) + footer area (a fixed band at the bottom). Within the body area, when charts and text are mixed, text sits on the left and diagrams on the right or center. + +## 3. Font Hierarchy + +The whole deck uses a single sans-serif family, QuattrocentoSans (humanist sans; Chinese: MiSans), differentiated only by weight and size; code/formula snippets use JetBrains Mono (brought in via customFonts). + +| Tier | Purpose | Relative size | Weight | Color | +| --- | --- | --- | --- | --- | +| H0 | Cover main title | 100% baseline ×2.2 | Bold | Near-black | +| H1 | Content-page title | ×1.5 | Bold | Near-black | +| H2 | Column title / card title | ×1.1 | Bold | Near-black | +| Divider-page large text | Section divider page | ×1.8 | Bold (keywords) + Regular (the rest, light gray) | Black/light-gray mix | +| Body | Lists and paragraphs | ×0.85 | Regular | Near-black | +| Small text | Footnotes, table notes, figure captions | ×0.6 | Regular | Medium gray | +| Footer | Navigation and page number | ×0.5 | Regular (current item Bold) | Gray/black | + +- Body line height 1.3–1.4; list-item spacing is 0.5× the line height. +- Emphasis is limited to: **bold**, the theme color, and a local highlight background — italics, underlines, and shadowed text are not used. + +## 4. Color Tokens + +| Token | Color value (approximate) | Purpose | +| --- | --- | --- | +| `bg` | `#FFFFFF` | Global base color | +| `ink` | `#1A1A1A` | Titles and body text | +| `ink-muted` | `#8C8C8C` | Secondary text, non-current footer items, grayed-out state | +| `line` | `#BFBFBF` | Table rules, connecting lines, chart axis lines | +| `accent` (primary) | `#2E8B7E` deep teal-green | List square markers, divider-page outline, quote/label block background | +| `accent-wash` | `#DFF1EE` | Light background for label blocks | +| `info` (secondary) | `#5B9BD5` medium blue | Goal/conclusion banners, card headers, icon background | +| `info-wash` | `#E8F1FA` | Light fill for banners and card bodies | +| `highlight` | `#F2B90F` amber | "Current focus" highlight during progressive builds, key values, local background | +| `annotate` | `#8E5AA8` purple | Annotation bubbles, quotation-marker boxes | +| `danger` | `#C0504D` red | Negation, error paths, cancellation marks (used very sparingly) | +| `neutral-tag` | `#9AA5B1` | Secondary group bar (e.g. a "baseline/gap" group header) | + +Rules: colored area per page ≤ 15%; the same semantic meaning stays the same color throughout the deck (e.g. "in progress/focus" is always amber); graying-out is the only way to express "past/irrelevant." + +## 5. Page Skeleton (Masters) + +1. **Cover page**: a title block at upper left (main title Bold + subtitle + one small line of byline/date); below, a full-width dark banner image occupying about 1/4 of the height (abstract texture, not a photo of people). +2. **Section divider page A (gray-text style)**: a large title centered-left, with non-keyword portions in light-gray Regular and keywords in black Bold, creating "light/dark contrast within one sentence." +3. **Section divider page B (outlined-frame style)**: a thin-lined rounded rectangle centered on the page (`accent` outline, no fill), with the section name centered inside in Bold; even whitespace above and below. +4. **Standard content page**: H1 at upper left; the body area carries a list/two columns/chart/table; a fixed footer at the bottom (see §9). +5. **Section summary page (Digest)**: H1 reads "Section Name - Digest"; the left side is a three-part structured list (Task / Method / Result, each with 2–4 square-marker sub-items), the right side has one method diagram + 1–2 source label blocks (`accent-wash` background + `accent` text + a small icon). +6. **Conclusion/closing page**: reuses the standard content page, with list items allowed to end with a back-reference mark such as "→ Goal number ✓" (circle + number + checkmark). +7. **Acknowledgments page**: purely text, centered, two lines (a main sentence + a secondary sentence), optionally paired with a simple symbol. +8. **References page**: H1 + a two-column or single-column dense numbered small-text list (×0.55 size), with no other decoration. +9. **Backup/appendix pages**: share the same skeleton as the main content, but the footer switches to simplified navigation (only 3–4 groups + a dot-progress indicator). + +## 6. Reusable Layouts + +- **L1 single-column list**: H1 + a multi-level square-marker list, up to three levels; level 1 uses a solid `accent` square, level 2 a small square or short dash of the same color, level 3 hollow/gray. +- **L2 two-column comparison**: two equal-width columns, with a Bold short phrase as the column header ("A looks for … / B looks for …" pattern), each column containing a short list; no divider line is drawn between them — grouping relies on spacing. +- **L3 centered pithy statement**: a bold statement line at the page's center (which may include a symbol like ⇒), with large whitespace above and below; used for transitional argument pages. +- **L4 banner card**: `info-wash` background + a solid `info` icon area on the left + a Bold label on the right + one line of explanation; rounded corners, thin border; used for statements that "need to be remembered," such as research goals or core conclusions. +- **L5 multi-column goal matrix**: a rounded `info` header bar at the top (with a gear-type icon on the left) → a `neutral-tag` group header below it (two groups: baseline / gap) → 4 equal-width columns, with column headers as rounded `info` chips (number + short name) and column bodies as `info-wash`-filled rounded rectangles; a vertical sidebar at the far left, embedding 4–6 line icons + vertically arranged category text. Matrix cells support three fill states: empty (yet to be discussed) / a ✓✗ comparison grid / numbered points + source labels. +- **L6 progressive-build page**: the same composition spans multiple consecutive pages, with each page adding only one change: ① a new element fades in; ② an existing element is emphasized with a `highlight` yellow frame/background; ③ non-focus elements are grayed out as a whole (`ink-muted`). The page must be designed as a composition stable enough that "adding one more layer still doesn't collapse it." +- **L7 text-left/image-right**: a structured list on the left, a line-art diagram on the right (document icons, connecting lines, label chips); the image occupies about 45% of the width. +- **L8 full-width table/figure**: H1 + a table or chart occupying 90% of the body area, with small-text footnotes immediately following. +- **L9 large comparison table**: a multi-row, multi-column metric comparison table + one line of small footnote text at the bottom explaining the measurement basis. + +## 7. Chart / Table / Image / Component Rules + +**Charts** +- Style: academic simple diagrams. Thin gray axis lines, no decorative tick marks, direct labeling; bars, lines, and scatter plots are all usable, with colors limited to `accent`, `info`, `highlight` + two shades of gray. +- Error bars and confidence intervals are expressed with thin lines; legends sit at the upper right or right side inside the chart, at ×0.6 size. +- When multiple subplots sit side by side, unify the axis range and font size; subplot labels use small (a)(b)(c) markers. +- Time/trend line charts may use multiple thin colored lines, but the same metric must use the same color across pages. + +**Tables** +- A three-line-table variant: a medium-thin horizontal line at the top and bottom, a thin horizontal line below the header, with no vertical lines or only extremely faint vertical lines. +- Headers are Bold, numbers are right-aligned or aligned by decimal point; the best value may be Bold + colored with `accent`, but at most once per column. +- Table footnotes: a superscript letter/symbol + ×0.55 gray text, immediately following the table. + +**Images and diagrams** +- Only two types are used: ① an abstract full-width banner (cover-only); ② a line-art diagram (document/pipeline/process). Photos, screenshots, and realistic illustrations are prohibited. +- Line-art diagram convention: thin black outlines, gray-scale fills simulating lines of text, small colored chips marking key positions; elements are connected by gray curved arrows, with arrows indicating direction only, not weight. +- Icons: a unified set of line icons (same stroke width, same corner radius), in two sizes (within lists / within cards), colored from `accent`/`info`/gray. + +**Components** +- Square-marker list: a solid small square ■, in `accent` color, sized at about 0.45× the text height. +- Source/citation label block: a rounded rectangle, `accent-wash` background + `accent` text, with a small document icon on the left; 1–2 may appear side by side on the same page. +- Annotation bubble: a rounded rectangle + a pointer line, `annotate` outline, containing a handwriting-feel short sentence or formula fragment inside; used only for "in-text quote/parameter"-type annotations. +- Numbered back-reference: circled numbers (①②③) used for point numbering; goal back-references use "diamond/circle + number + ✓." +- Pipeline diagram: left-to-right flow, with stages represented by line-art blocks or cylinders (data sources) + rectangles (artifacts), stage numbers placed on gray rounded bars, arrows as solid gray lines. + +## 8. Density and Spacing + +- **Rhythm**: content pages have medium-to-high information density (1 central argument per page + ≤ 6 first-level points); insert one low-density divider or pithy-statement page every 8–15 pages as a breathing point. +- **Spacing system** (with body text size as 1u): title to body 1.5u; between list items 0.5u; between list groups 1u; chart to caption 0.75u; between columns 2u; footer to body 1.5u. +- **Progressive-page discipline**: each step of a step-by-step reveal changes only one thing; do not add a new element and gray out another within the same step. +- **Whitespace floor**: on any page, the bounding box of the body area's elements must not exceed 85% of the content area, and at least two corners must retain noticeable empty space. + +## 9. Footer and Page Numbers + +- **Main-thread footer (three parts)**: + 1. Top navigation row: all section names laid out horizontally (about 7–8 items), with the current section Bold near-black and the rest `ink-muted`; below each section name is a row of small dots representing that section's page count — discussed/current dots are solid (the current page's dot in `accent` or solid black), undiscussed dots are hollow. + 2. Lower left: a small `current page/total pages` label (e.g. `12/51` or as a fraction). + 3. Bottom row: a date (left) + a gray small-text byline row (speaker · report title, replaced with a generic placeholder when reusing). +- **Backup-page footer**: only 3–4 group names + a dot-progress indicator + page number, with no byline row. +- Divider page B and the acknowledgments page may omit the footer entirely; divider page A retains the footer to maintain a sense of position. +- Page numbers are numbered continuously throughout the deck (the backup section may either restart or continue the numbering, as long as the choice is applied consistently). + +## 10. Prohibited Items + +- Prohibited: any brand mark, institutional logo, real person's name/photo, the thesis's original title and body paragraphs, original charts and real experimental data, webpage/software screenshots, or original reference-list entries. +- Prohibited: gradient fills, drop shadows, 3D effects, decorative display type, textured backgrounds, full-bleed colored background pages. +- Prohibited: italics/underlines as emphasis, more than two colors emphasizing the same element simultaneously, sticker-style emoji graphics. +- Prohibited: vertical body text (only sidebar category labels may be set vertically), list nesting beyond three levels, more than one central argument per page. +- Prohibited: footer dots not matching the actual section page count, the same semantic color changing across pages, and jumpy positioning across progressive-build pages. + +## 11. Delivery Checklist + +- [ ] 16:9, white background; no brand, no people, no photos/screenshots, no original text/figures/data. +- [ ] Only one sans-serif family + one monospace font are used; font-size tiers match the §3 table. +- [ ] All colors come from the §4 tokens; colored area per page ≤ 15%; the same semantic meaning uses the same color. +- [ ] All eight reusable skeletons — cover, the two divider-page types, standard content page, Digest page, conclusion page, acknowledgments page, references page, backup page — are present and reusable. +- [ ] At least one example each of layouts L1–L9; progressive-build pages change only one thing per step and keep a stable composition. +- [ ] Tables follow the three-line-table style with complete footnotes; chart colors are compliant, with the same metric using the same color across pages. +- [ ] The footer's navigation section names + dot progress match the actual state; page numbers are continuous; the backup section's footer is the simplified version. +- [ ] The four component types — square-marker lists, source label blocks, annotation bubbles, numbered back-references — are styled consistently throughout the deck. +- [ ] A low-density breathing page appears every 8–15 pages; the body area occupies ≤ 85%. +- [ ] The whole document is UTF-8; placeholder text uses generic research narrative (goal/gap/task/method/result/limitation) with no identifiable source information. + +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: lines, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/05_academic/03/en/pastel-derivation.md b/skills/open-kimi-ppt/reference/design_system/05_academic/03/en/pastel-derivation.md new file mode 100644 index 0000000..5dff1e1 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/05_academic/03/en/pastel-derivation.md @@ -0,0 +1,115 @@ +# Pastel Academic Derivation Deck Design System + +A brand-free design system for math/ML-style deep-dive tutorials: pastel-gradient section covers + white-background derivation content pages, with "contour probability plots + formula cards + progressive reveal" as the core narrative device. This system abstracts only the visual style and pacing of explanation, and contains no brand, person, original text, or original chart. + +## 1. Visual DNA + +- **Two page skins**: ceremonial pages (cover, agenda, section dividers, back cover) use a diagonal pastel gradient; content pages use a near-white solid color, with high information density but generous whitespace. +- **Warm-toned figure area**: all probability/geometry diagrams sit on a uniform warm off-white (peach) canvas block, with orange-to-deep-red heat contour lines representing density — a recurring visual anchor throughout the deck. +- **The formula is the protagonist**: a large serif italic formula, centered or occupying its own line, carried by a pale blue-gray rounded "formula card"; within body text, key terms are colored blue (process/link), magenta (warning/key point), or teal (condition/input) rather than piled up with bold. +- **Progressive reveal (build-up)**: the same title is reused across consecutive pages, adding elements frame by frame and fading in the next conclusion; the pacing is one concept per page, breaking the derivation down as slowly as possible. +- **Rounded-pill components**: definitions, theorems, goals, and caveats are all placed inside rounded rectangles/pill bars, in a two-part "label + content" structure. +- **Annotation arrows**: thin blue/magenta arrows with text labels point to a specific term in a formula or a region of a diagram, replacing parenthetical notes. +- **Small-print footnotes**: a line of extremely small gray text at the bottom of the page carries sources/supplementary notes; body text never cites a reference number. + +## 2. Canvas and Grid + +- Aspect ratio: 16:9, recommended 1280×720 pt (or 33.87×19.05 cm). +- Safe margins: 48 pt left/right, 40 pt top/bottom; the footer band sits 12 pt above the bottom edge. +- Content grid: 12 columns, 16 pt column gap; common placements are 4+8 (text left, image right), 6+6 (two-column comparison), 3×4 (three-card row), and full-width (single image/single formula). +- Title anchor: upper-left corner, x=48, y=40, title block 72 pt tall, with the content area starting 24 pt below it; the content area's bottom ends at y=640, leaving room for the footnote below. +- Figure-area alignment: all diagram canvas blocks use a unified set of width/height sizes (e.g. 320×240 / 480×360 / full-width 600×420); sizes are not mixed within the same section. + +## 3. Font Hierarchy + +| Tier | Font | Size | Color | Purpose | +| --- | --- | --- | --- | --- | +| H1 cover/divider title | Sans-serif (e.g. Inter/Helvetica Neue) Medium | 40–48 | Ink black | Main title, section name | +| Section number | Sans-serif Light | 40 | Ink black 70% | Large "01"-style numbering | +| H2 content-page title | Sans-serif Medium | 28–32 | Ink black | Each page's upper-left title | +| Subtitle/pill small title | Sans-serif Medium | 14–16 | Primary blue or ink black 70% | Card labels | +| Body/bullets | Sans-serif Regular | 16–18 | Ink black 85% | Lists, explanations | +| Formulas | Serif italic (CMR/Times family) | 18–28 (protagonist formulas larger) | Ink black, key terms colored | Derivations, theorems | +| Colored keywords | Same as body | Same as body | Blue/magenta/teal | Inline emphasis, replacing underlines | +| Figure captions/footnotes/sources | Sans-serif Italic | 9–11 | Gray 60% | Footer line, figure captions | +| Table text | Sans-serif | 12–14 | Ink black 85% | Comparison tables, data tables | + +## 4. Color Tokens + +- `--ink` `#1F1F24` (primary text); `--ink-70` `#5A5A63`; `--muted` `#8A8A94` (footnotes/captions). +- Primary accents: `--blue` `#2E6FD6` (process, link, "generate/derive" semantics); `--magenta` `#C8366E` (warning, caveat, key assumption); `--teal` `#0E8A8F` (condition, input, example label). +- Ceremonial gradient color (diagonal 135°, four equidistant stops): `#F7D3E4` (pink) → `#E3DCF7` (lavender) → `#CDE4F6` (sky blue) → `#D7F2E6` (mint). Used as a full-bleed base only on ceremonial pages; prohibited on content pages. +- Figure-area base: `--peach` `#FCEFD9`; density heatmap: `#F2A65A` → `#E0743C` → `#B23A30` (light orange to deep red, 4–6 contour tiers, 0.75–1 pt line width, with a darker outline of the same hue). +- Component background: `--pill` `#EDF2F9` (pale blue-gray info card); `--note` `#FFF7CC` (pale yellow tip bar); `--caveat-bg` `#F3EEF1` (warning-bar background). +- Structural gray: divider lines `#D8D8DE`, table alternating-row background `#F5F6F8`. +- No more than 3 color tokens are used as emphasis on a single page; text coloring follows the fixed semantics of "blue = process/reference, magenta = limitation/problem, teal = condition/example." + +## 5. Page Skeleton + +1. **Cover**: gradient background; main title + one subtitle line at center-left; a QR-code slot at lower right (replace with your own link or remove when reusing); an info bar at the bottom (institution/date/license-icon slot). +2. **Agenda page**: gradient background; "H1 Agenda" on the left, vertical entries on the right in the form `[Duration] NN Section Name`, with the number in primary blue and the duration in muted gray. +3. **Section divider page**: gradient background; a large number (01/02/…) on the left in the same row as the section name; an optional QR-code slot on the right. +4. **Content derivation page**: white background; H2 title at upper left; content area placed per the grid; a footnote line at the bottom. +5. **Topic-switch page (progress-bar style)**: white background; 2–3 rounded thumbnail cards in a row, the current topic in normal color and the rest grayed to 30%, previewing/reviewing the section structure. +6. **References page**: white background; grouped subheadings + two groups of pale blue-gray rounded cards, each card containing a small italic citation list. +7. **Back cover**: gradient background; a large centered rounded functional card (a list of supported capabilities + a repository/link QR-code slot). + +## 6. Reusable Layouts + +- **L1 concept diagram**: 5 columns of text on the left (definition + bullet list, dot markers), 7 columns of peach figure canvas on the right; an optional line of small teal annotation below the figure. +- **L2 formula protagonist**: a full-width centered formula (serif, 24–28), a pill-shaped conclusion line above, and a pale blue-gray card below stating "conditions for validity/equivalent relations"; within the formula, different terms are colored blue/magenta with arrow labels attached. +- **L3 two-column comparison**: two side-by-side rounded gray cards, each containing a small thumbnail + 3–4 lines of bullet points (one column of "simple/fast/precise"-type advantages, one column of "large design space/slow"-type costs), with a shared symbol optionally sandwiched between them. +- **L4 three-topic navigation**: three thumbnail cards in a row with the current one highlighted (used for switching between sub-sections within a chapter). +- **L5 pipeline flow**: a horizontal 3–4 step process, with thick arrows between steps labeled with the action name above (e.g. "Data → Path design → Training → Sampling"), optionally with a loop-back arrow indicating iteration. +- **L6 sample grid**: an N×M array of result thumbnails (each cell the same size, 4 pt rounded corners), with small colored labels on the left or above marking conditions/step counts; for placeholder purposes only — real generated results must not be placed here. +- **L7 theorem + derivation, two rows**: a "Theorem" pill in the top row (pale blue background), a large formula card in the bottom row, with a peach figure on the right providing geometric intuition. +- **L8 problem list**: a pill-shaped small title (all-caps, muted gray) + 2–4 question-sentence body lines + a "design choice" sticky-note card at the lower right (pale blue background, pinned-corner shadow). + +## 7. Chart / Table / Image / Component Rules + +- **Charts**: line charts use 2–4 colors (primary blue, orange, green, gray), 2 pt line width with rounded end dots; axis labels use 10–11 pt gray text; omit tick marks and enclosing axis frames, retaining only pale-gray horizontal gridlines; the legend sits at the upper right or inside the chart. Bar charts use a single color or a two-color scheme, with 2 pt rounded bar corners and values optionally labeled on top. All axis labels must be present, using placeholder names. +- **Tables**: thin gray lines or no vertical lines, with alternating-row light backgrounds; the header may use colored background blocks (blue/magenta/teal each representing one method category); numeric values are centered, method-name columns are left-aligned; do not mix alignment styles within the same column. +- **Images**: always 4 pt rounded corners; a 9–10 pt italic gray caption below the image (source/conditions); multiple images are aligned to the grid with equal width and height; screenshots must not be placed directly on the page (they must be redrawn or replaced with self-produced placeholder images). +- **Rounded info cards**: 8–12 pt corner radius, 16×12 pt padding, a two-part structure of "small title (colored, 14 pt) + content"; a single-line pill bar uses a corner radius of half its height. +- **Bullet markers**: small dots (solid, primary color or gray), with only one nesting level allowed; points ≤ 4 lines, each line ≤ 12 words. +- **Warning/conclusion bars**: `Caveat` (magenta small title + gray-background card), `Open Problem` (magenta title + a centered question line), `Goal:` (teal pill + formula/short phrase). +- **Arrow annotations**: 1.5 pt line + solid triangular arrowhead; blue labels "process/average," magenta labels "limitation/dependency," with 12–14 pt text in the matching color. + +## 8. Density and Spacing + +- One central idea per page: 1 figure + ≤ 1 main formula + ≤ 4 lines of bullet points; exceeding this means splitting the page (prefer a build-up continuation page instead). +- Element spacing: title → content 24 pt; card → card 16–20 pt; figure → caption 8 pt; formula-card padding ≥ 16 pt; footer-line-to-content distance ≥ 20 pt. +- Within the same build-up series (same title across pages), every previously shown element stays pixel-for-pixel unmoved, with only incremental additions; new elements must fade in at a grid intersection point. +- White pages (transition pages with only a title + one sentence) are allowed, but at most 1 per section. + +## 9. Footer and Page Numbers + +- Footer: starting 12 pt above the bottom edge and 48 pt from the left, 9–10 pt italic gray text, containing a source/supplementary-note placeholder (replace with your own citation when reusing); multiple sources stack on new lines, and right-alignment is also acceptable. +- Page number: not displayed by default; if needed, 10 pt muted gray at the lower right, in the format `NN` (no prefix). +- Section pages and the cover/back cover carry no footer or page number. + +## 10. Prohibited Items + +- Do not copy any brand mark, institutional logo, conference name, or speaker name/avatar/photo from a source deck. +- Do not copy original sentences, original formula typesetting, original figures (contour plots, sample grids, loss curves, comparison-table data), or real experimental values; charts may retain only their type and color rules — data must be recreated as placeholder values. +- Do not reuse QR codes, external links, or citation entries as-is; link and citation slots should be presented as placeholder cards. +- Do not mix photographic/realistic-style illustrations into the diagram system; diagrams stay vector-flat + peach background. +- Do not use dark/pure-black background pages, gradient content pages, 3D-realistic charts, or overly heavy card shadows. +- Do not exceed 3 accent colors on a single page, nest bullet levels beyond 1 level, or use a serif font for content-page body text (serif is reserved for formulas only). + +## 11. Delivery Checklist + +- [ ] 16:9 canvas; 48 pt left/right and 40 pt top/bottom safe margins observed throughout. +- [ ] Ceremonial pages (cover/agenda/divider/back cover) use the four-stop pastel gradient; content pages use a near-white solid color, with the two skins never mixed. +- [ ] All 9 tiers of the font hierarchy table are present: H1, section number, H2, pill title, body, formula, inline coloring, footnote, table text. +- [ ] All colors come from the tokens; the blue/magenta/teal semantics are fixed (process/warning/condition); accent colors per page ≤ 3. +- [ ] All diagrams use a unified peach canvas block + orange-red contour-line language, with a consistent size series. +- [ ] Formulas use serif italics, with protagonist formulas occupying their own card; arrow annotations replace parenthetical notes. +- [ ] The eight layouts (L1–L8) can cover all pages; build-up continuation pages have zero displacement of existing elements. +- [ ] Charts/tables/images follow the rules in Section 7; no real data, screenshots, or photos of any kind. +- [ ] Footer uses 9–10 pt italic gray placeholder citations; page numbers follow Section 9; ceremonial pages have no footer or page number. +- [ ] The entire document contains no brand, no person's name/avatar, and no original text/figures/data; links/QR codes are placeholders. +- [ ] The file is UTF-8; this file's first non-empty line is a level-1 heading. + +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: lines, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/05_academic/04/en/paper-white-courseware.md b/skills/open-kimi-ppt/reference/design_system/05_academic/04/en/paper-white-courseware.md new file mode 100644 index 0000000..e0c528c --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/05_academic/04/en/paper-white-courseware.md @@ -0,0 +1,112 @@ +# Editorial Growth Courseware · PPT Design System (brand-free, reusable version) + +This system is abstracted from a complete source deck of corporate brand and growth-methodology courseware, retaining only the layout, color relationships, and teaching narrative. It is not a reproduction of the source deck: it carries no platform mark, company name, person, photo, original text, case data, or product interface. All colors, dimensions, and values are approximate tokens; when generating, this file should serve as the constraint, with the user's query as the sole source of content. + +Applicable scenarios: B2B brand courses, marketing-capability training, growth-methodology workshops, brand-and-demand-alignment explanations for management. + +## Visual DNA + +- **Editorial paper feel**: content is organized through generous whitespace, thin dividers, short paragraphs, and prominent section numbers; each page advances only one teaching conclusion. +- **Calm base color + a single warm accent**: the base color is near paper-white or extremely light gray, with structural text in deep-blue ink; warm yellow or coral is used only to mark emphasis, action, or results — never as full-screen decoration. +- **The section number is the navigation anchor**: section pages may use an oversized semi-transparent number or a narrow color bar to indicate progress; the number expresses only sequence and carries no statistic beyond what the query provides. +- **Method first, cases later**: principles are first broken down into actionable steps, then verified with anonymous, fictional scenario cards; cases must not become a brand showcase wall. +- **Lightweight illustration**: prefer geometric color blocks, wireframes, arrows, and abstract human silhouettes; do not use photos, real webpage screenshots, or icon stacks. + +## Canvas and Grid + +- The output aspect ratio is fixed at 16:9 (recommended 1280×720 or equivalent), even if the source deck was portrait-oriented — only its editorial pacing is borrowed, not its portrait ratio. +- Safe margins are about 6% left/right, about 7% at the top, with 7% reserved at the bottom as the footer band. The title, section number, and page number keep the same baseline throughout. +- Use an implicit 12-column grid: the title and main text occupy 7 columns, with evidence/cards on the right occupying 5 columns; a full-width data page may occupy 10 columns while retaining two columns of breathing room. +- Section pages may include a narrow color band extending from left to right; content pages remain paper-white, without a large color block pressing down on the text. + +## Font Hierarchy + +- Use Liter (English) and MiSans (Chinese); do not use brand-imitation letterforms. Numbers may use a semi-bold weight of the same font. + +| Tier | Purpose | Approximate size (1280 width) | Weight | Color | +|---|---|---:|---|---| +| Cover title | One-sentence thesis | 42–50px | Bold | `--ink` | +| Page title | Conclusion sentence | 30–38px | Bold | `--ink` | +| Section number | Navigation mark | 54–90px | Regular/Bold | `--accent` at 20% opacity | +| Card title | Principle/action name | 20–24px | Bold | `--ink` | +| Body text | Explanation, steps, notes | 15–18px | Regular | `--body` | +| Footer | Source placeholder, page number | 10–12px | Regular | `--muted` | + +Titles should preferably state a conclusion or a question, not an empty section label like "Contents" or "Introduction." Each body line should not exceed about 26 words; keywords are emphasized with weight rather than a second accent color. + +## Color Tokens + +- `--paper`: paper white `#FBFAF7`, the background of content pages. +- `--paper-cool`: cool light gray `#F1F3F5`, used for card backgrounds or section dividers. +- `--ink`: deep-blue ink `#102A43`, for titles, axis lines, and primary text. +- `--body`: dark blue-gray `#334E68`, for body text and explanations. +- `--muted`: blue-gray `#829AB1`, for footers, secondary tick marks, and borders. +- `--accent-yellow`: bright warm yellow `#F4C95D`, used for principle numbers, action markers, and a single point of emphasis. +- `--accent-coral`: soft coral `#E98B73`, used only for result/risk callouts — pick one or the other, never using it as decoration alongside warm yellow at the same time. +- `--line`: light blue-gray `#D9E2EC`, for dividers and table rules. +- `--dark-panel`: deep indigo `#243B53`, used only for a single dark closing page or code-style explanation. + +Choose at most one primary accent color per page; warm yellow and coral may coexist only when their semantics are genuinely different (action vs. risk), and each must occupy less than 10% of the page. + +## Page Skeleton + +A six-page template progresses through "recognize the problem → form principles → turn into action → check the closed loop": + +1. **Cover thesis**: paper-white background, a left-aligned conclusion sentence, an abstract geometric composition on the right; a small section number or short color band sets the tone. +2. **Why now**: one question sentence + three anonymous signal cards; the cards display only settings given by the query, without introducing source-deck data. +3. **Three principles**: three horizontal cards or a vertical staircase, each card with one verb, one explanation, and one observable behavior. +4. **Action combination**: a matrix/process connects audience, touchpoints, content, and cadence; an accent color points out the currently prioritized action. +5. **Verification and cases**: fictional before/after comparisons or a funnel on the left, with "what to look for/how to judge" on the right; all numbers must come from the query or be clearly marked as examples. +6. **Action closed loop**: a dark or light closing page giving the next step, a placeholder for the owner, a review cadence, and a reusable checklist; do not use a plain "thank you" page. + +## Reusable Layouts + +- **E1 conclusion + side card**: 60% conclusion and three pieces of evidence on the left, 40% a large number/abstract graphic on the right. +- **E2 three-principle cards**: three equal-width columns of cards, with the section number at the card's top and one line at the bottom stating "what counts as done." +- **E3 staircase path**: a four-tier horizontal staircase expressing progression from awareness to action, with connecting lines using only thin lines and arrows. +- **E4 2×2 choice matrix**: the horizontal/vertical axes each represent one judgment dimension explicitly given in the query, with only short labels placed within the quadrants — do not fabricate rankings. +- **E5 before/after comparison**: the same component in two rows, with the change explained on the left and direction shown with a same-colored bar on the right; using real case screenshots from a source deck is prohibited. +- **E6 closing checklist**: a deep-indigo or paper-white background, three "this week's actions" + one "next review," leaving ample whitespace at the bottom. + +## Chart/Table/Image/Component Rules + +- **Big-number card**: shows only one number and its unit, with the measurement basis/target written below; a number without a source uses an "example" label, without faking precision. +- **Funnel/path diagram**: at most four tiers, direction left to right; each tier uses only shades of a single color, no rainbow gradients. +- **Matrix**: axes, quadrants, and labels use `--ink`/`--line`, with the accent color marking only one recommended region; the judgment basis must be written beside it. +- **Process and loop**: use rounded rectangles + thin arrows, with step numbers matching the section number; a loop-back must label its trigger condition and review action. +- **Tables**: at most five columns, no vertical lines, with light lines between rows; headers are bolded, and key rows are marked with an accent-colored left border. +- **Images**: prefer abstract geometric placeholders, wireframes, and self-drawn graphics; do not place photos of people, brand logos, product interfaces, or source-deck charts. +- **Cards**: 8–12px rounded corners, 1px border, avoiding heavy shadows; leave at least 16px spacing between cards. + +## Density and Spacing + +- One repeatable conclusion per page, with body text not exceeding 6 items; on a three-card page, each card should not exceed about 35 words. +- Title to body 32–48px, between paragraphs 14–18px, card padding 18–24px; effective content area about 55–70%. +- The cover and closing pages are low density; the method-matrix and case pages are medium density; do not solve excess content by shrinking the font — cut content or split the page instead. + +## Footer and Page Numbers + +- Content pages place a page number in the form `01/06` at the lower right, 10–12px `--muted`; section pages may show only the section number. +- The lower left may carry an "internal working draft/example" placeholder, but must not carry a source brand name or a copied copyright mark. +- The cover and closing pages may omit the footer; if retained, use the same gray value and the same baseline. + +## Prohibited Items + +- Do not copy any platform/company logo, trademark, person, case name, original sentence, real data, or product screenshot. +- Do not use large areas of brand blue, gradient text, glow, heavy shadows, skeuomorphic icons, or decorative photos to manufacture a "marketing feel." +- Do not use empty words like "brand," "growth," or "exposure" as titles; a title must be able to guide a judgment or an action. +- Do not use a percentage without a stated unit and measurement basis, and do not write an anonymous example as if it were a real client result. +- Do not use multiple highly saturated accent colors on the same page, and do not let a wall of cards replace narrative. + +## Delivery Checklist + +- [ ] The aspect ratio is 16:9, with the title/section-number/page-number baseline consistent. +- [ ] Each of the six pages has one conclusion, with no table-of-contents page, plain thank-you page, or blank transition page. +- [ ] At least one principle-card page, one action-matrix page, one before/after comparison page, and one action-closed-loop page are present. +- [ ] Each page uses only one primary accent color, and color carries a clear semantic meaning. +- [ ] All numbers come from the query or are marked as examples, with the unit and measurement basis stated. +- [ ] No source-deck brand mark, person, photo, screenshot, original text, original data, or identifiable case is present. +- [ ] Cards, tables, processes, and charts are all readable at projection distance, with whitespace ratios not compressed. + +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: lines, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/05_academic/05/en/blue-line-courseware.md b/skills/open-kimi-ppt/reference/design_system/05_academic/05/en/blue-line-courseware.md new file mode 100644 index 0000000..228ca6e --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/05_academic/05/en/blue-line-courseware.md @@ -0,0 +1,113 @@ +# Blue-Line Experiment Methodology Courseware · PPT Design System (brand-free, reusable version) + +This system is reverse-engineered from a complete experiment-and-measurement-methodology courseware, abstracting only the teaching pacing, method matrices, comparison expression, and editorial layout. Do not copy the platform name, company, person, case, photo, screenshot, original text, or real metric from the source deck; the facts and numbers in the generated deck may come only from the user's query. + +Applicable scenarios: marketing-experiment training, product-trial design, growth-team workshops, management-level experiment-governance explanations. + +## Visual DNA + +- **Handout-style section structure**: each chapter is cut apart by a prominent number, a short title, and a color band; the body reads like a printable operations manual — defining first, then demonstrating. +- **A blue line runs throughout**: deep-blue thin lines, arrows, and axes string the pages into one path of "form a hypothesis — split groups — measure — act"; the line matters more than any icon. +- **Highlighting only signals**: yellow/orange is used for hypotheses, caveats, or next steps, in a small, fixed-position area; the rest of the information is layered in black, gray, and light blue. +- **Comparison first**: control vs. treatment group, before vs. after, input vs. result are all displayed side by side using the same geometric component, without flashy 3D graphics. +- **Cases are practice material**: case pages only demonstrate how the method lands in practice, using anonymous fictional scenarios instead; they do not reproduce a source deck's client narrative or results. + +## Canvas and Grid + +- Output is uniformly 16:9 (1280×720 or equivalent); the source deck's portrait reading pace is translated into horizontal columns rather than copying its original page ratio. +- Margins are about 5.5% left/right, 7% at the top, 8% at the bottom; the section number and page number are fixed at the upper-left and lower-right anchor points. +- Use a 12-column grid: definition text occupies 5 columns, the method diagram occupies 7 columns; comparison pages use a 5:5 two-column split, with 2 columns left in the middle for connecting lines. +- Lines use 1–2px width, with connecting lines always directional; large color blocks appear only on section pages or a single dark summary page. + +## Font Hierarchy + +- Use Liter for English and MiSans for Chinese; process labels and numbers may use the same font's semi-bold weight, with JetBrains Mono (brought in via customFonts) reserved for code or formulas. + +| Tier | Purpose | Approximate size (1280 width) | Weight | Color | +|---|---|---:|---|---| +| Cover title | Method thesis | 40–48px | Bold | `--ink` | +| Page title | Conclusion/question | 30–36px | Bold | `--ink` | +| Section number | Progress navigation | 48–76px | Bold | `--accent-blue` | +| Method label | Hypothesis, control, treatment, etc. | 16–20px | SemiBold | `--ink` | +| Body text | Definitions, steps, explanations | 15–18px | Regular | `--body` | +| Annotation/footnote | Measurement basis, limitations, page number | 10–12px | Regular | `--muted` | + +Write titles as "the judgment this page must produce," not empty section names like "Methodology" or "Best Practices." Every chart must be accompanied by one sentence of "how to read it/what it means." + +## Color Tokens + +- `--paper`: warm white `#FCFCFA`. +- `--ink`: deep indigo-blue `#14213D`, for titles, the main line, and axis lines. +- `--body`: blue-gray `#3E536B`, for body text. +- `--muted`: gray-blue `#8C9AA8`, for footnotes and auxiliary lines. +- `--line`: light blue-gray `#D8E2EA`, for dividers and grids. +- `--accent-blue`: medium-bright blue `#2F80ED`, for section numbers, the treatment group, or the main path. +- `--accent-yellow`: warm yellow `#F2C94C`, for hypothesis/key-point callouts; choose only one spot as the primary emphasis. +- `--accent-orange`: orange `#F2994A`, for risk/to-be-verified callouts; must not be used as decoration simultaneously with yellow. +- `--control`: gray-blue `#9FB3C8`, for the control group or baseline. +- `--deep-panel`: deep blue `#203A5F`, for the summary page or method box, not for an ordinary content-page background. + +By default, each page enables only `--accent-blue` plus one semantic accent color (yellow or orange). The control and treatment groups must both be labeled with text in the legend — do not distinguish them by color alone. + +## Page Skeleton + +A six-page template progresses through "problem — method — verification — scaling": + +1. **Cover**: one experimental thesis sentence, a section number, and a blue line; geometric nodes hint at the path, with no photo or brand mark. +2. **Why experiment**: a question sentence + three common misconceptions, with the boundary of the judgment to be verified this time given at the bottom. +3. **Hypothesis and grouping**: the hypothesis structure on the left, with control/treatment columns on the right explaining the input, what stays constant, and the observed metric. +4. **Method selection**: use a two-dimensional matrix or decision tree to select the test type, clearly stating when it does not apply; all labels use the user query's own terminology. +5. **Read results and act**: an anonymous example's before/after comparison, a confidence-interval placeholder, or a result card, immediately followed by the criteria for "continue / adjust / stop." +6. **Scaling closed loop**: an owner, a timeline, a review cadence, and an experiment log form the loop; the final sentence is an executable next step, not a thank-you page. + +## Reusable Layouts + +- **M1 hypothesis card**: an `If … then … because …` three-line structure, with the falsifiability condition written at the bottom. +- **M2 two-group comparison**: control group / treatment group side by side, with what stays constant written at the top and the single changed variable written at the bottom. +- **M3 decision tree**: at most three branch levels; each leaf node states "applicable/not applicable" rather than an abstract noun. +- **M4 method matrix**: the horizontal axis is the observation period or intervention intensity, the vertical axis is a user-given dimension such as randomization or geographic scope; the recommended cell gets a yellow border. +- **M5 result card**: four lines — metric, direction, interval/measurement basis, action; if there is no interval, explicitly write "evidence pending." +- **M6 closed-loop swimlane**: four segments — propose → execute → analyze → review — with a role placeholder marked beside each lane, avoiding fabricated names. + +## Chart/Table/Image/Component Rules + +- **Comparison bar**: the control group in gray-blue, the treatment group in blue; both bars start from the same zero point, directly labeling the direction and unit of the difference. +- **Timeline**: a single blue line connects the baseline, intervention, observation window, and decision point; each node states only one action. +- **Interval chart**: prefer point estimates + error bars or an interval band; do not truncate axes, hide sample size, or present correlation as causation. +- **Decision matrix**: the axis titles, applicability boundary, and "do not use" region must all be present; avoid treating a four-quadrant layout as decoration. +- **Tables**: at most five columns, six visible rows; the first column is the question/hypothesis, the last column is the action or evidence status. +- **Images**: use only self-drawn abstract graphics, wireframe devices, and geometric placeholders; photos of people, product interfaces, logos, and original source-deck charts are prohibited. +- **Formulas/code**: use a monospace font in a light-colored code box, at most 8 lines; explain the input, output, and limitations beside it. + +## Density and Spacing + +- One judgment per page; body text does not exceed 6 items, decision-tree nodes do not exceed 8, and each matrix axis does not exceed 4 labels. +- Title to main figure 28–44px, spacing between components 16–24px, at least 8px of gap between lines and text; effective content area about 60%. +- Definition pages are low density, method-matrix pages are medium density, result pages are medium-low density; do not shrink the font to cram in more experiment types. + +## Footer and Page Numbers + +- The lower right uses a `01/06`-style page number, the lower left carries small "measurement basis/hypothesis/example" text; both use `--muted`. +- When a source is needed, write only an anonymous "internal setting/public methodology reference," not a source-deck brand name or a copied copyright line. +- The cover may omit the footer; the closed-loop page retains the page number for reference during reviews. + +## Prohibited Items + +- Do not copy any platform, company, client, person, trademark, photo, interface, original text, real result, or number from the source deck. +- Do not describe an observational correlation as causal, and do not omit the control group, sample definition and sampling basis, time window, or limitations. +- Do not use rainbow colors, glowing particles, heavy shadows, 3D perspective, or complex illustrations in place of a clear experimental relationship. +- Do not use baseline-free promotional language such as "significantly improved" or "comprehensively leading"; without evidence, write "to be verified." +- Do not let a matrix, process, or big-number card exist independently, detached from the page's title conclusion. + +## Delivery Checklist + +- [ ] The aspect ratio is 16:9, with the section number, title, and page number sharing a consistent baseline. +- [ ] The six pages cover, in order, the problem, hypothesis grouping, method selection, reading results, and the scaling closed loop, with no table-of-contents or thank-you page. +- [ ] At least one control/treatment comparison page, one method-matrix or decision-tree page, and one result-criteria page are present. +- [ ] Charts clearly state the unit, measurement basis, time window, and limitations; if missing, mark them as evidence pending. +- [ ] Each page enables only one semantic accent color, with both the control and treatment groups carrying text labels. +- [ ] All numbers come from the query or are marked as examples; there is no brand mark, person, photo, screenshot, original text, or source-deck data. +- [ ] The generated PPTD/PPTX opens correctly, the per-page screenshot count matches the page count, and text is readable at projection distance. + +- No cards by default: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment: lines, whitespace, and font-size differences are the superior solution +- No evenly-divided composition: unless there is no other usable layout, do not default to three-way splits, four-way splits, or 2×2 matrices. This includes three-part conclusions such as three-column + title + conclusion diff --git a/skills/open-kimi-ppt/reference/design_system/05_academic/06/en/dark-themed-data.md b/skills/open-kimi-ppt/reference/design_system/05_academic/06/en/dark-themed-data.md new file mode 100644 index 0000000..aaea8ca --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/05_academic/06/en/dark-themed-data.md @@ -0,0 +1,163 @@ +# Organization Name — Q2 2025 Crypto Industry Report STYLE DESIGN SYSTEM + +## 1. Style Positioning + +A dark, data-driven PPT design system for quarterly crypto-industry research reports, aimed at professional readers fluent in metrics across markets, assets, trading volume, ETFs, DeFi, NFTs, and exchanges, supporting high-density data, longer explanatory text, and multi-series charts. The body adopts a dark research dashboard with Organization Name's green visual identity; the cover, section dividers, and product/closing pages use high-saturation green or purple frames, large rounded cards, and mascot illustrations. + +The whole deck is a 16:9 landscape canvas; content pages use a near-black background with white ultra-heavy sans-serif titles (Archivo Black, via customFonts), body and footnotes in Inter (via customFonts); the header holds a fixed small brand wordmark; the footer contains the report name, copyright, sources, and page numbers. Main content includes line, column, stacked-column, and area charts, timelines, tables, and text lists/avatar matrices; accent colors are fluorescent green, purple, pink, yellow, and other high-saturation colors. + +Underlying principles: + +1. **Data over decoration.** Pages prioritize charts, tables, numbers, and explanatory text; illustrations, borders, bright colors, and identity marks are used only for brand recognition, classification, emphasis, or section transitions. +2. **Body-skeleton consistency over layout showboating.** Ordinary data pages keep the black background, upper-left brand mark, white title, insight line on the right or above, and bottom sources and page numbers; large-area green/purple brand pages appear only at the cover, section dividers, product, or closing positions. +3. **Accent colors must carry semantics.** Fluorescent green is used for the brand, positive/growth values, key series, or button-like components; purple/pink for insight lines, section transitions, and special annotations; red only for negative change or risk-type data. If bright colors hinder reading values, prioritize the clarity of axes, labels, units, and legends. + +## 2. Page Skeleton + +The canvas is 16:9 landscape widescreen. Content-page backgrounds are pure black or near-black; covers/section/closing pages use a bright-green outer background, or a purple outer frame with a dark rounded inner card. Keep stable margins with no key data at the outer edges; high-density pages may approach full-bleed, but the header, title, and footer must keep their safety zones. + +**Cover page**: bright-green outer background with a large deep-green rounded card at the center, and a notch-style split or dual-card structure at the top. The upper left holds the identity mark — plain small text with the new topic name, or left blank; no graphic logo is drawn. The main title is huge, the year or keywords may be layered with a dark-green/light-green gradient feel, and the report name is in white/light green; the lower middle holds the Organization Name mascot illustration, a thin-line trend line, and halftone dots; the sponsor text list sits at the right or lower right, smaller in area than the main title and the mascot. + +**Table of contents page**: black background with a large "Content"-style title at the upper left; the body is a multi-column contents list, with level-one section titles larger and white, entries in small white/gray text, and page numbers right-aligned; author avatars, names, and titles may sit below. The contents page uses no large charts and little decoration. + +**Section dividers**: a bright-green or purple outer frame/background, with a large deep-green or deep-blue-black rounded card inside. The left holds the section name and a small label; the right or bottom holds the large Organization Name mascot and theme graphics. Section titles take the dominant level, with minimal information. + +**Content data pages**: a fixed small brand wordmark at the upper left, with the white page title below it or to its right; the title area occupies a compact horizontal band at the top. The insight line sits to the right of the title, at the page's upper right, or atop the explanation column, usually opening in purple and continuing in gray-white text. The body may use a single large chart, left-right columns, chart + explanation column, a timeline, a table, or a matrix. The bottom left holds the report name/copyright, Source sits below the chart or at the lower left, and the page number sits at the lower right. Reading path: brand and title → purple insight line/key information line → main chart or table → explanatory text/legend → source and page number. + +Dividers are used only for chart axes, table lines, card borders, and timeline rules — no heavy header rules are set. Content pages use no watermarks or large background graphics; backgrounds stay clean. + +## 3. Content Organization + +Titles are object-type or metric-type, such as "a certain asset's price and trading volume," "a certain market share," "notable events," or "exchange trading volume," responsible for topic positioning; conclusions are expressed by the insight line. Titles should be 1 line, 2 lines if necessary; avoid more than two lines, which compresses the chart area. + +Each page prioritizes one information line, located to the right of the title or atop the explanation column, structured as "key change/conclusion + data definitions and measurement basis/time range + cause or impact." Use purple to highlight the opening phrase or core number, with the rest in gray-white. Do not stack multiple conclusions into one paragraph; each page prioritizes one main judgment. + +The body uses short paragraphs and bullets, usually in the narrow column to the left or right of a chart; each paragraph explains one cause, data finding, or impact. Keep paragraphs broken and line lengths moderate; the text column in left-right layouts exists to explain the chart and does not become a long article on its own. + +Group by market category, asset class, time, platform, chain, exchange, or metric definition and basis. High-density pages use subtitles, labels, legends, colored series, and thin-line separation. A single page carries one core question; it may contain multiple data series, but must not discuss multiple unrelated topics at once. + +Numbers and units stay close to data labels or axes, retaining the relevant formats and units — percentages, dollars, multiples, dates, and quarters. Time axes remain continuous and readable; big numbers may be highlighted in the insight line or chart annotations. Source footnotes sit below charts or in the footer, in small gray-white text that does not compete with the main data. + +## 4. Content Page Layout System + +**A. Left explanation column + right large chart** +Suited to single-theme time series such as price, trading volume, index, and capital flows. The left column holds the title, insight line, 2–4 explanation paragraphs, and the source; the right large chart occupies most of the body width, complete with axes, legend, and data annotations. Emphasize with bright lines, peak labels, vertical annotation lines, or key-point text. Not suited to table-type content requiring extensive categorical comparison. + +**B. Top title-and-insight + full-width chart below** +Suited to horizontal time-axis charts such as multi-series lines, stacked columns, and market-share change. A compact title and one insight line sit on top; the main chart spans the page; the legend stays near the chart's top or right, and series colors keep high contrast. If there is too much explanation, switch to left-right columns to avoid compressing chart height. + +**C. Large chart + right annotation/sponsor/note column** +Suited to pages needing supplementary event background, such as IPOs, ETFs, and trading volume. The main chart sits on the left or in the middle; the right narrow column holds short notes, wordmarks, or secondary legends; the right column must not exceed the main chart in width. This layout is not suited to multiple long paragraphs or multiple unrelated wordmarks. + +**D. Timeline/event-band layout** +Suited to "Notable Events"-type content. Use multiple rows of horizontal date bars; date blocks distinguish periods or categories with high-saturation green, pink, purple, etc., with small-size event notes beneath; the title area is minimal. Do not add complex charts; event copy must be short — long explanations break the timeline rhythm. + +**E. Table/ranking/matrix page** +Suited to asset returns, stablecoins, exchanges, chain ecosystems, and team or platform comparisons. The body uses dark tables, ranking bars, text lists, or multi-column cards; a note column may sit on the left, and colored bars, dots, icons, or text color highlight positive/negative change inside the table. This layout suits high-density classification, not continuous trends. + +**F. Brand/product/section-style body variant** +Uses green or purple cards, buttons, screenshot-style interfaces, and the mascot for product promotion, section intros, or closing pages; lower information content than data pages. Must not be abused as a template for ordinary research pages. + +## 5. Color System + +**Background black / near-black #000000–#080808**: the main background of content pages, largest in area. Cannot be replaced with light colors; even if the new theme uses a brand color, keep body backgrounds dark. + +**Deep-green cards #183F2D / #1A412E**: the main base color of covers, section dividers, and brand cards, usually paired with bright-green outer frames. Brand pages may use it over large areas; ordinary content pages use only small amounts for labels or borders — it should not replace the black background over large areas. + +**Fluorescent green #A6F05F / #9EE45A / #4BCC00**: used for the cover outer base, section frames, identity marks, positive values, key data lines, button-like labels, and a few chart series. Area may be large on brand pages and small-to-medium on content pages. It may be replaced with a new brand primary color, but must keep dark-background high contrast and consistent "positive/key" semantics. + +**White #FFFFFF / light gray-white #DDE5E0**: used for titles, key labels, main axis text, and high-priority numbers. Cannot be replaced by low-contrast colors. + +**Gray-blue/gray-green text #8A9492 / #B9BCA6 / #808963**: used for body text, notes, secondary legend text, axis labels, sources, and footers; low brightness, but never so low as to be unreadable. + +**Purple #7A54FF / #6B4CFF**: used for section dividers, insight-line openings, key lines, labels, and brand variants, at small-to-medium areas; it does not represent positive/negative status by default. + +**Pink #F19EE2 / #F4A0E5**: used for event timelines, chart series, and emphasis blocks, at small areas, expressing categories. Avoid large simultaneous use with purple, which becomes garish. + +**Yellow #FAEB6A / #E7D84A**: used for column charts, key values, event or return-type series; not for long text passages. + +**Red/coral #FF5A6A / #BE827F**: used for negative returns, declines, risks, or negative values. For status/data only, never as decoration. + +Content pages keep their main hues to black-white-gray + 1 brand accent + 2–4 data series colors. Multi-series charts may add colors, but legends must stay clear; color serves classification/status only — no meaningless decoration. + +## 6. Fonts and Text Hierarchy + +Fonts are modern sans-serif: titles use Archivo Black (via customFonts); body is dominated by Inter (via customFonts), with weights handled through the bold field. Chart axis/category labels may use a serif italic (e.g. EB Garamond Italic via customFonts); everywhere else, do not mix in serif or handwritten fonts; special sponsor/logo fonts exist only as images or marks. + +With body note text = 1x: + +- **Cover main title/year**: approx. 4–6x, bold or semi-bold, tight letter spacing allowed. +- **Section titles**: approx. 3–5x, white or light green, usually 1–2 lines. +- **Content-page titles**: approx. 2–3x, white, medium-bold to bold. +- **Insight line/information line**: approx. 1.4–2x, usually medium-bold, purple keywords + gray-white continuation. +- **Subtitles/group titles**: approx. 1.1–1.4x, medium-bold or semi-bold, white/light gray. +- **Body paragraphs and bullets**: 1x, regular weight, gray-white or gray-blue. +- **Table text/chart labels**: approx. 0.7–1x, compress per space, keeping numbers readable. +- **Footnotes, sources, footers, page numbers**: approx. 0.6–0.8x, gray, low-level but never absent. + +Numeric labels use the same fonts as body text, with increased weight or a different color; no ornamental numeral forms. Titles and body build hierarchy through size, weight, and color, without relying on shadows or strokes. + +## 7. Chart Language + +Core charts include line charts, column charts, stacked columns, area charts, dual-axis price/volume charts, horizontal-bar rankings, timelines, share/market-share charts, donut/pie mini-widgets, and tabular leaderboards. + +Charts use dark bases; axes and gridlines are low-brightness gray thin lines; no white-background chart boxes. Main data lines use high-contrast colors such as fluorescent green, yellow, purple, pink, and cyan; secondary series lower saturation or line width. Column charts use bright columns against the dark grid, and volume columns may combine with price lines. Multi-series stacked columns need clear legends, placed above the chart, to the right, or in empty chart areas. + +Key data uses peak/trough labels, vertical event lines, endpoint values, local text annotations, color brightening, and red for negative values. Annotations stay close to their points and should not form long passages. Forecasts, targets, or baselines use dashed/thin lines and explicit labels, distinguished from historical data; never let a forecast line blur into an actual line. + +Axes keep units and time bases — especially dollars, percentages, quarters, dates, and trading volume. Gridlines must be thin, dark, and few; no heavy borders. The page title states the chart's subject; the chart itself keeps only the necessary subtitle and legend, avoiding repetition. + +## 8. Tables and High-Density Information + +Tables are used for rankings, asset comparisons, exchange/chain/protocol metrics, returns, market share, and team/author information. They adopt a dark-base, high-density style: headers in white or light-gray medium-bold text, row-column dividers in low-brightness thin gray, and cells usually without obvious fills; when necessary, use dark gray/deep green for light zoning. + +Number columns are right-aligned or visually aligned by decimal point; text columns left-aligned; name columns may add small icons or circular token placeholder blocks. Positive/negative values are distinguished in green/red; rankings or strength may use horizontal bars, color-block lengths, heat colors, or small dots. Summary rows or key rows use brighter text, thin borders, or a light fill — but no heavy highlight fills. + +High-density side-by-side modules use cards, column groups, text lists, or small chart collections. Each module keeps a title, a key value, and one minimal explanation; modules are separated by alignment, spacing, and thin lines — no large shadows. Zebra striping is not a primary language; extremely low-contrast dark gray may be used cautiously, and where dividers suffice, no zebra striping is added. + +If a table exceeds what one screen can scan, split it into multiple pages or focus on the Top N — do not compress it into illegibility. + +## 9. Components and Graphic Elements + +**Brand wordmark header**: fixed at the upper left of content pages, small in size, white brand word + green "Research." Keep it on new pages; do not enlarge it into decoration. + +**Insight line component**: purple keyword/opening + gray-white explanation, located to the right of the title or atop the body column; at most one main insight per page — avoid multiple purple sentences competing. + +**Rounded brand cards**: covers, section pages, and product pages use large rounded deep-green/deep-blue cards with bright-green or purple outer frames. Content data pages do not by default frame all content in large cards. + +**Labels/badges**: used for section codes, asset symbols, button-like CTAs, or chart categories; outlined rounded rectangles or bright fills with short text. Cannot carry long sentences. + +**Thin dividers and axis lines**: low-brightness gray lines for tables, charts, and timelines; thin and restrained — no decorative thick lines. + +**Event timeline blocks**: horizontal date color blocks + event notes beneath, colored by date period or category. Suited to event lists, not numeric trends. + +**Text lists/avatar matrices**: used for contents-page authors, sponsors, exchanges, ecosystem projects, etc.; institution names are presented as text lists or neutral placeholder blocks, avatars may remain; unified sizes, alignment, and label text. Do not mix in colorful icon decoration; no graphic logos are drawn. + +**Mascot illustrations**: the Organization Name green/purple character is used on covers, section dividers, and closing pages. On ordinary data pages it may appear only on special brand/product pages, and must not cover charts. + +## 10. Texture and Prohibited Items + +Overall flat, dark, data-driven, and restrainedly branded; content pages rely on color contrast, type-size hierarchy, chart density, and alignment — not photography, complex textures, shadows, or 3D. + +**Prohibited**: on ordinary content pages, large-area photo backgrounds, complex gradient backgrounds, 3D graphics, glowing strokes, emoji, garish illustrations, decorative colorful icons, large stretches of centered copy, heavy shadows, low-contrast gray text, unsourced charts, unit-less numbers, or decorations covering axes. + +**Use with caution**: rounded cards, large-area bright-green bases, large purple blocks, text lists, avatars, screenshot-style interfaces, donut mini-charts, zebra-striped tables. They must serve an information function or a brand-node function — never added just to fill whitespace. + +**Special pages allowed**: covers, section dividers, product pages, and closing pages may use the mascot, large rounded cards, bright-green/purple outer frames, halftone dots, trend-line backgrounds, and sponsor text lists. Even on special pages, keep the title readable and never let brand elements overshadow the main information. + +Images/screenshots are not the core language of the body; if they must be used, place them within fixed boundaries with a title and a source — no fullscreen photographic storytelling. If gradients appear, they are limited to subtle treatment of the cover title or brand atmosphere, not a body-background system. + +## 11. Generation Checklist + +- Skeleton: is it 16:9; are content pages black-based; is there a small brand wordmark at the upper left; does the footer include the report name/copyright, sources, and page numbers? +- Copy: is the title a clear object/metric; is there only one main insight per page; is the body in short paragraphs or bullets; do numbers carry units, time ranges, and measurement bases? +- Hierarchy: are the title, insight line, body, chart labels, and footnotes separated by relative sizes and colors; is dependence on specific font sizes avoided? +- Color: does it stay at black-white-gray + fluorescent green/purple + necessary data colors; are positive/negative states clearly green/red; are there too many bright colors on one page? +- Layout: does the main chart/table occupy the largest area; does the explanation column assist the chart; is there meaningless whitespace or overcrowding? +- Charts: are axes, units, legends, gridlines, data labels, and emphasis annotations complete; are multi-series colors distinguishable; are forecasts/baselines marked? +- Tables: are headers, alignment, dividers, key rows/columns, and positive/negative colors consistent; is text readable; is over-compression avoided? +- Components: do rounded cards, labels, timelines, wordmarks, and the mascot appear only on appropriate pages; do they serve information rather than decoration? +- Prohibited items: no photo backgrounds, emoji, 3D, glow, heavy shadows, complex textures, meaningless icons, or large stretches of centered copy. +- Quality: check overflow, truncation, garbled text, overlap, low contrast, occlusion, empty content, wrong chart proportions, missing page numbers, missing sources, and mechanical template repetition. +- No default use of cards: unless the user explicitly requests it, it is strictly forbidden to use rounded rectangles or rectangular cards to build hierarchy or alignment — line segments, whitespace, and font and font-size differences are better solutions. +- No equal-division composition: unless no other layout is available, do not default to three-way splits, four-way splits, or 2×2 matrices — including three-part structures such as three-way split + title + conclusion. diff --git a/skills/open-kimi-ppt/reference/design_system/academic/blue-line-courseware/design.md b/skills/open-kimi-ppt/reference/design_system/academic/blue-line-courseware/design.md new file mode 100644 index 0000000..91db804 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/academic/blue-line-courseware/design.md @@ -0,0 +1,81 @@ +# Blue-Line Courseware · Academic STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum) + +A rigorous, formally typeset academic presentation benchmarked against top-tier research talks and thesis defenses (NeurIPS/CHI/SIGGRAPH main-conference standards), with clarity of argument taking precedence over decoration. The deck must read as a reproducible scientific claim, not as marketing collateral. Use academic language throughout: standard terminology for research questions, hypotheses, evidence, significance, contributions, and limitations, without marketing or business rhetoric. Shift the visual emphasis by discipline: in theoretical work, formulas and proof steps occupy the main visual field; in computer science and engineering, system diagrams, code, execution traces, and performance curves provide the backbone; in experimental research, formulas, charts, and images cluster tightly around a single conclusion; in the humanities and social sciences, archival material, maps, manuscripts, and other textual evidence add narrative depth without compromising academic rigor. + +Content and layout: +1. Use a fixed argumentative spine: research question → gap in related work → data and methods → main results → ablation/analysis → limitations → future work. A short deck may compress this sequence, but must not reorder it. +2. Build evidence-first slides: results tables must include baseline comparison columns, comparative charts, and architecture/process diagrams; present the core contribution as a formally typeset equation. +3. Maintain moderate information density: one argument per slide, with evidence organized around that argument. Slides should be composed, not merely filled—white space is a valid means of separating stages of the argument. + +Visual style: +1. Aesthetic: restrained, precise, and scholarly. No promotional copy, decorative photography, or clip-art icons. +2. Typography: use a clear sans serif (render with Liter / Chinese: MiSans) for body copy and labels; when the source style uses serif typography, titles may also use serif. Equations must be formally typeset (KaTeX quality), with standard equation numbering and italic variables. +3. Color: use one two-color system per deck—one primary structural color and one accent color, with gray establishing hierarchy; use a white or near-white background; reserve one consistent warning color for negative or ablation signals. +4. Graphics: use thin, precise vector lines in diagrams; minimal horizontal rules in tables; axis labels, units, and sample definitions in charts; no decorative 3D effects, shadows, or gradients. + +Structure and discipline (distilled from deliverables established as benchmarks): +1. Every content-slide title must state an argument (a finding, not a section label—“Lapses in Attention Can Be Predicted 10 Seconds in Advance,” not “Experimental Results”), followed by evidence that supports it. +2. Align claims with evidence: every quantitative conclusion on a slide must be supported on that same slide by a chart, table, or cited result; no orphaned numbers. +3. The main results table must include baseline comparison columns and identify the best value; show relative improvement alongside absolute values. +4. Method slides must include reproducibility details: dataset size, annotation protocol, inter-annotator agreement, and key hyperparameters. Show only the core idea as an equation; move derivations to appendix slides. +5. Every figure must be self-contained: include axis labels with units, a legend or direct annotations, and a caption area specifying sample size and confidence convention; a figure must not rely on its legend alone. +6. Ablations and limitations are mandatory slides, not optional ones: ablations isolate each component’s contribution; limitations accurately state scope, failure modes, and ethics/de-identification status. +7. Every number must include its unit, time range, dataset, and statistical convention (mean ± variance, sample size); express uncertainty using a measurable quantity or confidence interval, never vague language. +8. Open with the problem statement and a one-sentence contribution; close with numbered conclusions (claims, not a summary) and an explicit list of open questions. +9. Place citations in a compact footnote line at the bottom of the slide where they are used; unless the genre requires it, avoid a full-slide wall of dense references. + +Default baseline (distilled from the layout skill; PART B may override): organize each slide around one evidence unit (figure/table/equation); charts must include complete axis labels, units, and sample definitions; keep charts honest—do not truncate the y-axis to exaggerate differences, and distinguish correlation from causation explicitly in the copy; ensure projection readability on a 960×540 canvas, with body text at ≥14pt equivalent and chart labels at ≥10pt equivalent. + +**Title sequence test**: Reading only the slide titles in order should tell the complete story; if they do not form a coherent narrative, the structure is not working. + +Density anchor: The specific minimums for each style (number of evidence modules and charts per slide, annotation conventions) are defined by the 【Density Baseline】 reverse-engineered from that style’s source deck—this baseline does not impose a universal number. + +### Global Prohibitions (Default AI Patterns · Mandatory) + +1. **Do not use cards by default**: Unless the user explicitly requests them, never use rounded rectangles or rectangular cards to establish hierarchy or alignment—functional containers (status indicators, hypothesis boxes, quotation boxes) do not count as cards. Lines, white space, font size, and weight differences are preferable. +2. **Do not use equal-split compositions**: Unless no other viable layout exists, do not default to three equal columns, four equal columns, or a two-by-two matrix. An equal split must be justified by the content structure (three scenarios naturally warrant three columns; frameworks explicitly named in the content are exempt). +3. **Do not use unmotivated AI color schemes**: Institution-specific palettes stated in the content are exempt. Prohibited schemes are generic, familiar defaults with no rationale—blue-purple gradients, cyan-purple neon, rainbow glows, glass cards, and luminous borders. +4. **Do not use elements that conflict with the overall style**: No out-of-style treatments, such as rounded icons or rounded rectangles in a sharp-edged visual system. +5. **Keep chart backgrounds transparent**: Use transparency or the slide background color, except for reversed charts on dark backgrounds. +6. **Do not leave planned regions empty**: Do not leave an entire block of the content area blank; every planned region must be filled with real content. Failure to fill it is the most serious form of roughness. + +## PART B — Signature System (Distinctive Features of This Template; Overrides PART A in Case of Conflict) + +One-sentence style signature: Editorial infographic courseware with a white background and deep ink text, using electric blue as the structural anchor, gray-blue/cyan for layered hierarchy, and an alternating rhythm of photography, evidence blocks, and geometric white space. + +【Color Palette】 +The background is predominantly `#FFFFFF`; body text and line art use `#202124`, reserved for high-contrast text; titles, top rules, numbering, key figures, and the primary panel use `#4285F4`, with only one large primary-blue block per slide; deep blue `#0059BA` is reserved for strong-result panels; cyan `#24C2E0` is used for secondary-option panels; light blue `#ADCCFA` is used for explanatory backgrounds; gray `#D8DBE0` is used for comparison, disabled, or decorative backgrounds, while `#9AA0A6` is used for headers and low-emphasis labels; positive or intervention markers use `#34A853`; do not introduce a separate red for negative or unaffected states—continue using `#202124` or `#9AA0A6`. Charts use a fixed mapping: primary blue = primary series, light gray = no occurrence, charcoal = control, cyan = secondary series. Use no more than 4 hues per slide; decorative elements use blue, black, and gray only; never flood the entire slide with an accent color. + +【Layout Skeleton】 +Source-deck facts: 1190.55×1683.78pt, A4 portrait, with an aspect ratio of approximately 0.7071 and left/right margins of approximately 80pt. Content slides have an approximately 2pt blue rule across the top, gray section navigation on the left, and a gray running title on the right; below the title, use either text on the left and a visual on the right or stacked horizontal bands, often with a geometric anchor in a bottom corner. Cover only: large title at top left; at the bottom, an arched/rounded photograph layered with a striped circle and black capsule. Section divider only: oversized blue number and title, with a large image at bottom right. Agenda slides may use vertical numbering. 16:9 adaptation: retain the top rule, navigation at both ends, left-text/right-visual structure, blue/gray bands, and bottom-corner geometry; convert vertical stacking into a horizontal 2-column layout or 3:2 partition, move the photograph to the right or into a lower horizontal band, and reduce circular decoration to a corner accent. Never present adaptation rules as source-deck facts. + +【Typography】 +Source-deck facts: sans serif `GoogleSans-Regular/Medium/Bold` (render with {latin: Liter, ea: MiSans}); body text is approximately 20pt=1x, argument titles 46pt≈2.3x, section/cover titles 80–87pt≈4–4.4x, large figures 60–70pt≈3–3.5x, running headers 18pt≈0.9x, and footnotes 14pt≈0.7x. Use Medium for titles, Regular for body copy, and Bold for metrics/conclusions; enlarge numbers while setting units and explanations one level smaller; keywords often use a blue underline. 16:9 adaptation: recommended, not measured—on a 960×540 canvas, use body text at 18–22pt equivalent, titles at 42–54pt, and section titles at 72–84pt, preserving the original scale and weight relationships. + +【Chart Language】 +Observed types: rows of person icons, layered tree/process diagrams, central-node loop diagrams, two-row treatment/control comparisons, small “pre–intervention–post” line charts, four-step numbered processes, and paired-metric case-study blocks. Dense conventional tables are not a stable signature; axis labels, units, and measurement conventions inherit PART A. + +⭐Signature techniques: +1. Use gray/blue/black person icons with a matching legend to communicate group attribution. +2. Use light blue → cyan → deep blue → gray nodes, thin black outlines, and orthogonal connectors to show a four-level hierarchy. +3. Link line-art icons with a black loop line and place a primary-blue circle at the center to express system relationships. +4. Inside a white rounded panel, use blue/gray line charts; use a green dashed line only to mark the intervention point. +5. Arrange treatment/control as horizontal rows, with a device screenshot beside a thin divider to explain between-group differences. + +【Signature Components】 +Top rule + gray navigation: 1 instance on every content slide, fixed to the top edge. Geometric anchor cluster (striped circle, quarter circle, gray circle/square, black capsule/triangle): no more than 1 cluster per slide, attached only to an edge or corner. Blue quotation panel: no more than 1 per slide, with a large white quotation mark and a short quotation. Blue/gray case-study band: no more than 1 group per slide, layered with a device screenshot/photograph/large metric. Rounded action capsule: no more than 1 per slide and only for an explicit action. Line-art icons use black outlines plus only one blue/cyan accent. Photography is mandatory on narrative/case-study slides: use 1 hero image, cropped as a circle/arch/rounded shape/diagonal cut; never use a photo wall or replace it with an icon wall. + +【Prohibited】 +No gradients, neon, luminous borders, 3D charts, or diffuse shadows; no continuous sequence of rounded cards for ordinary paragraphs; do not tile striped circles/quarter circles as a background; no rainbow icons or multicolor gradient charts; no full-slide photographs or photo collages; oversized blue numbers are reserved for sections, steps, or key metrics; serif typography must not serve as the primary typeface. + +【Slide Types and Layouts】 +Section/Cover|Opening transition|Title 45% + photograph/geometry 55%|2–4 blocks|Large number, photograph, geometric cluster|Do not include a complete evidence chain. +Argument + Image/Quotation|Claim with explanation/citation|Left text 42–48% + right image/blue panel 52–58%|4–7 blocks|Photograph, quotation, key figure|Do not include a multi-series statistical chart. +Method/Process Diagram|Steps, hierarchy, system relationships|Diagram 45–55%, explanation 25–35%|4–8 blocks|Line art, colored nodes, numbering|Do not include long-form narrative. +Comparison/Two-Column Case Study|Treatment/control or two cases side by side|Blue/gray approximately 50% each|6–10 blocks|Device screenshot, paired metrics, action capsule|Do not present a single continuous argument. +Checklist/Do–Avoid|Standards and review items|Left/right approximately 45/45%, optional photograph along the bottom|6–9 blocks|Check/cross line art, gray background blocks|Do not include a high-dimensional data table. + +【Density Baseline】 +Most content slides contain 1 main title and 4–8 independent blocks; two-column case studies contain 6–10 blocks; process slides contain 1 primary diagram + 3–5 explanatory elements. A slide usually contains 0–1 chart; complex slides may add at most 1–2 microcharts. Label only key figures and legends; do not crowd every bar or point with labels. Use 2–4 explanatory paragraphs, each approximately 40–90 words/characters equivalent; present metrics as a large number + unit/short conclusion. Concentrate white space in the header, between the title and primary visual, and around geometric elements in the bottom corners; the content area must still be fully occupied by substantive text, diagrams, or photography. diff --git a/skills/open-kimi-ppt/reference/design_system/academic/deep-blue-atlas/design.md b/skills/open-kimi-ppt/reference/design_system/academic/deep-blue-atlas/design.md new file mode 100644 index 0000000..17f09f9 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/academic/deep-blue-atlas/design.md @@ -0,0 +1,97 @@ +# Deep Blue Atlas · academic STYLE DESIGN SYSTEM + +## PART A — academic Baseline (Universal Floor) + +Academic presentations benchmarked against top-tier research talks and thesis defenses (NeurIPS/CHI/SIGGRAPH main-track caliber): clarity of argument outranks decoration; the whole deck must read as one reproducible scientific claim, not marketing collateral. Academic register throughout — the disciplined vocabulary of research questions, hypotheses, evidence, significance, contributions, and limitations; no marketing or business-speak mixed in. + +Content and layout: +1. Fixed argument skeleton: research question → gap in related work → data and method → main results → ablation/analysis → limitations → future work; short decks may compress, but the order may not be reversed. +2. Evidence first: results tables must include baseline comparison columns with the best values marked, relative gains beside absolute numbers; core contributions presented as formally typeset equations; method pages carry reproducibility information (data scale, annotation protocol, key hyperparameters). +3. Medium information density: one claim per page, evidence organized around that claim; pages are designed, not filled — whitespace is a legitimate device for separating stages of the argument. + +Visual style: +1. Aesthetics: plain, precise, scholarly; no slogans, decorative photography, or icon clip art. +2. Body text and labels in a clear sans-serif; titles may use serif when the source style does; equations formally typeset (KaTeX-grade), with proper numbering and italicized variables. +3. One two-color system: a primary structural color + one accent, grays carrying hierarchy; negative/ablation signals use a single consistent warning color. +4. Diagrams in thin, precise vector lines, tables in minimal horizontal rules; charts carry axis labels, units, and sample basis; never truncate the y-axis to exaggerate differences; correlation and causation are explicitly distinguished in the copy; no 3D, shadows, or gradients as decoration. + +Structure and discipline: +1. Every body-page title must be a claim (a finding, not a section name), with supporting evidence following on the page; every quantitative conclusion is backed on-page by a chart, table, or citation — no orphan numbers. +2. Figures must be self-contained: axis labels with units, in-figure annotation or legends, captions giving sample size and confidence basis. +3. Ablation and limitations pages are mandatory; numbers must carry units, time ranges, datasets, and statistical basis; uncertainty is expressed as confidence intervals. +4. The opening is a problem statement plus a one-sentence contribution; the close is numbered conclusions plus a list of open questions; citations sit as compact footnote lines at the page bottom — no full-page reference walls. + +Global prohibitions (mandatory): no default cards (containers serving information functions do not count as cards); no evenly split compositions unless justified by content structure; no unmotivated AI color schemes (blue-purple gradients, neon, glass cards, glowing borders); no elements that clash with the overall style; chart backgrounds transparent or the page background color; care with large empty areas — and no padding just to fill space. + +Density anchor: per-page minimums for evidence modules, charts, and labeling follow the density-baseline section in PART B; this baseline imposes no uniform numbers. + +## PART B — Signature System + +One-line style signature: a deep-blue linear-reasoning system on white — oversized conclusory titles deliver the judgment first, orthogonal segments and nodes organize the evidence, cyan singles out the one key piece of evidence, and trace orange-red handles thresholds and exceptions. + +【Color Palette】 +All hex values below are approximations pixel-sampled from the reference images (marked "approx."): +- Page background #FFFFFF (approx.): a uniform pure-white canvas across the deck, white covering over 90% of the area, no dark pages. +- Primary structural deep blue #203D74 (approx.): page titles, body emphasis, table headers, key figures, chart main lines, nodes, arrows, and decision-tree edges — the system's first visual anchor. +- Secondary deep blue #2C477A (approx.): section subheads and secondary structural lines, carrying the deep blue's anti-aliased tiers. +- Primary accent cyan #49B7D0 (approx.): subtitles, two-digit numerals, selected/active states, point estimates, event nodes, current step; never used as large-area fill, and it doubles as the entire "positive/valid" semantics (this style uses no green). +- Neutral gray #7F899E (approx.): explanatory text, axis labels, auxiliary notes, and legend-style annotations. +- Light blue-gray #B5C0D0 (approx.): page numbers, secondary notes, de-emphasized information, and fine reference lines. +- Divider gray #D9DEE7 (approx.): table hairlines, row separators, inter-column boundaries. +- Grid gray #E7ECF1 (approx.): horizontal chart gridlines, faintest structural lines. +- Negative red #E94B3B (approx.): inapplicable/excluded states, ex-ante threshold lines, risk reference lines — trace amounts only. +- Reminder orange #FD9F66 (approx.): exceptions and flagged figures needing attention without a negative verdict — even more trace than red. +Color discipline: no multi-series rainbow palette; within a page, no more than the three hue families deep blue / cyan / gray; every colored element must be able to explain its information role. + +【Layout Skeleton】 +Source facts: 16:9 canvas (sample images ~1467×825 px). Outer margins ~5–7% left/right, 6–8% top; page titles left-aligned, occupying roughly the top quarter; body content begins at ~28–32% of page height. The reading path is a Z: title → main figure/table → sidebar explanation → bottom conclusion line. Columns are always asymmetric — ratios such as ~58:42, 37:63, 31:38:31, 72:28 chosen per page type — with zones separated only by whitespace and fine gray rules, never panels. A light-gray "current page / total pages" number is fixed at lower right, omitted on the cover; no header navigation bar, no fixed sidebar, no logo corner mark. The bands between title zone and main figure, the inter-column transitions, and the page edges are fixed whitespace. + +【Typography】 +Source facts: a modern sans-serif character throughout — even stroke widths, flat terminals, open letterforms, close to a modern gothic/humanist sans (render with {latin: QuattrocentoSans, ea: MiSans}); Latin and numerals equally clean sans (the JPGs cannot confirm exact family names). Taking body text as 1x: small notes/page numbers 0.65–0.8x; section subheads 1.25–1.5x, semi-bold; page titles 2.1–2.5x, regular-to-medium weight, authority built through size rather than extreme boldness; cover main title 3–3.5x, distinctly bold; result big numbers 2–2.8x, semi-bold to bold. Weight hierarchy: page titles regular/medium, section heads semi-bold, key conclusions and figures bold, explanatory text regular, auxiliary information demoted to gray. No serif, script, italic, or monospace code faces anywhere in the set. + +【Chart Language】 +Only types that actually appear in the samples: +- ⭐ Single-series line chart: light-gray horizontal grid, no legend, node values labeled directly, one in-chart sentence of annotation. +- ⭐ Three-line academic wide table: only two deep-blue rules, below the header and at the foot — no vertical lines, no outer frame, no zebra striping; key-difference cells switch to cyan, variable differences legible without a legend. +- ⭐ Orthogonal decision tree: diamond decision nodes + right-angle polylines + small terminal arrows, branch labels placed along the lines; leaf nodes = deep-blue bold name + status word (red = inapplicable, cyan = applicable) + gray explanation. +- ⭐ Segmented timeline: thick deep-blue main axis + short ticks; excluded phases switch to gray dashed lines with axis-break jogs; cyan dots mark key instants, vertical leader lines connect annotations. +- ⭐ Confidence-interval plot (simplified forest plot): deep-blue interval lines + end caps + cyan point estimates + gray reference dashes + a red ex-ante threshold line. +- Mini interval scale: fine line with ticks at both ends, baseline value in gray at left, criterion value in deep-blue bold at right, flanking metric rows and logic rows. +- Horizontal process chain: cyan-numbered steps joined by thin arrows, with one looping bracket line allowed to express retrospective iteration. +Shared discipline: labels placed directly, no legend dependence; one main figure per page — never pile up multiple independent charts. + +【Signature Components】 +- Conclusory display title: one complete long-form assertion per body page, left-aligned, occupying the top quarter; on the cover, a main title plus core proposition performs the same function. +- Two-digit cyan numerals: 01/02-style navigation numbers, small but conspicuous, used for list items and process steps — the deck's wayfinding. +- Cyan evidence points: one to three cyan focuses per page (point estimate, key node, selected path, current step) — the reader's sole landing spot, never a fill. +- Lines as grammar: dividers, axes, leader lines, and table rules carry all structural expression — the style's most stable visual fingerprint. +- Panel-free zones: multi-column areas are zoned by whitespace and fine gray rules alone — no rounded cards, no shadows, no fill blocks. +- Short-tick anchor lists: resolution/threshold lists use short cyan vertical ticks as per-item anchors instead of bullets. +- Bottom conclusion line: one full-width deep-blue bold line at the foot of body pages, sealing the page's argument. +- Light lower-right page number: light gray "current page / total pages", omitted on the cover. +- Restrained geometric nodes: diamond = decision, dot = status/estimate, short tick = list anchor, arrow = direction; no general-purpose icon library. + +【Prohibited】 +- No dark full-bleed backgrounds; deep blue is for text and lines, never page fills. +- No photos, people images, product shots, screenshots, illustrations, or large image backgrounds. +- No gradients, glows, shadows, glassmorphism, transparency layering, or 3D effects. +- No rounded cards, card walls, colored panels, or heavy information boxes. +- No colored icons, emoji, stickers, badge-style labels, or decorative graphic assets; no logos, brand corner marks, permanent sidebars, or header navigation bars. +- No vertical table lines, heavy outer frames, or zebra row fills; tables use horizontal rules only. +- No pies, donuts, default office-suite legends, or multi-color categorical charts. +- No green for positive states; positive/valid semantics are carried entirely by cyan. +- No free-curve connectors, radial mind maps, or dense network node graphs — the "atlas feel" comes from orthogonal-line relationship expression, not webs. +- No long centered copy, slogan-style one-liner pages, or decorative giant background numerals; no serif, script, italic, or display faces. + +【Slide Types and Layouts】 +Cover | module opening | left ~2/3 information zone + right 1/3 whitespace | eyebrow + oversized main title + cyan subtitle + one line of meta info + fine divider + bolded core proposition + supplementary note | ~7 text blocks, no charts, no page number. +Problem evidence page | phenomenon data + misreading teardown | ~58:42 two columns | 1 main figure + 3 numbered items + bottom conclusion band | direct-labeled line chart, cyan numerals | not suited to parallel multi-topic content. +Logic hypothesis page | falsifiable hypothesis statements | narrow left column with large relational words + wide middle column of explanation + mini interval plot at right | 3 logic rows + 2 dividers | not suited to long formula derivations. +Comparison table page | groups/approaches compared side by side | full-width three-line table (~88% of page width) + basis note below + key-points passage + conclusion line | high density relieved by generous row height. +Decision-tree page | option selection converging | ~37:63, conclusion first in the left column + orthogonal decision tree at right | 2–3 decision nodes + 4 leaf nodes | wide gaps between branches to avoid line crossings. +Timeline page | measurement windows / phase schedule | full-width single axis (~86% of page width) + annotations above and below the axis + 2-line bottom note | medium-low density, breathing room around the axis. +Results decision page | metric comparison + point estimates + action branches | ~31:38:31 three columns + bottom three-column action zone | the deck's density ceiling, order maintained by three-column alignment. +Convergence page | scaling resolutions | ~72:28 main zone + right resolution rail | process chain + loop line + threshold checklist + limitations note | does not end on a thank-you page. + +【Density Baseline】 +One core visual object per page: 1 main figure/table/framework — never pile up multiple independent charts. Body pages carry ~7–15 text and graphic blocks; line charts directly label 3–5 nodes; comparison tables 2–4 data rows × 4–6 columns with generous row height; decision trees 2–3 decision nodes and at most 4 leaves; timelines carry at most 8 time-point labels; results pages allow 2 sets of mini metrics + 1 interval plot + 3 columns of action branches. Numbered lists run 3–5 items per page, each a one-line bolded claim + one gray explanatory sentence. Whitespace concentrates between title and main figure, in asymmetric-column transitions, and at the page edges; the body area holds no large empty block, nor may anything be stuffed in to fill. At most 3 cyan focuses per page; red and orange combined remain trace. diff --git a/skills/open-kimi-ppt/reference/design_system/academic/paper-white-courseware/design.md b/skills/open-kimi-ppt/reference/design_system/academic/paper-white-courseware/design.md new file mode 100644 index 0000000..ca584f6 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/academic/paper-white-courseware/design.md @@ -0,0 +1,66 @@ +# Paper White Courseware · Academic STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum) + +Create rigorous, formally typeset academic presentations at the standard of top-tier research talks and thesis defenses (NeurIPS/CHI/SIGGRAPH main-stage quality), with clarity of argument taking precedence over decoration. The deck must read as a reproducible scientific claim, not as marketing collateral. Use academic language throughout: standard terminology for research questions, hypotheses, evidence, significance, contributions, and limitations, without marketing or business phrasing. Shift the visual emphasis by discipline: theoretical work should make equations and proof steps the dominant large-scale content; computer science and engineering should be structured around system diagrams, code, execution traces, and performance curves; experimental research should tightly organize equations, charts, and images around the same conclusion; humanities and social sciences should layer archival records, maps, manuscripts, and other textual evidence with narrative depth while preserving academic rigor. + +Content and layout: +1. Use a fixed argument structure: research question → gap in related work → data and methods → main results → ablation/analysis → limitations → future work. A short deck may compress this sequence, but must not reorder it. +2. Make every slide evidence-first: results tables must include baseline comparison columns; use comparison charts and architecture/process diagrams; present the core contribution as a formally typeset equation. +3. Maintain medium information density: one claim per slide, with evidence organized around that claim. Slides should be composed, not filled—white space is a legitimate way to separate stages of the argument. + +Visual style: +1. Aesthetic: restrained, precise, and scholarly. Do not use promotional copy, decorative photography, or clip-art icons. +2. Typography: use clear sans serif typefaces (render with Liter / Chinese: MiSans) for body text and labels; titles may use serif type when the source style does. Equations must be formally typeset (KaTeX quality), with standard equation numbering and italic variables. +3. Color: use a two-color system for each deck—one primary structural color and one accent color, with gray carrying hierarchy; use a white or near-white background; use only one consistent warning color for negative results or ablation signals. +4. Graphics: draw diagrams with thin, precise vector lines; use minimal horizontal rules in tables; give charts axis labels, units, and sample definitions; do not use 3D effects, shadows, or gradients as decoration. + +Structure and discipline (derived from work we consider exemplary): +1. Every content-slide title must state a claim—a finding, not a section label: “Lapses in attention can be predicted 10 seconds in advance,” not “Experimental results.” Support that claim with evidence on the same slide. +2. Align claims with evidence: every quantitative conclusion on a slide must be supported there by a chart, table, or cited result. Never leave a number orphaned. +3. The primary results table must include baseline comparison columns and mark the best value; show relative improvement alongside absolute values. +4. Method slides must provide reproducibility details: dataset size, annotation protocol, inter-annotator agreement, and key hyperparameters. Show only the core idea as an equation; place derivations in appendix slides. +5. Every figure must be self-contained: include axis labels with units, a legend or direct labels, and a caption area stating sample size and confidence convention. A figure must not rely on the legend alone. +6. Ablations and limitations are mandatory, not optional: ablations isolate the contribution of each component; limitations candidly state scope, failure modes, and ethical/anonymization status. +7. Every number must include its unit, time range, dataset, and statistical convention (mean ± variance, sample size). Express uncertainty with a measurable quantity or confidence interval, not vague language. +8. Open with a problem statement and a one-sentence contribution; close with numbered conclusions—claims, not a summary—and an explicit list of open questions. +9. Place citations as compact footnote lines at the bottom of slides where they are used; unless the genre requires it, do not create a dense full-slide wall of references. + +Default baseline (derived from the layout skill; PART B may override): organize each slide around one evidence unit (figure/table/equation); give charts complete axis labels, units, and sample definitions; make charts honest—do not truncate the y-axis to exaggerate differences, and distinguish correlation from causation explicitly in the copy; ensure projection readability, with body text on a 960×540 canvas at ≥14pt equivalent and chart labels at ≥10pt equivalent. + +**Title read-through test**: reading only the slide titles should tell the complete story; if the sequence does not flow, the structure is not working. + +Density anchor: the specific minimum for each style—the number of evidence modules and charts per slide, and annotation conventions—is defined by the 【Density Baseline】 reverse-engineered from that style’s source deck. This baseline does not impose a single universal number. + +### Global Prohibitions (Mandatory · Prevent Default AI Patterns) + +1. **No cards by default**: unless the user explicitly requests them, do not use rounded rectangles or rectangular cards to create hierarchy or alignment. Containers with a genuine information function—status indicators, hypothesis boxes, quotation frames—do not count as cards. Lines, white space, font size, and weight contrast are better tools. +2. **No equal-split compositions**: unless no other layout is viable, do not default to three equal columns, four equal columns, or a two-by-two matrix. An equal split must be justified by the content structure—three scenarios naturally support three columns; frameworks explicitly named in the content are exempt. +3. **No unjustified AI-default color schemes**: institution-specific palettes stated in the content are exempt. Prohibited defaults are generic, moderate, and unsupported choices such as blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **No elements inconsistent with the overall style**: do not introduce forms outside the visual language, such as rounded icons or rounded rectangles in a sharp-edged style. +5. **Keep chart backgrounds transparent**: use transparency or the slide background color, except for reversed charts on dark backgrounds. +6. **No empty regions**: do not leave an entire planned region of the content area blank. Every allocated region must contain real content; an unfilled region is the most serious form of roughness. + +## PART B — Signature System (Distinctive Template Signature; This Section Overrides PART A in Case of Conflict) + +One-sentence style signature: warm courseware with a paper-editorial sensibility, grounded in creamy paper white; forest green establishes structure, coral orange provides small accents, and moderately high long-form text density coexists with generous breathing room. + +【Color Palette】Background #FDFAF5: fill the full slide while retaining the warmth of paper; primary text #56687A: use for all long-form text instead of pure black; title #44712E: use for slide titles, section labels, bold emphasis, and dark result bars; primary accent #F5987E: use only for short divider rules, chapter numbers, step numbers, and key figures; supporting green #D7EBCE: use only as fills for list items, table rows, or title panels; supporting pink #F9DED8: use only for chapter circles, case-study top bands, or alternating rows. Fix the chart series to #44712E, #F5987E, and their light variants #D7EBCE and #F9DED8. Do not create a separate red/green convention for positive and negative values; use #F5987E for both, with ↑/↓ and text indicating direction. Use no more than two hue families per slide (green + coral); never flood an entire slide with the accent color. + +【Layout Skeleton】Source-deck facts: 612×792 pt portrait Letter, with a 17:22 aspect ratio and standard margins of approximately 48 pt. Most content slides place a 25 pt claim title at the upper left, followed by a coral rule approximately 50×4 pt; the coral chapter number sits at the upper right, double angle brackets at the lower left, and “Short Document Name|Page Number” at the lower right. Content typically uses two unequal columns, read left to right and then downward. Cover/chapter slides use only a giant pale-pink circle + a person or botanical illustration + a pale-green title panel at the bottom. For 16:9 adaptation: retain the left margin, short rule, upper-right chapter number, and footer; change the columns to approximately 45:55, use a horizontal photo band across the upper 35%–40%, enlarge the chapter slide’s large circle and shift it left, and convert the pale-green title panel into a wide lower-left band rather than stretching the portrait composition. + +【Typography】Source-deck font facts: the PDF embeds the slab-serif family Community Slab (Regular/Semibold/Italic) and the sans serif family Community (Light/Semibold); however, the reference output is entirely sans-serif with extra-bold black titles — the reference image wins: body, titles, numbers, and navigation all use the sans family (render with {latin: Liter, ea: MiSans}, titles and figures bold). Body text 11.5 pt = 1x, slide titles 25 pt ≈ 2.2x, information statements 15–17 pt ≈ 1.3–1.5x, large figures 40–48 pt ≈ 3.5–4.2x, chapter numbers approximately 105 pt ≈ 9x, and footers 8 pt ≈ 0.7x. For 16:9 adaptation: on a 960×540 canvas, use 16–18 pt body text, 34–40 pt slide titles, and 56–72 pt large figures; preserve the scale ratios and the all-sans weight hierarchy. Set English titles in sentence case, never all caps; bold only the conclusion within a sentence, and italicize quotations. + +【Chart Language】Elements used in the source: bar charts with few bars, single-diagonal relationship diagrams, funnels, circular-arrow diagrams, proportional icon arrays, comparison matrices/tables, and KPI result bars. ⭐Pair each chart with a one-sentence rule on the same slide: place the chart within a pale-green or pale-pink field, and label the conclusion directly beside the relevant line, bar, or region rather than creating a separate large legend. ⭐All quantified case-study outcomes belong in a dark-green result bar: white explanatory text + a large coral figure, with body content avoiding emphasis at the same level. ⭐Use proportional icon arrays only occasionally, and only when the sample is small enough for a proportion to be read directly from 10 units. + +【Signature Components】Coral short rule: use it once beneath the title, at a width approximately 2 times the title’s cap height; pale list panels: use only for parallel steps, comparison rows, or tool items, 3–6 per slide—this is a narrow exception to PART A’s prohibition on default cards; flat person/botanical illustrations: use them to turn abstract claims into situations, no more than one group per slide, positioned against the slide edge or in open space without covering body text; dark-green result bar: use only for “result + key change,” no more than one per slide. Photography is a hard requirement: include at least one real contextual photograph of a person in the deck, used only as a full-width top band or standalone rectangle on an introduction slide or at the opening of a case study. Do not replace it with an abstract gradient or an illustration-only treatment. + +【Prohibited】Do not use a photo as a text background or add a mask with overlaid text; do not generalize pale-green/pale-pink panels into a card grid with no information function; do not scatter colored icons—icons must sit inside white circular wells or be bound to list items; do not allow the native colors of embedded interfaces/screenshots to spill into the global palette; do not use coral orange for long passages of body text or as a full-slide background. + +【Slide Types and Layouts】Editorial argument slide|one judgment + explanation + diagram|title 15% / unequal two-column body 55% / marginal illustration or figure 30%|3–5 blocks|short rule, footer, marginal illustration|not suitable for a multi-metric dashboard. +Data-claim slide|one large figure or one primary chart supports the conclusion|title 15% / primary evidence 45% / explanation 30%|2–4 blocks|large figure, pale chart field|not suitable for several small charts side by side. +List/tool slide|3–6 peer-level steps, benefits, or methods|title 15% / vertical list or matrix 70%|3–6 blocks|pale list panels, icons in circular wells|not suitable for a long derivation. +Photo-led introduction slide|human context + one-sentence lead-in|photo 40%–48% / title and body 40%|2–3 blocks|full-width photo band, short rule|not suitable for data-dense content. +Case-evidence slide|problem—method—result chain|pale-pink top band or photo 20% / two-column body 50% / result bar 30%|4–6 blocks|device image or photo, dark-green result bar|not suitable for a story without verifiable outcomes. + +【Density Baseline】Portrait argument slides in the source typically contain 3–5 evidence/explanation modules, list slides 3–6, and case-study slides 4–6; most slides contain 0–1 primary chart and never form a multi-chart dashboard. Label values bar by bar only in sparse bar charts with approximately 3 bars; label only the key regions and endpoints in relationship diagrams. For new 16:9 decks, use 2–4 modules per slide; keep each explanation block to roughly 40–90 characters’ worth of content, adjusted to an equivalent length in the working language. If a case study exceeds 4 blocks, split it into separate “Method” and “Results” slides. This overrides PART A’s prohibition on empty regions: continuous paper-white space is allowed beneath the title, around illustrations, and above the footer, but never reserve an empty container. diff --git a/skills/open-kimi-ppt/reference/design_system/academic/pastel-derivation/design.md b/skills/open-kimi-ppt/reference/design_system/academic/pastel-derivation/design.md new file mode 100644 index 0000000..6f9b532 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/academic/pastel-derivation/design.md @@ -0,0 +1,68 @@ +# Pastel Derivation · Academic STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum Standard) + +A rigorous, formally typeset academic presentation benchmarked against top-tier research talks and thesis defenses (main-stage NeurIPS/CHI/SIGGRAPH quality), where clarity of argument takes precedence over decoration. The deck must read as a reproducible scientific claim, not as marketing collateral. Use academic language throughout, with disciplined wording for research questions, hypotheses, evidence, significance, contributions, and limitations; do not mix in marketing or business language. Shift the visual emphasis by field: theoretical derivations should devote most of the canvas to equations and proof steps; computer science and engineering should be structured around system diagrams, code, execution traces, and performance curves; experimental research should tightly organize equations, charts, and images around a single conclusion; humanities and social sciences should add narrative texture and textual evidence—such as archives, maps, and manuscripts—without compromising academic rigor. + +Content and layout: +1. Use a fixed argument structure: research question → gap in related work → data and methods → main results → ablation/analysis → limitations → future work. A short deck may compress this structure, but must not change its order. +2. Build evidence-first slides: include result tables with baseline comparison columns, comparison charts, and architecture/process diagrams; present the core contribution as a formally typeset equation. +3. Maintain medium information density: one claim per slide, with evidence organized around that claim. Slides must be composed, not filled—white space is a valid way to separate stages of the argument. + +Visual style: +1. Aesthetic: restrained, precise, and scholarly. Do not use promotional copy, decorative photography, or clip-art icons. +2. Typography: use a clear sans serif (render with Liter / Chinese: MiSans) for body text and labels; headings may use a serif if the source style does. Equations must be professionally typeset (KaTeX quality), with standard equation numbering and italic variables. +3. Color: use a two-color system for each deck—one primary structural color and one accent color—with gray establishing hierarchy. Use a white or near-white background. Use only one consistent warning color for negative or ablation signals. +4. Graphics: use thin, precise vector lines for diagrams and minimal horizontal rules for tables. Charts must include axis labels, units, and sample definitions. Do not use 3D, shadows, or gradients as decoration. + +Structure and discipline (distilled from work recognized as benchmark quality): +1. Every body-slide title must state a claim—a finding, not a section label: “Distraction Can Be Predicted 10 Seconds in Advance,” not “Experimental Results.” The evidence supporting that claim must follow on the same slide. +2. Align claims with evidence: every quantitative statement on a slide must be supported on that slide by a chart, table, or cited result. No orphan numbers. +3. The main results table must include baseline comparison columns and identify the best value; show relative improvement alongside absolute values. +4. Method slides must include reproducibility details: dataset scale, annotation protocol, inter-annotator agreement, and key hyperparameters. Show only the central idea in equations; move derivations to appendix slides. +5. Every figure must be self-contained: provide axis labels with units, a legend or direct labels, and a caption area specifying sample size and confidence basis. A figure must not rely on its legend alone. +6. Ablations and limitations are required slides, not optional ones: ablations isolate the contribution of each component; limitations accurately state scope, failure modes, and ethical/anonymization status. +7. Every number must include its unit, time span, dataset, and statistical basis (mean ± variance, sample size). Express uncertainty through measurable quantities or confidence intervals, not vague language. +8. Open with the problem statement and a one-sentence contribution. Close with numbered conclusions—claims, not a summary—and an explicit list of open questions. +9. Place citations in a compact footnote line at the bottom of the relevant slide. Do not create a dense, full-slide bibliography wall unless the format requires it. + +Default baseline (distilled from the layout skill; PART B may override): organize each slide around one evidence unit (figure/table/equation); give charts complete axis labels, units, and sample definitions; keep charts honest—do not truncate the vertical axis to exaggerate differences—and distinguish correlation from causation explicitly in the copy; ensure projection readability, with body text at ≥14pt equivalent and chart labels at ≥10pt equivalent on a 960×540 canvas. + +**Title read-through test**: reading only the slide titles in sequence should tell the complete story. If the sequence does not flow, the structure is not working. + +Density anchor: the specific minimum for each style—evidence modules per slide, chart count, and annotation conventions—is defined by the 【Density Baseline】 reverse-engineered from that style's source deck. This baseline does not impose one universal number. + +### Global Prohibitions (Mandatory · Prevent Default AI Patterns) + +1. **Do not default to cards**: unless the user explicitly requests them, do not use rounded rectangles or rectangular cards to create hierarchy or alignment. Containers with a genuine information function—such as status indicators, hypothesis boxes, or quotation boxes—do not count as cards. Lines, white space, type size, and weight differences are preferable. +2. **Do not default to equal-split compositions**: unless no other layout is viable, do not use three equal columns, four equal columns, or a two-by-two matrix by default. Equal division must be justified by the content structure (three scenarios naturally warrant three columns; a framework explicitly named in the content is exempt). +3. **Do not use ungrounded AI color schemes**: an institutional palette specified in the content is exempt. Prohibited choices are generic, commonplace, and unjustified defaults—blue-purple gradients, cyan-purple neon, rainbow light blobs, glass cards, and glowing borders. +4. **Do not use any element inconsistent with the overall style**: styles from outside the system are prohibited, such as rounded icons or rounded rectangles in a sharp-edged visual language. +5. **Keep chart backgrounds transparent**: use transparency or the slide background color, except for reversed charts on dark backgrounds. +6. **Do not leave regions blank**: do not leave an entire planned region empty within the body content area. Every planned region must contain real content; failing to fill it is the most serious sign of an unfinished layout. + +## PART B — Signature System (Distinctive Template Signature; PART B Takes Precedence in Conflicts with PART A) + +One-line style signature: approachable, rational, whiteboard-like derivations on white, with pale pink–mist blue–mint chapter colors; electric blue and magenta carry fixed variable semantics; low-to-medium density with progressive reveal. + +【Color Palette】Body background: #FFFFFF. Use low-contrast gradients only on cover and chapter slides; observed corner colors are approximately #FEF2E8 at top left, #DBEDFE at top right, and #DEF8E9 at bottom right. Use #172C34 for all headings and readable text. Use the primary accent #0064E0 only on one key action phrase within a title. Use annotation blue #0085FD for arrows, links, newly introduced variables, and in-figure labels. Use supporting magenta #C32E8F only for the inverse operation, source term, or limiting phrase paired with blue. Use light gray #F1F4F7 only as a background frame for theorems, conclusions, or conditions, covering no more than 25% of a slide. Use almond #FCEEDC only as a “sandbox” for geometry, distributions, and trajectories. Chart series use #1F77B4, #FF7F0E, #2CA02C, and #D62728; use #0085FD for positive signals and #C32E8F for negative signals/caveats, with each applied to no more than a short phrase. Except in multi-series charts, use no more than two chromatic hues per slide. Pastels do not enter body-slide backgrounds, and accent colors never flood the slide. + +【Layout Skeleton】Source canvas: 1920×1080, 16:9. Anchor body-slide titles at the top left, starting at approximately x=2.7%, y=2.8%, and occupying 9%–12% of the height. Begin content at y≈15%; reserve the bottom 4% for bright-blue citations, with no full-width footer. The default reading path is “left-side definition/starting point → central arrow or main equation → right-side geometry/result.” When a horizontal flow is unsuitable, use a centered equation with a conclusion strip at the bottom. Primary evidence occupies 55%–70%; supporting explanation occupies 25%–40%. Do not use equal-weight cards. The cover alone uses a “large center-left title + right-side call to action + contributor information at the bottom” layout. Chapter slides alone use a slightly left-of-center “number + chapter title” layout, with a large QR code on the right only when a genuine external entry point exists. + +【Typography】PDF embedding has been verified: use OptimisticDisplay-Medium for headings, with a single key phrase optionally switched to OptimisticDisplay-Bold. Use OptimisticText-Regular/Bold for body text and labels. Use STIXGeneral-Regular/Italic for equations, with italic variables and upright operators. Taking the source deck's body text size of 40 as 1x, the heading size of 74 is approximately 1.85x. There is no consistent large-numeral tier. Main equations are usually 1.4–1.75x, with occasional use of 2.8x on minimal mechanism slides; figure captions are 0.6–0.75x and citations 0.5x. Use sentence case for headings, never all caps. Serif type is reserved for mathematics. Render with {latin: Liter, ea: MiSans} (headings Medium/Bold); use STIX Two Text for equations (via customFonts). + +【Chart Language】The source uses single- and dual-line charts, paired bar comparisons, minimal comparison tables, sample matrices, scatter plots, vector fields, trajectory schematics, and process-node diagrams. Tables inherit PART A, with no consistent additional treatment. ⭐Almond sandbox: use contours, point clusters, fine trajectories, and a small number of samples to spatialize abstract objects. ⭐Color-linked equation and diagram: key equation terms share their color with the corresponding arrows, points, and labels in the figure. ⭐Fixed-base progression: retain the same base figure and viewpoint across 2–5 adjacent slides, adding only one trajectory, condition, or equation term per slide; only the new element receives color. Standard performance charts do not label every data point; retain axes, legend, and source. + +【Signature Components】①Light-gray theorem/conclusion strip: spans the lower half of the slide or sits next to the relevant equation; use no more than 2 per slide, and only for a theorem, condition, conclusion, or caveat. ②Almond canvas: uses a 1–2 px dark outline; use 1–3 per slide, and only for geometry, distributions, trajectories, and corresponding samples. ③Blue downward arrow + magenta upward arrow: expresses only inverse operations or two directions of operation; use no more than 1 pair per slide. ④Within-chapter route strip: place 3 thumbnails side by side; add a #F1F4F7 backplate to the current stage and reduce the others to approximately 40% opacity. Use only on subsection transition slides. ⑤Progressive construction sequence: established graphics remain fixed in place; each new slide reveals only one new piece of evidence or transformation. Do not use this pattern for a single-slide summary. + +【Prohibited】Do not use pastel gradients, almond, or light gray as a full-slide background for ordinary body slides. Do not use serif type for explanatory prose. Do not turn #F1F4F7 rounded frames into generic cards; every frame must serve a theorem, condition, or conclusion. Do not use blue or magenta as decoration without semantic meaning, or swap their roles within the same progressive sequence. Do not expand a complete multi-step derivation on a single slide; split it across progressive slides while keeping the base figure fixed. Do not use reversed text on a dark background for body slides. + +【Slide Types and Layouts】 +Equation–Conclusion Slide | Definitions, losses, theorems, equivalences | Title 12% + central equation 60% + bottom conclusion 20% | 1–2 blocks | Light-gray conclusion strip, color-linked variables | Unsuitable for photo matrices. +Schematic Derivation Slide | Mechanisms or paths that map algebraic concepts | Almond figure 55%–65% + equation/explanation 35%–45% | 1–3 blocks | Almond canvas, paired arrows, progressive sequence | Unsuitable for dense literature. +Comparative Evidence Slide | Comparison of methods, conditions, or results | Two columns at 48/48 or three evidence units in a row | 2–4 blocks | Blue phrase in title, light-gray conclusion strip | Unsuitable for long equation chains. +Within-Chapter Navigation Slide | Subtopic progress | Three thumbnails across the horizontal middle band | 3 blocks, 1 current state | Within-chapter route strip | Does not carry new evidence. +References/Limitations Slide | Literature, open questions, or caveats | 1–3 light-gray functional boxes stacked vertically | 1–3 blocks | Bright-blue citations, magenta limiting phrases | Unsuitable for main results. +Occasional · Proposition Pause Slide | Problem reframing or within-chapter turn | Large proposition on the left 40% + geometric metaphor on the right 55% | 2 blocks | Almond geometric figure | Unsuitable for dense data. + +【Density Baseline】The source deck has low-to-medium density because it relies on progressive construction; no deck-wide hard minimum applies. An Equation–Conclusion Slide usually contains 1 main equation + 0–1 conclusion strip and 0–2 explanatory blocks, with a 15–50 words/characters equivalent per block. A Schematic Derivation Slide contains 1–3 figures and adds only 1 key node per slide; annotations follow variables and trajectories rather than labeling every data point. A Comparative Evidence Slide contains 2–4 modules, 0–2 quantitative charts, and optionally 1 conclusion; it uses 1–2 explanatory blocks, with a 25–60 words/characters equivalent per block. A References/Limitations Slide contains 2–3 boxes, with 3–6 lines per box. Preserve white space between the title and primary evidence, between two layers of equations, and around large figures. When content exceeds capacity, add slides for progressive reveal; do not shrink type to fill white space. diff --git a/skills/open-kimi-ppt/reference/design_system/academic/teal-green-academic-defense/design.md b/skills/open-kimi-ppt/reference/design_system/academic/teal-green-academic-defense/design.md new file mode 100644 index 0000000..ecb0f3f --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/academic/teal-green-academic-defense/design.md @@ -0,0 +1,90 @@ +# Teal-Green Academic Defense · Academic STYLE DESIGN SYSTEM + +## PART A — Category Baseline (Universal Minimum) + +Create a rigorous, formally typeset academic presentation benchmarked against top-tier research talks and thesis defenses (at the level of the main programs of NeurIPS/CHI/SIGGRAPH), with clarity of argument taking precedence over decoration. The deck must read as a reproducible scientific argument, not as marketing collateral. Use academic language throughout: standard terminology for research questions, hypotheses, evidence, significance, contributions, and limitations, with no marketing language or corporate jargon. Shift the visual emphasis by discipline: theoretical work should devote substantial space to equations and proof steps; computer science and engineering should be structured around system diagrams, code, execution traces, and performance curves; experimental research should organize equations, charts, and images tightly around a single conclusion; humanities and social sciences should layer archival material, maps, manuscripts, and other textual evidence with narrative depth on top of academic rigor. + +Content and layout: +1. Use a fixed argumentative structure: research question → gap in related work → data and methods → main results → ablation/analysis → limitations → future work. A short deck may compress this structure, but must not change the sequence. +2. Build evidence-first slides: result tables must include baseline comparison columns, comparative charts, and architecture/process diagrams; present core contributions as formally typeset equations. +3. Maintain medium information density: one claim per slide, with evidence organized around that claim. Slides should be composed, not filled—whitespace is a valid way to separate stages of the argument. + +Visual style: +1. Aesthetic: restrained, precise, and scholarly. Do not use slogans, decorative photography, or clip-art icons. +2. Typography: use a clear sans serif (render with Liter / Chinese: MiSans) for body text and labels; headings may use a serif when the source style does; equations must be formally typeset (KaTeX quality), with standard equation numbering and italic variables. +3. Color: use a two-color system for each deck—one primary structural color and one accent color, with gray establishing hierarchy; use white or near-white backgrounds; use only one consistent warning color for negative findings or ablation signals. +4. Graphics: use thin, precise vector lines for diagrams; minimal horizontal rules for tables; axes, units, and sample definitions for charts; do not use 3D effects, shadows, or gradients as decoration. + +Structure and discipline (distilled from work established as the benchmark): +1. Every content-slide title must state a claim (a finding, not a section label—“Attention Lapses Can Be Predicted 10 Seconds in Advance,” not “Experimental Results”), followed by evidence that supports the claim. +2. Align claims with evidence: every quantitative statement on a slide must be supported by a chart, table, or cited result on the same slide; orphan numbers are not allowed. +3. The main results table must include baseline comparison columns and identify the best value; show relative improvement alongside absolute values. +4. Method slides must include reproducibility details: dataset size, annotation protocol, inter-annotator agreement, and key hyperparameters. Show only the core idea as an equation; place derivations in appendix slides. +5. Every chart must be self-contained: include axis labels with units, a legend or direct labels, and sample size/confidence definitions in the caption area; a chart must not rely on its legend alone. +6. Ablation and limitations are mandatory slides, not optional ones: ablation isolates the contribution of each component; limitations candidly state scope of applicability, failure modes, and ethics/de-identification status. +7. Every number must include a unit, time range, dataset, and statistical definition (mean ± variance, sample size); express uncertainty through measurable quantities or confidence intervals, not vague wording. +8. Open with the problem statement and a one-sentence contribution; close with numbered conclusions (claims, not a summary) and an explicit list of open questions. +9. Place citations in a compact footnote line at the bottom of the slide where they are referenced; unless the format requires it, do not create a full slide densely packed with references. + +Default baseline (distilled from the layout skill; PART B may override): organize each slide around one evidence unit (chart/table/equation); give charts complete axis labels, units, and sample definitions; represent data honestly, without truncating the y-axis to exaggerate differences; distinguish correlation from causation explicitly in the copy; ensure projection readability, with body text at ≥14 pt equivalent and chart labels at ≥10 pt equivalent on a 960×540 canvas. + +**Title sequence test**: Read only the slide titles from beginning to end; they should tell the complete story. If the sequence is incoherent, the structure has not been established. + +Density anchor: The specific minimum for each style (number of evidence modules and charts per slide, annotation conventions) is defined by the 【Density Baseline】 reverse-engineered from that style’s source deck—this baseline does not impose a universal number. + +### Global Prohibitions (Default AI Patterns · Mandatory) + +1. **Do not default to cards**: Unless explicitly requested by the user, do not use rounded rectangles or rectangular cards to establish hierarchy or alignment—containers with a clear information function (status indicators, hypothesis boxes, quotation frames) are not considered cards. Lines, whitespace, font-size differences, and weight differences are preferred. +2. **Do not use equal-part layouts by default**: Unless no other viable layout exists, do not default to three equal columns, four equal columns, or a two-by-two matrix—equal division must be justified by the content structure (three scenarios naturally support three columns; frameworks explicitly named in the content are exempt). +3. **Do not use ungrounded AI color schemes**: Institution-specific palettes defined in the content are exempt; what is prohibited is a bland, common, unjustified default palette—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **Do not use elements that conflict with the overall style**: No out-of-style elements, such as rounded icons or rounded rectangles in an angular visual system. +5. **Keep chart backgrounds transparent**: Use transparency or the slide background color, except for reversed charts on dark backgrounds. +6. **Do not leave planned regions empty**: Do not leave an entire planned region of the content area blank; every planned region must contain real content. Failure to fill one is the most serious form of roughness. + +## PART B — Signature System (Template-Specific Signature; This Section Prevails over PART A in Case of Conflict) + +One-sentence style signature: Academic diagrams with black text on white, using teal green as the structural color, sky blue as the framework color, and yellow-orange as a single-point marker, balanced by medium-density whitespace. + +【Color Palette】 + +Background #FFFFFF; use near-white #F7F7F4 only inside chapter-title frames. Primary text and headings #000000. Primary accent #009682 for square bullets, key connectors, checkmarks, and small labels, covering no more than 10% of any slide. Supporting colors: #68BCE0 only for goal banners/column headers, #939FB5 only for sidebars/inactive states, #868686 only for neutral lines, #70D6A6 for evidence labels, and #F4FAFD for goal-cell backgrounds. Focal marker #F0A81D may circle only one dimension or parameter. Chart series use #1F77B4, #FF7F0E, #2CA02C, #D62728, and #9467BD. Positive #009682; error/risk approximately #B51E00. Use 3–4 structural hues per slide; never flood a slide with an accent color. + +【Layout Skeleton】 + +The source canvas is 483.874×272.126 pt, with a 1.778 (16:9) aspect ratio. On standard slides, place the title at the upper left, approximately 4% from the left and 12% from the top, in bold black; begin the body at approximately 26% of the slide height, using “left list + one chart/table/process diagram on the right,” with 38–45% for the left and 45–52% for the right. On process slides, center the main diagram horizontally; on chart slides, let one evidence object occupy the primary area. Standard slides include bottom navigation: section name + dot progress, with the current section bold black; on the next line, use a thin gray rule, page number/date/short title. Chapter slides contain only a centered rectangle with a thin teal-green outline and near-white interior, with no body copy. Title → key points → evidence → annotation. + +【Typography】 + +The source deck’s primary typeface is the sans serif NimbusSanL-Regu/Bold (render with Liter / Chinese: MiSans); use mathematical/monospaced faces for equations and code (render with JetBrains Mono, via customFonts). Measured body text is 8.52 pt=1x, slide titles 13.63 pt≈1.60x, chapter titles 23.55 pt≈2.76x, footnotes/footers 5.68 pt≈0.67x; subsection bold text is 9.46 pt, banner text 11.36 pt. At 960×540, the proportional equivalents are approximately 17/27/47/11 pt. Slide titles commonly follow “Primary Class - Subclass”; use sentence case for body copy, uppercase for proper names/acronyms, and keep numbers, Greek letters, superscripts, subscripts, and equations aligned on the same line. Use bold or a word-level background highlight for emphasis. + +【Chart Language】 + +The actual chart and diagram types include horizontal process diagrams, document/database pipelines, line charts, same-scale small multiples, horizontal bars, scatter plots + error bars, heatmaps, ablation tables, and comparison tables. Signature feature 1: Split the main visual into 2–6 same-scale panels with shared coordinates. Signature feature 2: Use top and bottom horizontal rules in tables, bold the best value, and place footnotes close to the bottom. Signature feature 3: Use thin black outlines, gray numbered bands, and one-way arrows in process diagrams. Signature feature 4: Direct-label series/key points within trend charts; retain axes, units, and sample definitions. + +【Signature Components】 + +1. Document-to-output mapping diagram: folded-corner paper with black outlines, gray text lines, and sparse color highlights, with 1–3 light-gray curved lines connecting output icons; at most one set per slide. One purple-gray outlined callout bubble may explain a single piece of evidence. +2. Goal banner/matrix: a sky-blue rounded banner with a line-art diamond at the left; below it, add a gray baseline/gap band and four columns of pale-blue cells, with a blue-gray vertical sidebar and checkmarks/plus signs where needed. Use only for goals, stage checks, and completion status. +3. Evidence labels: thin-outlined teal-green rounded labels beneath the chart, with a document icon on the left and a short bold name/number on the right; at most two per slide. +4. Navigation footer: section names, dot progress, page number, and date; show the current section in black and the rest in light gray. +5. Bullets: use solid teal-green squares in different sizes for the first and second levels, with bold group headings; do not mix them with circles or checkmarks. + +【Prohibited】 + +1. Do not use large teal-green/sky-blue backgrounds, gradients, shadows, or glass effects; sky blue is reserved for goal banners/column headers. +2. Do not use rounded cards without an information purpose, four-way card walls, or heavy borders; reserve rounded corners for the three functional component types. +3. Do not use solid-color chapter slides; chapter transitions must use a thin teal-green outlined rectangle, while content-slide titles remain at the upper left. +4. Do not omit the navigation footer from standard content slides; chapter covers, matrix openers, and acknowledgments are exceptions. +5. Do not place multiple high-saturation accent colors side by side; yellow marks only one focal point, red marks only errors/risks, and line art must not become skeuomorphic illustration. + +【Slide Types and Layouts】 + +Narrative summary slide | problem/method/result highlights | 42% list on the left, 48% chart/screenshot on the right | 2–4 blocks | square bullets, document diagram | unsuitable for long tables. +Process method slide | reproducible processing pipeline | horizontal 3–6 nodes across the center, with a numbered band along the top edge | 1 main diagram + 3–6 nodes | gray numbered band, line art | unsuitable for stacking conclusions. +Results chart slide | trends, comparisons, ablations | one chart/table occupies 45–60%, with 2–3 interpretation points on the left | 1 primary evidence object | fixed series colors, best value in bold | unsuitable for a second large chart. +Goal matrix slide | multidimensional goals and stage acceptance | banner at approximately 10% across the top, four-column grid + left vertical sidebar | 4 columns, 4–5 status rows | sky-blue banner, blue-gray sidebar | unsuitable for free-form narrative. +Chapter transition slide | start of a new section | only a centered outlined title frame with generous whitespace on all sides | 1 title block | teal-green outlined rectangle | unsuitable for body evidence. + +【Density Baseline】 + +A standard “list + visual” slide contains 2–4 blocks: 2–3 groups of key points on the left and 1 chart/table on the right; each group contains 2–4 bullets, each approximately 8–22 words/characters equivalent. A process slide contains 1 main flow, 3–6 nodes, and 0–1 callout. A chart slide typically contains 1 chart/table; same-scale small multiples contain 2–6 panels, with labels only on key bars/points. A matrix slide uses a fixed four-column grid, with 1–2 short statements or 1 status symbol per cell and no more than 5 rows. Explanatory blocks span 2–4 lines, each approximately 12–28 words/characters equivalent; place 1–2 lines of footnotes close to the chart or slide bottom. Preserve whitespace between the title and body, around the main visual on the right, and throughout chapter transition slides. diff --git a/skills/open-kimi-ppt/reference/design_system/academic/wine-red-data/design.md b/skills/open-kimi-ppt/reference/design_system/academic/wine-red-data/design.md new file mode 100644 index 0000000..5f326b1 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/academic/wine-red-data/design.md @@ -0,0 +1,62 @@ +# Wine Red Data · Academic STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum Standard) + +A rigorous, formally typeset academic presentation benchmarked against top-tier research talks and thesis defenses (at the standard of NeurIPS/CHI/SIGGRAPH main conferences), where clarity of argument takes precedence over decoration. This deck must read as a reproducible scientific claim, not as marketing collateral. Use academic language throughout: standard terminology for research questions, hypotheses, evidence, significance, contributions, and limitations, with no marketing language or business jargon. Shift the visual emphasis by discipline: theoretical work should devote substantial space to equations and proof steps; computer science and engineering should be structured around system diagrams, code, execution traces, and performance curves; experimental research should tightly organize equations, charts, and images around a single conclusion; and humanities and social sciences should layer archival materials, maps, manuscripts, and other textual evidence with a sense of narrative, without compromising academic rigor. + +Content and layout: +1. Use a fixed argumentative structure: Research Question → Gap in Related Work → Data and Methods → Main Results → Ablation/Analysis → Limitations → Future Work. A short deck may compress this structure, but must not change the sequence. +2. Evidence-first slides: results tables must include baseline comparison columns, comparison charts, and architecture/process diagrams; core contributions must be expressed through formally typeset equations. +3. Moderate information density: one argument per slide, with evidence organized around that argument. Slides should be composed, not filled—whitespace is a legitimate way to separate stages of the argument. + +Visual style: +1. Aesthetic: plain, precise, and scholarly. Do not use promotional copy, decorative photography, or clip-art icons. +2. Typography: use a clear sans serif for body text and labels (render with Liter / Chinese: MiSans); titles may use a serif when the source style does. Equations must be formally typeset (KaTeX quality), with correct equation numbering and italic treatment for variables. +3. Color: use a two-color system for each deck—one primary structural color plus one accent, with gray carrying hierarchy; use a white or near-white background; use only one consistent warning color for negative results or ablation signals. +4. Graphics: use thin, precise vector lines for diagrams; minimal horizontal rules for tables; and axis labels, units, and sample definitions for charts. Do not use 3D, shadows, or gradients as decoration. + +Structure and discipline (derived from work we recognize as benchmark quality): +1. Every content-slide title must state an argument—a finding, not a section label: “Attention Lapses Can Be Predicted 10 Seconds in Advance,” not “Experimental Results.” The evidence supporting that argument follows on the same slide. +2. Claim–evidence alignment: every quantitative conclusion on a slide must be supported on that same slide by a chart, table, or cited result. No orphan numbers. +3. The main results table must include baseline comparison columns and mark the best value; show relative improvement alongside absolute values. +4. Method slides must include the information needed for reproducibility: data scale, annotation protocol, inter-annotator agreement, and key hyperparameters. Show only the core idea as an equation; move derivations to appendix slides. +5. Every figure must be self-contained: include axis labels with units, a legend or direct labels, and a caption area stating sample size and confidence basis. Figures must not rely on legends alone. +6. Ablations and limitations are mandatory slides, not optional ones: ablations isolate the contribution of each component; limitations candidly state scope of applicability, failure modes, and ethics/de-identification status. +7. Every number must include its unit, time range, dataset, and statistical basis (mean ± variance, sample size); express uncertainty through observable quantities or confidence intervals, never vague wording. +8. Open with the problem statement plus a one-sentence contribution; close with numbered conclusions—claims, not a summary—and an explicit list of open questions. +9. Citations appear as compact footnote lines at the bottom of the slides where they are referenced; do not create a full-slide wall of dense references unless the genre requires it. + +Default baseline (derived from the layout skill; PART B may override): Organize each slide around one evidence unit (figure/table/equation); give charts complete axis labels, units, and sample definitions; keep charts honest by avoiding truncated vertical axes that exaggerate differences, and distinguish correlation from causation explicitly in the copy; ensure projection readability, with body text at ≥14pt equivalent and chart labels at ≥10pt equivalent on a 960×540 canvas. + +**Title read-through test**: Reading only the slide titles should tell the complete story. If the sequence does not flow, the structure has not been established. + +Density anchor: The specific minimum standard for each style—the number of evidence modules and charts per slide, plus annotation conventions—is defined by that style’s 【Density Baseline】 reverse-engineered from the source deck. This baseline does not impose a uniform number. + +### Global Prohibitions (Default AI Patterns · Mandatory) + +1. **No default card layouts**: Unless the user explicitly requests them, never use rounded rectangles or rectangular cards to create hierarchy or alignment. Containers with a genuine information function—status indicators, assumption boxes, and quotation frames—do not count as cards. Rules, whitespace, type size, and weight contrast are preferable. +2. **No equal-split compositions**: Unless no other layout is viable, do not default to equal thirds, equal quarters, or two-by-two matrices. Equal splits must be justified by the content structure—three scenarios naturally warrant three columns; frameworks explicitly named in the content are exempt. +3. **No arbitrary AI-default color schemes**: Institutionally specified palettes in the body are exempt. What is prohibited is a generic, commonplace, unjustified default palette—blue-purple gradients, cyan-purple neon, rainbow glows, glass cards, and luminous borders. +4. **No elements inconsistent with the overall style**: Do not introduce out-of-style treatments—for example, rounded icons or rounded rectangles in a sharp-edged visual system. +5. **Keep chart backgrounds transparent**: Use transparency or the slide background, except for reversed-out charts on dark backgrounds. +6. **No empty regions**: Do not leave large blank areas in the body-content region. Every planned area must be filled with real content; an unfilled region is the most serious form of roughness. + +## PART B — Signature System (Template-Specific Signature; This Section Prevails in Case of Conflict with PART A) + +One-sentence style signature: predominantly white-background academic lecture notes, with black type accented by wine red and purple-orange; full-slide solid-color chapter transitions; and information consistently resolved into “argument—evidence—source.” + +【Color Palette】The source deck uses “white-background content + sectional reskinning.” Background #FFFFFF (approximately 108/150 slides); chapters may use full-slide #820000 wine red (approximately 7 slides); covers and contents pages often use #F3F3F3 (approximately 13 slides); a standalone subsection later in the deck uses a #FFEFD9 cream background with #004032 dark-green text (approximately 13 slides), never mixed with wine red on the same slide. Primary text #000000; title purple #4F0E86 is reserved for openings/navigation; primary accent orange #E69138 is used for keywords, numbers, and arrows and occupies no more than 10–15%; fluorescent yellow #F7D05B (approximate) is used only for short horizontal brush strokes. Common chart-series colors are #0076BA, #00A2FF, #56C1FF, #D2C7EB, and #A9AAAC, with gray as the baseline; positive #00B050 and negative #FF0000 convey status only. Keep table backgrounds white or light gray; do not invent additional colored fills. Use 2–3 hues per slide, and never let the accent color fill the entire slide. + +【Layout Skeleton】Source-deck specifications: 720×405 pt, approximately 1100×619 px, 16:9. Place content-slide titles at top left with a left margin of approximately 4–6%. The body typically uses a 40/60 or 50/50 two-column split, with the main chart, screenshot, definition box, or table in the right column. Separate modules with whitespace and fine rules; a single gray source line often runs along the bottom, while slide numbers are not fixed throughout the deck. Special slides include centered chapter titles on light gray/light purple, full-slide declarations in wine red/black/dark green, and numbered contents pages whose current item is marked with a yellow brush stroke or colored capsule; these treatments are for transitions only. The reading path is title conclusion → chart/process → explanation → source. Reskinning applies continuously across an entire section and must not be mixed within a single slide. + +【Typography】PDF measurements show section-specific combinations: standard slides primarily use ArialMT/Arial-BoldMT, with OpenSans/Roboto appearing at the beginning; use Consolas for code; and SpaceGrotesk + Jomolhari in the later cream-colored subsection. When only slide images are available, do not guess font families; preserve the sans-serif/serif relationship. Body = 1x, titles 1.6–2x, large chapter text 2.3–3.4x, large numbers 1.4–2x, and footnotes 0.5–0.7x. Set titles in bold; keywords may use bold or italic orange/red. Use sentence case for body copy and all caps for short labels when appropriate; keep numbers and English abbreviations aligned to the baseline, and preserve formal equation typesetting. Render with {latin: Liter, ea: MiSans}; use JetBrains Mono for code (via customFonts). + +【Chart Language】Observed in the source: bar/line/scatter charts and dot distributions, radar charts, comparison tables, equation-definition tables, closed-loop processes, and screenshot comparisons. ⭐Signatures: ① The title states the conclusion first, and the chart only proves it; use one orange or wine-red series as the focal point and render the rest in gray/low-saturation blue (20+ slides). ② Show methods as horizontal steps or closed-loop arrows, with lightly filled nodes and thin black lines (15+ slides). ③ Place definitions/quotations in light-gray or pale-yellow rounded boxes beside the main figure (10+ slides). ④ Use human figures or dot arrays converging on a conclusion box to represent population distributions (approximately 8 slides). ⑤ High-density tables use only fine horizontal rules, equation columns, and a source line at the bottom (approximately 6 slides). + +【Signature Components】Apply the yellow brush stroke only to the current contents item or a key short phrase; keep it short and horizontal (approximately 3–4 instances). A full-slide wine-red declaration uses large white type for transitions and carries no data (approximately 7 slides). Rounded quotation/definition boxes hold direct quotations, measurement definitions, or status, with no more than 2–3 per slide. Red/orange outlines, strike-through lines, and arrows attach only to the marked object. Human/robot and similar icons serve only as process nodes or population glyphs. Photographs/screenshots must sit in a distinct frame with an explanation and must not be used as backgrounds. + +【Prohibited】Do not stack rounded cards without an information function; do not use glass effects, gradients, or luminous borders. Rounded containers are reserved for quotations, definitions, status, and process steps. Do not mix decorative colors; retain only one primary accent color per slide. Do not use full-slide hand-drawn textures or substitute strike-through marks for argumentation. Photographs/screenshots/illustrations may support evidence or a special cover, but must not become the default background. Do not center long passages of body text. Full-slide wine-red, black, dark-green, and cream reskinning must not jump between colors within the same chapter. + +【Slide Types and Layouts】Argument–evidence two-column|One conclusion + explanation/source|Left 40–45% text, right 55–60% chart/screenshot|2–4 blocks|Keyword color, quotation box, source line|Not suitable for multiple equally weighted conclusions. Process/closed-loop diagram|Method, lifecycle, causal chain|Central 60–70% graphic with explanations on both sides|1 main diagram, 4–10 nodes|Semantic arrows and role glyphs|Not suitable for a pure literature list. High-density data/definition slide|Table + equation or multiple metrics|35–45% table, 55–65% chart/definition box|1–2 main charts or 1 table + 1 chart|Fine horizontal rules, single-series highlight|Not suitable for numbers without measurement definitions. Large-type viewpoint/chapter slide (special)|Transition/strong judgment|Full-slide 80–90% text, 0–1 metadata item|1 statement|Solid color or whitespace|Not suitable for body evidence. Contents/navigation slide (special)|Section transition|Numbered list covering 60–80%, 3–5 items|Current-item brush stroke/capsule|Not suitable for chart explanation. + +【Density Baseline】There is no uniform minimum across the full deck. Two-column content slides typically contain 2–4 evidence blocks, 0–2 charts, and 1–3 explanation blocks, each approximately 20–60 words/characters equivalent; place whitespace between the title and evidence group and at the two-column divide. Process slides use 1 main diagram, 4–10 nodes, and 2–6 arrows. Table slides use 1 main table + 1 equation/conclusion box, with numbers right-aligned, text left-aligned, and 1–2 footnote lines; multi-chart slides use 2–4 small charts, label only key values, and do not crowd every bar with labels. Viewpoint slides contain only 1 statement of approximately 20–60 words/characters equivalent, while source notes still sit at the bottom. Close the “title—evidence” loop first, then move remaining copy down into the source line. diff --git a/skills/open-kimi-ppt/reference/design_system/consulting/apricot-white-brief/design.md b/skills/open-kimi-ppt/reference/design_system/consulting/apricot-white-brief/design.md new file mode 100644 index 0000000..16df76c --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/consulting/apricot-white-brief/design.md @@ -0,0 +1,84 @@ +# Apricot White Brief · Consulting STYLE DESIGN SYSTEM + +**Create at Full Strength**: Bring your full creativity and imagination to the work. Treat every slide as an independent, complete design artifact worthy of close consideration. Structure, composition, charts, imagery, and visual storytelling must all be driven by the content; do not default to preset layouts. + +**No AI Slop**: Do not produce low-judgment, templated, decoration-heavy AI defaults, including unjustified card arrays, evenly divided grids, arbitrary blue-purple gradients or glassmorphism, icon walls, empty oversized text, repetitive skeletons, or visual gimmicks unrelated to the content. Every slide must reflect a clear design decision grounded in the content. + +**Landscape Delivery**: The final presentation must use a consistent 16:9 landscape format. Portrait or non-16:9 source material may be used only as a style reference; it must be recomposed for 16:9 landscape and must not retain the original canvas ratio. + +**Layout Coordination**: style.md is the final authority on style (typography/color palette/components/chart language/prohibited elements); the “Layout/Visual Task” line for each slide in query.md governs that slide’s content structure, primary anchor, and reading order. Both are execution requirements: follow the task line in query.md for layout intent, and style.md for the final visual treatment. +### Global Prohibitions + +1. **Do Not Use Cards by Default**: Unless the user explicitly requests them, never use rounded rectangles or rectangular cards to create hierarchy or alignment. Functional containers such as status indicators, assumption boxes, and quotation frames are not considered cards. Lines, whitespace, type size, and weight differences are preferred. +2. **Do Not Use Evenly Divided Compositions**: Unless no viable alternative exists, do not default to three equal columns, four equal columns, or a 2×2 grid. Equal division must be justified by the content structure (three scenarios naturally support three columns; frameworks explicitly named in the content are exempt). +3. **Do Not Use Arbitrary AI Color Schemes**: Institution-specific palettes named in the content are exempt. What is prohibited is any generic, familiar, or ungrounded default palette, including blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **Do Not Introduce Elements That Conflict with the Overall Style**: Never use styles outside the system—for example, rounded icons or rounded rectangles within a sharp-edged visual language. +5. **Keep Chart Backgrounds Transparent**: Use transparency or the page background, except for reversed charts on dark backgrounds. +6. **Use Large Areas of Whitespace Carefully**: Maintain appropriate density in the body area. Diluting sparse content into an artificially crowded slide is a defect. Whitespace used for breathing room, grouping, and rhythm is permitted; form must follow content, and nothing should be forced in merely to fill space. + +## PART A — Category Baseline (General Minimum Standard) + +A professional, high-density consulting presentation benchmarked against top-tier strategy firms (McKinsey/BCG), with the sensibility of premium editorial publishing. + +Content and layout: +1. Rich data visualization: slides are filled with complex, precise charts (stacked columns, waterfalls, and line charts) and detailed data tables with complete rows and columns. +2. Structured frameworks: include strategy maps or 2×2 matrices constructed with fine, crisp lines. +3. High information density: use complex, multi-column layouts that resemble real business-analysis presentations rather than cover slides dominated by whitespace. + +Visual style: +1. Aesthetic: balance a technology-forward sensibility with substantial information density. Clean, clear, and authoritative. +2. Typography: use a bold sans serif for primary titles; chart labels and numerical data use the same sans family. +3. Color: pure white background and pure black text; use deep royal blue for charts and graphic elements, with varying gray values to establish hierarchy. +4. Graphics: use fine borders for tables and precise vector lines for charts. + +Structure and discipline (distilled from work we consider exemplary): +1. Every body slide title must be a complete assertion—a conclusion sentence—with a one-line scope/methodology subtitle beneath it explaining what the slide covers and how to read it. +2. Every body slide includes a chapter breadcrumb/tab bar with the current chapter highlighted, so any individual slide can be located within the narrative. +3. Use one named analytical framework per slide, never a loose collage: a pressure-convergence bar, a phased timeline with a TODAY marker and stage gates, a three-scenario table (conservative/base/accelerated), a Five Forces diagram, a heat table, a difficulty × impact 2×2 with an observation zone, a three-stage upstream/midstream/downstream value chain, or a multidimensional profile matrix—select the framework according to the content. +4. Present parallel evidence in 2–3 equal-width columns. Number independent judgments (1/2/3), each with a bold assertion line and one concise explanation. +5. Chart annotation discipline: place data labels on marks, add growth/level callouts (for example, “+42% p.a.”), include a TODAY marker, use dashed lines for forecasts, and pair uncertainty with named observable indicators. Never rely on the legend alone to explain a chart. +6. Close most slides with a synthesis strip at the bottom (“How to read this slide” / “Profile interpretation” / a one-sentence so-what) that converts the evidence above into a single takeaway. +7. Fixed three-part page furniture: source/footnote line at bottom left and page number at bottom right. Never omit these elements or use them decoratively. Generated decks must never include watermarks, confidentiality statements/stamps, copyright lines, or logo placeholders. +8. Open with a one-slide executive summary and a numbered, paginated table of contents. Close with numbered conclusions (claims, not summaries) and a implications slide organized by reader type (for example, policymakers/operators/buyers), with each column ending in an action. +9. Every number must include its unit, time range, and basis of calculation. Express uncertainty through monitorable indicators, not hedging language. + +Default baseline (distilled from the layout skill; PART B may override): body slides use high-density, multi-column layouts and contain at least one complex chart or one multi-row, multi-column data table. Never use “one oversized sentence + vast whitespace” as a body slide. Build framework diagrams (strategy maps/2×2 matrices/driver trees) with fine, crisp vector lines rather than stacked color blocks. Use fine table borders without heavy fills, and limit the primary hues on any slide to ≤2. + +> Priority note: This section defines the minimum baseline for consulting use cases. Where it conflicts with the signature system below (PART B), the signature system takes precedence—especially for backgrounds, color, and typography. The typography and color requirements above apply as defaults only where the signature system is silent. + + +## PART B — Signature System (Distinctive Signature of This Template; Overrides PART A in Case of Conflict) + +One-sentence style signature: the restrained authority of an editorial report on white paper, with black serif body text carrying long-form content, vivid red marking judgments and focal points, and charts rendered primarily in grayscale—high in information density, yet disciplined in its use of whitespace. + +【Color Palette】 + +Background #FFFFFF: pure white across the full slide, with no separate fills behind charts or body text; primary text #000000: body copy, main titles, and axis text, covering the vast majority of the text area; titles #000000: keep chapter/article titles black, while changing contents/figure numbers and occasional chapter cues to #CC0000; primary accent #CC0000: use only for figure numbers, chapter cues, pull quotes, and fine rules, limited to small areas of text and lines—never as a full-slide fill; secondary #231F20: subtitles, chart notes, and secondary labels, softening the black text; chart series colors use #CC2027 for the focal series, #F16667 for the lighter tier, and #991B1E for the darker tier, while #D1D3D4, #99999A, #808285, and #58595B represent background/historical/secondary series in grayscale. Apply these colors only to bars, ranges, or marks. When a third series is occasionally required, select one set from blue-grays #506E86, #748B9E, #95A6B5 or magenta-reds #B86E9B, #A33D7A, #891D5A. Positive/negative colors: the source does not establish stable dedicated colors; retain #231F20 for positive/negative signs and the zero line, while #CC2027/#991B1E communicate series hierarchy only. By default, each slide should contain only black, gray, and one red focal set; never flood the slide with the accent color. + +【Layout Skeleton】 + +Source facts: the canvas is 612×792, a 0.773:1 portrait format. On non-section pages, a centered running short title sits at the top, followed by a fine gray rule and the centered short report name; left and right body margins are approximately 12%, and the page number is always centered at the bottom. Chart pages begin with a red-and-black caption comprising a “figure number + complete judgment sentence,” followed by a bold chart subtitle, the visualization, and Notes/Source immediately beneath it. The default reading path is judgment sentence → chart → direct labels → methodology. Article-opening pages instead use photography across approximately the upper 1/3, with a white title panel overlapping the lower edge of the image; the title/subtitle/author and “Key Takeaways” are followed by body copy. The cover retains only a large photograph and the red report name below, without the body-page header. 16:9 migration: retain the pure white background, top running short title + fine rule, bottom-centered page number, red-and-black captions, and the “chart—methodology” sequence. Do not stretch the portrait single-column layout horizontally; recompose chart pages as two columns or a 60% primary chart + 40% explanation, and place two charts side by side where appropriate. On article-opening pages, recompose the photograph as a horizontal top band approximately 30–33% high, retain the white title panel overlapping its lower edge, and set long-form copy in two columns to preserve reading density. The final landscape format must be 16:9; do not treat the source portrait ratio as a prohibited characteristic. + +【Typography】 + +Verified source fonts: the PDF embeds the serif TiemposText-Regular (body copy) and the sans-serif Graphik-Regular / Light / Medium / Semibold (titles, charts, and navigation). Body copy supports long-form reading. Section/article titles use Graphik Medium, clearly stronger than the body yet contained by the title panel. Section subtitles and subheads are only slightly stronger than the body. Red pull quotes and KPI numbers may become local focal points, while chart labels, secondary notes, footnotes, sources, and the running short title recede in that order. Use title case for section names and captions, and sentence case for body copy. Captions begin with a red figure number followed by a black complete judgment sentence. Retain units such as %, $, and B; write the first year on the x-axis in full, with later years optionally abbreviated. In 16:9 landscape, do not carry over the source's serif body: follow the reference output and use sans serif throughout (render with {latin: Liter, ea: MiSans}), preserving the weight relationships but not the source’s absolute type sizes or scaling ratios. + +【Chart Language】 + +Observed in actual use: single- and multi-series column charts, stacked columns and 100% stacked columns, line charts, column-line combinations, quantile range/distribution charts, waterfall/driver decompositions, donut proportions, and side-by-side KPIs. No consistent standalone data-table treatment was observed; inherit table requirements from PART A. ⭐Fix the caption format as “red figure number + black complete judgment sentence,” followed by a bold metric name, and repeat this system throughout chart slides; ⭐use #CC2027/#F16667 for the focal period or series, push historical context into grayscale, and directly label line ends, bar tops, quantile points, and key deltas wherever possible rather than hiding meaning in a legend; ⭐a slide often links 2 vertically stacked charts into an evidence chain, with each chart retaining its own title and Notes/Source, and with modules separated by whitespace rather than cards; ⭐a waterfall or distribution chart may be paired with a percentage ring, zero line, or quantile marker to explain “contribution/range”; occasional use: a five-column oversized-number KPI strip, with red numbers above and black descriptions below. + +【Signature Components】 + +Running header framework: on non-section pages, the top contains only one centered short title, one fine gray rule, and the short report name; the footer contains only one centered page number. Caption lead-in: each chart module may use no more than one red figure number, followed by a black assertion sentence; do not repeat an oversized title inside the chart. Pull-quote block: approximately 8 narrative pages use a prominent red, left-aligned statement with one fine light-red #F16667 rule above and below, appearing only once at a turn in the narrative. Takeaway triangle marker: on section-opening pages, each “Key Takeaways” item begins with a small red triangle, typically 3 items; do not carry this device into standard data slides. Photography is a hard constraint: the cover and 6 section-opening pages use landscape photography; on section pages, the image occupies approximately the upper 1/3 and a white title panel overlaps its lower edge, while the cover photograph is inset with whitespace. On chart and long-form pages, never substitute photography for evidence or allow it to overlap body copy. A side-by-side KPI strip may be used occasionally, but it is not a fixed component on every slide. + +【Prohibited】 + +On body/chart slides, do not use full-bleed photography, text over photography, or full-image backgrounds; photography belongs only on the cover and section-opening pages. Do not use centered long-form quotations or black poster-style declarations. For emphasis, use left-aligned red text with two fine rules above and below, while retaining the surrounding context. Use multiple groups of colored series, gradients, and glow effects sparingly in charts. The source prioritizes grayscale comparison with a single red focal color; enable a third color group only when the data truly contains a third dimension. + +【Slide Types and Layouts】 + +Photographic section opener|Best for a section thesis or case introduction|Photograph across the upper 30–33%, with a white title panel overlapping the lower edge; subtitle, author, 3 takeaway items, and 3–4 body paragraphs below|Approximately 8–10 independent blocks|Photographic title panel, red-triangle takeaways|Not suitable for dense charts. Multi-chart argument slide|Best for multiple mutually reinforcing quantitative judgments|Caption occupies approximately the top 12%; the remainder contains 2 vertically stacked chart areas, each approximately 35–40%, with Notes/Source beneath each chart|2–5 chart modules|Red number + black sentence, direct labels, gray-and-red series|Not suitable for long explanations. Chart + narrative slide|Best for one primary piece of evidence leading into explanation|Chart occupies approximately the upper 35–45%; the lower 45–55% contains 3–5 paragraphs of serif body copy|1 primary chart + 4–6 paragraphs|Caption and methodology block|Not suitable for laying out multiple independent conclusions. Long-form narrative slide|Best for mechanisms, context, and case walkthroughs|Single-column body copy approximately 76% wide, with an optional red pull quote inserted mid-page|5–8 paragraph blocks|Running header, fine rules around the pull quote|Not suitable for displaying a single isolated number. KPI statistics strip (occasional)|Best for rapid horizontal comparison|5 metrics across the top, with 3 explanatory paragraphs below|7–8 independent blocks|Oversized red numbers, short underlines|Not suitable for complex causal relationships. + +【Density Baseline】 + +Source chart pages typically contain 2–5 chart panels. Each panel includes 1 red-and-black judgment sentence, 1 bold metric name, several direct numerical labels, and 1 small Notes/Source block. Label bar tops, line ends, and key quantile points individually wherever possible. Explanatory copy typically comprises 0–2 blocks, each approximately 50–180 characters or an equivalent amount of text. Long-form pages usually contain 5–8 paragraphs of approximately 2–6 lines each; pull-quote pages insert 1 red judgment block of roughly three lines between body paragraphs. Section-opening pages consistently contain 3 takeaway items + 3–4 body paragraphs; occasional KPI pages contain 7–8 short metric blocks plus 3 explanatory paragraphs below. Whitespace should appear primarily between the header and the first chart, between vertically stacked charts, between charts and Notes/Source, and around the footer. It must not create large, contentless holes in the center of the body area. When generating new material, fill these evidence modules first, then use spacing between modules to control breathing room. diff --git a/skills/open-kimi-ppt/reference/design_system/consulting/indigo-due-diligence/design.md b/skills/open-kimi-ppt/reference/design_system/consulting/indigo-due-diligence/design.md new file mode 100644 index 0000000..12be628 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/consulting/indigo-due-diligence/design.md @@ -0,0 +1,67 @@ +# Indigo Due Diligence · Consulting STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum) + +A professional, information-dense consulting presentation benchmarked against top-tier strategy consulting firms (McKinsey/BCG), with a premium editorial aesthetic. + +Content and layout: +1. Rich data visualization: Pages are filled with sophisticated, precise charts (stacked columns, waterfall charts, line charts) and detailed data tables with complete row and column structures. +2. Structured frameworks: Include strategy maps or 2×2 matrices built with fine, crisp lines. +3. High information density: Use complex, multi-column layouts that resemble real-world business analysis presentations rather than cover pages dominated by empty space. + +Visual style: +1. Aesthetic: Balance a technology-forward feel with information density. Clean, clear, and authoritative. +2. Typography: Use a serif typeface for primary titles (render with {latin: Oranienbaum, ea: 思源宋体}) to evoke a premium financial-report aesthetic; use a clean sans serif for chart labels and data figures. +3. Color palette: Pure white background and pure black text; use deep royal blue for charts and graphic elements, with different gray values to distinguish hierarchy. +4. Graphics: Use fine borders for tables and precise vector lines for charts. + +Structure and discipline (distilled from work we consider best-in-class): +1. Every content slide title must be a complete assertion (a conclusion statement), followed by a one-line scope/method subtitle explaining what the slide covers and how to read it. +2. Every content slide must include a chapter breadcrumb/tab bar with the current chapter highlighted, so any slide can be located within the narrative. +3. Use one named analytical framework per slide, never a loose collage: pressure columns, phased timelines with a TODAY marker and stage gates, three-scenario tables (conservative/base/accelerated), Five Forces diagrams, heat tables, difficulty × impact 2×2 matrices (with an observation zone), three-part upstream/midstream/downstream value chains, or multidimensional profile matrices—select the framework to fit the content. +4. Present parallel evidence in 2–3 equal-width columns; number independent judgments (1/2/3), each with a bold assertion line + one concise explanation. +5. Chart annotation discipline: Place data labels directly on marks; add growth/level callouts (such as “+42% p.a.”), a TODAY marker, dashed lines for forecasts, and named observable indicators for uncertain quantities. Never rely on the legend alone. +6. Conclude most slides with a synthesis bar at the bottom (“How to read this slide” / “Profile interpretation” / a one-sentence so-what) that converts the evidence above into a single takeaway. +7. Fixed three-part slide furniture: source and footnote lines at bottom left, page number at bottom right; never omit these or treat them as decoration. Generated decks must never include watermarks, confidentiality notices/stamps, copyright lines, or logo placeholders. +8. Open with a one-slide executive-summary overview + a numbered table of contents with page numbers; close with numbered conclusions (claims, not summaries) + an implications slide divided by audience type (such as policymakers/operators/buyers), with each column ending in actions. +9. Every number must include its unit, time range, and measurement basis; express uncertainty through observable monitoring indicators rather than hedging language. + +Default baseline (distilled from the layout skill; PART B may override): Content slides use information-dense, multi-column layouts and must contain at least one complex chart or one multi-row, multi-column data table. Never use “one oversized sentence + a large empty area” as a content slide. Build framework diagrams (strategy maps/2×2 matrices/driver trees) with fine, crisp vector lines rather than stacked color blocks. Tables use fine borders without heavy fills; limit each slide to ≤2 primary hues. + +**Title read-through test**: Reading only the slide titles should tell the complete story; if they do not flow coherently, the structure has not been established. + +> Priority note: This section defines the minimum baseline for consulting scenarios. Where the signature system below (PART B) conflicts with it, the signature system takes precedence—especially for background, color palette, and typography. The typography/color guidance above applies only as a default when the signature system is silent. + +### Global Prohibitions (AI Default Patterns · Mandatory) + +1. **No cards by default**: Unless the user explicitly requests them, do not use rounded rectangles or rectangular cards to establish hierarchy or alignment—containers with a functional information role (status indicators, assumption boxes, quotation boxes) do not count as cards. Lines, whitespace, type size, and weight contrast are preferred. +2. **No equal-split compositions**: Unless no other layout is viable, do not default to three equal columns, four equal columns, or a two-by-two matrix. Equal division must be justified by the content structure (three scenarios naturally warrant three columns; explicitly named frameworks in the body are exempt). +3. **No arbitrary AI color palettes**: Institution-specific palettes defined in the content are exempt. Prohibited choices are bland, common, unsupported defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **No elements inconsistent with the overall style**: Do not introduce off-style treatments, such as rounded icons or rounded rectangles in an angular visual system. +5. **Keep chart backgrounds transparent**: Use transparency or the slide background color, except for reversed content on a dark background. +6. **No empty content regions**: Do not leave entire planned regions blank; every allocated area must be filled with real content. Failure to fill a region is the most severe form of visual roughness. + +## PART B — Signature System (Distinctive Template Signature; Overrides PART A in Case of Conflict) + +One-sentence style signature: A white and cool-gray foundation, deep navy, and royal blue create a composed due-diligence tone; serif conclusion titles, sans-serif data, and a right-side judgment panel connect dense evidence into one clear path. + +【Color Palette】#FFFFFF for content backgrounds; #E5E6E5 only for the right half of contents slides / right-side judgment panels. Text and titles use #000000. Primary accent #2151FF highlights selected columns, key figures, and target boxes; secondary accent #00A9F4 highlights active navigation and secondary series. Structural dark #041C2C is used for chapter bands, sidebars, numbered circles, and table headers; supplementary series colors are #282C70, #99C4FF, and #B2B3B2. Positive #2151FF (upward icons may occasionally use #92D050), negative #E4536C; reserve #FF0000 for warnings only. Use black/gray + 1 blue hue per slide, with no more than 3 blue steps; never flood the slide with accent color. + +【Layout Skeleton】Source canvas: 1467×825 pixels, 16:9. Content slides typically use a left evidence area of 64–72% + a right judgment panel of 28–36%. Place a serif assertion title at top left, a sans-serif scope line beneath it, then charts/tables below a horizontal rule. Beneath a fine bottom rule, place footnotes at left and institution text plus page number at right. Reading order: title → scope → left-side evidence → right-side judgment → so-what. Contents slides always use a white left side and gray right side, with a deep-navy horizontal band on the right highlighting the current number. Chapter transitions with a deep-navy left panel + white chart area on the right are reserved for special slides. + +【Typography】Only the combination of bold, high-contrast serif titles + neutral sans-serif body/data has been verified; the font families cannot be confirmed. Render with {latin: Oranienbaum, ea: 思源宋体} (serif titles) and {latin: Liter, ea: MiSans} (sans body/data). Scale: body 1x, subtitle 1.1–1.25x, title 1.8–2.2x, large figures 1.4–1.8x, footnotes 0.55–0.65x. Figures must include unit/period; distinguish actual/estimate with A/E, lighter tones, or dashed lines. Chinese and English abbreviations may be mixed; do not set titles in all caps. + +【Chart Language】Repeatedly use stacked columns, dual-axis lines, waterfall charts, heat tables, ranking bars, scatterplots, donut charts, flows, and fine-bordered tables. ⭐Above trend columns, draw a black diagonal arrow labeled “+x% p.a.”; use 4–6 blue steps in heat tables and outline target rows/columns in pink. Use lighter tones/dashed lines for forecasts; apply a pale-blue row fill or pink outline to the entire target object. Call out key points with leader lines/ellipses/dots. Present expert evidence with round quotation marks + italicized quotations. Write values directly inside charts; legends must not carry the conclusion. + +【Signature Components】Place a numbered circle (#041C2C fill, white text) at the far left of the title, typically 1 per slide. On sequential detailed customer-profile slides, arrange five navigation pills horizontally across the top, with only the active item highlighted in bright cyan-blue. The right-side gray judgment panel sits flush to the edge at approximately one-third of the slide width and contains 2–4 takeaways/quotations. Use deep-navy, square-cornered label blocks for profile, SWOT, and risk-table row labels. Use fine-bordered elliptical pills for percentages/CAGR, no more than once per metric. The source material does not rely on photography; do not add photos. + +【Prohibited】No blue-purple gradients, neon, or rainbows; do not expand gray panels into a full-slide card wall; do not mix multiple blue palettes without a legend; do not replace square-cornered headers/fine rules with rounded cards (navigation pills are exempt); do not turn the right panel into a second main chart or use color blocks that obscure data. Use red sparingly and only for warnings; all other prohibitions inherit from PART A. + +【Slide Types and Layouts】 +Conclusion + main chart + gray panel|Trend/share/profitability|Left 64–72% chart, right 28–36% judgment|4–8 blocks|Diagonal arrow/elliptical value/quotation|Not suitable for a single small table. +Detailed customer profile|Single-entity relationships/metrics|Approximately 50% each side: segmented black table + cyan bars on the left, four rows of mini charts + past/future commentary on the right|8–16 blocks|Five-item navigation/dark labels|Not suitable for an overview. +Heat table/scoring matrix + gray panel|Multidimensional comparison|Left 68–72% matrix, right conclusion|8–12 rows × 6–12 columns|Blue steps + pink target outline|Not suitable for fewer than 4 entities. +Two-column framework/flow|Risks, initiatives, current state—target state|Two/three columns with consistent subheads and fine rules|4–9 blocks|Numbers/arrows/dark headers|Not suitable for a continuous timeline. +Contents/chapter slide (occasional)|Navigation/chapter break|White left + gray right or dark left + white right|1–6 blocks|Split screen/fine rules|Do not place content data. + +【Density Baseline】A standard content slide uses 1 main chart + 2–4 explanatory blocks, with another 2–4 takeaways or 1–3 quotations in the sidebar. Detailed customer-profile slides are denser: 5–7 segmented bars on the left and 4 rows of mini charts on the right, with 2 judgments per row. Heat tables typically contain 8–12 rows × 8–12 columns, with values written in cells and the target column outlined. Label every column/point in column and line charts, place totals above columns, and show CAGR with arrows. Whitespace is permitted only between the title and rule, in the narrow gap between the chart and sidebar, and above the footnote band; do not leave any large blank region in the content area. diff --git a/skills/open-kimi-ppt/reference/design_system/consulting/marine-blue-research/design.md b/skills/open-kimi-ppt/reference/design_system/consulting/marine-blue-research/design.md new file mode 100644 index 0000000..308e8e4 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/consulting/marine-blue-research/design.md @@ -0,0 +1,75 @@ +# Marine Blue Research · Consulting STYLE DESIGN SYSTEM + +## PART A — Category Baseline (Universal Minimum Standard) + +Professional, information-dense consulting presentations benchmarked against the style of leading strategy consulting firms (McKinsey/BCG), with a premium editorial aesthetic. + +Content and Layout: +1. Rich data visualization: Fill slides with sophisticated, precise charts (stacked columns, waterfall charts, line charts) and detailed data tables with complete row-and-column structures. +2. Structured frameworks: Include strategy maps or 2×2 matrices constructed with fine, crisp lines. +3. High information density: Use sophisticated, multi-column layouts that resemble real-world business analysis presentations rather than cover-like slides dominated by empty space. + +Visual Style: +1. Aesthetic: Balance a technology-forward feel with information richness. Keep it clean, clear, and authoritative. +2. Typography: Use a bold sans serif for main titles; chart labels and numerical data use the same sans family. +3. Color palette: Use a pure white background and pure black text; apply deep royal blue to charts and graphic elements, with varying shades of gray to distinguish hierarchy. +4. Graphics: Use thin borders for tables and precise vector lines for charts. + +Structure and Discipline (distilled from deliverables we regard as benchmarks): +1. Every content-slide title must be a complete assertion (a conclusion statement), followed by a one-line scope/methodology subtitle explaining what the slide covers and how to read it. +2. Every content slide includes a chapter breadcrumb/tab bar with the current chapter highlighted, so any slide can be located within the narrative. +3. Use one named analytical framework per slide, never a loose collage: a pressure-convergence column chart; a phased timeline with a TODAY marker and stage gates; a three-scenario table (conservative/base/accelerated); a Five Forces diagram; a heat table; a difficulty × impact 2×2 with an observation zone; an upstream/midstream/downstream value chain; or a multidimensional profile matrix. Select the framework to match the content. +4. Present parallel evidence in 2–3 equal-width columns; number independent judgments (1/2/3), each with a bold assertion line + one brief explanation. +5. Chart annotation discipline: Place data labels directly on marks; add growth/level callouts (such as "+42% p.a."); include TODAY markers; use dashed lines for forecasts; and name observable indicators for uncertain variables. Never rely on legends alone. +6. Conclude most slides with a synthesis strip at the bottom ("How to Read This Slide"/"Profile Interpretation"/a one-line so-what), translating the evidence above into a single takeaway. +7. Three mandatory fixed elements: source/footnote line at bottom left and page number at bottom right; never omit them or treat them as decoration. The generated deck must never include watermarks, confidentiality notices/stamps, copyright lines, or logo placeholders. +8. Open with a one-slide executive overview + a numbered, paginated table of contents; close with numbered conclusions (claims, not summaries) + an implications slide organized by reader type (such as policymakers/operators/buyers), with each column ending in actions. +9. Every number must include its unit, time range, and basis of calculation; express uncertainty through monitorable indicators rather than hedging language. + +Default baseline (derived from the layout skill; PART B may override): Content slides use information-dense, multi-column layouts and must contain at least one complex chart or one multi-row, multi-column data table. Never use "one oversized sentence + a vast empty area" as a content slide. Build framework diagrams (strategy maps/2×2/driver trees) with fine, crisp vector lines rather than stacked color blocks. Limit each slide to ≤2 primary hues. + +**Title Read-Through Test**: Reading only the slide titles in sequence should tell the complete story; if they do not flow coherently, the structure has not been established. + +> Priority note: This section defines the minimum baseline for consulting contexts. Where the signature system below (PART B) conflicts with it, the signature system takes precedence—especially for background, color palette, and typography. The typography/color guidance above applies only as a default when the signature system is silent. + +### Global Prohibitions (AI Default Patterns · Mandatory) + +1. **Do not default to cards**: Unless explicitly requested by the user, do not use rounded rectangles or rectangular cards to create hierarchy or alignment—containers with a functional information role (status indicators, assumption boxes, quotation boxes) are not considered cards. Lines, whitespace, and differences in type size and weight are preferable. +2. **Do not default to equal-split compositions**: Unless no other viable layout exists, do not default to three-way splits, four-way splits, or two-by-two matrices. Equal division must be justified by the content structure (three scenarios naturally require three columns; frameworks explicitly named in the body content are exempt). +3. **Do not use unmotivated AI color schemes**: Institution-specific palettes defined in the content are exempt. Prohibited choices are generic, commonplace, and unjustified defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **Do not use elements that clash with the overall style**: Never introduce out-of-style treatments, such as rounded icons or rounded rectangles within a sharp-edged visual system. +5. **Keep chart backgrounds transparent**: Use transparency or the slide background color, except for reversed charts on dark backgrounds. +6. **Do not leave regions empty**: Do not leave large blank blocks in the content area. Every planned region must be filled with real content; failure to fill it is the most serious form of rough execution. + +## PART B — Signature System (Distinctive Template Signature; This Section Overrides PART A in Case of Conflict) + +One-line style signature: Navy Kaiti-style conclusion statements on white, cyan-blue charts with restrained orange accents, and grayscale still-life photography for chapter breaks; dense multi-column layouts, each ending with a one-line so-what strip. + +【Color Palette】 +Area discipline: Deep blue appears only in selected columns/deep cells; light blue only in matrix cells; gray only as a baseline or neutral block; panel gray only as a banded background; orange only for a single series/numbering; yellow only for inline highlights; and the map color only on maps. +Background #FFFFFF (content-slide background; retain white space in text areas even on photo slides); primary text #000000 (body text/axes); title #00295F (eyebrow/assertion); primary cyan #00ACEE (fine lines/primary series/current chapter, ≤1/4 of area); deep blue #0064BC (secondary series/final value/deep cell); light blue #BEE0FF (low-emphasis cell); gray #D5D6D9 (baseline/other); panel gray #F1F2F1 (synthesis strip); orange #F17E00 (third series/numbering, not for positive/negative meaning); approximations #F2E292 (inline highlight), #C3CFE0 (map). Use cyan/blue for positive values and gray + black arrows for negative values; ≤3 chromatic hues per slide; never use orange as a background fill. + +【Layout Skeleton】 +Source-file specifications: 720×405 pt, 16:9. Cyan eyebrow at top left (8–10 pt) + navy title (16 pt), with a fine cyan rule beneath each module heading; main body in 2–4 columns. On comparison slides, left-side labels occupy approximately 10–15%, with explanations/excerpts on the right. Most slides end with a light-gray so-what strip (cyan label + 2–4 short statements); footer conventions inherit PART A and showed no observed overrides in the source. Do not use a persistent breadcrumb. Chapters are signaled by the eyebrow/chapter-divider slides. Photography is reserved for the cover/table of contents/chapter slides; the table of contents uses five gray bars with the current bar in cyan, and subsections are overlaid with large white rectangles. + +【Typography】 +Source-file specifications: Chinese text uses STKaiti (render with LXGW Bright); Latin letters/numerals use Calibri (render with QuattrocentoSans), with QuattrocentoSans Bold for key figures. Body text 9–10 pt=1x; title 16 pt≈1.6x; short chapter title 12 pt; large figure 16 pt; footnote 8 pt≈0.8x. Titles are left-aligned and may span two lines; percentages, CAGR, and English abbreviations use Calibri. + +【Chart Language】 +Stacked columns (recurring): show shares within columns, totals above columns, and adjacent CAGR capsules. Bridge/waterfall charts (recurring): gray baseline—cyan increment—deep-blue final value, connected with dashed lines, with the change value attached to the endpoint. Blue-scale matrices (recurring): three levels in deep blue/light blue + gray, with dashed row separators, white text in deep cells, and labels reserved on the left. Before-and-after microbars (recurring): a gray baseline bar connected to a cyan improvement segment, with the value attached to the bar end. Processes/timelines (recurring): connect nodes along black axes/gray arrows, locate positions with cyan dots, and number them with orange dots; maps may occasionally use a #C3CFE0 base. + +【Signature Components】 +Grayscale still-life photography is a hard requirement: Use it only on the cover, table of contents, chapter transitions, and a limited number of findings slides. Place text on white/gray information panels; do not add arbitrary photography to content-heavy chart slides. The so-what strip translates conclusions rather than serving as decoration. Metric capsules contain CAGR/share/multiples and sit directly beside the chart. Interview excerpts always appear on the right with an oversized blue quotation mark + a fine cyan rule. Orange numbered dots and cyan/gray check circles attach respectively to nodes and capability cells. + +【Prohibited】 +Photography must not overlap body content, and chapter photography must not be replaced with arbitrary illustrations. Orange must not serve as the default positive/negative encoding. Continue to present comparisons with square-cornered cells/fine borders/dashed lines; legends must not replace labels placed directly on columns, dots, and line endpoints. All other prohibitions inherit PART A; no additional overrides were observed in the source. + +【Slide Types and Layouts】 +Primary evidence chart slide|trend/scale|main chart 60–70% + explanation 30–40%|1–3 charts|capsules/direct labels/synthesis strip|not suitable for cell-by-cell comparison. +Multi-metric matrix slide|competitors/regions/capabilities|labels 10–15% + matrix 65–75% + excerpt 15–20%|3–6 rows × 4–7 columns|blue-scale cells/quotation mark|not suitable for a single trend. +Unit-economics bridge chart slide|before-and-after change and drivers|left bridge 35–45% + right-side drivers 55–65%|1 bridge + 4–6 rows|change capsule/assumption strip|not suitable for causal-free parallel listing. +Process/timeline/map slide|process/evolution/geography|graphic 70–80% + annotations 20–30%|1 graphic + 3–8 nodes|cyan nodes/orange numbering|not suitable for lengthy item-by-item argumentation. +Key findings text slide (occasional)|multiple findings/excerpts|light-gray background approximately 90%|4–8 items, 1–3 lines each|blue numbering/yellow highlights|not a substitute for a data slide. + +【Density Baseline】 +Chart slide: 1–3 charts and 2–4 explanatory blocks; matrix: 3–6 rows × 4–7 columns, with 1–3 lines per cell; process/timeline: 5–9 nodes. Synthesis strip: 2–4 items, each 15–35 words/characters equivalent; excerpt: 25–60 words/characters equivalent. Directly label column/line endpoints and capsules with totals/shares/changes. Concentrate whitespace between titles and fine rules, around chart edges, and near the footer. diff --git a/skills/open-kimi-ppt/reference/design_system/consulting/moss-green-transformation/design.md b/skills/open-kimi-ppt/reference/design_system/consulting/moss-green-transformation/design.md new file mode 100644 index 0000000..6b20901 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/consulting/moss-green-transformation/design.md @@ -0,0 +1,69 @@ +# Moss Green Transformation · Consulting STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum Standard) + +A professional, information-dense consulting presentation benchmarked against leading strategy firms (McKinsey/BCG), with a premium editorial aesthetic. + +Content and layout: +1. Rich data visualization: Fill pages with sophisticated, precise charts (stacked bars, waterfall charts, line charts) and detailed data tables with complete rows and columns. +2. Structured frameworks: Include strategy maps or 2×2 matrices constructed with fine, crisp lines. +3. High information density: Use complex, multi-column layouts that resemble real business-analysis presentations, rather than cover-style pages dominated by empty space. + +Visual style: +1. Aesthetic: Balance a technology-forward feel with information density. Keep it clean, clear, and authoritative. +2. Typography: Use a bold sans serif for primary titles; chart labels and numerical data use the same sans family. +3. Color palette: Pure white background and pure black text; use deep navy blue for charts and graphic elements, with a range of grays to distinguish hierarchy. +4. Graphics: Use thin borders for tables and precise vector lines for charts. + +Structure and discipline (distilled from work we consider best-in-class): +1. Every content-page title must be a complete assertion (a conclusion sentence), followed by a one-line scope/methodology subtitle stating what the page covers and how to read it. +2. Every content page must include a chapter breadcrumb/tab bar with the current chapter highlighted, so any page can be located within the overall storyline. +3. Use one named analytical framework per page, never a loose collage: a convergence-pressure column, a phased timeline with a TODAY marker and stage gates, a three-scenario table (conservative/base/accelerated), a Five Forces diagram, a heat table, a difficulty × impact 2×2 (with a watch zone), a three-part upstream/midstream/downstream value chain, or a multidimensional profile matrix—choose the framework to fit the content. +4. Present parallel evidence in 2–3 equal-width columns; number independent judgments (1/2/3), each with a bold assertion line and one concise explanatory sentence. +5. Chart-annotation discipline: Put data labels directly on marks; include growth/level callouts (such as “+42% p.a.”), TODAY markers, dashed lines for forecasts, and named monitoring indicators for uncertain variables. Never rely on the legend alone. +6. Close most pages with a synthesis strip at the bottom (“How to Read This Page” / “Profile Interpretation” / a one-sentence so-what) that converts the evidence above into a single takeaway. +7. Fixed page triad: source/footnote line at bottom left and page number at bottom right; never omit or treat them as decoration. Generated decks must never include watermarks, confidentiality notices/stamps, copyright lines, or logo placeholders. +8. Open with a one-page executive-summary overview followed by a numbered, paginated agenda; close with numbered conclusions (claims, not summaries) and an implications page divided by audience type (such as policymakers/operators/buyers), with each column ending in concrete actions. +9. Every number must include its unit, time range, and measurement basis; express uncertainty through observable monitoring indicators, not hedging language. + +Default baseline (distilled from the layout skill; PART B may override): Content pages use dense, multi-column layouts and contain at least one complex chart or one multi-row, multi-column data table. Never use “one oversized sentence + vast empty space” as a content page. Construct framework diagrams (strategy maps/2×2/driver trees) with fine, crisp vector lines rather than stacked color blocks. Tables use thin borders with no heavy fills. Limit each page to ≤2 primary hues. + +**Title Read-Through Test**: Reading only the titles across the deck should communicate the complete story; if they do not flow coherently, the structure is not working. + +> Priority note: This section defines the minimum baseline for consulting use cases. Where the signature system below (PART B) conflicts with it, the signature system takes precedence—especially for background, color, and typography. The typography and color guidance above serves only as a default where the signature system is silent. + +### Global Prohibitions (AI Defaults · Mandatory) + +1. **Do not default to cards**: Unless the user explicitly requests them, do not use rounded rectangles or rectangular cards to create hierarchy or alignment—containers with a functional information role (status indicators, hypothesis boxes, quotation boxes) are not considered cards. Lines, whitespace, and differences in font size and weight are preferable. +2. **Do not default to evenly divided compositions**: Unless no other layout is viable, do not default to thirds, quarters, or 2×2 matrices. Equal division must be justified by the content structure (three scenarios naturally require three columns; frameworks explicitly named in the body are exempt). +3. **Do not use arbitrary AI-default colors**: A designated institutional palette specified in the content is exempt. The prohibition applies to generic, commonplace, unsupported defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **Do not introduce elements that conflict with the overall style**: No out-of-style treatments—for example, rounded icons or rounded rectangles within a sharp-edged visual system. +5. **Keep chart backgrounds transparent**: Use transparency or the page background, except when reversing content out on a dark background. +6. **Do not leave blank regions**: Leave no large empty block in the content area. Every planned region must be filled with real content; an underfilled region is the most serious form of visual roughness. + +## PART B — Signature System (Distinctive Template Signature; Overrides PART A in Case of Conflict) + +Based on a small source sample of 6 slides. + +One-sentence style signature: A moss-green-to-mint data narrative on a dark charcoal background, compressing a high-density transformation roadmap through short labels, conclusion-led headlines, and deep-green evidence blocks. + +【Color Palette】Use an approximate `#2C2C2C` background that fills the canvas and overrides the white background in PART A. Use approximate `#F3F3F3` for titles/primary text, including titles, table headers, and key figures. Use approximate `#B7B7B7` for secondary text such as subtitles, footnotes, and axis labels, limited to a small number of text layers. Use `#125E42` for section labels/table headers, only as short bars or phase bands. Use `#0A3021` for evidence cards and conclusion boxes, constrained by thin borders within the content area and typically occupying no more than one-third of it. Use `#36AA7E` as the primary accent, only to highlight selected bar segments, positive values, phases, and status indicators. Use `#345A4D` for baseline series, paired with bright green to show comparisons/unselected states. Use approximate `#86C5AA` only for a small number of highlighted figures. Use approximate `#C05172` only for gaps or warning points. Retain only two primary hue families per page—charcoal and green—with burgundy reserved as a negative exception. Do not flood the page with the accent color, and do not let deep-green blocks replace the full-page background. + +【Layout Skeleton】Source facts: 960×540, 16:9. Content pages follow a fixed sequence: “top-left all-caps English section label—1–2-line conclusion-led title—1-line scope/methodology subtitle—thin divider—evidence area,” with the title area occupying approximately the top quarter. Depending on the content, use a 60/40 two-column evidence area, a three-column group of equal-width cards, or a full-width table, with narrow gutters and square, thin borders. Chapter location is indicated by a single green kicker, not a multi-item horizontal tab bar; when overriding the navigation in PART A, retain only the current section label. The reading path is label → title → subtitle → evidence from left to right → bottom-line conclusion. Use a thin footer rule, source/methodology at left, and page number at right. Cover only: frame the title on the left with a thin green vertical line plus horizontal rules above and below; place dark-background rings, square dots, and a blurred green glow on the right. Do not reuse these elements on content pages. + +【Typography】Only page images are available in the source, so the font families cannot be verified. Chinese titles, body text, and tables all have a sans-serif appearance (render with {latin: Liter, ea: MiSans}); titles are bold and body text is regular. English section labels are all caps with expanded letter spacing. Body text = 1x, title ≈2.6–3x, large figures ≈3.4–4x, subtitle ≈0.8x, and footnote ≈0.6x. Titles may span two lines but must preserve a complete assertion. Set P1/P2/P3, Q1–Q4, and 01/02/03 in clean, regular Latin letters and numerals; keep percentages and units tight to the figure, and render key values in bold bright green or light green. + +【Chart Language】Observed chart types: horizontal stacked bars, three-column information cards, a maturity table, a pilot–value two-column layout, and a quarterly roadmap table. ⭐ Signature treatments: Place percentages directly inside stacked-bar segments and pair them with 3 numbered interpretations on the right. Use dot-matrix levels in the maturity table, with burgundy limited to a few cells in the gap column. On the pilot page, stack P1–P3 vertically on the left and enlarge 3 value figures on the right. In the roadmap, use segmented green bands for phases, then populate a Q1–Q4 grid. Place labels directly within bars, phase bands, or cells; never rely on the legend alone. Tables use thin borders with charcoal/transparent backgrounds. + +【Signature Components】1) Section kicker: one per content page at the top left—a short green bar, all-caps English, shown only once. 2) Thin divider below the subtitle: a hard boundary between the title area and the evidence area. 3) Deep-green evidence blocks: three-column cards, pilot strips, conclusion boxes, or bottom synthesis strips, with square corners and thin borders; use no more than 3 at the same hierarchy level on one page. 4) Conclusion strip/box: at most once per content page, positioned at the bottom or below the right column, and closed with a one-sentence so-what. 5) Source line and bottom-right page number: retain on every page at the smallest font size. Use the geometric glow on covers only occasionally, confined to the empty area on the right. + +【Prohibited】1) Reverting content pages to a white background or full-page light color; 2) blue-purple treatments, neon gradients, or glowing borders; 3) turning deep-green evidence blocks into rounded/glass cards or using them as a full-page fill; 4) multi-item tab navigation or a large top navigation band; 5) providing only a legend without labels inside bars or cells; 6) copying the cover's geometric glow onto content pages; 7) using burgundy decoratively or as a large-area fill. + +【Slide Types and Layouts】 +Conclusion-led two-column chart page (occasional)|Core quantitative finding + explanation|Approximately 60% stacked bars on the left; approximately 40% numbered interpretation/conclusion box on the right|1 chart + 3 explanations|In-bar labels, so-what|Not suitable for multiple topics. +Three-column deep-green information-card page (occasional)|Three parallel scenarios/capabilities|Three equal-width columns, each structured as title—current state—transformation—use case—benefit|3 blocks|Deep-green cards, bottom benefit figures|Not suitable for time series. +Maturity-matrix table page (occasional)|Capability gaps and actions|Full-width table of approximately 5 columns × 5 rows, with a bottom conclusion band|1 table + 1 synthesis|Dot-matrix levels|Not suitable for long-form narrative. +Pilot–value two-column page (occasional)|Initiatives and proof of value|Approximately 60% for three pilots on the left; approximately 40% for three metrics on the right|3 cards + 3 metrics|P1/P2/P3, bright-green figures|Not suitable for multi-series charts. +Quarterly roadmap table (occasional)|Phased implementation|Phase bands + a Q1–Q4 grid across three rows: tools/talent/governance|Approximately 12 action cells|Phase bands, quarterly grid|Not suitable for single-metric comparison. + +【Density Baseline】Content pages in the sample typically contain 3–6 independent blocks: a two-column page contains 1 chart + 3 interpretations; a three-column page contains 3 cards, each with 3–4 text levels; the maturity table is approximately 5×5; the pilot page contains 3 cards + 3 metrics; and the roadmap spans 4 quarters × 3 rows. Use only 1 complex chart per page, or replace it with 1 table/1 card group. Bar charts place percentages inside bars; tables use short terms with dot-matrix levels; each roadmap cell contains 1–3 short statements. Explanatory blocks should be approximately 20–70 words/characters equivalent; titles should occupy 1–2 lines and subtitles 1 line. Reserve whitespace only for narrow bands between columns, between cards, and above the footer; do not leave large empty blocks in the content area. diff --git a/skills/open-kimi-ppt/reference/design_system/consulting/pine-green-strategy/design.md b/skills/open-kimi-ppt/reference/design_system/consulting/pine-green-strategy/design.md new file mode 100644 index 0000000..5b95e82 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/consulting/pine-green-strategy/design.md @@ -0,0 +1,73 @@ +# Pine Green Strategy · consulting STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum) + +A professional, high-density consulting presentation benchmarked against top-tier strategy firms (McKinsey/BCG), with the aesthetic of a premium editorial publication. + +Content and layout: +1. Rich data visualization: fill the page with complex, precise charts (stacked columns, waterfall charts, line charts) and detailed data tables with complete rows and columns. +2. Structured frameworks: include a strategy map or a 2×2 matrix built with fine, clear lines. +3. High information density: use complex layouts and multi-column design that resemble a real business analysis presentation, not a cover with expansive blank space. + +Visual style: +1. Aesthetic: balance a technological feel with information richness. Keep it concise, clear, and authoritative. +2. Typography: use a bold sans serif for main titles; use the same sans family for chart labels and data figures. +3. Color: use a pure white background and pure black text; use deep royal blue for charts and graphic elements, with different gray values to distinguish hierarchy. +4. Graphics: use fine borders for tables and precise vector lines for charts. + +Structure and discipline (distilled from outputs we recognize as benchmarks): +1. Every body-page title must be a complete assertion (a conclusion sentence), with a one-line scope/definition subtitle stating what the page covers and how to read it. +2. Every body page carries a chapter breadcrumb/tab bar with the current chapter node highlighted, so any single page can be located in the storyline. +3. One named analytical framework per page, not a loose collage: a pressure-convergence bar, a phased timeline with a TODAY marker and stage gates, a three-scenario table (conservative/base/accelerated), a five-forces diagram, a heat table, a difficulty × impact 2×2 (with an observation zone), an upstream/midstream/downstream value chain, a multidimensional persona matrix—choose the framework based on the content. +4. Run parallel evidence in 2–3 equal-width columns; number independent judgments (1/2/3), each with a bold claim line + one brief explanation. +5. Chart annotation discipline: place data labels on marks, growth/level callouts (such as「+42% p.a.」), and a TODAY marker; use dashed lines for forecasts; give uncertain quantities a named observable metric; never make a chart rely on the legend alone. +6. Most pages close with a bottom synthesis bar (「how to read this page」/「persona interpretation」/a one-line so-what), converting the evidence above into a single takeaway. +7. Fixed page trio: source/footnote line at bottom left and page number at bottom right; never omit them or use them as decoration. Generated decks never add watermarks, confidentiality notices/stamps, copyright lines, or logo placeholders. +8. Open with one overview executive summary + a numbered page-by-page contents list; close with numbered conclusions (claims, not a summary) + an implications page split by reader type (such as policy makers/operators/buyers), with each column landing on an action. +9. Numbers must carry units, time ranges, and definitions; express uncertainty through monitorable observable metrics, not hedging language. + +Default baseline (distilled from the layout skill, PART B may override): body pages are high-density and multi-column, carrying at least one complex chart or one multi-row, multi-column data table; never use「one large sentence + expansive blank space」as a body page; build framework diagrams (strategy maps/2×2/driver trees) with fine, clear vector lines rather than stacked color blocks; use fine table borders with no heavy fills, and keep the dominant hues on one page ≤2. + +**Read-the-titles test**: reading only the page titles across the deck should let you hear the complete story; if they do not read coherently, the structure is not working. + +> Priority note: this section is the minimum baseline for consulting contexts. When the Signature System below (PART B) conflicts with it, follow the Signature System—especially for background, color, and typography; the font/color items above apply as defaults only when the Signature System is silent. + +### Global Prohibitions (AI Default Patterns · Mandatory) + +1. **Do not default to cards**: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to build hierarchy or alignment—containers that carry information functions (status lights, assumption boxes, quotation boxes) do not count as cards. Lines, whitespace, type size, and weight differences are preferable. +2. **Do not default to equal-split composition**: unless no other usable layout exists, do not default to thirds, quarters, or a two-by-two matrix—equal splits must be justified by the content structure (three scenarios naturally mean three columns; frameworks explicitly named in the body are exempt). +3. **No ungrounded AI color schemes**: the institutional palette specified in the body is exempt; what is prohibited is bland, common, unsupported default color—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **No elements that clash with the overall style**: do not introduce styles outside the visual language, such as rounded icons or rounded rectangles in a sharp-edged style. +5. **Make chart backgrounds transparent**: use transparency or the page background, except for reversed type on a dark background. +6. **No empty regions**: leave no solid block of blank space in the body content area; every planned region must be filled with real content, and failing to fill it is the most serious form of roughness. + +## PART B — Signature System (Template-Specific Signature; takes precedence over PART A in conflicts) + +One-line style signature: use darkened technology photography as the header background, let deep forest green govern conclusions and structure, use bright mint green for emphasis, and keep the overall density high while allowing large light-gray/light-green zones to create breathing room. + +【Color Palette】Use pure white #FFFFFF as the primary background (large body areas); use light gray #F1F1F1 for explanation columns and bottom so-what bars (sectioning only, never as the main text background); use medium gray #565656 for main text, with #7E7E7E available for footnotes/page numbers; use deep forest green #03522C (structural near-equivalent #04512C) for titles, skeleton lines, and chapter codes as the first structural color throughout; bright green #29B974 is the primary accent, reserved for key figures, icons, and action lines rather than spread across the page; mint base #D1F5E2 is for half-screen transitions/quotes/large explanation areas, light green #B8EDBC for metric cards/summary panels, with cover overlays additionally using #A8EFB8; for chart series, prioritize the same-color scale from deep green → bright green → olive yellow #D3DF33, adding cyan #2FC1D6 when needed; use magenta #E71C56 for negative/risk, with deep burgundy #670E30 only at its boundary. Structure pages usually show only green tones + neutrals; data pages use at most 3–4 hues, every color must correspond to a data category or positive/negative meaning, and the accent color must never cover the page. + +【Layout Skeleton】Source-canvas facts: 16:9, 12192000×6858000 EMU (approximately 1467×825 px). Most body pages have a darkened technology/person/data photo band about 14–17% high across the top, with a white assertion-style title aligned left; below it is a navigation bar of “chapter code + vertical rule + section name,” then the white body. The body commonly uses a 2:1 two-column or three-column grid, with a light-gray explanation column on the right; charts, tables, and diagrams are separated by fine gray/green lines. The signature divider is a stripe band that fades from a solid deep-green block into fine vertical bars, usually attached to the top edge of the body or the right column. Cover only: overlay two translucent mint rectangles, a thick deep-green divider, and a bottom stripe on a full-bleed dark image; chapter page only: use a vertical photo + mint overlay on the left about 1/3, and list the chapter agenda on a white right side. Keep the reading path fixed as “black title band carrying the conclusion → chapter locator → main chart/table → sidebar explanation → one-line bottom close”; special transition pages may remove the photo title band but retain the navigation logic. + +【Typography】Source-deck facts: use sans-serif Arial for body copy and data labels (render with {latin: Liter, ea: MiSans}); use Trebuchet MS for chapter codes, some section headings, and a small number of footnote/italic prompts (QuattrocentoSans is an acceptable substitute); cover date verification uses Times New Roman and the cover subtitle uses Georgia, both for low-frequency special use (render with Unna). Body copy is about 12–16pt=1x; black full-width title about 24pt≈1.8–2x; chapter code about 18–27pt≈1.5–2x; key conclusion/section title 20–24pt≈1.5–2x; large figures 32–40pt≈2.5–3x; cover main title about 36pt≈3x (dedicated page); footnotes about 7–9pt≈0.5–0.6x. Titles generally use bold, sentence case, or all-caps labels; body copy uses short sentence-style paragraphs; emphasize key phrases, figures, and positive/negative judgments in bright green/magenta bold; italics are only for quotations or metric definitions, never decoration. + +【Chart Language】Actually used: stacked/segmented columns, phase curves, three-column metric cards, set-overlap diagrams/concentric rings, 2×2 risk matrices, four-quadrant discs, radial hub diagrams, horizontal timelines, three-column tables, and screenshot evidence collages. +- Use green steps and olive yellow for layers in stacked columns, write values directly inside the columns, make growth rates/compound growth separate ellipse or capsule callouts, and optionally list same-color CAGR labels on the right. +- Use a bright-green solid line to highlight the primary path in curve charts, gray dash-dot lines for assumptions/extensions, and numbered dots with short explanations for key stages; do not make viewers guess lines from a legend. +- Use pale cyan #2FC1D6, pale yellow #D3DF33, and mint-green zones for 2×2s, set-overlap diagrams, and ring charts; place labels directly inside regions, prioritizing overlap zones or priorities 1–4. +- Use a gray arrow track to carry deep-green numbered blocks on timelines, with icons above nodes and a fixed three-layer “name—fine rule—description” stack below each node. +- Use deep-green headers, a white body, fine green grid lines, and a small amount of light-gray row fill in tables; the first column may use a mint sidebar navigation, and key rows use bold rather than heavy fill. + +【Signature Components】1) Darkened technology-photo title band: once on most body pages; photos appear only in full-width headers, covers, or the left column of chapter pages, never beneath body charts; photography is a hard constraint: when substituted, retain the “person/technology scene + low-contrast darkening” function. 2) Chapter code + vertical-rule navigation: at most one per page, with the code in large deep-green type and the section name in gray bold. 3) Deep-green → fine-vertical-bar fading stripe: at most one per page, attached to an edge for rhythm/separation and never crossing body content. 4) Line-drawn icon + deep-green title rule: icons serve categories, processes, or risks only, never random decoration; at most one per evidence block. 5) Light-gray/mint explanation column and bottom close bar: carry one sentence on “why/how to read/action,” at most one of each. 6) Direct data-label components (numbered blocks, dots, capsules, concentric rings): mark key points directly rather than substituting a legend. + +【Prohibited】Do not spread photography across the body or place body copy on top of a photo; prohibit blue-purple gradients, neon, rainbow series, and semantically ungrounded multicolor cards, with cyan/yellow/magenta used only as chart categories or positive/negative states; prohibit heavy borders, shadows, glow, and 3D charts; do not use rounded cards as default grouping containers, with rounded boxes appearing only occasionally in page types such as decision-process nodes; do not mix colorful emoji and colorful icons, and keep icons as single-color line drawings; do not place subtitles, legends, or multiple paragraphs of body copy inside a full-width title band. Screenshots/news clippings may appear occasionally, but must be independent evidence blocks with a white background and fine shadow, never becoming a full-page collage. + +【Slide Types and Layouts】 +Full-width assertion + two-column evidence|One conclusion jointly proven by chart and explanation|Title band about 15%, main chart at left 55%, explanation/screenshot at right 45%, footnote at bottom|2–4 blocks|Navigation, stripe band, light-gray explanation column|Not suitable for multiple unrelated tables. +Three-column contrast/comparison|Parallel dimensions, before/after differences, or three options|Three body columns about 30% each, icon + green mini-heading + fine rule + short paragraph, one so-what line at bottom|3 blocks|Line icons, green divider rules|Not suitable for long text or row-by-row data. +Metric/cost cards|3–6 KPIs or option-cost comparisons|3×2 light-gray cards or three large cards, icon, oversized figure, 1–2 sentence definition, horizontal conclusion at bottom|3–6 blocks|Large figures, footnote links|Not suitable for causal chains. +Framework diagram/matrix|Relationship structures such as 2×2s, set overlaps, rings, and radial hubs|Main diagram 60–70%, side/bottom explanation 30–40%, labels placed directly in the diagram|1 main diagram+2–4 explanations|Stripe band, numbered markers|Not suitable for stuffing every detail into the diagram. +Evolution/transition contrast (occasional)|“From—to,” role change, or policy checklist|Mint/white half-screen split left and right, visual or quotation in the center, deep-green horizontal bar at bottom|2–4 blocks|Large quotation, photographic/illustrative evidence|Not suitable for routine data pages. +High-density table/timeline|Role-task matrix, risk list, or phase sequence|Body 75–85% as a three-column table or an 8-node track, fine-line grid, direct numbering|6–8 blocks|Deep-green table header, numbered blocks|Not suitable for a single viewpoint. + +【Density Baseline】Body evidence pages typically have 2–4 independent modules; metric cards have 3–6 cards, risk grids about 8 items, and timelines about 8 nodes. A single page typically has 1 main chart+1 sidebar/bottom explanation, with each column, point, or phase directly labeled inside the chart and a short callout added for key growth/risk. Explanation blocks are usually 2–5 blocks, each about 20–80 words/characters equivalent or 2–5 lines; lists have 2–4 items per block. Whitespace is concentrated below the title band, between columns, outside diagrams, and at the boundaries of light-gray/mint zones; leave no solid blank area in the body content region, organizing density through zones and fine lines rather than piling on more decoration. diff --git a/skills/open-kimi-ppt/reference/design_system/consulting/red-black-growth/design.md b/skills/open-kimi-ppt/reference/design_system/consulting/red-black-growth/design.md new file mode 100644 index 0000000..dd744ab --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/consulting/red-black-growth/design.md @@ -0,0 +1,73 @@ +# Red-Black Growth · Consulting STYLE DESIGN SYSTEM + +## PART A — Category Baseline (Universal Minimum Standard) + +A professional, information-dense consulting presentation benchmarked against leading strategy firms (McKinsey/BCG), with the visual refinement of premium editorial design. + +Content and layout: +1. Rich data visualization: Fill slides with sophisticated, precise charts (stacked columns, waterfall charts, line charts) and detailed data tables with complete rows and columns. +2. Structured frameworks: Include strategy maps or 2×2 matrices built with fine, crisp lines. +3. High information density: Use complex, multi-column layouts that resemble real business-analysis presentations, not cover slides dominated by empty space. + +Visual style: +1. Aesthetic: Balance technological sophistication with information density. Keep the presentation clean, clear, and authoritative. +2. Typography: Use a bold sans serif for main titles; chart labels and numerical data use the same sans family. +3. Color: Use a pure-white background and pure-black text; apply deep royal blue to charts and graphic elements, and distinguish hierarchy through multiple shades of gray. +4. Graphics: Use fine borders for tables and precise vector lines for charts. + +Structure and discipline (distilled from outputs recognized as benchmarks): +1. Every content-slide title must be a complete assertion—a conclusion sentence—with a one-line scope/method subtitle beneath it explaining what the slide covers and how to read it. +2. Every content slide must include a chapter breadcrumb/tab bar with the current section highlighted, so any standalone slide can be located within the overall narrative. +3. Use one named analytical framework per slide, not a loose collage: a convergence-pressure bar, a phased timeline with a TODAY marker and stage gates, a three-scenario table (conservative/base/accelerated), a Five Forces diagram, a heat table, a difficulty × impact 2×2 with an observation zone, an upstream/midstream/downstream value chain, or a multidimensional profile matrix—select the framework to match the content. +4. Present parallel evidence in 2–3 equal-width columns; number standalone judgments (1/2/3), each with a bold assertion line and one concise sentence of explanation. +5. Chart annotation discipline: Put data labels directly on marks, add growth/level callouts (such as “+42% p.a.”), include a TODAY marker, use dashed lines for forecasts, and pair uncertain quantities with named monitoring indicators; never rely on a legend alone. +6. Close most slides with a bottom synthesis strip (“How to Read This Slide” / “Profile Interpretation” / a one-sentence so-what) that converts the evidence above into a single takeaway. +7. Fixed slide essentials: Place the source/footnote line at bottom left and the slide number at bottom right; never omit them or treat them as decoration. Generated decks must never include watermarks, confidentiality notices/stamps, copyright lines, or logo placeholders. +8. Open with a one-slide executive summary plus a numbered, paginated contents page; close with numbered conclusions (claims, not summaries) plus an implications slide organized by reader type (for example, policymakers/operators/buyers), with each column ending in concrete actions. +9. Every number must include its unit, time range, and measurement basis; express uncertainty through observable monitoring indicators, not hedging language. + +Default baseline (derived from the layout skill; PART B may override): Content slides use dense, multi-column layouts and must contain at least one complex chart or one multi-row, multi-column data table. Never use “one oversized sentence + a large empty field” as a content slide. Build framework diagrams (strategy maps/2×2/driver trees) with fine, crisp vector lines rather than stacked color blocks. Tables use fine borders without heavy fills. Limit each slide to ≤2 primary hues. + +**Title read-through test**: Reading only the slide titles from beginning to end should reveal the complete story. If they do not read as a coherent sequence, the structure has not been established. + +> Priority note: This section defines the minimum baseline for consulting use cases. Where the signature system below (PART B) conflicts with it, follow the signature system—especially for backgrounds, color, and typography. The typography and color guidance above applies only when the signature system is silent. + +### Global Prohibitions (Default AI Patterns · Mandatory) + +1. **Do not default to cards**: Unless explicitly requested by the user, never use rounded rectangles or rectangular cards to create hierarchy or alignment—containers with a genuine information function (status indicators, assumption boxes, quotation frames) are not considered cards. Lines, whitespace, type size, and weight contrast are preferred. +2. **Do not use equal-partition compositions by default**: Unless no other viable layout exists, do not default to three equal sections, four equal sections, or a two-by-two matrix. Equal partitioning must be justified by the content structure (three scenarios naturally warrant three columns; explicitly named frameworks are exempt). +3. **Do not use unmotivated AI color schemes**: Institution-specific palettes defined in the content are exempt. What is prohibited is a generic, conventional, unsupported default palette—blue-purple gradients, cyan-purple neon, rainbow light effects, glass cards, and glowing borders. +4. **Do not introduce elements that conflict with the overall style**: Never use out-of-style treatments, such as rounded icons or rounded rectangles in a sharp-edged design system. +5. **Keep chart backgrounds transparent**: Use transparency or the slide background, except when reversing content out of a dark background. +6. **Do not leave blank regions**: Leave no entire content region empty. Every planned area must be filled with real content; an unfilled region is the most serious form of visual roughness. + +## PART B — Signature System (Distinctive Template Signature; This Section Overrides PART A in Case of Conflict) + +One-sentence style signature: A white-background, high-density growth-consulting deck that organizes evidence with near-black text and a single coral-red focal point, uses light gray to carry detail, and resolves the story with reversed text on near-black (based on a small 8-slide source sample). + +【Color Palette】 +Background #FFFFFF: Fill the entire canvas. Primary text #454545: Use for body copy, axis labels, and connector lines, never as a large background. Title color #0F0605: Reserve for titles, assertions, and large numbers. Primary accent #FF4D4D: Use only for pivotal shifts, leading items, or central nodes; allow at most 1 large color block per slide, covering no more than approximately 20%. Secondary #F6F6F6: Use as an evidence background, limited to 30% of a slide; #909090: Use only for subtitles, annotations, and small footer text; #DDDBDB: Use only for fine borders; #FFF1F1: Use as a pale-red module background, limited to 15%; #FED8D8: Use only for pale-red borders; #1C0B0B: Use for a narrow conclusion strip or a single outcome node, limited to 8%. Chart series #FF4D4D, #454545, and #BDBDBD are for marks only; gridlines use #E0E6F1. Do not assign separate positive/negative colors: red indicates emphasis only; show negative direction with #454545 / #BDBDBD, arrows, and text. Allow only 1 non-neutral hue per slide; never flood the full slide with red. + +【Layout Skeleton】 +Source canvas: 13.333×7.5 inches, 16:9. Position the title 5% from the left and 5% from the top, at approximately 90% width; place the subtitle at 11% from the top. The content area spans 18%–88% vertically, with approximately 5% margins on both sides. Common structures are “primary evidence 60% + explanation 40%” and “input 30% + conversion 25% + outcome 30%.” Override PART A: Do not use chapter tabs/breadcrumbs. Use only read-through titles and a two-digit “current slide / total slides” indicator at bottom right for navigation; place the source at bottom left. Framework slides flow left → right with arrows. Do not create separate cover, contents, or section-divider slides for short reports; special slides in long reports inherit PART A. + +【Typography】 +Source-file facts: The entire deck is sans serif; all PPTX text runs use Liter, while the theme font is MiSans. The PDF primarily embeds Hiragino Sans GB W3/W6, with Arial Black for large numbers; export substitution is present. Prefer Liter; if unavailable, use MiSans or Hiragino Sans GB, overriding PART A’s serif titles. Body copy 8.5pt=1x, titles 24pt≈2.8x, major statements/numbers 20–30pt≈2.4–3.5x, footnotes 7.5pt≈0.88x. Set titles and numbers in extra-bold weight; use regular weight for explanations. Use Arabic numerals with units immediately following; format stage numbers as 01, 02, and set Latin abbreviations in uppercase. + +【Chart Language】 +Practical types: clustered column charts, clustered bar charts, and fine-rule data tables. Framework options also include arrow-based causal chains, convergence–release diagrams, stepped roadmaps, and KPI matrices. ⭐Use #FF4D4D for the target column/bar; use only #454545 or #BDBDBD for comparators; place values directly inside the columns/bars. ⭐For comparisons, use paired small multiples with the same scale, followed by a precise-value table; use red and gray on one side and gray only on the other. ⭐Place at most 1 shadow-free, pale-red delta box beside the chart, containing one line of large numerals and one line of explanation. ⭐Occasional pattern: Route light-gray inputs through straight arrows into a single red node, then into a pale-red or near-black outcome. ⭐Occasional pattern: Build a four-step roadmap from equal-width right-angled stage blocks that rise progressively, each with its own evidence box. + +【Signature Components】 +Coral-red focal block: Carries the single core relationship; use at most 1 per slide. KPI evidence brick: A square-cornered #F6F6F6 background with a fine #DDDBDB border, containing one ultra-bold number and 1–2 lines defining its measurement basis; use 2–5 per group. Reversed-text conclusion strip: A narrow #FF4D4D or #1C0B0B horizontal strip with one bold white sentence. This overrides “most slides” in PART A: use it only for strong closure, at most 1 strip per slide. Data pill: A light-gray fill or red outline containing only a short label/ratio; use 1–3 per slide. This is the only standard exception permitting a rounded container. Connector arrows: Fine, straight #454545 lines used only in frameworks; never run them through text. + +【Prohibited】 +Do not use PART A’s deep royal blue, serif titles, full-slide dark/red backgrounds, multicolor charts with equal visual weight, or green/red positive-negative encoding. Do not use rounded corners except for pills and a single central node. Do not use shadows, gradients, glows, or 3D effects. Use photographs/illustrations sparingly; without a hard requirement, keep the presentation purely vector-based. + +【Slide Types and Layouts】 +Chart Evidence (occasional)|Differences and explanation|Approximately 60% chart + 40% explanation, or two charts above a table|4–6 blocks|Direct labels, delta box, conclusion strip|Unsuitable for purely qualitative mechanisms. +Input–Conversion–Outcome|Definition migration, causality, or resource mapping|30% input on the left, 25% red conversion in the center, 30% outcome on the right|7–10 nodes|Red focal point, straight arrows, light-gray/pale-red modules|Unsuitable for precise coordinate reading. +KPI Overview (occasional)|Opening position or final synthesis|Large statement in the upper approximately 25%, matrix in the lower approximately 75%|5–8 blocks|KPI evidence bricks, selective red text|Unsuitable for extended causal reasoning. +Action Staircase (occasional)|An explicit four-step sequence|Four columns at 18%–20% each, rising from left to right|4 stages + 4 evidence boxes|Two-digit stage numbers, short arrows, bottom cost strip|Unsuitable for unordered categories. + +【Density Baseline】 +Do not impose a single hard minimum across the full deck. Chart slides contain 1–2 charts and 3–5 explanation/conclusion blocks; label every column/bar with its value, and reserve 1 callout for the key difference. Framework slides typically contain 7–10 nodes and 4–8 connector lines, with 15–35 words/characters equivalent per node and no more than 3 lines for the central assertion. KPI overview slides use approximately 5 KPIs plus 3 conclusions, with 20–40 words/characters equivalent per block; closing statements use 35–70 words/characters equivalent. Concentrate whitespace between the title and content, between columns, and around arrows; never leave an entire content region without information. diff --git a/skills/open-kimi-ppt/reference/design_system/finance/black-gold-ledger/design.md b/skills/open-kimi-ppt/reference/design_system/finance/black-gold-ledger/design.md new file mode 100644 index 0000000..747985c --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/finance/black-gold-ledger/design.md @@ -0,0 +1,94 @@ +# Black Gold Ledger · finance STYLE DESIGN SYSTEM + +## PART A — finance Baseline (Universal Floor) + +Institutional-grade investment research presentations, benchmarked against top-tier fund research reports, due diligence, and strategy outlooks. Chart-heavy, text on the dense side, more report than consulting: Excel-style financial model tables carry the argument; every number is traceable, every assumption made explicit, every conclusion executable. + +Content and layout: +1. Thesis-driven structure: deal decks run "summary → highlights → target → financial diagnosis → valuation & returns → risk mitigation → decision ask"; research decks run "stance → evidence → scenarios → allocation advice". The ending must land on an explicit decision or stance. +2. Tables are the protagonist: valuation ranges, comparable companies, the three financial statements, scenario modeling, sensitivity grids — all under strict row/column discipline (assumption columns, driver rows, check rows); charts serve the numbers, never decorate. +3. High but ordered density: multi-column layouts with clear hierarchy; each page answers one investment-committee question; density comes from evidence modules, not walls of text. + +Visual style: restrained, authoritative, compliance-clean; no lifestyle photography, decorative icons, or marketing superlatives. Serif is allowed for titles when gravitas is needed; table body text, chart labels, and all figures use sans-serif, with numbers column-aligned. A conservative institutional palette: deep structural colors plus one restrained accent, reserved for key figures and recommended actions; positive/negative semantic colors fixed, expressing financial meaning only. Fine table rules, precise vector chart lines; no 3D or shadows; gradients are not part of the standard chart language. + +Structure and discipline: every body-page title must be a complete investment assertion, with a one-line subtitle stating scope and how to read it; every number must carry unit, as-of date, and measurement basis — estimates must be flagged, no bare numbers; returns are given only as scenario ranges (bear/base/bull, with probabilities or assumptions), never a single-point IRR, and every valuation conclusion ships with a sensitivity table; assumptions are boxed and made explicit, placed on the page whose conclusion depends on them; risks and mitigations appear in pairs (risk → probability/impact → mitigation → owner); every valuation page must have an anchor (comparable companies, precedent transactions, or DCF cross-check); parallel evidence runs in 2–3 equal-width columns, numbered arguments carrying one bolded claim line plus one proving sentence; chart labels sit on the marks, forecast segments use dashed lines, key drivers are named inside the chart — never rely on the legend alone; the deck closes on a decision or stance, with next actions and a timeline — never end on a thank-you page. + +Default baseline (PART B may override): key metrics are set in a size larger than body text, adjacent to their units and basis; at least one class of high-density financial table is kept, with right-aligned numbers, thousands separators, and a unified negative-number convention; positive/negative semantic colors fixed across the deck; forecast vs. historical visually distinguishable and labeled by basis; each page carries source, basis, and time range in small gray footer text; a single temperament per deck — choose one. Headline read-through test: reading only the page titles across the deck should tell the complete story. Density anchor: per-page minimums for evidence modules and charts follow the PART B density baseline. + +Global prohibitions (mandatory): no default cards (information containers such as status lights, assumption boxes, and verdict bands do not count as cards); no unearned even splits (three/four-way splits and 2×2 grids must be justified by content); no unmotivated AI color schemes (blue-purple gradients, cyan-purple neon, glass cards, glowing borders); no elements that clash with the overall style; chart backgrounds transparent or same as the page background (except reversed-out on dark); no large empty blocks in the body area — planned regions must be filled with real content. + +## PART B — Signature System + +One-line style signature: financial-periodical order in black, white, and gray — white evidence pages carry verifiable numbers via axis-free charts and hairline tables, dark pages hold only judgments and decisions, a single gold anchors current values and key thresholds, and no stray hues appear anywhere in the deck. + +【Color Palette】 +All values below are approximations sampled from the reference images; a single gold anchor, grayscale steps carrying data, and two background depths with distinct duties. +- White background #FFFFFF (approx.): about 3/4 of pages, carrying verifiable data and detail. +- Dark background #151515 (approx.): charcoal, not pure black; used only for summary and closing-action pages, about 1/4. +- Ink black #0A0A0A (approx.): titles on white pages, top rule, line series, black full-width bands, and the strongest text. +- Warm dark gray #3D3C3A (approx.): body text, primary-series bars, key in-table figures. +- Secondary gray #606060 (approx.): subtitle basis line, chart captions, units. +- Supporting gray #A7A7A7 (approx.): secondary series, column labels, auxiliary text on dark. +- Footnote gray #B6B6B6 (approx.): sources, page numbers, and other weakest-tier information. +- Light gray #D6D6D6 (approx.): historical/background series, table hairlines, caption text on dark. +- Panel gray #F0F0F0 (approx.): watermark-sized type, conclusion bands, light reversed cards on dark. +- Track gray #F3F3F3 (approx.): pale track beds for progress and composition bars. +- Primary gold #D6A000 (approx.): the single strong accent anchor — KPI big numbers, current endpoints, threshold capsules, the short gold cover line, key horizontal bars; under 3% of any single page's area, one gold focus per page, no light/dark double gold. +- Copper brown #A86038 (approx.): the only auxiliary semantic color, reserved for exit/risk-related amounts, low frequency. +- Structural lines: on white pages #0A0A0A (approx.) sets page-level boundaries, #D6D6D6 / #E9E9E9 (approx.) separate rows and modules; on dark pages the divider is #302F2D (approx.). +- No red/green up-down system (overrides the PART A baseline): gold marks current and key values, copper brown marks exits/risk, and all other data recedes into neutral gray steps. + +【Layout Skeleton】 +Source facts: 16:9 canvas (source images 1467×825 px, generated at 960×540 pt); left/right margins about 5.5% of canvas width (~52 pt), content span about 89%. The grid resolves to 12 columns, combined per content into thirds, roughly 2:1, roughly 1:1, or five-column tables, overall asymmetric; no logo, no breadcrumbs — the English masthead on the cover carries the publication identity. +- White analysis pages: thin black top rule (about 5% from the top) → conclusory title → gray basis subtitle → light-gray divider → body (starting around 1/5 of page height) → footer with basis/source at left and "n / N" page number at right. +- Dark pages: letterspaced small English label → white conclusory title → one to two lines of explanation → numbered judgments or full-width light cards → bottom judgment/decision line. +- Cover/closing: masthead and date at top left and right → short gold line → two-line large title → abstract → KPI big-number row → oversized watermark at right → black basis band across the bottom. +- Reading path: title assertion → main chart/evidence area → explanation column or KPIs → bottom judgment and basis line; the gold focus closes the attention loop last. + +【Typography】 +Modern sans-serif for both CJK and Latin (Source Han Sans temperament). Title weight 700–800, section titles 600–700, body 400, footnotes lighter. Taking body text as 1x: standard page titles about 2.1–2.4x, cover title about 3x, KPI big numbers about 2.8–3.5x, chart labels about 0.8–0.9x, footnotes about 0.7x (reference at 960×540: body 9–10 pt, page titles 21 pt, cover 36 pt). Big numbers share the line with their units, units shrunk to 50%–70%, basis on the next line; numbers bolded, tight against sign and unit. Small English labels in all caps, light weight, tracking 0.20–0.28em — a financial-periodical header signature, used only on the cover and dark pages. + +【Chart Language】 +- ⭐ Bar–line combo (amount bars + count line): historical bars light gray, current-period bars dark charcoal, the line in ink black; bar values on top, point values above nodes; key changes called out with gold capsules. +- ⭐ Full-width time-series line: ink-black ~2 pt line with circular nodes, the current endpoint enlarged and switched to gold; only a ~1 px baseline remains — no y-axis, grid, or frame. +- ⭐ Horizontal bar groups (ranking/comparison): dark charcoal for the focus item, mid/light grays for the rest and for history; a key series may run entirely in gold; values labeled directly at bar ends, multiple bar groups sharing row baselines. +- ⭐ Grayscale composition bar (100% segments): dark → mid → light segments, reversed-white percentages inside, name and amount annotated in two lines below. +- Dot plot (aligned comparison, low frequency): shares row baselines with horizontal bars; focus-row dots in gold or dark charcoal. +- Step bars (staged progression, select cases): light → mid → dark progression, expected range values flagged in gold. +- In-table progress bars: dark charcoal bars on pale gray tracks embedded in vertical-line-free tables, expressing structural share. +- KPI big-number column: right-hand vertical rail or horizontal row on the cover; gold goes only to the one or two most critical numbers. +- Universal discipline: all data labels placed directly (bar tops / bar ends / beside nodes), never legend-dependent; tables are ruled primarily by horizontal lines — no zebra striping, no dense vertical lines; chart backgrounds match the page. + +【Signature Components】 +- Thin black top rule: fixed header fixture of white analysis pages, ~2 pt full width, the identity line of evidence pages. +- Short thick gold line: about 46×4 pt, set above the cover/closing main title, one per special page only. +- Letterspaced small English label (eyebrow): all caps, tracking 0.20–0.28em, reserved for the cover masthead and dark-page headers. +- Gold capsule: fully rounded gold chip with ink text, carrying only key changes, time cross-sections, or trigger thresholds — at most one per page. +- Right-hand KPI rail: a vertical line sets it off from the main area, big numbers alternating with gray captions; gold/white on dark pages, gold/ink on white pages. +- Oversized light-gray watermark type: panel gray, more than ten times body size, holding a year or institution initials at the right of cover/closing pages, low frequency. +- Bottom black basis band: full-width black bar at the foot of special white pages, small white text carrying fund information and risk disclosures. +- Light-gray verdict band: full-width panel-gray strip at the foot of white pages, closing the page with one bolded judgment. +- Large light-gray numerals: dark key-point pages only, numbered from 01, paired with bolded white assertions. +- Footer "basis + page number" pair: small gray basis/source at left, n / N at right — present on every page of the deck; legends use small squares only, data points small circles only, never decorative. + +【Prohibited】 +- No colored chart series or second accent: apart from gold (and low-frequency copper brown), all data series run in gray steps. +- No red/green up-down pairs: positive/negative semantics are not carried by red and green (overrides the PART A baseline). +- No pies, donuts, radars, stacked areas, 3D, shadows, gradients, glows, or default Office chart styles. +- No y-axes, gridlines, or chart frames — axes keep only the baseline; no chart that can only be read via its legend. +- No complex data grids on dark pages: dark pages carry only stage judgments, executive summaries, and decision asks. +- No sprinkling dark backgrounds across analysis pages: dark pages are about 1/4, fixed at the summary and closing-action pages. +- No photos, illustrations, colored icons, large textures, or logo dependence. +- No rounded-card walls or evenly split card grids: the light full-width card exists only as the dark action-page form. +- No centered layouts or symmetric display titles: everything left-aligned, asymmetric columns. +- No large-area gold fills or full pages of gold type (<3% per page, one focus per page). + +【Slide Types and Layouts】 +Cover snapshot | the deck's single white front page | left ~58% holds the masthead, short gold line, two-line large title, two-line abstract, and three KPIs; oversized watermark at right; black basis band at bottom | ~6 information blocks, the most whitespace in the deck | not suited to detailed data. +Dark key-points page | executive summary or next-quarter action list | small label + white conclusory title + caption line; left ~2/3 numbered judgments, right ~1/3 KPI rail; or three full-width light cards organized as "observation — gold-capsule threshold — trigger action" | 3 judgments + 3–4 KPIs, or 3 threshold cards plus default actions | full-width overall judgment / decision ask at bottom | not suited to complex charts and grids. +Trend data page | time series of totals, revenue, etc. | one main chart in the upper half (bar–line combo or full-width line), lower half in three equal explanation columns or a dual module of "composition bar + step bars" | 1 main chart + 2–4 explanation blocks | gold marks only the current bar, current endpoint, and key capsules | not suited to parallel multi-topic content. +Table matrix page | segment/portfolio breakdown | five-column, four-row vertical-line-free table: name, amount big number, embedded progress bar, representative items, through-line; light-gray hairlines between rows, ink line before the last row, total row + meaning row at bottom | highest density in the deck (~20 information units), noise-reduced via generous row height and gray steps | not suited to long-form narrative. +Comparison ranking page | region/project/approach comparison | horizontal bar groups occupy the left ~2/3, a KPI quick view or dot plot the right 1/3, sharing row baselines; two same-scale bar groups may sit side by side below, closed by a light-gray verdict band | 3–5 bar rows + ~3 KPIs | dual emphasis in gold or dark charcoal goes only to the leader | not suited to time-series narrative. + +【Density Baseline】 +Body pages carry 3–7 information blocks; the standard combination is "one main chart + 2–4 explanation or KPI blocks"; text blocks run 1–2 lines, roughly 20–55 words/characters equivalent, footnotes a single line. Charts directly label 3–8 data points — small samples fully labeled, long series labeled only at first/last and key points; table pages allow ~20 information units, noise-reduced with generous row height, hairlines, and gray steps. Whitespace concentrates in chart backgrounds, inter-column gutters, and the title-to-body transition band — never spread evenly. Dark pages carry fewer blocks, building authority through reversed contrast rather than volume. One gold focus per page; dark pages ~1/4 of the deck; the deck-wide rhythm is "white cover — dark summary — a run of white evidence — dark action close". diff --git a/skills/open-kimi-ppt/reference/design_system/finance/ebony-ledger/design.md b/skills/open-kimi-ppt/reference/design_system/finance/ebony-ledger/design.md new file mode 100644 index 0000000..98e8a5b --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/finance/ebony-ledger/design.md @@ -0,0 +1,72 @@ +# Ebony Ledger · Finance STYLE DESIGN SYSTEM + +**Full creative commitment**: apply your complete creativity and imagination, treating every page as an independent, complete design work worthy of scrutiny. Structure, composition, charts, imagery, and visual narrative must be content-driven — never fall back on default layouts. + +**No AI slop**: no low-judgment, templated, decoration-stacked AI default output, including unjustified card arrays, evenly split grids, gratuitous blue-purple gradients or glassmorphism, icon walls, hollow oversized type, repeated skeletons, and visual gimmicks unrelated to the content. Every page must show clear design judgment with a basis in the content. + +**Landscape delivery**: the final presentation is uniformly 16:9 landscape. Portrait or non-16:9 source material serves only as style observation and must be recomposed into 16:9 landscape — the original canvas ratio must not be carried over directly. + +**Layout coordination**: style.md governs the final style rules (fonts / colors / components / chart language / prohibitions); the "layout / visual task" line that query.md gives for each page governs that page's content structure, primary anchor, and reading order — both are binding execution specs. Layout intent follows the query task line first; final visuals follow style.md. +### Global Prohibitions + +1. **No default cards**: unless the user explicitly requests it, never use rounded rectangles or rectangular cards to build hierarchy or alignment — containers that serve an information function (status lights, assumption boxes, quote frames) do not count as cards. Rules, whitespace, and differences in type size and weight are the better tools. +2. **No evenly split compositions**: unless no other layout is truly available, do not default to three-way splits, four-way splits, or 2×2 matrices — even splits must be justified by content structure (three scenarios naturally take three columns; frameworks explicitly named by the content are exempt). +3. **No unjustified AI color schemes**: institutional palettes specified in the content are exempt; what is banned are bland, common, unjustified default colors — blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, glowing borders. +4. **No elements that clash with the overall style**: nothing outside the style system may appear — for example, rounded icons or rounded rectangles in a sharp style. +5. **Transparent chart backgrounds**: transparent or the page background color, except reverse-white treatments on dark grounds. +6. **Avoid large blank areas**: keep reasonable density in the body area; padding out or diluting content into sparse pages is treated as a defect. Whitespace for breathing, grouping, and rhythm is allowed — form follows content; never stuff material in just to fill the page. + +## PART A — Category Baseline (universal floor) + +Institutional-grade investment research presentations, benchmarked against top-tier fund research reports, due diligence, and strategy outlooks (bulge-bracket bank and sovereign wealth fund standards). Chart-heavy, text-dense, more report-like than consulting decks: arguments are carried by Excel-style financial model tables (three-statement models, scenario analyses, sensitivity grids). Every number traceable, every assumption explicit, every conclusion actionable. + +Content and layout: +1. Thesis-driven structure: deal decks run "Summary → Investment highlights → Target/Market → Business plan/Financial diagnostics → Valuation and returns → Risks and mitigants → Decision request"; research outlooks run "Core stance → Evidence → Scenario analysis → Allocation recommendation". The ending must land on an explicit decision or stance. +2. Tables are the protagonist: valuation ranges, comparable companies, three financial statements, scenario analyses, sensitivity grids, with Excel financial-model row/column discipline (assumption columns, driver rows, and check rows clearly distinguished); charts serve the numbers (football-field valuation charts, IRR bridges, waterfall attributions, scenario fan charts) and are never decorative. +3. High but ordered density: multi-column layouts with clear information hierarchy; each page answers one investment-committee question; density comes from evidence modules, not walls of text. + +Visual style: +1. Aesthetic: restrained, authoritative, compliance-clean. No lifestyle photography, no decorative icons, no marketing superlatives. +2. Typography: use serif for titles when institutional gravitas is needed; sans serif for table body text, chart labels, and all numerals; numbers are always column-aligned. +3. Color: a conservative institutional palette — navy/charcoal structural colors, one restrained accent (e.g., gold or signal blue) reserved for key figures and recommended actions; positive/negative signs use one consistent red-green pair, expressing financial meaning only. +4. Graphics: thin table rules, precise vector chart lines, fine connector lines on bridge charts; no 3D, no shadows, and gradient fills are not a routine chart language. + +Structure and discipline (distilled from the artifacts we consider benchmarks): +1. Every body-page title must be a complete investment assertion (e.g., "This asset will reprice on capacity scarcity" — not "Market overview"), with a one-line subtitle stating scope and how to read the page. +2. Every number carries unit, as-of date, and basis; estimates must be labeled (illustrative / internal estimate); no bare numbers. +3. Returns are given only as scenario ranges (bear/base/bull, with probabilities or driving assumptions) — never a single-point IRR; any valuation conclusion must be paired with a sensitivity table. +4. Assumptions must be made explicit in boxes, placed on the page where the conclusion depends on them; hidden assumptions are treated as defects. +5. Risks and mitigants appear in pairs (risk → probability/impact → mitigant → owner/status); a page with risks but no mitigants is a defect. +6. Valuation pages must be anchored: comparable companies, precedent transactions, or a DCF cross-check — a multiple without a reference set is not evidence. +7. Parallel evidence runs in 2–3 equal-width columns; numbered arguments each carry a one-line bolded claim plus one short proof sentence. +8. Chart annotation discipline: data labels attached to marks, bridge-chart connector blocks labeled block by block, forecast segments dashed, key drivers named inside the chart; charts may not rely on legends alone. +9. The ending must land on a decision or stance: items submitted for decision (approve / reject / conditionally approve) or an explicit allocation stance (overweight / underweight / range), with a to-do list and timeline — never close with a thank-you page. + +Default baseline (distilled from the layout skill; PART B may override): numbers first — key metrics (amounts / growth rates / multiples) must be set larger than body text and presented standalone, immediately adjacent to unit and basis; keep at least one class of high-density financial table (three statements / comps / sensitivity), with right-aligned numbers, thousands separators, and negative-number conventions unified deck-wide; positive/negative semantic colors fixed — up/positive and down/negative each use one fixed color that never changes across the deck; forecast and history must be visually distinguishable (dashes / light tints / hatched bands) and labeled with the basis; every page carries source, basis, and time range in small gray type at the page bottom — numbers without sources are not allowed in the main visual area; a single temperament per deck (dark navy/charcoal with metallic accents OR traditional white ground with blue-gray) — pick one per deck. + +Density anchor: each style's specific floor (evidence modules per page, chart count, annotation habits) follows the 【Density Baseline】 reverse-engineered from that style's source material — this baseline imposes no uniform numbers. + + +## PART B — Signature System (this template's signature; where it conflicts with PART A, this section governs) + +One-line style signature: a calm institutional-annual temperament — pure white ground with a black skeleton, teal-green data, and terracotta conclusions; medium-high density that retains magazine-like breathing room. + +【Color Palette】 Background #FFFFFF; primary body text and headings #000000 — black carries only text, baselines, and the top bar. Primary accent #4C9F8B for current values, main scenarios, or winning items, occupying no more than one-third of any single chart. Supporting #1B5E5C for secondary series or starting values. Conclusion color #A95228 reserved for multipliers, arrows, and short vertical ticks — never large color blocks. Structural gray #CACED7 for historical values; light gray #E4E4E4 for annotation plates and range bands. Chart series pick from #4C9F8B, #1B5E5C, #CACED7, #C39D78; when positive/negative encoding is truly needed, positive is #4C9F8B and negative is #C39D78 — #A95228 does not mean negative. At most two colored hue families per page; the iron rule is that the accent must never blanket the page. + +【Layout Skeleton】 Source facts: 612×792 US Letter portrait, 17:22; wide, stable margins on all four sides; a black horizontal rule placed inset at the top of the page, about 80% of page width. Body is single-column or 48:48 two-column with narrow, stable gutters; reading runs top-to-bottom, left-to-right. No navigation or breadcrumbs; the footer pairs a short running title at left with a thin vertical rule and page number at right. Overriding PART A: section pages may use the theme name as the main title, with the assertion demoted to a weaker subtitle; continuation pages may omit the page title and open with the chart head instead. Cover only: the top rule's left end is indented to about 31% of page width, the title uses two levels of serif, and the lower half page carries a key-point list marked by terracotta vertical ticks. 16:9 migration: unify finally to 16:9 landscape, keep the top bar, left alignment, and two columns, and recompose vertical chart groups into 5:7 or 6:6; the title area takes 14%–17%, the body area about 76%, the footer about 5%; long passages must be restructured. + +【Typography】 Source facts: headings use the embedded serif SanomatTT-Light, with key numerals occasionally in its Medium/Semibold; body, legends, axis labels, and footers use the sans serif GuardianSansTT-Light, with labels in Medium/Regular. Page titles sit clearly above paragraph heads and chart titles but stay restrained overall; chart titles and paragraph heads are only slightly stronger than body. Key numerals may be raised to title level or slightly above when a conclusion genuinely needs focus; footnotes, axis labels, and footers recede noticeably. Conclusion numerals use serif; ordinary data labels use sans serif. Render with {latin: Unna, ea: 思源宋体} (serif titles and conclusion numerals) and {latin: Liter, ea: MiSans} (sans body/labels). In 16:9 landscape, keep the light weights and this relative hierarchy — do not carry over the source's absolute sizes or ratios. + +【Chart Language】 Actually used: horizontal ranking bars, standard/positive-negative/stacked columns, line charts, donut charts, big-vs-small circle comparisons, benchmark dashes, and range bands; tables are not used — when financial tables are required, inherit PART A. ⭐ Historical bars are gray; current or main-scenario bars are teal-green; discrete bars carry direct value labels. ⭐ Change conclusions use large terracotta multipliers with black slanted arrows or brackets — at most once per chart. ⭐ Line charts label only endpoints, turning points, or comparison conclusions. ⭐ Forecast increments use teal-green dashed outlines; recession periods or explanatory zones use light-gray rectangular bands. ⭐ Parallel evidence may form a 2×2 small-chart matrix, each chart keeping its own chart number, serif chart title, and basis line. + +【Signature Components】 Thick black top bar: the header anchor, once per page, hugging the top margin only. Three-layer chart head: sans-serif medium-black chart number + serif chart title + small basis line — once per chart. Terracotta conclusion multiplier: extracts the magnitude of change, at most once per chart and twice per page, placed right next to the arrow or bracket. Light-gray evidence plate: carries benchmarks or summaries, 0–2 per page, hugging chart edges only. Minimal footer: short running title and page number at opposite ends, once per page. + +【Prohibited】 No dark full-bleed pages, dark section pages, or large teal-green backgrounds; no replacing teal-green with navy or bright blue; no heavy sans-serif page titles; no treating #A95228 as a negative-warning color; no colored blocks without data meaning and no more than four series colors. Use photos / illustrations cautiously, never as backgrounds. + +【Slide Types and Layouts】 Single-column argument + main chart | one thesis with one core piece of evidence | upper argument ~30%, middle main chart ~45%, lower explanation ~25% | 3–4 blocks | top bar, three-layer chart head, current value in teal-green | not suited to four parallel conclusions. +Staggered two-column text-image | two sets of evidence explaining each other | ~48:48 two columns, vertical offset allowed | 4–6 blocks | terracotta multipliers, light-gray evidence plates | not suited to continuous long text. +Multi-chart evidence board | cross-validating one conclusion from multiple angles | title and intro ~20%, body is a 2×2 or one-large-two-small chart group | 4–6 blocks, 2–4 charts | independent chart heads, direct value labels | not suited to a single complex causal chain. +Section opening page | opening an asset or theme section | title ~12%, stance and background ~28%, evidence area ~60% | 3–5 blocks | top bar, large serif title, 1–2 charts | not suited to slogans only. +Pure-argument closing page (occasional) | summarizing a stance or disclosing boundaries | single column of 3–4 paragraphs, ~80% wide | 2–4 blocks | top bar and footer only | not suited to number-dense topics. + +【Density Baseline】 Source body pages carry about 230–438 English words, 3–6 evidence modules, 1–4 charts; narrative pages 300–440 words with 0–2 charts; multi-chart pages 230–350 words with 2–4 charts. For 16:9 multi-chart pages, recommend 3–5 modules, 2–4 charts, and 1–2 explanation blocks of 35–70 words/characters equivalent each; narrative pages use 2–4 text blocks of 60–100 words/characters equivalent each, with 0–1 chart. Discrete bars each carry a value label; line charts mark only key points. Place whitespace after titles, between chart groups, and above the footer. No uniform hard floor across page types. diff --git a/skills/open-kimi-ppt/reference/design_system/finance/honey-orange-memo/design.md b/skills/open-kimi-ppt/reference/design_system/finance/honey-orange-memo/design.md new file mode 100644 index 0000000..5976e43 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/finance/honey-orange-memo/design.md @@ -0,0 +1,74 @@ +# Honey Orange Memo · Finance STYLE DESIGN SYSTEM + +## PART A — Category Baseline (universal floor) + +Institutional-grade investment research presentations, benchmarked against top-tier fund research reports, due diligence, and strategy outlooks (bulge-bracket bank and sovereign wealth fund standards). Chart-heavy, text-dense, more report-like than consulting decks: arguments are carried by Excel-style financial model tables (three-statement models, scenario analyses, sensitivity grids). Every number traceable, every assumption explicit, every conclusion actionable. + +Content and layout: +1. Thesis-driven structure: deal decks run "Summary → Investment highlights → Target/Market → Business plan/Financial diagnostics → Valuation and returns → Risks and mitigants → Decision request"; research outlooks run "Core stance → Evidence → Scenario analysis → Allocation recommendation". The ending must land on an explicit decision or stance. +2. Tables are the protagonist: valuation ranges, comparable companies, three financial statements, scenario analyses, sensitivity grids, with Excel financial-model row/column discipline (assumption columns, driver rows, and check rows clearly distinguished); charts serve the numbers (football-field valuation charts, IRR bridges, waterfall attributions, scenario fan charts) and are never decorative. +3. High but ordered density: multi-column layouts with clear information hierarchy; each page answers one investment-committee question; density comes from evidence modules, not walls of text. + +Visual style: +1. Aesthetic: restrained, authoritative, compliance-clean. No lifestyle photography, no decorative icons, no marketing superlatives. +2. Typography: use serif for titles when institutional gravitas is needed; sans serif for table body text, chart labels, and all numerals; numbers are always column-aligned. +3. Color: a conservative institutional palette — navy/charcoal structural colors, one restrained accent (e.g., gold or signal blue) reserved for key figures and recommended actions; positive/negative signs use one consistent red-green pair, expressing financial meaning only. +4. Graphics: thin table rules, precise vector chart lines, fine connector lines on bridge charts; no 3D, no shadows, and gradient fills are not a routine chart language. + +Structure and discipline (distilled from the artifacts we consider benchmarks): +1. Every body-page title must be a complete investment assertion (e.g., "This asset will reprice on capacity scarcity" — not "Market overview"), with a one-line subtitle stating scope and how to read the page. +2. Every number carries unit, as-of date, and basis; estimates must be labeled (illustrative / internal estimate); no bare numbers. +3. Returns are given only as scenario ranges (bear/base/bull, with probabilities or driving assumptions) — never a single-point IRR; any valuation conclusion must be paired with a sensitivity table. +4. Assumptions must be made explicit in boxes, placed on the page where the conclusion depends on them; hidden assumptions are treated as defects. +5. Risks and mitigants appear in pairs (risk → probability/impact → mitigant → owner/status); a page with risks but no mitigants is a defect. +6. Valuation pages must be anchored: comparable companies, precedent transactions, or a DCF cross-check — a multiple without a reference set is not evidence. +7. Parallel evidence runs in 2–3 equal-width columns; numbered arguments each carry a one-line bolded claim plus one short proof sentence. +8. Chart annotation discipline: data labels attached to marks, bridge-chart connector blocks labeled block by block, forecast segments dashed, key drivers named inside the chart; charts may not rely on legends alone. +9. The ending must land on a decision or stance: items submitted for decision (approve / reject / conditionally approve) or an explicit allocation stance (overweight / underweight / range), with a to-do list and timeline — never close with a thank-you page. + +Default baseline (distilled from the layout skill; PART B may override): numbers first — key metrics (amounts / growth rates / multiples) must be set larger than body text and presented standalone, immediately adjacent to unit and basis; keep at least one class of high-density financial table (three statements / comps / sensitivity), with right-aligned numbers, thousands separators, and negative-number conventions unified deck-wide; positive/negative semantic colors fixed — up/positive and down/negative each use one fixed color that never changes across the deck; forecast and history must be visually distinguishable (dashes / light tints / hatched bands) and labeled with the basis; every page carries source, basis, and time range in small gray type at the page bottom — numbers without sources are not allowed in the main visual area; a single temperament per deck (dark navy/charcoal with metallic accents OR traditional white ground with blue-gray) — pick one per deck. + +**Title read-through test**: reading only the page titles across the deck should tell the complete story; if the titles do not read through, the structure has not been established. + +Density anchor: each style's specific floor (evidence modules per page, chart count, annotation habits) follows the 【Density Baseline】 reverse-engineered from that style's source material — this baseline imposes no uniform numbers. + +### Global Prohibitions (AI default routines · mandatory) + +1. **No default cards**: unless the user explicitly requests it, never use rounded rectangles or rectangular cards to build hierarchy or alignment — containers that serve an information function (status lights, assumption boxes, quote frames) do not count as cards. Rules, whitespace, and differences in type size and weight are the better tools. +2. **No evenly split compositions**: unless no other layout is truly available, do not default to three-way splits, four-way splits, or 2×2 matrices — even splits must be justified by content structure (three scenarios naturally take three columns; frameworks explicitly named by the content are exempt). +3. **No unjustified AI color schemes**: institutional palettes specified in the content are exempt; what is banned are bland, common, unjustified default colors — blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, glowing borders. +4. **No elements that clash with the overall style**: nothing outside the style system may appear — for example, rounded icons or rounded rectangles in a sharp style. +5. **Transparent chart backgrounds**: transparent or the page background color, except reverse-white treatments on dark grounds. +6. **No regional blank space**: the body content area keeps no swaths of blank space; any planned region must be filled with real content — failing to fill it is the most severe form of sloppiness. + +## PART B — Signature System (this template's signature; where it conflicts with PART A, this section governs) + +One-line style signature: an investment-committee, report-style financial tone; warm-white ground, deep navy skeleton, bright orange anchors, cool blue and light peach as support — high information density with clear layering. + +【Color Palette】 +Background approx. #FAF8F6, with white #FFFFFF reserved for tables or note areas; primary text #4D4D55; titles and primary accent #FF6600; left structural rail approx. #FF5703. Deep structural color #172856 for active navigation segments, table headers, side labels, and argument bands; supporting #25408B and #579DB7 for series and comparisons; #FFE0CC and #96C2D2 for note blocks or row groups; #A6A6A6/#D9D9D9 as separators only. Chart series map orange → deep blue → cyan-blue; forecast segments switch to light tints or textures; positive/negative fixed at #008000 / #C00000, expressing financial direction only. Hold 4–6 meaningful hues per page; orange must not blanket the body. + +【Layout Skeleton】 +Source facts: 960×540 pt, 16:9. Nearly every page has a full-height left orange rail; standard pages carry a five-segment chevron navigation at top — current segment deep blue, the rest gray. The title area sits upper-left: bold orange title ~28 pt, gray subtitle ~16 pt, body starting at ~110 pt height; the body favors left chart/table + right commentary, an upper conclusion band over a lower evidence band, or three columns. The footer keeps only source/notes and page number. Section pages (5 in total) carry only a large orange number + deep blue title; the cover is a special case — full-bleed dark photography, deep navy overlay, white title, and an orange date block — and is not reused in body pages. + +【Typography】 +Source uses the sans-serif Arial family: ArialMT for body, Arial-BoldMT for titles/emphasis, a little Helvetica-Bold in footers; no stable serif observed. Body 10.6–11 pt = 1x, subtitles 16 pt ≈ 1.45x, regular titles 28 pt ≈ 2.5x, section numbers/titles 44 pt ≈ 4x, key large numbers 16–32 pt ≈ 1.5–3x, footnotes 7–8 pt ≈ 0.65–0.75x. Titles, conclusion bands, and key figures use bold; CAGR, multiples, and units may use italics; English abbreviations and years do not switch fonts. + +【Chart Language】 +Actual types: historical/forecast stacked columns and lines, event-annotated price lines, driver bridge charts, sensitivity matrices, comparable-company tables, historical/forecast financial tables, risk matrices, process cycle diagrams. ⭐ Forecast segmentation: table headers grouped in gray/deep blue/orange, forecast cells with light tints or hatching, CAGR and key years labeled directly on charts. ⭐ Event line charts: thin orange frames hung directly off data points. ⭐ Bridge charts: drivers color-coded, terminal value as a tall orange bar, with an item-by-item explanation row below. ⭐ Sensitivity matrices: deep-blue row/column headers, the base case circled with a green dashed line or orange border. ⭐ Financial model tables: multi-level headers, with grouped rows and total rows distinguished by gray/orange/light-yellow fills. + +【Signature Components】 +Fixed components are the five-segment chevron navigation and the left orange rail; deep-blue horizontal title bands with white text, about 2–5 per page. Orange numbered circles / lettered circles attach to the left end of argument bands — no more than 6 per argument page. Deep-blue, orange, and light-blue side labels head risk/stage/status rows without pressing into the body. Light-orange or light-blue note blocks carry only assumptions or commentary, 1–3 per page. Cycle flywheels and dashed rounded process frames are occasional components, appearing only on process pages. + +【Prohibited】 +No flattening the chevron navigation into straight tabs, and no removing the left orange rail; no expanding orange into large background areas; no body photography or decorative illustration — photography lives only on the cover; no stuffing charts or long text into section pages; no rounded containers without an information function — a few dashed rounded frames on process pages are the only occasional exception. + +【Slide Types and Layouts】 +Argument–evidence band page | one assertion with 3–6 proofs | title area + horizontal deep-blue argument band, or 60/40 left-right | 3–6 blocks | numbered circles, title bands | not suited to line-by-line financial detail. +High-density chart–commentary page | markets, trends, customers, returns | charts 60–70%, commentary 30–40% | 2–4 charts + 2–5 commentary blocks | direct labels, orange event frames | not suited to pure narrative. +Financial model / comps table page | history and forecast, comps, sensitivity | main table 60–85%, commentary right or below | 1 main table + 1 commentary area | multi-level headers, light-yellow total rows | not suited to abstract processes. +Risk / plan matrix page | risks–mitigants, status–actions | left category column 15–20%, evidence in the middle, actions/timing on the right | 4–8 rows | colored side labels, probability or scoring color scales | not suited to unprioritized long checklists. +Proposition list page (occasional) | multiple premises advancing in sequence | deep-blue vertical column at left, numbered list stacked at right | 4–6 items | orange numbered circles | not suited to dense data tables. + +【Density Baseline】 +Most body content occupies about 70–85% of the canvas. Argument pages: 3–6 evidence blocks. Chart pages: 2–4 charts, with columns, points, terminal values, and key differences labeled directly, forecast segments in light tints/hatching; explanation text in 2–5 blocks of about 40–120 words/characters equivalent each. Financial model pages center on one main table occupying 60–85% of the width, with 4–8 short comments to the right/below. Whitespace concentrates between title and subtitle, between modules, and in the outer margins; the body keeps no unexplained swaths of blank space — only section pages may hold large whitespace. diff --git a/skills/open-kimi-ppt/reference/design_system/finance/lake-blue-memo/design.md b/skills/open-kimi-ppt/reference/design_system/finance/lake-blue-memo/design.md new file mode 100644 index 0000000..fef6905 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/finance/lake-blue-memo/design.md @@ -0,0 +1,75 @@ +# Lake Blue Memo · Finance STYLE DESIGN SYSTEM + +## PART A — Category Baseline (Universal Minimum) + +Institutional-grade investment research presentations benchmarked against top-tier fund research reports, due diligence materials, and strategy outlooks (global investment bank and sovereign wealth fund standards). Chart-heavy and text-dense, these decks should feel more like formal reports than consulting presentations: Excel-style financial model tables (three financial statements, scenario analyses, and sensitivity grids) carry the argument. Every figure must be traceable, every assumption explicit, and every conclusion actionable. + +Content and layout: +1. Thesis-led structure: transaction decks follow “Executive Summary → Investment Highlights → Target/Market → Business Plan/Financial Diagnosis → Valuation and Returns → Risks and Mitigations → Decision Request”; research and outlook decks follow “Core View → Evidence → Scenario Analysis → Allocation Recommendation.” The ending must resolve into a clear decision or position. +2. Tables take center stage: valuation ranges, trading comparables, three-statement financials, scenario analyses, and sensitivity grids should follow the row-and-column discipline of an Excel financial model, with clearly separated assumption columns, driver rows, and check rows. Charts serve the numbers—football-field valuation charts, IRR bridges, attribution waterfalls, and scenario fan charts—and are never decorative. +3. High but orderly density: use multi-column layouts with a clear information hierarchy. Each page answers one investment committee question. Density comes from evidence modules, not walls of text. + +Visual style: +1. Aesthetic: restrained, authoritative, and compliance-clean. Do not use lifestyle photography, decorative icons, or marketing superlatives. +2. Typography: when institutional gravitas is required, use serif type for titles; use sans serif for table body text, chart labels, and all numbers. Always align numbers by column. +3. Color: use a conservative institutional palette—navy/charcoal structural colors, with one restrained accent (such as gold or signal blue) reserved for key figures and recommended actions. Use one consistent red/green pair for positive and negative values, and only to convey financial meaning. +4. Graphics: use fine table rules, precise vector chart lines, and thin bridge-chart connectors. Do not use 3D, shadows, or gradient fills as standard chart language. + +Structure and discipline (distilled from work we recognize as benchmark quality): +1. Every content-page title must be a complete investment assertion (for example, “The asset will reprice because capacity is scarce,” not “Market Overview”), followed by a one-line subtitle defining scope and how to read the page. +2. Every number must include a unit, point in time, and basis of measurement; estimates must be labeled (illustrative/internal estimate). Bare numbers are not allowed. +3. Present returns only as scenario ranges (downside/base/upside, with probabilities or driver assumptions), never as a single-point IRR; every valuation conclusion must include a sensitivity table. +4. Assumptions must be made explicit in a box on the page whose conclusion depends on them. Hidden assumptions are treated as defects. +5. Pair every risk with its mitigation (Risk → Probability/Impact → Mitigation → Owner/Status). A page that presents risks without mitigations is defective. +6. Every valuation page must have an anchor: trading comparables, precedent transactions, or DCF cross-validation. A multiple without a benchmark set is not evidence. +7. Place parallel evidence in 2–3 equal-width columns; each numbered argument includes a one-line bold assertion plus one concise proof statement. +8. Chart annotation discipline: label data marks directly, annotate bridge-chart blocks one by one, show forecast periods with dashed lines, and name key drivers inside the chart. Charts must never rely on legends alone. +9. End with a decision or position: specify the requested action (approve/reject/approve with conditions) or a clear allocation stance (overweight/underweight/range), plus an action list and timeline. Do not end with a thank-you page. + +Default baseline (distilled from the layout skill; PART B may override): numbers first—key metrics (amounts/growth rates/multiples) must appear independently at a larger size than body text, immediately adjacent to their units and basis; retain at least one class of high-density financial table (three statements/comparables/sensitivity), with right-aligned numbers, thousands separators, and a consistent negative-number convention throughout; lock positive and negative semantic colors, using one fixed color for gains/positive values and one for declines/negative values throughout; forecasts and historicals must be visually distinct (dashed lines/light tints/hatched bands) and their basis labeled; place the data source, basis, and date range in small gray text at the bottom of every page, and never place unsourced figures in the primary visual area; maintain one visual character (dark navy/charcoal + metallic accents, or traditional white + blue-gray), selecting only one per deck. + +**Title Read-Through Test**: Reading only the page titles should tell the complete story; if they do not flow as a coherent narrative, the structure has failed. + +Density anchor: the specific minimum for each style—evidence modules per page, chart count, and annotation conventions—is defined by the 【Density Baseline】 reverse-engineered from that style’s source deck. This baseline does not impose a single universal number. + +### Global Prohibitions (AI Defaults · Mandatory) + +1. **No cards by default**: Unless the user explicitly requests them, do not use rounded rectangles or rectangular cards to create hierarchy or alignment. Containers with a genuine information function (status lights, assumption boxes, quotation boxes) are not considered cards. Lines, whitespace, type size, and weight differences are better tools. +2. **No equal-split compositions**: Unless no other viable layout exists, do not default to three equal columns, four equal columns, or a 2×2 matrix. Equal division must be justified by the content structure (three scenarios naturally warrant three columns; frameworks explicitly named in the content are exempt). +3. **No ungrounded AI color schemes**: The institutional palette specified in the body is exempt. Prohibited choices are generic, familiar, and unjustified defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **No elements that clash with the overall style**: Do not introduce out-of-style treatments, such as rounded icons or rounded rectangles in a sharp-edged visual system. +5. **Keep chart backgrounds transparent**: Use transparency or the page background color, except when reversing out on a dark background. +6. **No empty regions**: Do not leave large blank areas in the body content zone. Every planned region must be filled with real content; an unfilled region is the most serious form of visual roughness. + +## PART B — Signature System (Template-Specific Signature; PART B Prevails in Case of Conflict with PART A) + +One-line style signature: a portrait institutional editorial-report aesthetic, grounded in paper white and deep lake blue, with grape purple as the title axis and bright blue-gray charts as evidence—dense without boxes, like a research journal designed to be browsed. + +【Color Palette】 +Background #FFFFFF occupies the vast majority of content-page area; near-white blue #EEF3F9 is reserved for full-page coverage on the opening statement page. Primary text #072535 is used for body text, running headers, and primary axis labels, keeping dense small type legible. Title color #490E5A is used for section names, pull quotes, and evidence conclusions, never as a body background. Primary accent #490E5A is reserved for judgment statements and evidence numbers; related deep purple #49004B is used only for small chart titles. Secondary #0C989A is used for large section numbers; #FFA500 marks the starting dot of a question-and-answer sequence; #DFE3F6 provides a light fill for grouped table headers. Chart series use #0229B1 for the primary series and #869198 for comparisons; #00A1C7, #5CA712, #490E5A, and #FFA500 join only for multi-series or phase encoding. Positive color #5CA712 and negative color #ED1C24 express directional judgments only. Excluding neutrals, standard pages use no more than 2 hues, and chart pages usually no more than 4; phase diagrams or heatmaps may exceed this for one-to-one data encoding, but the iron rule is that accent colors never flood a content page. + +【Layout Skeleton】 +Source-deck facts: the canvas is 612×792 pt, portrait Letter, with a 17:22 ratio; left and right body margins are approximately 54 pt. A lightweight running header and page number sit at the upper right, while a gray hairline spans the content width approximately 78 pt from the top. The body commonly uses a 48%|4% gutter|48% two-column grid, read vertically from the upper left to the bottom before moving to the right column. Chart-dense pages shift to a full-width primary evidence module at the top with paired left-right modules below, or two columns of small multiples. Cover only: full-bleed photography with a very large, white, left-aligned title. Contents page only: an index occupying approximately the left 2/3 and a deep lake-blue information sidebar occupying approximately the right 1/3. For 16:9 migration: on a 960×540 canvas, preserve approximately 5.5% outer margins, the top hairline, and the upper-right page number; reflow portrait long-form text into a 15%–22% title band above 2–3 horizontal evidence zones. Never scale the entire portrait page down proportionally and center it. Section pages retain giant, light-weight purple titles that may occupy 55%–62% of the left side, with the summary or first evidence module placed to the right and below. + +【Typography】 +Source-deck typography facts: the PDF embeds Ghost Regular, Light, Bold, Italic, and Medium, all sans serif (render with {latin: Liter, ea: MiSans}). Body text is 10 pt=1x; charts, tables, and sources are 8 pt≈0.8x; module headings and pull quotes are 18–20 pt≈1.8–2x; large content-page titles are approximately 38 pt≈3.8x; section titles and large numbers are 58 pt≈5.8x; the cover title is 85 pt≈8.5x. Use Light for giant titles and pull quotes, Regular for body text, Bold for evidence labels, and Italic only for terminology or subtle emphasis. For 16:9 migration: on 960×540, use 16–18 px body text, 13–15 px captions, 11–13 px sources, 28–34 px pull quotes, 56–64 px content-page titles, and 84–96 px section titles and large numbers. Preserve the original ratios and the relationship of “light titles, bold labels.” English titles use sentence case; section numbering is all caps. Keep numbers, units, and percent signs together without decorative tracking. + +【Chart Language】 +Useful chart types include line charts, grouped/stacked bar charts, stacked area charts, waterfall charts, scatter plots, phase-path diagrams, forecast/scenario tables, and correlation heatmaps; heatmaps and phase-path diagrams are both occasional-use formats. ⭐Begin every evidence module with “number + one-sentence purple conclusion,” followed by a hairline and a bold chart title; the chart itself receives no separate card background. ⭐A single page often arranges 2–4 small charts in two columns, each with its own short title, basis, and source, creating editorial-style small multiples. ⭐Use bright blue for the primary series and gray for comparisons; call out key inflection points with red outlined circles or thin arrows, and use only very light gray vertical bands for interval backgrounds. ⭐Forecast/scenario tables use light lavender grouped headers; only comparison cells receive pale cyan or pale warm-red fills, while white table bodies and fine lake-blue rules remain dominant. + +【Signature Components】 +Borderless purple pull quote: extract one judgment statement from the long-form text and place it at the bottom or side of a column, no more than 1 time per page, never overlapping a chart. Large cyan number + short gray rule above: use only for sections presenting a sequence of numbered viewpoints, with 1 per viewpoint and no more than 2 on a page. Green upward triangle/red downward triangle: use only for grouped positive and negative judgment lists, never as a replacement for ordinary bullets. Solid orange dot + question number: mark only the beginning of one question-and-answer sequence; do not repeat it on continuation pages. Photography is a hard constraint: the cover uses one full-bleed, shallow-depth-of-field natural macro photograph, with the title positioned over a low-texture area. Content pages must not substitute photography for data evidence; small portraits are limited to the contents-page information sidebar. + +【Prohibited】 +Do not use serif titles; in this template, the Ghost sans-serif family overrides PART A’s option for formal serif typography. Do not use large dark backgrounds with reversed body text on content pages; a solid deep lake-blue block is allowed only in the contents-page sidebar. Do not expand purple or blue into large content containers; they appear only in text, chart lines, table headers, or small signals. Do not center large content-page titles; section names, viewpoints, and questions are all left-aligned. Do not replace cross-supported small-multiple evidence with a single unannotated “hero image”; if one chart spans the full width, it must still include an evidence conclusion, basis, and source. + +【Slide Types and Layouts】 +Section opener|Begin a new argumentative section|Giant title in the top 30%, two columns or “text + table/chart” in the bottom 70%|2–4 modules|Section number, pull quote|Not suitable for continuous data updates. +Two-column long-form page|Explain one complex judgment progressively|48% / 4% gutter / 48%, with space at the bottom of a column for a pull quote|2–5 modules|Purple pull quote|Not suitable for comparing more than four entities at once. +Small-multiple evidence page|Use multiple metrics to support one conclusion|Full-width primary chart at the top or 2–4 charts in two columns|3–6 modules|Evidence-number strip, inflection-point circle/arrow|Not suitable when there is only one qualitative viewpoint. +Numbered-viewpoint page|Present 3–5 core judgments in sequence|Approximately 50% charts and 50% numbering + explanation, or one judgment on each side|4–6 modules|Large cyan numbers, pull quote|Not suitable for non-sequential content. +Positive/negative judgment list|Present grouped trade-offs|Two-column vertical lists, each item beginning with a triangle|3–5 modules|Red/green triangles|Not suitable for neutral description. +Serialized Q&A page|Develop an evidence-based answer around one question|Question header approximately 15%, two columns below; continuation pages may include 1–2 charts|3–6 modules|Orange question dot, pull quote|Not suitable for packing multiple unrelated questions onto one page. + +【Density Baseline】 +Source-deck content pages typically contain approximately 1,600–4,500 English characters. Long-form pages primarily use 2 columns, 4–8 natural paragraphs, and 1 pull quote; small-multiple pages contain 2–4 charts/tables and 1–2 explanation blocks, with an independent source for every evidence module. Bar charts usually label every bar; line charts label only key inflection points, extremes, and the latest point, rather than displaying numbers at every point. For new work in 16:9, recommended density is: 2–3 evidence blocks on section pages; 2–4 explanation blocks on long-form pages, each approximately 80–180 words/characters equivalent; 2–3 charts on small-multiple pages, increasing to 4 only when structurally necessary. Concentrate whitespace around giant titles, in the two-column gutter, between chart modules, and in the source area at the bottom of the page; do not leave large unassigned voids in the body content zone. diff --git a/skills/open-kimi-ppt/reference/design_system/finance/prospect-annual/design.md b/skills/open-kimi-ppt/reference/design_system/finance/prospect-annual/design.md new file mode 100644 index 0000000..9b2c56b --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/finance/prospect-annual/design.md @@ -0,0 +1,68 @@ +# Prospect Annual · Finance STYLE DESIGN SYSTEM + +**Full creative commitment**: apply your complete creativity and imagination, treating every page as an independent, complete design work worthy of scrutiny. Structure, composition, charts, imagery, and visual narrative must be content-driven — never fall back on default layouts. + +**No AI slop**: no low-judgment, templated, decoration-stacked AI default output, including unjustified card arrays, evenly split grids, gratuitous blue-purple gradients or glassmorphism, icon walls, hollow oversized type, repeated skeletons, and visual gimmicks unrelated to the content. Every page must show clear design judgment with a basis in the content. + +**Landscape delivery**: the final presentation is uniformly 16:9 landscape. Portrait or non-16:9 source material serves only as style observation and must be recomposed into 16:9 landscape — the original canvas ratio must not be carried over directly. + +**Layout coordination**: style.md governs the final style rules (fonts / colors / components / chart language / prohibitions); the "layout / visual task" line that query.md gives for each page governs that page's content structure, primary anchor, and reading order — both are binding execution specs. Layout intent follows the query task line first; final visuals follow style.md. +### Global Prohibitions + +1. **No default cards**: unless the user explicitly requests it, never use rounded rectangles or rectangular cards to build hierarchy or alignment — containers that serve an information function (status lights, assumption boxes, quote frames) do not count as cards. Rules, whitespace, and differences in type size and weight are the better tools. +2. **No evenly split compositions**: unless no other layout is truly available, do not default to three-way splits, four-way splits, or 2×2 matrices — even splits must be justified by content structure (three scenarios naturally take three columns; frameworks explicitly named by the content are exempt). +3. **No unjustified AI color schemes**: institutional palettes specified in the content are exempt; what is banned are bland, common, unjustified default colors — blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, glowing borders. +4. **No elements that clash with the overall style**: nothing outside the style system may appear — for example, rounded icons or rounded rectangles in a sharp style. +5. **Transparent chart backgrounds**: transparent or the page background color, except reverse-white treatments on dark grounds. +6. **Avoid large blank areas**: keep reasonable density in the body area; padding out or diluting content into sparse pages is treated as a defect. Whitespace for breathing, grouping, and rhythm is allowed — form follows content; never stuff material in just to fill the page. + +## PART A — Category Baseline (universal floor) + +Institutional-grade investment research presentations, benchmarked against top-tier fund research reports, due diligence, and strategy outlooks (bulge-bracket bank and sovereign wealth fund standards). Chart-heavy, text-dense, more report-like than consulting decks: arguments are carried by Excel-style financial model tables (three-statement models, scenario analyses, sensitivity grids). Every number traceable, every assumption explicit, every conclusion actionable. + +Content and layout: +1. Thesis-driven structure: deal decks run "Summary → Investment highlights → Target/Market → Business plan/Financial diagnostics → Valuation and returns → Risks and mitigants → Decision request"; research outlooks run "Core stance → Evidence → Scenario analysis → Allocation recommendation". The ending must land on an explicit decision or stance. +2. Tables are the protagonist: valuation ranges, comparable companies, three financial statements, scenario analyses, sensitivity grids, with Excel financial-model row/column discipline (assumption columns, driver rows, and check rows clearly distinguished); charts serve the numbers (football-field valuation charts, IRR bridges, waterfall attributions, scenario fan charts) and are never decorative. +3. High but ordered density: multi-column layouts with clear information hierarchy; each page answers one investment-committee question; density comes from evidence modules, not walls of text. + +Visual style: +1. Aesthetic: restrained, authoritative, compliance-clean. No lifestyle photography, no decorative icons, no marketing superlatives. +2. Typography: use serif for titles when institutional gravitas is needed; sans serif for table body text, chart labels, and all numerals; numbers are always column-aligned. +3. Color: a conservative institutional palette — navy/charcoal structural colors, one restrained accent (e.g., gold or signal blue) reserved for key figures and recommended actions; positive/negative signs use one consistent red-green pair, expressing financial meaning only. +4. Graphics: thin table rules, precise vector chart lines, fine connector lines on bridge charts; no 3D, no shadows, and gradient fills are not a routine chart language. + +Structure and discipline (distilled from the artifacts we consider benchmarks): +1. Every body-page title must be a complete investment assertion (e.g., "This asset will reprice on capacity scarcity" — not "Market overview"), with a one-line subtitle stating scope and how to read the page. +2. Every number carries unit, as-of date, and basis; estimates must be labeled (illustrative / internal estimate); no bare numbers. +3. Returns are given only as scenario ranges (bear/base/bull, with probabilities or driving assumptions) — never a single-point IRR; any valuation conclusion must be paired with a sensitivity table. +4. Assumptions must be made explicit in boxes, placed on the page where the conclusion depends on them; hidden assumptions are treated as defects. +5. Risks and mitigants appear in pairs (risk → probability/impact → mitigant → owner/status); a page with risks but no mitigants is a defect. +6. Valuation pages must be anchored: comparable companies, precedent transactions, or a DCF cross-check — a multiple without a reference set is not evidence. +7. Parallel evidence runs in 2–3 equal-width columns; numbered arguments each carry a one-line bolded claim plus one short proof sentence. +8. Chart annotation discipline: data labels attached to marks, bridge-chart connector blocks labeled block by block, forecast segments dashed, key drivers named inside the chart; charts may not rely on legends alone. +9. The ending must land on a decision or stance: items submitted for decision (approve / reject / conditionally approve) or an explicit allocation stance (overweight / underweight / range), with a to-do list and timeline — never close with a thank-you page. + +Default baseline (distilled from the layout skill; PART B may override): numbers first — key metrics (amounts / growth rates / multiples) must be set larger than body text and presented standalone, immediately adjacent to unit and basis; keep at least one class of high-density financial table (three statements / comps / sensitivity), with right-aligned numbers, thousands separators, and negative-number conventions unified deck-wide; positive/negative semantic colors fixed — up/positive and down/negative each use one fixed color that never changes across the deck; forecast and history must be visually distinguishable (dashes / light tints / hatched bands) and labeled with the basis; every page carries source, basis, and time range in small gray type at the page bottom — numbers without sources are not allowed in the main visual area; a single temperament per deck (dark navy/charcoal with metallic accents OR traditional white ground with blue-gray) — pick one per deck. + +Density anchor: each style's specific floor (evidence modules per page, chart count, annotation habits) follows the 【Density Baseline】 reverse-engineered from that style's source material — this baseline imposes no uniform numbers. + + +## PART B — Signature System (this template's signature; where it conflicts with PART A, this section governs) + +One-line style signature: deep navy and generous whitespace as the ground, neon mint green and cool lavender purple setting the focus; on four-column research pages, giant condensed assertions and single-block colored conclusion panels create annual-report rhythm. + +【Color Palette】 Body background #FFFFFF; primary text and body titles #000533; full-bleed #000533 only on covers/section pages. Primary accent #1EFF8F for section display type, arrow tiles, and key columns; supporting #A29AFF for section display type, line charts, and decorative squares, diluted to #C7C2FF and #DAD7FF for quote panels or secondary columns. Conclusion panels use #A5FFD2; whole-block focus panels use #D2FFE9. The table of contents may exceptionally go full-bleed #78FFBC; occasional special features may use a #FBFFCC ground with #FFE900. Chart series prefer #001AFF, #1EFF8F, #A29AFF/#DAD7FF, adding #FFE380 and #998C00 as needed when stacking. Positive/negative colors inherit from PART A — the source has formed no stable increment. Each page is usually deep navy plus 1–2 hue families; multi-series charts are the exception; saturated accents must not blanket the body. + +【Layout Skeleton】 Source facts: canvas 1224×792, 17:11 (1.545:1); narrow margins on all four sides; four columns unfold at an even rhythm with narrow, consistent gutters. Title fixed upper-left; section openers hold an oversized assertion across roughly the top quarter with four columns below, and continuation pages go straight to four columns or "left two columns of text, right two columns of charts". Navigation appears only in the table of contents — numbered items with horizontal rules and three columns of information; the footer centers the running title and right-aligns the page number. Reading path: assertion → left-side explanation → right-side evidence charts → colored conclusion panel. Cover/section only: deep-navy ground, oversized title at left, and at right one arrow tile above a rounded-square mosaic. 16:9 migration: unify finally to 16:9 landscape, keep the four columns, the left-right division of labor, the footer, and the section mosaics; compress title-to-body spacing and pull the body forward; reduce line counts within the four columns; tall three-column panels become horizontal panels spanning 2–3 right-side columns. + +【Typography】 Source facts: the whole deck is sans serif; the PDF font table verifies display headings in `SharpGroteskBold-14`, body and charts in `Inter-Regular`, emphasis in `Inter-Bold`. Render: titles in Anton (ultra-condensed bold feel, via customFonts) or MiSans Bold; body/charts in Inter (via customFonts) or Liter (Chinese: MiSans). Body text stays compact and continuously readable; subheads and chart captions are only slightly stronger than body; main assertions and pull quotes form clear focal points; section slogans and cover slogans become full-page protagonists only on their special pages. No standalone KPI tier — column-top and endpoint numerals sit close to the chart-label level; footnotes recede noticeably. Section eyebrows are all caps, everything else uses sentence-style titles; no serif. In 16:9 landscape, keep the "ultra-condensed bold display titles + Inter body" hierarchy and weight relations — do not carry over the source's absolute sizes or ratios. + +【Chart Language】 Actually used: line charts, multi-series/dual-axis lines, clustered columns, column + dot dual-axis, stacked columns, and zero-crossing columns; no data tables in the body — when tables are required, inherit PART A. ⭐ Half-page evidence chart: chart title above, the chart occupying the right two columns, the left two columns holding explanation and conclusion panel. ⭐ Layered annotation: column charts label every column, line charts mark only endpoints/key values, legends identify series only. ⭐ Forecast bands are used only occasionally and are not mandatory to migrate. Backgrounds follow the page; sources sit directly under charts. + +【Signature Components】 Body pages stably use 1 — at most 2 — light rounded conclusion/quote panels in #A5FFD2, #C7C2FF, or #DAD7FF, spanning one to two columns, placed close to the text or chart they explain, never covering charts and never split into card walls. The cover and 4 section pages use the "arrow tile + rounded-square mosaic", hugging the right half / right edge only, never entering the body. The running title and page number are the footer anchors. Portraits appear only occasionally in the foreword. + +【Prohibited】 No serif titles — gravitas is carried by the ultra-condensed bold. No full-bleed deep navy/mint/purple on ordinary body pages — dark grounds go only to covers/sections, and bright-green full-bleed only to the table of contents. No replicating conclusion panels into card walls. No extending photos into body backgrounds. No per-point markers and numerals on line charts. No reusing the arrow mosaic outside section pages. + +【Slide Types and Layouts】 Big-title overview page | section stance and first round of evidence | top 25–30% giant assertion, four columns below | 5–6 blocks | conclusion panels, optional single right-side chart | not suited to tiled multi-metric layouts. Two-column argument + half-page chart page | text and one main chart cross-validating | left 48% explanation, right 52% charts | 4–5 blocks | 1 conclusion panel + direct labels | not suited to many small charts. Four-column continuation / multi-theme survey (occasional) | parallel factors | four narrow columns, 1–2 conclusion panels at bottom/side | 5–7 blocks | light-purple judgment boxes | not suited to single-evidence magnification. Focused analysis panel page (occasional) | one judgment with multiple explanation passages and one chart | left column limits the text, right three columns hold a light-mint panel containing title, explanation, and chart | 4–6 blocks | combined charts inside panels | not suited to unrelated topics. Full-bleed feature analysis (occasional) | a single feature's history–drivers–outlook | light full-page ground, main chart at left, explanation in the middle, conclusion at right | 5 blocks | single-color conclusion block | not to be applied repeatedly. + +【Density Baseline】 The 12 body pages typically hold 4–6 independent blocks, with a few four-column pages reaching 7; the 8 chart body pages each carry exactly 1 chart. Explanation blocks run about 120–220 words/characters equivalent, main assertions 24–50, conclusion panels 30–70; column charts label every column, line charts mark only key points. Whitespace concentrates between title and body, in gutters, and above the footer; the content area keeps no orphan blocks. Covers/section pages are the low-density exception. diff --git a/skills/open-kimi-ppt/reference/design_system/finance/rice-paper-annual/design.md b/skills/open-kimi-ppt/reference/design_system/finance/rice-paper-annual/design.md new file mode 100644 index 0000000..5ac15f5 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/finance/rice-paper-annual/design.md @@ -0,0 +1,62 @@ +# Rice Paper Annual · Finance STYLE DESIGN SYSTEM + +## PART A — Category Baseline (universal floor) + +Institutional-grade investment research presentations, benchmarked against top-tier fund research reports, due diligence, and strategy outlooks (bulge-bracket bank and sovereign wealth fund standards). Chart-heavy, text-dense, more report-like than consulting decks: arguments are carried by Excel-style financial model tables (three-statement models, scenario analyses, sensitivity grids). Every number traceable, every assumption explicit, every conclusion actionable. + +Content and layout: +1. Thesis-driven structure: deal decks run "Summary → Investment highlights → Target/Market → Business plan/Financial diagnostics → Valuation and returns → Risks and mitigants → Decision request"; research outlooks run "Core stance → Evidence → Scenario analysis → Allocation recommendation". The ending must land on an explicit decision or stance. +2. Tables are the protagonist: valuation ranges, comparable companies, three financial statements, scenario analyses, sensitivity grids, with Excel financial-model row/column discipline (assumption columns, driver rows, and check rows clearly distinguished); charts serve the numbers (football-field valuation charts, IRR bridges, waterfall attributions, scenario fan charts) and are never decorative. +3. High but ordered density: multi-column layouts with clear information hierarchy; each page answers one investment-committee question; density comes from evidence modules, not walls of text. + +Visual style: +1. Aesthetic: restrained, authoritative, compliance-clean. No lifestyle photography, no decorative icons, no marketing superlatives. +2. Typography: use serif for titles when institutional gravitas is needed; sans serif for table body text, chart labels, and all numerals; numbers are always column-aligned. +3. Color: a conservative institutional palette — navy/charcoal structural colors, one restrained accent (e.g., gold or signal blue) reserved for key figures and recommended actions; positive/negative signs use one consistent red-green pair, expressing financial meaning only. +4. Graphics: thin table rules, precise vector chart lines, fine connector lines on bridge charts; no 3D, no shadows, and gradient fills are not a routine chart language. + +Structure and discipline (distilled from the artifacts we consider benchmarks): +1. Every body-page title must be a complete investment assertion (e.g., "This asset will reprice on capacity scarcity" — not "Market overview"), with a one-line subtitle stating scope and how to read the page. +2. Every number carries unit, as-of date, and basis; estimates must be labeled (illustrative / internal estimate); no bare numbers. +3. Returns are given only as scenario ranges (bear/base/bull, with probabilities or driving assumptions) — never a single-point IRR; any valuation conclusion must be paired with a sensitivity table. +4. Assumptions must be made explicit in boxes, placed on the page where the conclusion depends on them; hidden assumptions are treated as defects. +5. Risks and mitigants appear in pairs (risk → probability/impact → mitigant → owner/status); a page with risks but no mitigants is a defect. +6. Valuation pages must be anchored: comparable companies, precedent transactions, or a DCF cross-check — a multiple without a reference set is not evidence. +7. Parallel evidence runs in 2–3 equal-width columns; numbered arguments each carry a one-line bolded claim plus one short proof sentence. +8. Chart annotation discipline: data labels attached to marks, bridge-chart connector blocks labeled block by block, forecast segments dashed, key drivers named inside the chart; charts may not rely on legends alone. +9. The ending must land on a decision or stance: items submitted for decision (approve / reject / conditionally approve) or an explicit allocation stance (overweight / underweight / range), with a to-do list and timeline — never close with a thank-you page. + +Default baseline (distilled from the layout skill; PART B may override): numbers first — key metrics (amounts / growth rates / multiples) must be set larger than body text and presented standalone, immediately adjacent to unit and basis; keep at least one class of high-density financial table (three statements / comps / sensitivity), with right-aligned numbers, thousands separators, and negative-number conventions unified deck-wide; positive/negative semantic colors fixed — up/positive and down/negative each use one fixed color that never changes across the deck; forecast and history must be visually distinguishable (dashes / light tints / hatched bands) and labeled with the basis; every page carries source, basis, and time range in small gray type at the page bottom — numbers without sources are not allowed in the main visual area; a single temperament per deck (dark navy/charcoal with metallic accents OR traditional white ground with blue-gray) — pick one per deck. + +**Title read-through test**: reading only the page titles across the deck should tell the complete story; if the titles do not read through, the structure has not been established. + +Density anchor: each style's specific floor (evidence modules per page, chart count, annotation habits) follows the 【Density Baseline】 reverse-engineered from that style's source material — this baseline imposes no uniform numbers. + +### Global Prohibitions (AI default routines · mandatory) + +1. **No default cards**: unless the user explicitly requests it, never use rounded rectangles or rectangular cards to build hierarchy or alignment — containers that serve an information function (status lights, assumption boxes, quote frames) do not count as cards. Rules, whitespace, and differences in type size and weight are the better tools. +2. **No evenly split compositions**: unless no other layout is truly available, do not default to three-way splits, four-way splits, or 2×2 matrices — even splits must be justified by content structure (three scenarios naturally take three columns; frameworks explicitly named by the content are exempt). +3. **No unjustified AI color schemes**: institutional palettes specified in the content are exempt; what is banned are bland, common, unjustified default colors — blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, glowing borders. +4. **No elements that clash with the overall style**: nothing outside the style system may appear — for example, rounded icons or rounded rectangles in a sharp style. +5. **Transparent chart backgrounds**: transparent or the page background color, except reverse-white treatments on dark grounds. +6. **No regional blank space**: the body content area keeps no swaths of blank space; any planned region must be filled with real content — failing to fill it is the most severe form of sloppiness. + +## PART B — Signature System (this template's signature; where it conflicts with PART A, this section governs) + +One-line style signature: a report-serious chassis overlaid with magazine-style highlight notes — warm paper white, ultra-bold black type, per-section color rotation, evidence dense but orderly. + +【Color Palette】 Background #F2EFE6; primary text/titles #000000; section accents rotate through orange #F9961F, pink peach #FFC1A8, bright green #08BC51, purple #D772FF, indigo #4C36FD — used only for highlights, key numbers, and a few series; section background colors #05225A/#4C1431/#05201B/#A4C9FF, special pages only; series colors #0B1636/#1058E2/#A4C9FF/#F6A031/#08BC51/#7421F7, fixed as solid fills; positive/negative inherit PART A. Body pages: 1 primary accent + ≤3 series per page; accents never blanket the page. + +【Layout Skeleton】 Source facts: 960×540, 16:9; roughly 40 pages carry a "color square + short label" at upper-left; titles are 1–2 line left-aligned assertions, with keywords set off by trailing rectangular highlights. Default: left 30–35% conclusion, right 65–70% main chart; complex pages use dual charts, chart + table, or three columns. Chart titles often carry a thin black horizontal rule; source/basis/time are pressed to the bottom; reading path: upper-left → main chart → footer. The cover and 9 section pages are solid dark or light blue, with a giant title at lower-left and a stepped stack of blocks + oversized numeral at upper-right — special pages only. + +【Typography】 Sans serif, family unverifiable; wide-set heavy letterforms, regular body, heavy titles, a little italic. Render: titles and giant numerals in Archivo Black (via customFonts) or MiSans Bold; body in {latin: Liter, ea: MiSans}. Body 1x, subheads 1.2–1.4x, assertions 2.2–2.8x, giant numerals 7–10x, footnotes 0.6–0.7x. Sections often in all caps; numbers carry units/thousands separators; highlighted phrases may share the same frame. + +【Chart Language】 Types: line charts, columns/stacked columns, stacked areas, horizontal bars, dual axes, bubbles, donuts, matrix tables, timelines. ⭐ Stacked charts use fixed solid colors with small legend swatches; ⭐ tables have dark full-row headers, with key rows fully saturated end to end; ⭐ dual axes pair light-tint columns/areas with a thin line; ⭐ common-baseline bubble comparisons (occasional) write values inside the bubbles; timelines run a horizontal axis with nodes alternating above and below (occasional). + +【Signature Components】 Title highlight blocks: 1–3 per page, may span lines without covering text. Section labels: once, at upper-left. Conclusion bubbles / number boxes: inside or beside charts, ≤2 per page, holding a single conclusion/number only. Stepped stacked blocks + giant numerals for section pages only; orange arrow capsules docked to chart titles, occasional. + +【Prohibited】 Body pages: no full dark/high-saturation grounds, no centered big titles, no sinking section stacked blocks into body pages; no gradients/glows/thick shadows; rounded corners only for conclusion boxes or functional entries; use photos, complex illustrations, and large screenshots cautiously. + +【Slide Types and Layouts】 Conclusion + main chart | single primary evidence | left 30–35% / right 65–70% | 1 chart + 1–3 annotations | highlights/number boxes | not suited to multi-evidence. Full-width assertion + dual charts/table | cross-validating comparisons | two columns below | 2–4 blocks | highlights/solid table headers | not suited to a single conclusion. Three-column evidence | parallel facts | three columns | 3–9 short blocks | labels/highlights | not suited to long narrative. Timeline / process | sequential relations | horizontal axis with alternating nodes | 8–12 nodes | colored dots and dashes | occasional use. + +【Density Baseline】 Default: 1 assertion + 1 main chart + 1–3 annotation boxes; explanations in 1–3 blocks of 20–60 words/characters equivalent each, with whitespace in the left column, above the title, and around charts. Dual-chart/table pages: 2 charts or 1 chart + 1 table, 2–4 blocks, labeling only key column points; three-column pages: 2–4 short facts per column. Timelines may be dense but the axis keeps whitespace; source/basis are fixed at the bottom — never fill space with decoration. diff --git a/skills/open-kimi-ppt/reference/design_system/promotion/aqua-charity-report/design.md b/skills/open-kimi-ppt/reference/design_system/promotion/aqua-charity-report/design.md new file mode 100644 index 0000000..ff865b1 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/promotion/aqua-charity-report/design.md @@ -0,0 +1,73 @@ +# Aqua Charity Report · Promotion STYLE DESIGN SYSTEM + +**Create at Full Strength**: Bring your full creativity and imagination to the work. Treat every slide as an independent, complete design artifact worthy of close consideration; structure, composition, charts, imagery, and visual narrative must all be driven by the content rather than a default layout. + +**No AI Slop**: Do not produce low-judgment, formulaic, decoration-heavy AI defaults, including arbitrary card arrays, evenly divided grids, unmotivated blue-purple gradients or glassmorphism, icon walls, hollow oversized text, repetitive skeletons, or visual gimmicks unrelated to the content. Every slide must reflect a clear design decision grounded in the material. + +**Landscape Delivery**: The final presentation must use a 16:9 landscape format throughout. Portrait or non-16:9 source material may be used only for style reference; it must be recomposed for 16:9 landscape and must not retain the source canvas ratio directly. + +**Layout Coordination**: style.md is the final authority for style (typography/color palette/components/chart language/prohibited elements); the “Layout/Visual Task” line for each slide in query.md governs that slide’s content structure, primary anchor, and reading order—both are execution specifications. Follow the task line in query.md for layout intent, while style.md remains the final authority for visual treatment. +### Global Prohibitions + +1. **Do Not Use Cards by Default**: Unless the user explicitly requests them, never use rounded-rectangle or rectangular cards to create hierarchy or alignment—functional containers such as status indicators, assumption boxes, and quote boxes do not count as cards. Lines, whitespace, font-size contrast, and font-weight contrast are preferred. +2. **Do Not Default to Equal-Division Layouts**: Unless no other layout is viable, do not default to three equal columns, four equal columns, or a two-by-two matrix. Equal division must be justified by the content structure (three scenarios naturally support three columns; frameworks explicitly named in the body copy are exempt). +3. **Do Not Use Unmotivated AI Color Schemes**: Institution-specific palettes defined in the content are exempt. What is prohibited is a safe, familiar, unsupported default palette—blue-purple gradients, cyan-purple neon, rainbow light flares, glass cards, and glowing borders. +4. **Do Not Introduce Elements That Conflict with the Overall Style**: Never use styling outside the design language, such as rounded icons or rounded rectangles within a sharp-edged visual system. +5. **Keep Chart Backgrounds Transparent**: Use transparency or the slide background color, except when reversing content out of a dark background. +6. **Use Large Areas of Whitespace Deliberately**: Maintain appropriate density in the main content area. Diluting content merely to reach a target count, or forcing content into a crowded slide, is a defect. Whitespace used for breathing room, grouping, and rhythm is permitted; form must follow content, and nothing should be forced in simply to fill the canvas. + +## PART A — Category Baseline (General Minimum Standard) + +An emotion-led yet fully auditable brand presentation, benchmarked against top-tier agency annual reports, campaign retrospectives, and destination/product launch decks. Every slide must land one memorable creative idea while keeping every claim verifiable—expressive in form, disciplined with numbers. + +Content and Layout: +1. Creative-driven structure: a single annual/campaign proposition → audience and market evidence → development of the big idea (waves/chapters) → channel and content system → results with full measurement context → direction for the following year. +2. Make major metrics the protagonists: give a small number of headline metrics full-slide or oversized typographic emphasis; arrange supporting evidence around them in compact modules. +3. Build rhythm at medium density: alternate evidence-dense slides with spacious statement slides; the deck should rise and fall like a story rather than filling every surface like a report. + +Visual Style: +1. Aesthetic: confident, contemporary, and brand-first. Use photographic or illustrative texture only when it is genuinely present in the source style—never use stock assets as filler. +2. Typography: one expressive display face carries the major propositions according to the style signature, while one highly legible workhorse face handles body copy and data. Use the display face for large numbers; apply capitalization and letter-spacing rules consistently throughout the deck. +3. Color: use one brand color family per deck (one primary color plus lighter and darker steps), with one contrasting accent reserved for CTAs and highlighted data. Background colors follow the style signature. No rainbow charts. +4. Graphics: reduce charts to the story line (few series, direct labels). Timelines, funnels, and audience bars are signature graphic forms. Icons must follow the established line or filled language of the style; multicolored clip art is prohibited. + +Structure and Discipline (Derived from Outputs We Recognize as Best-in-Class): +1. One big idea per slide: the slide title states the campaign proposition or chapter message, and every module on the slide serves that single idea. +2. Campaign evidence must include complete measurement context: impressions, completion rate, engagement rate, and conversion must always specify platform, period, and sample scope. Vanity numbers without context are a defect. +3. Timeline slides are first-class citizens: every wave, season, or phase has a named cadence and phase-specific metrics. A campaign deck without a rhythm slide is incomplete. +4. Audience slides use funnels, tiers, or audience bars—demographics must be tied to behavior and value; never show bare percentages alone. +5. Results slides distinguish outputs (impressions, content volume) from outcomes (search lift, share of new customers, sell-through rate). Outcomes must rank above outputs visually. +6. Case-study deep dives use fixed fields: Context → Action → Numerical Evidence → Implication. Parallel cases must use consistent, comparable fields. +7. Social/UGC evidence must cite realistic scale and show representative content structures. Always redraw third-party platform screenshots rather than reproducing them directly. +8. The ending must set direction: next year’s theme, total budget and allocation, and the measurement framework. A closing slide that only says thank you is a defect. +9. Every number must include a unit, point in time, and source/methodology context. Label estimates as internal illustrative assumptions. +10. Imagery and Shape Expression: when permitted by the style signature, actively source authentic imagery and use a creative shape language (torn edges, collage, irregular crops, signature shapes) instead of ordinary rectangular blocks. Flat rectangles are a last resort, not the default. + +Default Baseline (Derived from the layout skill; PART B may override): one proposition per screen; each slide communicates only one core message; continuous body copy on content slides must not exceed 3 lines; visual tension must have a clear source (large whitespace/strong contrast/large fields of the primary brand color/full-bleed product or portrait imagery), with at least one applied consistently throughout the deck; no table-heavy layouts—prioritize big numbers, single charts, and comparison bars; use one decorative language throughout the deck and never mix more than two decorative systems. + +Density Anchor: the specific minimum for each style (number of evidence modules per slide, chart count, and labeling conventions) follows the 【Density Baseline】 reverse-engineered from that style’s source material—this baseline does not impose a universal number. + + +## PART B — Signature System (Distinctive Template Signature; This Section Overrides PART A in Case of Conflict) + +One-Sentence Style Signature: a humanistic documentary annual-report character + warm-white and cream grounds + aqua and yellow as primary accents, alternating cool-blue data slides with evidence slides and full-bleed photography. + +【Color Palette】 Backgrounds: outer frame #FFFFFF; standard surface #FAF7F0, static-data surface #F8EED3, and map surface #DDE9F6. Use each across a complete region; do not intermix them within one field. Primary body text and titles #222520; reversed text over dark imagery #FFFFFF. Primary accent #FFC907: it may fill special slides or sidebars, but on standard slides it is limited to short rules, keywords, and outlined numbers. Supporting #5493D3 highlights priority regions; #CCDFF2 forms the map base. Charts use only the yellow scale #FFC907 / #FFD951 / #FFE99C and the blue scale #5493D3 / #76A9DC / #98BEE5 / #A7CDF2 / #CCDFF2. Positive/negative color: no dedicated red or green appears; write symbols directly in #222520, and do not use #FFC907 to encode increase or decrease. Use only yellow and blue as chromatic colors on each slide; yellow may fill the canvas only on special slides. + +【Layout Skeleton】 Source facts: canvas 792×612, approximately 22:17. Except on the cover, an inset composition creates a stable white gallery-mat border. Titles sit at the upper left, with a yellow all-caps pull quote beneath the large serif heading; there is no top bar, navigation, or breadcrumb, and a small page number sits at the lower left. The reading path runs upper left → columns or primary image → explanatory content below. Split-screen slides allocate approximately 48% to text and 52% to photography. Cover only: approximately 61% photography on the left and a yellow title block on the right, closed by one giant arc with a vertically set year overlaid. Section divider only: a yellow inner field, a short centered statement, and cropped outlined section words visible at the top and bottom. 16:9 adaptation: standardize the final output to 16:9 landscape while preserving the stable gallery-mat border, upper-left title, single arc, and lower-left page number. Adjust split-screen slides to 36%–42% text and 58%–64% photography; use the added map width for direct labels, and do not stretch three-column layouts. + +【Typography】 Verified source fonts: Kazimir Text Book is the display serif, with Semibold used occasionally; Proxima Nova Regular / Bold / Light is the workhorse sans serif. Family names were verified in the PDF. Body copy supports sustained reading; display serif headings are reserved for cover and section-opener statements (render with {latin: Oranienbaum, ea: 思源宋体}), while interior titles and body use the sans workhorse (render with {latin: Liter, ea: MiSans}); large numbers become a dominant focal point only on photographic headline-metric slides; footnotes, page numbers, and methodology notes recede visibly. Set headings in Book and Title Case. Set pull quotes, module headings, and data notes in bold all-caps sans serif with expanded letter spacing. Do not use outlined numerals in regular body copy. In the 16:9 landscape adaptation, preserve the role relationship of “serif display, sans serif workhorse” without carrying over the source’s absolute font sizes or scale ratios. + +【Chart Language】 Practical chart types: choropleth maps, maps paired with rankings, pie charts, 100% stacked columns, and metrics over photography; tables appear only as borderless lists. ⭐Direct-Labeled Maps: pale-blue base, saturated-blue priority areas, dots with right-angle leader lines, and a name plus two lines of metrics placed against each line; no legend. ⭐Occasional Composition Breakdown: an oversized pie chart paired with a narrow yellow sidebar containing a stacked column; label every segment directly, using yellow for the largest item and pale yellows or the blue scale for the rest. ⭐Photographic Metric Slides: yellow outlined numerals, short rules, and all-caps units, with no axes. Lists use column alignment and one fine vertical rule for grouping. + +【Signature Components】 White gallery-mat border: once on every slide except the cover, aligned to all four edges. Giant single-arc image crop: no more than one per slide, placed only at a split-screen or cover corner. Short yellow rule: immediately follows a module heading or pull quote; no more than 3 on a standard slide and up to 6 on a three-column slide; never crosses a column boundary. Photography is mandatory: photographic slides must use documentary images of real people or on-site environments, shown at half-slide or full-slide scale; do not replace them with icons, illustrations, or mockups. Dark image text zone: use #1A1A1A to form a quiet band covering 45%–65% of the left side, with text limited to #FFFFFF and #FFC907. Oversized outlined type: reserved for the cover year, section echoes, and headline metrics; one group per slide, which may be cropped but must not overlap body copy. + +【Prohibited】 Do not use serif type for dense body copy or chart labels. Do not use a set of medium-sized rounded photo cards; photography may appear only as small square thumbnails, a large half-slide image, or one giant-arc crop. Do not place body copy directly over visually complex light-and-dark photography; first establish a solid dark field. Do not add separate legends to maps or composition charts. Do not center long passages on ordinary content slides; centered alignment belongs only to section statement slides. + +【Slide Types and Layouts】 Documentary Split Screen|Narrative, principles, name lists|text 36%–48% + photography 52%–64%|3–5 blocks|giant arc, short rules|not suitable for more than six parallel evidence items. +Three-Column, Six-Module Layout|Parallel facts|two groups stacked in each column|6 blocks|short rules; one square image per block in the photographic version|not suitable for processes. +Direct-Labeled Map|Geographic distribution|map 70%–80%, or map 60% + ranking 40%|6–14 label groups|cool-blue ground, dot-and-elbow leader lines|not suitable for time trends. +Full-Bleed Photographic Statement/Metric|A single judgment, 1–2 metrics, or 2–3 short passages|photography 100%, dark left zone 45%–65%|2–4 blocks|outlined numerals, short rules|not suitable for dense argumentation. +Occasional Composition Breakdown|Composition data|main chart 70% + right yellow sidebar 30%|2 charts, 8–12 direct labels|yellow and blue scales, leader lines|not suitable for near-equal values or multi-period trends. + +【Density Baseline】 Spacious slides: 1–3 blocks; split screens: 3–5 blocks; three-column layouts: 6 blocks; maps: 6–14 direct-label groups, optionally with a ranking; charts: 1–2. Do not impose one universal minimum on new work: photographic slides should contain 2–3 explanatory blocks, each approximately 40–90 words/characters equivalent; each three-column block should contain approximately 60–120 words/characters equivalent. Label every priority region on maps and every pie segment/column segment in composition charts. The source contains no time series, so do not extrapolate a “label every point” rule. Reserve whitespace for the gallery-mat border, the gap between title and main content, the space in front of a subject’s gaze, and the outside of chart labels; do not leave functionless empty cells within the body grid. diff --git a/skills/open-kimi-ppt/reference/design_system/promotion/cream-collage/design.md b/skills/open-kimi-ppt/reference/design_system/promotion/cream-collage/design.md new file mode 100644 index 0000000..27598fa --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/promotion/cream-collage/design.md @@ -0,0 +1,78 @@ +# Cream Collage · Promotion STYLE DESIGN SYSTEM + +## PART A — Category Baseline (Universal Minimum Standard) + +A brand presentation that leads with emotion while keeping every piece of evidence auditable, benchmarked against top-tier agency annual reports, campaign retrospectives, and destination or product launch decks. Every slide must land one memorable creative idea while keeping every claim verifiable—bold in form, disciplined with numbers. + +Content and layout: +1. Creative-led structure: a single annual/campaign proposition → audience and market evidence → development of the big idea (waves/chapters) → channel and content system → results with full measurement context → direction for the following year. +2. Make headline metrics the protagonists: give a small number of key figures full-slide or oversized-type emphasis; arrange supporting evidence around them in compact modules. +3. Use medium density to create rhythm: alternate evidence-dense slides with spacious statement slides; the deck should rise and fall like a story, not fill every space like a report. + +Visual style: +1. Aesthetic: confident, contemporary, and brand-first; use photography or illustration only when the source style genuinely calls for it—never use stock assets merely to fill space. +2. Typography: one expressive display typeface carries the major propositions, as defined by the style signature; one highly legible workhorse typeface handles body copy and data. Set large numbers in the display typeface. Apply capitalization and tracking rules consistently across the deck. +3. Color: one brand color family per deck—one primary color plus lighter and darker tonal steps—with a single contrasting accent reserved for CTAs and highlighted data; the background follows the style signature. No rainbow charts. +4. Graphics: reduce charts to the story essentials, using few series and direct labels. Timelines, funnels, and audience bars are signature chart forms. Icons must follow the established line or fill language of the style; no multicolor clip art. + +Structure and discipline (derived from the work we recognize as benchmark quality): +1. One big idea per slide: the slide title states the campaign proposition or chapter message, and every module on the slide serves that single idea. +2. Campaign evidence must include complete measurement context: impressions, completion rate, engagement rate, and conversion must always specify platform, period, and sample scope. Vanity metrics without context are a defect. +3. Timeline slides are first-class citizens: every wave, season, or phase has a named beat and phase-specific metric. A campaign deck without a pacing slide is incomplete. +4. Audience slides use funnels, tiers, or audience bars—demographics must be tied to behavior and value; never show bare percentages alone. +5. Results slides distinguish outputs, such as impressions and content volume, from outcomes, such as search lift, share of new customers, and sell-through rate. Outcomes take visual priority over outputs. +6. Deep-dive case studies use fixed fields: context → action → numerical evidence → implication. Parallel cases must use consistent, comparable fields. +7. Social/UGC evidence cites authentic scale and shows representative content structures. Always redraw screenshots from third-party platforms. +8. The ending must provide direction: next year's theme, total budget and allocation, and measurement framework. A closing slide that only says thank you is a defect. +9. Every number must include a unit, time reference, and source/methodology context; label estimates as internal illustrative assumptions. +10. Imagery and shape language: when permitted by the style signature, proactively source authentic imagery and use expressive shapes—torn edges, collage, irregular crops, and signature forms—instead of generic rectangular blocks. Flat rectangles are the last resort, not the default. + +Default baseline (derived from the layout skill; PART B may override): one screen, one proposition; each slide communicates only one core message; continuous body copy on a content slide must not exceed 3 lines. Visual tension must come from at least one clearly defined source—expansive negative space, strong contrast, a large field of the brand color, or full-bleed product/people imagery—and remain consistent throughout the deck. Do not stack tables; prioritize oversized figures, a single chart, or comparison bars for data. Use one decorative language across the deck; never mix two or more decorative systems. + +**Title read-through test**: read only the slide titles from beginning to end; they should tell the complete story. If the sequence does not read coherently, the structure has failed. + +Density anchor: the specific minimum for each style—the number of evidence modules and charts per slide, plus annotation conventions—must follow the 【Density Baseline】 reverse-engineered from that style's source deck. This baseline does not impose one universal numeric target. + +### Global Prohibitions (Default AI Patterns · Mandatory) + +1. **Do not use cards by default**: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to create hierarchy or alignment. Functional containers, such as status indicators, assumption boxes, and quotation frames, are not considered cards. Lines, negative space, type scale, and weight contrast are better tools. +2. **Do not use equal-split compositions**: unless no viable alternative exists, do not default to three equal columns, four equal columns, or a 2×2 matrix. An equal split must be justified by the content structure—three scenarios naturally warrant three columns, and frameworks explicitly named in the brief are exempt. +3. **Do not use ungrounded AI color schemes**: an institutional palette specified in the content is exempt. The prohibition applies to generic, overfamiliar, and unjustified defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **Do not introduce elements that conflict with the overall style**: never use forms outside the established visual language, such as rounded icons or rounded rectangles in a sharp-edged style. +5. **Keep chart backgrounds transparent**: use transparency or the slide background color, except when reversing to light graphics on a dark background. +6. **Do not leave planned regions empty**: no content region may contain a large blank area. Every planned region must be filled with real content; failure to fill it is the most severe form of roughness. + +## PART B — Signature System (Template-Specific Signature; Overrides PART A in Case of Conflict) + +Based on a small 6-slide source sample. + +One-line style signature: a cream paper ground with hard-edged collage shapes in tomato red and cobalt blue; fluorescent yellow-green appears only on actions; titles and numbers are large and spacious. + +【Color Palette】 +Use an approximately #F3E8D4 background continuously across the full slide. Use approximately #171717 for primary text and titles, body copy, axes, and page numbers. Use approximately #F05A39 as the primary accent for diagonal anchors, key figures, and nodes, covering no more than about one-third of a standard slide. Use approximately #2657D7 as the secondary accent for second-priority content, pathway panels, and range figures. Reserve pink #E9A7B3 and fluorescent green #D9F04A for geometric cover accents or the closing CTA only; do not propagate either color elsewhere. Limit chart series to red #F05A39, blue #2657D7, and ink #171717 on transparent backgrounds. The source deck defines no positive/negative color semantics; when a distinction is required, red and blue may be used only with text labels. A slide should normally use only the cream background, ink, and one or two of red/blue; never flood the slide with accent colors. + +【Layout Skeleton】 +Source facts: 960×540, 16:9; approximately 80 px (8%) safe margins. Place the title from the upper left, with a light-gray descriptor on the following line and a fixed page number at the lower right. Separate sections with hard-edged color fields or a single horizontal rule; do not use navigation. The default reading path is upper-left title → central structure → concluding statement at the bottom. The cover uses a red diagonal panel on the left, a pink square at the upper right, and a green diamond at the lower right; reserve this composition for special slides. The closing slide uses an almost-black background, a two-column list, and a centered green button at the bottom; use it only for the final slide. Content slides commonly use four horizontal blocks, three parallel columns, or an asymmetric grid with figures on the left/center and a proportion bar on the right. + +【Typography】 +Source typography facts: the typeface family cannot be verified from the page images. Only the use of sans-serif Chinese type is confirmed, with heavy titles, regular/medium body copy, and prominent oversized figures in a matching sans-serif. Visual scale ratios are 1x for body copy, approximately 2.2–2.8x for titles, approximately 3.8–4.5x for large figures, and approximately 0.65–0.75x for footnotes/page numbers. Left-align text and Arabic numerals. Use hyphens for dates, en dashes for ranges, and commas as thousands separators. Do not mix in serif or handwritten typefaces. Render with MiSans (titles Bold); English titles may use Archivo Black (via customFonts). + +【Chart Language】 +Observed chart types: single-line timelines, two-series horizontal stacked bars, and card-free KPI number arrays; no tables or coordinate grids appear. Signature treatment: timelines use a black baseline with evenly spaced circular nodes, dates above, and labels below; red/blue identify only a few selected nodes. Proportion bars retain only one short bar, with the meaning written beside it. KPI slides use four large figures as evidence, plus a small proportion bar at the upper right. Place annotations as adjacent text rather than labeling every bar densely. All other rules inherit from PART A. + +【Signature Components】 +Diagonal red block: an upper-slide/cover anchor that bleeds to the edge; use no more than 1 on a standard slide. Hard-edged red/blue panels: hold parallel content with square corners and no outlines; use 3–4 per slide. Low-contrast oversized sequence numbers 01/02/03: use only for a three-column pathway, 1 per column. Small lower-right page number: 1 per slide. Solid fluorescent-green action bar: use only at the bottom center of the closing slide, no more than 1, with ink-colored text. Pink squares and green diamonds are occasional cover decorations only and must touch a slide edge. + +【Prohibited】 +Do not use gradients, glass effects, shadows, outlines, rounded cards, or pill labels; keep color fields solid and hard-edged. Do not expand red/blue into full-slide backgrounds for ordinary content slides. Reserve a complete set of three blue panels and the almost-black background for their dedicated slide types. Do not introduce a fourth highly saturated color on a content slide; pink and green remain accents only. Use photography, textures, and sticker illustrations sparingly; never use assets merely to fill space. + +【Slide Types and Layouts】 +Cover (special) | Introduce the proposition | Red diagonal panel covering approximately one-third on the left, two geometric shapes on the right | 4–5 blocks | Geometric accents | No evidence matrix. +Overview matrix | Total + categories | Four square blocks in a row, black band at the bottom | 4+1 blocks | Large white figures | No long paragraphs. +Three-path entry (occasional) | Parallel pathways | Three blue panels with narrow gaps | 3 blocks | Oversized sequence numbers | No more than three pathways. +Single-line timeline (occasional) | Phase pacing | One horizontal line, 7 nodes, labels above and below | 7 nodes + concluding statement | Colored nodes | No complex Gantt chart. +KPI array (occasional) | Target/scale/range | 2×2 large figures at left/center, short bar at upper right | 4+1 blocks | Red, blue, and ink figures | No long explanations. +Action close (special) | Checklist + CTA | Almost-black background, two columns, button at bottom | 2 columns + 1 button | Reversed white title/green bar | No new background narrative. + +【Density Baseline】 +Content slides usually contain 3–5 independent modules, but follow the designated slide type: overview, 4 blocks + black band; pathway, 3 blocks, each with a title + two short descriptions; timeline, 7 nodes; KPI, 4 figures + 1 bar; action slide, 3–4 items in each of 2 columns + 1 button. Use 0–1 chart per slide and 0–2 explanatory blocks, each approximately 8–24 words/characters equivalent. Concentrate negative space below titles, between modules, and to the right of KPIs; preserve breathing room around figures. diff --git a/skills/open-kimi-ppt/reference/design_system/promotion/pine-soot-pictorial/design.md b/skills/open-kimi-ppt/reference/design_system/promotion/pine-soot-pictorial/design.md new file mode 100644 index 0000000..5e5a74c --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/promotion/pine-soot-pictorial/design.md @@ -0,0 +1,65 @@ +# Pine Soot Pictorial · Promotion STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum) + +An emotion-led yet fully auditable brand presentation, benchmarked against annual reviews from top-tier agencies, campaign retrospectives, and destination/product launch decks. The deck must land one memorable creative idea on every slide while keeping every claim verifiable—expressive in form, disciplined with numbers. + +Content and layout: +1. Creative-led structure: one unifying annual/campaign proposition → audience and market evidence → big-idea development (waves/chapters) → channel and content system → results with full measurement context → direction for the coming year. +2. Make big numbers the protagonists: give a small set of headline metrics full-slide or oversized emphasis; arrange supporting evidence around them in compact modules. +3. Build rhythm at medium density: alternate evidence-dense slides with spacious statement slides; the deck should rise and fall like a story, not fill every surface like a report. + +Visual style: +1. Aesthetic: confident, contemporary, and brand-first; use photographic or illustrative texture only when it is authentic to the source style—never pad the deck with generic stock imagery. +2. Typography: one expressive display face carries the major propositions, as defined by the style signature, while one highly legible workhorse face handles body copy and data; set large numerals in the display face; keep case and tracking rules consistent throughout. +3. Color: give each deck one brand-color family—one primary color with lighter and darker steps—plus one contrasting accent reserved for CTAs and highlighted data; let the style signature determine the background; no rainbow charts. +4. Graphics: reduce charts to the elements required by the narrative—few series, direct labels; timelines, funnels, and audience bars are signature graphic forms; icons must follow the style’s established line or fill language, with no multicolor clip art. + +Structure and discipline (distilled from the work we recognize as benchmark quality): +1. One big idea per slide: the slide title states the campaign proposition or chapter message, and every module on the slide serves that one idea. +2. Campaign evidence must include full measurement context: impressions, completion rate, engagement rate, and conversion must always state platform, period, and sample scope; vanity metrics without context are a defect. +3. Timeline slides are first-class citizens: every wave, season, or phase has a named cadence and phase-specific metrics; a campaign deck without a rhythm slide is incomplete. +4. Audience slides use funnels, tiers, or audience bars—demographics must be tied to behavior and value, never shown as bare percentages. +5. Results slides distinguish outputs (impressions, content volume) from outcomes (search lift, new-customer share, sell-through rate); outcomes take visual precedence over outputs. +6. Case-study deep dives use fixed fields: context → action → numerical evidence → implication; parallel cases must use consistent, comparable fields. +7. Social/UGC evidence cites authentic order of magnitude and shows the structure of representative content; redraw all third-party platform screenshots. +8. The ending must establish direction: next year’s theme, total budget and allocation, and measurement framework—a closing slide that says only “thank you” is a defect. +9. Every number must include its unit, point in time, and source/measurement context; label estimates as internal illustrative assumptions. +10. Imagery and shape language: when permitted by the style signature, proactively source authentic imagery and replace generic rectangular blocks with expressive shapes—torn edges, collage, irregular crops, and signature forms; flat rectangles are a last resort, not the default. + +Default baseline (distilled from the layout skill; PART B may override): one proposition per screen, with each slide communicating only one core message and no more than 3 continuous lines of body copy; visual tension must come from at least one clearly defined device—expansive negative space, strong contrast, a large field of the primary brand color, or a full-bleed product/person image—and remain consistent throughout; no table-heavy layouts, with data expressed first through oversized numerals, a single chart, or comparison bars; use one decorative language across the deck and never mix more than one system. + +**Title Read-Through Test**: read only the slide titles from beginning to end; they should tell the complete story. If the sequence does not flow, the structure has not been established. + +Density anchor: the specific minimums for each style—the number of evidence modules and charts per slide, plus annotation conventions—follow the 【Density Baseline】 reverse-engineered from that style’s source material; this baseline does not impose a universal number. + +### Global Prohibitions (AI Default Tropes · Mandatory) + +1. **Do not default to cards**: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to construct hierarchy or alignment—functional containers such as status indicators, assumption boxes, and quotation frames do not count as cards. Rules, negative space, type scale, and weight contrast are preferable. +2. **Do not default to equal subdivisions**: unless no other workable layout exists, do not default to three equal columns, four equal columns, or a two-by-two matrix—equal division must be justified by the content structure (three scenarios naturally support three columns; frameworks explicitly named in the body copy are exempt). +3. **Do not use unmotivated AI color schemes**: institutional palettes specified in the brief are exempt; the prohibition targets safe, familiar, unsupported defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **Do not use elements that conflict with the overall style**: no out-of-style treatments, such as rounded icons or rounded rectangles within a sharp-edged system. +5. **Keep chart backgrounds transparent**: use transparency or the slide background, except when reversing content out of a dark field. +6. **Do not leave planned regions empty**: the body-content area must not contain large blank zones; every planned region must be filled with real content, and failure to fill it is the most severe form of roughness. + +## PART B — Signature System (Distinctive Template Signature; Overrides PART A in Case of Conflict) + +One-line style signature: a cinematic-pictorial editorial sensibility built on near-black grounds and full-slide cinematic photography, structured with white type, with cover red and magenta used as one-off bursts; large-scale imagery preserves breathing room within medium-high text density. + +【Color Palette】Background #000101 (renders close to #000000): carries black fields and photographic negative space and may occupy 44%–56%. Primary text #FFFFFF: used for body copy, navigation, page numbers, and fine rules, never as a large filled field. Titles #FFFFFF: hierarchy comes only from size and weight. Primary accent #EF1722: the striped field at the cover’s lower right, occupying about one-fifth of the cover; prohibited in body slides. Secondary accent #FD1AEE: the narrow vertical stripe on the same cover, with roughly half the area of the primary accent. Chart series colors and positive/negative colors: not used; inherit PART A without adding new encodings. The interface layer on every slide is black and white only; the cover may add red and magenta, while photographic hues do not count. Iron rule: color comes only from photography or the cover stripes and never fills body-content containers. + +【Layout Skeleton】Source facts: the canvas is 19×11 inches, at 19:11. Five micro anchors sit across the top at approximately x=2%, 25%, 48%, 70%, and 97%; the rightmost index is vertical, and the page number is fixed at the lower left. The main title begins at y≈31%, two-column body copy occupies y≈41%–74%, and the label group occupies y≈77%–91%; the reading path is navigation → title → explanation → labels. Photography and black field use a hard 43.7%/56.3% split that may be mirrored left to right; images meet the slide edge with square corners, and seams use black hairlines only. Cover only: approximately 59% of the left side is a full-bleed close-up, while the right 41% is black above and red/magenta vertical stripes below; the main title breaks into offset oversized words at the lower left. 16:9 migration: at 960×540, preserve the vertical hierarchy, two-column body, and square-edged division; assign the additional ≈2.9% width to the photographic crop or outer black field, place the division at 42%–44% (or mirror it), and never stretch the image or alter the vertical stack. + +【Typography】Source typeface facts: sans-serif Inter (brought in via customFonts); body copy uses Inter, navigation uses Inter Medium, and titles and labels use Inter SemiBold. Body = 1x = 13 pt, body title ≈4.23x = 55 pt, oversized year numeral ≈2.77x = 36 pt, cover title ≈8.85x = 115 pt, and small label/footnote level ≈0.85x = 11 pt (there is no separate footnote style). Titles may run 2–3 lines, with line height around 0.6–0.7em and tracking tightened by approximately 4%–10%; compress title lines only and never overlap the body copy. Navigation and labels use ALL CAPS, body titles use sentence case, and four-digit indices are stacked vertically. For Chinese, choose a modern sans-serif with even stroke weight and keep to a single type family; continue using Inter for Latin letters and numerals. 16:9 migration: at 960×540, recommended sizes are 16–17 for body copy, 66–72 for titles, 124–144 for cover titles, and 13–15 for labels/navigation; preserve the original ratios and weights. These are not measurements taken from the source. + +【Chart Language】Actual-use inventory: no data charts and no tables; only single photographs, horizontal storyboards, hard-edged image matrices, and attribute-label groups. ⭐Image matrix: compose 2–11 unequal-width frames into a square-cornered visual evidence wall; frame sizes may vary, but all boundaries must align. Use only to show multiple visual facets of the same subject, never to encode quantitative comparison. All other chart rules inherit PART A; no stable additions were observed in the source. + +【Signature Components】Photography is a hard requirement: every body slide contains at least one cinematic photograph suitable for full-slide cropping, covering 44%–100% of the canvas; text sits only on a black field, a darkening layer, or natural negative space. Top micro-navigation + lower-left page number: each appears once per body slide, flush with the slide edge and outside the body grid; the leftmost anchor names only the section role and must not reproduce an institutional logo. Attribute-label group: one group appears in the lower portion of each body slide, containing 4–10 low-profile capsules with transparent fill and a fine #FFFFFF outline, set in Inter SemiBold ALL CAPS; arrange them across two lines according to content width, with no individual label wrapping. Cover red/magenta stripe field (occasional): use only once in the entire deck, confined to the lower-right quadrant, and never extend it into a decorative device for body slides. + +【Prohibited】Do not use #EF1722, #FD1AEE, or any colored interface block on body slides; this preserves the impact of the cover burst. Do not use rounded photographs, floating cards, shadows, or wide white gutters; photography must be hard-cropped into a continuous composition. Do not place white type directly over highly textured or brightly lit photography; if there is no natural dark region, recrop first and use a localized black darkening layer only as the second choice. Do not use centered body-slide titles or symmetrical poster compositions; titles, body copy, and labels always begin on the same left edge. Do not substitute illustrations, 3D graphics, or multicolor icons for photographic evidence. Labels must not use solid fills, gradients, or multiline word breaks. + +【Slide Types and Layouts】Black field—photography hard split|Concept explanation + one set of visual evidence|Approximately 44% photography and 56% black field, optionally mirrored, with two-column body copy in the black field|3–5 independent blocks; photography may be 1 image or a 9–11-frame matrix|Top navigation, label group, page number|Unsuitable for high-dimensional data or long tables. +Dual-photography split with type on dark regions|One proposition requires a primary image and a supporting image|Approximately 56% on one side for a type-bearing hero image with a dark region, and 44% on the other for 1–2 supporting images|3–4 independent blocks|Top navigation, label group, page number|Unsuitable for photographs without clear negative space. +Full-bleed photography with negative space|A single strong visual supports a short analysis|Photography bleeds across 100% of the slide; the title and two-column body copy occupy only approximately 42% on one side|2–4 independent blocks|Top navigation, label group, page number|Unsuitable for parallel conclusions or dense parameters. + +【Density Baseline】A typical body slide contains 1 main title, 2–4 explanatory blocks, 1 group of 4–10 labels, and 1–11 photographs; the chart count is always 0. Black-field split slides usually contain 3–4 text/label modules; image-matrix slides replace additional text with 9–11 frames; full-bleed photography slides retain only 2–3 text blocks. Source-language blocks contain approximately 120–400 characters; new drafts should target a language-equivalent concise length of 45–90 words/characters across 2–6 lines. Do not caption every image or annotate every point. Concentrate negative space between navigation and title, to the right of the title, within dark photographic regions, and below the label group; do not impose a universal module minimum across the deck—the more fully photography occupies the slide, the less text it should carry. diff --git a/skills/open-kimi-ppt/reference/design_system/promotion/silk-yellow-magazine/design.md b/skills/open-kimi-ppt/reference/design_system/promotion/silk-yellow-magazine/design.md new file mode 100644 index 0000000..dfd1f58 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/promotion/silk-yellow-magazine/design.md @@ -0,0 +1,75 @@ +# Silk Yellow Magazine · brand_campaign STYLE DESIGN SYSTEM + +## PART A — Category Baseline (Universal Minimum) + +An emotion-led, audit-ready brand presentation benchmarked against top-tier agency annual reports, campaign retrospectives, and destination/product launch decks. Every slide must land one memorable creative idea, while every claim remains verifiable—form can be expansive; numbers stay disciplined. + +Content & Layout: +1. Idea-driven structure: one annual/campaign proposition → audience and market evidence → big-idea development (waves/chapters) → channel and content system → results with measurement context → direction for next year. +2. Make big numbers the protagonists: give a small set of headline metrics full-bleed or oversized emphasis; arrange supporting evidence in compact modules around them. +3. Medium density with pacing: alternate evidence-dense slides with breathing-room statement slides; the deck should rise and fall like a story, not fill every inch like a report. + +Visual Style: +1. Aesthetic: confident, contemporary, brand-first; use photographic or illustrative texture only when it is genuinely present in the source style—never pad with stock assets. +2. Type: one expressive display face handles major propositions (as defined by the style signature), and one highly readable workhorse face handles body copy and data; use the display face for big numbers; keep capitalization and tracking rules consistent across the deck. +3. Color: one brand-color family per deck (one primary color with lighter and darker steps), plus one contrasting accent reserved for CTAs and highlighted data; background tone follows the style signature; no rainbow charts. +4. Graphics: simplify charts into a story line (few series, direct labels); timelines, funnels, and audience bars are signature graphic forms; icons use only the style's established line/filled language—no multicolor clip art. + +Structure & Discipline (distilled from outputs we recognize as benchmarks): +1. One big idea per slide: the slide title is the campaign proposition or chapter message, and every module on the slide serves that one idea. +2. Campaign evidence must carry complete measurement context: impressions, completion rate, engagement rate, conversions—always include platform, time period, and sample scope; a vanity number without context is a defect. +3. Timeline slides are first-class citizens: waves, seasons, or phases each have named beats and phase metrics; a campaign deck without a pacing slide is incomplete. +4. Use funnels, tiers, or audience bars on audience slides—demographics must be tied to behavior and value; never show bare percentages alone. +5. Separate outputs (impressions, content volume) from outcomes (search lift, new-customer share, sell-through rate) on results slides; outcomes must outrank outputs visually. +6. Use fixed fields for case deep dives: context → action → numerical evidence → takeaway; parallel cases must use identical, comparable fields. +7. Cite real scale for social/UGC evidence and show representative content structure; always redraw third-party platform screenshots instead of using them directly. +8. The ending must point forward: next year's theme, total budget and allocation, and measurement framework—a closing slide that only says thank you is a defect. +9. Every number must carry a unit, time point, and source context; label estimates as internal example assumptions. +10. Image and shape expression: when the style signature permits, actively use image search to obtain real supporting visuals and replace ordinary rectangular blocks with a creative shape language (torn edges, collage, irregular crops, signature shapes); flat rectangles are a last resort, not the default. + +Default baseline (distilled from the layout skill, overridable by PART B): one proposition per screen, one core message per slide, no more than 3 lines of continuous body copy on content slides; at least one explicit source of visual tension (large negative space / high contrast / a large field of brand primary color / a full-bleed product or people image), applied consistently across the deck; no piled-up tables, prioritize big numbers, a single visual, and comparison bars; use one decorative language throughout, without mixing more than two decorative systems. + +**Title read-through test**: reading only the slide titles in sequence should let you hear the whole story; if the sequence does not flow, the structure has not worked. + +Density anchor: each style's specific minimums (evidence modules per slide, chart count, labeling habits) follow the 【Density Baseline】 reverse-engineered from that style's source deck—this baseline does not impose one uniform number. + +### Global Prohibitions (AI Defaults · Mandatory) + +1. **Do not default to cards**: unless the user explicitly asks for them, never use rounded rectangles or rectangular cards to build hierarchy or alignment—information-bearing containers (status lights, assumption boxes, quote frames) do not count as cards. Lines, whitespace, type size, and weight differences are the better solution. +2. **Do not default to evenly split compositions**: unless no other usable layout exists, do not default to thirds, quarters, or a two-by-two matrix—even splits must be justified by the content structure (three scenarios naturally make three columns; frameworks named in the body are exempt). +3. **No ungrounded AI color schemes**: institution palettes explicitly specified in the body are exempt; what is banned is bland, common, unsupported default color—blue-purple gradients, cyan-purple neon, rainbow light flares, glass cards, glowing borders. +4. **No element that clashes with the overall style**: do not introduce styles outside the system, such as rounded icons or rounded rectangles in a sharp-edged style. +5. **Chart backgrounds must be transparent**: use transparency or the page background, except for reversed white on a dark background. +6. **No blank regions**: never leave a solid block of empty space in the body-content area; every planned region must be filled with real content, and failure to fill it is the most serious form of roughness. + +## PART B — Signature System (Template Signature; this section overrides PART A in case of conflict) + +One-line style signature: a rough-edged editorial-magazine character, grounded in warm gray and black-and-white, with one highly saturated chapter color as the accent, advancing through alternating dense long-form copy and full-bleed real imagery. + +【Color Palette】 +The default background is warm gray #E5E3DD, with #000000 as a full-column inverse background and #FFFFFF reserved for reading panels over photos. Primary text is #000000; reverse type on dark backgrounds uses #E5E3DD or #FFFFFF; titles remain #000000 on light backgrounds, while chapter display titles use the chapter color. For each chapter, select only one primary accent from #E2FDBE, #F9B3A7, #6E8EBE, #DD5A50, #99BBBD, #FFD200; it may fill a chapter page or one macro column. Supporting colors are limited to the neutral layers #E5E3DD / #FFFFFF. If a chart must be added, its series use only #000000+the chapter color, with #E5E3DD as the baseline. The source deck has no dedicated positive/negative colors: use #000000 text for both, paired with +/−; do not automatically read #DD5A50 as negative. A slide may contain at most one chromatic hue; a photo's inherent color is exempt, but do not sample a second accent from the photo. + +【Layout Skeleton】 +The source canvas is 1920×1080, 16:9. Use a 12-column base, most often resolving into three equal-width 4/4/4 macro columns, or 4/8 and 8/4 text-image splits; this is the template's explicit override of PART A's “do not split evenly unless necessary.” The top of the page carries three 12pt micro-metadata items; a capsule tab overflowing the upper-left edge carries the page title; mirrored vertical chapter/level navigation sits on both side edges, with a fixed micro page number at bottom right. The default reading path is left→right, then top→bottom within each column; images and text must align to thirds or the 12-column grid lines. Covers use a dedicated full-bleed multicolor halftone collage with a white oversized title at left-center; chapter pages use the chapter color, black-and-white halftone imagery, and a three-line oversized title on the left, and these treatments do not carry over to ordinary body pages. + +【Typography】 +Source fact: the PDF embeds only the sans-serif fonts FranklinGothicATF-Regular and FranklinGothicATF-Heavy. Body 20pt=1x; large pull quotes 27pt≈1.35x; module titles and data statements 30pt≈1.5x; headline numbers 50pt≈2.5x; chapter display titles 200pt≈10x; footnotes, page numbers, and sidebars 12pt≈0.6x. Tab titles are approximately 0.95x, establishing hierarchy through Heavy and all caps rather than enlargement. Use sentence case for body copy; set people/project role names and sources in Heavy; key sources may receive a straight underline; do not introduce a third font. Render with {latin: Liter, ea: MiSans}; titles and chapter display titles use Archivo Black (via customFonts) or MiSans Bold. + +【Chart Language】 +Types actually used are: large-number text lists, two-column numbered key-point boards, case-study “action+impact” lists, and occasional six-cell chapter indexes; no bar, line, or pie charts, and no data tables. ⭐ Do not draw data as charts; set it as a 1.5–2.5x sentence occupying one column, with the source immediately below in bold/underlined type. ⭐ The upper part of a case panel is an underlined Heavy title and body copy; the bottom uses a light band in the chapter color for the impact or pull quote. ⭐ Chapter closes use two asymmetrical black/warm-gray key-point boards over a halftone background, with no axes or legends. + +【Signature Components】 +1)Top-left bleed capsule tab: identifies the page subhead; at most 1 per page, occupying only the upper-left area. 2)Mirrored edge navigation: shows chapter and page level together, hugging only the left and right page edges without covering body copy. 3)Two-tone halftone imagery: serves as background, hero visual, or column divider; choose exactly one crop treatment per page from full bleed, organic edge, circle/semicircle, or hard rectangle, with one dominant logic. 4)Square-corner opaque evidence panel: isolates busy photos from long copy; ordinary pages use no more than 2, aligned to the grid, with no shadow. 5)Photography is a hard constraint: case pages must include a real documentary photo or video frame, occupying 1/3, 2/3, or full bleed; without real assets, existing evidence graphics may be halftoned, but stock images and generic AI illustrations are prohibited. + +【Prohibited】 +Do not mix two chapter colors on one page; prohibit gradients, transparent glass, shadows, and glow, and keep every text-bearing surface flat and opaque; long-form copy must not sit directly on a high-detail photo. Rounded corners are reserved for the upper-left tab and frames around genuine vertical media; evidence panels always use square corners. Do not add serif, handwritten, or decorative display type. Use conventional charts and tables sparingly; no stable examples of them were observed in the source deck. + +【Slide Types and Layouts】 +Text-led analysis|integrate multi-source evidence|two text columns+one halftone hero visual, or three columns side by side|2–3 blocks|tab, edge navigation, halftone imagery|not suited to a single dominant case. +Single-case hero|explain one action and its outcome|1/3 text+2/3 photo, or a center 1/3 photo with explanation and pull quote on both sides|1–2 blocks|real photo, square-corner evidence panel|not suited to three co-equal objects. +Dual-case gallery|contrast two like-for-like examples|photos fill the left and right halves, with two same-field panels overlaid on the images|2 blocks|light impact/pull-quote bands|not suited to cases without comparable fields. +Quote/key-point close|synthesize a position or recommendation for two audiences|full-page halftone background+two large asymmetrical text blocks|2 blocks|black/warm-gray opposition|not suited to a new conclusion whose evidence chain is incomplete. +Occasional chapter index|preview the full-deck structure on one screen|six equal color blocks in a 3×2 arrangement|6 blocks|six-color chapter palette|not suited to arbitrary body content. + +【Density Baseline】 +Chapter display-title pages contain only 1 title and image, with no evidence minimum. Text-led pages usually contain 2–3 evidence modules; in new work, each long-form block is recommended at 180–320 words/characters equivalent, paired with 1 pull quote or data sentence of 60–120 words/characters equivalent. Case pages usually contain 1–2 cases; each case includes 1 hero image, 1 description of 100–220 words/characters equivalent, and 1 impact/pull-quote band of 40–90 words/characters equivalent. Quote/key-point close pages are fixed at 2 blocks, each 80–180 words/characters equivalent. The source deck's conventional chart count is 0; when a new topic truly requires one, use no more than 1 chart per page, label key values directly, and do not label every bar/point. Negative space is concentrated in the 12-column gutters, the inner padding of text blocks, and the outer edges of organic crops; the remaining open areas are carried by photos, halftone, or chapter solid color. diff --git a/skills/open-kimi-ppt/reference/design_system/promotion/silver-gray-luxury-magazine/design.md b/skills/open-kimi-ppt/reference/design_system/promotion/silver-gray-luxury-magazine/design.md new file mode 100644 index 0000000..44ba7e7 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/promotion/silver-gray-luxury-magazine/design.md @@ -0,0 +1,68 @@ +# Silver-Gray Luxury Magazine · Promotion STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum) + +A brand presentation that leads with emotion while keeping its evidence auditable, benchmarked against top-tier agency annual reports, campaign retrospectives, and destination/product launch decks. Every slide must land one memorable creative idea, while every claim remains verifiable—bold in form, disciplined with numbers. + +Content and layout: +1. Creative-led structure: a single proposition for the year/campaign → audience and market evidence → development of the big idea (waves/chapters) → channel and content system → results with full measurement context → direction for the following year. +2. Make major numbers the hero: give a small set of headline metrics full-slide or large-type emphasis; arrange supporting evidence around them in compact modules. +3. Use medium density to create rhythm: alternate evidence-dense slides with spacious statement slides; the deck should rise and fall like a story, not fill every space like a report. + +Visual style: +1. Aesthetic: confident, contemporary, and brand-led; use photographic or illustrative texture only when it is genuinely present in the source style—never substitute generic stock imagery. +2. Typography: one expressive display face carries major propositions in line with the style signature; one highly legible workhorse face handles body copy and data. Set major numbers in the display face. Apply capitalization and tracking rules consistently throughout the deck. +3. Color: give each deck one brand color family—a primary color plus lighter and darker steps—and one contrasting accent used only for CTAs and highlighted data. Let the style signature determine the background. No rainbow charts. +4. Graphics: reduce charts to the story line—few series and direct labels. Timelines, funnels, and audience bars are signature graphic forms. Icons must follow the style's established line or fill language; no multicolored clip art. + +Structure and discipline (derived from work we recognize as benchmark quality): +1. One big idea per slide: the slide title states the campaign proposition or chapter message, and every module on the slide serves that single idea. +2. Campaign evidence must include complete measurement context: impressions, completion rate, engagement rate, and conversion—always specify platform, period, and sample scope. Vanity numbers without context are a defect. +3. Timeline slides are first-class citizens: each wave, season, or phase needs a named cadence and phase-specific metrics. A campaign deck without a pacing slide is incomplete. +4. Audience slides use funnels, tiers, or segment bars—demographics must be tied to behavior and value; never present bare percentages alone. +5. Results slides distinguish outputs (impressions, content volume) from outcomes (search lift, share of new customers, sell-through rate); outcomes must sit higher in the visual hierarchy than outputs. +6. Use fixed fields for case deep dives: context → action → numerical evidence → takeaway. Parallel cases must use consistent, comparable fields. +7. Social/UGC evidence must cite real scale and show a representative content structure; always redraw third-party platform screenshots. +8. The ending must establish direction: next year's theme, overall budget and allocation, and measurement framework. A closing slide that only says thank you is a defect. +9. Every number must include its unit, time point, and source/methodology context; label estimates as internal illustrative assumptions. +10. Imagery and shape language: when permitted by the style signature, proactively source authentic imagery and use creative shape language—torn edges, collage, irregular crops, and signature shapes—instead of ordinary rectangular blocks. Flat rectangles are the last resort, not the default. + +Default baseline (derived from the layout skill; PART B may override): one proposition per screen, with each slide communicating only one core message; continuous body copy on content slides must not exceed 3 lines. Visual tension must come clearly from at least one of the following—generous negative space, strong contrast, a large field of the primary brand color, or full-bleed product/portrait imagery—and remain consistent throughout the deck. Do not stack tables; prioritize major numbers, single charts, and comparison bars. Use one decorative language throughout; never mix more than 2 decorative systems. + +**Title Read-Through Test**: Reading only the slide titles across the deck should tell the complete story. If the sequence does not flow, the structure has failed. + +Density anchor: the specific minimum for each style—the number of evidence modules and charts per slide, plus annotation conventions—is defined by the style's 【Density Baseline】 reverse-engineered from the source deck. This baseline does not impose a uniform number. + +### Global Prohibitions (AI Defaults · Mandatory) + +1. **No cards by default**: unless the user explicitly requests them, never use rounded rectangles or rectangular cards to create hierarchy or alignment. Functional information containers—status indicators, assumption boxes, and quotation frames—do not count as cards. Lines, negative space, type size, and weight differences are better tools. +2. **No equal-split compositions**: unless no other layout is viable, do not default to 3 equal columns, 4 equal columns, or a 2×2 matrix. Equal splits must be justified by the content structure—3 scenarios naturally support 3 columns; frameworks explicitly named in the source copy are exempt. +3. **No ungrounded AI color schemes**: institution-specific palettes stated in the content are exempt. Prohibited choices are moderate, familiar, and unjustified defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **No element that conflicts with the overall style**: do not introduce off-style treatments, such as rounded icons or rounded rectangles in a sharp-edged visual system. +5. **Keep chart backgrounds transparent**: use transparency or the slide background, except for reversed-out charts on dark backgrounds. +6. **No empty regions**: do not leave an entire planned region of the content area blank. Every allocated region must be filled with real content; failure to fill it is the most serious form of roughness. + +## PART B — Signature System (Template-Specific Signature; Overrides PART A in Case of Conflict) + +One-line style signature: austere luxury editorial—cool white, deep black, and desaturated documentary photography as the foundation; narrow copper-brown and warm-gold accents; spacious narrative slides; dense data and appendix slides. + +【Color Palette】Backgrounds: narrative slides use full-bleed desaturated photography, overlaid with #000000 for darkening when necessary; data slides use #FFFFFF only. Primary text: #252525 or #000000 on white, and #FFFFFF over photography. Titles follow the same rule, with no separate title color. Primary accent: #9D5A37 copper-brown, reserved for the primary series, key numbers, or a single conclusion, covering no more than approximately 15% of the slide. Secondary colors: #A6A6A6 and #E7E6E6 carry secondary series, row bands, and structure; #CC9900 or #D79740 is reserved for small highlights. Chart series use #9D5A37 / #A6A6A6 / #000000 / #CC9900 / #585858. Appendix tables use alternating #CCEDFF rows, never on narrative slides. Positive/negative values: default to #252525; when a value belongs to a specific series, retain the series color and rely on +/− or parentheses for interpretation. Use at most 2 non-neutral colors per slide. Never flood a slide with copper-brown or warm gold. + +【Layout Skeleton】Source canvas: 720×405 pt, 16:9. Narrative slide titles sit at the upper left with 2%–3% inset, commonly using “chapter role — slide judgment” as an implicit breadcrumb. The main content unfolds horizontally; information over imagery is consolidated with 1 central mist-white band or 3–4 parallel bands. Data slides use a pure white background with a 1 pt black rule at both top and bottom; the title sits below the top rule. The main chart occupies approximately 60% on the left, and interpretation approximately 30% on the right. Narrative slide numbers are reversed in white at the lower right; data slide numbers sit at the lower right inside the bottom rule, while footnotes align left along that rule. Reading path: upper-left title → central primary evidence → right-side interpretation → bottom methodology. Cover only: full-bleed architectural photography, preserving the building geometry in the upper half, with the theme statement and date centered in the lower section. Section divider only: a full-bleed image carrying only 1 short judgment. + +【Typography】Source-deck facts: titles and large judgments use the serif Georgia; body copy, data, and interpretation use the sans serif Tahoma. Appendix tables additionally use Times New Roman, restricted to that area. Render with {latin: Unna, ea: 思源宋体} (serif titles) and {latin: QuattrocentoSans, ea: MiSans} (sans body/data). Narrative body copy is 12–14 pt=1x; slide titles are 20 pt≈1.5–1.7x; milestone numbers are 28 pt≈2–2.3x; slide numbers/footnotes are 8–10 pt≈0.65–0.75x. Type inside data charts may be reduced to 7–10 pt, while titles remain 20 pt. Large titles and chapter roles favor ALL CAPS; assertions may use serif italics. Do not set numbers in script or decorative styles; units and periods follow the value immediately. + +【Chart Language】Actually used in the source: stacked bars, single-bar comparisons, pie charts, waterfall charts, horizontal timelines, financial statements, and adjustment/reconciliation tables. ⭐Place small pie charts directly beneath stacked bars to show total volume and composition together; use this only when both share the same categories. ⭐Place 1–3 warm-gold oval number badges above bars when needed, labeling only a secondary measure rather than ordinary data labels. ⭐Reserve the right side of data slides for 3–5 short interpretations; bold key entities instead of coloring them. ⭐Use only monochrome black/gray bars and parenthesized negative values in waterfall charts; the endpoint may use a dark bar. ⭐Appendix tables use alternating #CCEDFF bands and thin black rules; never apply this language to body charts. + +【Signature Components】Photography is a hard requirement on narrative slides: use only premium documentary photography of architecture, materials, craftsmanship, people, or on-site environments, either full-bleed or occupying half the slide. Never substitute illustration, abstract gradients, or fabricated scenes, and never carry photography into financial/appendix data areas. Mist-white right-angled horizontal bands: separate conclusions over imagery from the background; use no more than 4 per slide, extending horizontally across the content area. Hairline horizontal rules: use only to separate titles, timeline nodes, or footers; use 1–3 per slide and never close them into frames. Warm-gold oval number badges: use only above financial charts, with no more than 3 per slide. + +【Prohibited】Do not apply high-saturation premade color overlays to narrative photography; create contrast through image luminance and black/white type. Do not use red and green for positive/negative values, as this would break the copper-brown–grayscale system. Do not bring #CCEDFF table bands, small-type appendix density, or Times New Roman into primary narrative slides. Do not place large photographs across white-background data slides; black-and-white photographic chart slides are occasional exceptions, not a general rule. Do not turn mist-white horizontal bands into floating glass cards or shadowed containers. + +【Slide Types and Layouts】Full-bleed photographic argument slide|1 judgment/transition|image 100%, text in the lower-middle 15%–25%|1–2 blocks|short title + hairline rule|unsuitable for data requiring multiple methodological definitions. +Photographic evidence-band slide|3–4 parallel points|title 12%, mist-white bands 55%, footer 8%|3–5 blocks|mist-white horizontal bands|unsuitable for extended argumentation. +Photographic timeline slide|phase evolution|title 12%, horizontal nodes 65%, quotation/methodology 15%|4–7 nodes|large numbers + hairline rules|unsuitable for non-sequential categories. +White-background chart interpretation slide|scale, composition, or drivers|title 15%, left chart 55%–65%, right text 25%–35%|1–2 charts + 3–5 points|copper-brown bars, number badges, footer rule|unsuitable for emotional statements. +Audit/adjustment table slide|cross-period details/methodology reconciliation|title 12%, table body 72%, notes 10%|1–2 tables|gray body bands, pale-blue appendix bands|unsuitable for conclusion slides. +Occasional · split white-ground/photographic slide|1 concept and 1 portrait/product photograph|left text 45%, right image 55%|2–3 blocks|no component|unsuitable for multi-series data. + +【Density Baseline】Full-bleed argument slides should contain 1–2 blocks of 12–40 words/characters equivalent each, using negative space in the image for breathing room. Photographic evidence slides should contain 3–5 blocks of 20–60 words/characters equivalent each; keep breathing room between horizontal bands, but do not leave an entire region empty. White-background chart slides typically contain 1 primary chart, with at most 1 set of small pie charts; label every segment of stacked bars and label proportions on pie charts, then add 3–5 interpretations of 25–70 words/characters equivalent each. Audit slides contain 1–2 tables with 8–20 rows; appendices may extend to 15–30 rows with 1–4 lines of small-type notes and do not set the minimum for body slides. On white-background slides, preserve whitespace between the title and main chart, between the chart and interpretation column, and above the footnote rule. diff --git a/skills/open-kimi-ppt/reference/design_system/promotion/travel-green-handbook/design.md b/skills/open-kimi-ppt/reference/design_system/promotion/travel-green-handbook/design.md new file mode 100644 index 0000000..7bd8576 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/promotion/travel-green-handbook/design.md @@ -0,0 +1,75 @@ +# Travel Green Handbook · Promotion STYLE DESIGN SYSTEM + +**Create at Full Capacity**: Apply your full creativity and imagination. Treat every slide as an independent, complete design work worthy of close consideration; structure, composition, charts, imagery, and visual storytelling must be driven by the content rather than forced into default layouts. + +**No AI Slop**: Do not produce low-judgment, formulaic, decoration-heavy AI defaults, including unjustified card arrays, equal-split grids, arbitrary blue-purple gradients or glassmorphism, icon walls, hollow oversized text, repetitive skeletons, or visual gimmicks unrelated to the content. Every slide must demonstrate a clear design decision grounded in its content. + +**Landscape Delivery**: Deliver the final presentation in a consistent 16:9 landscape format. Portrait or non-16:9 source materials are references for style observation only; they must be recomposed for 16:9 landscape and must never retain the original canvas proportions directly. + +**Layout Coordination**: style.md is the final authority on style (typography, color, components, chart language, and prohibited treatments); the “Layout/Visual Task” line for each slide in query.md governs that slide’s content structure, primary anchor, and reading order. Both are execution specifications: follow the task behavior in query.md for layout intent and style.md for the final visual treatment. +### Global Prohibitions + +1. **Do not use cards by default**: Unless the user explicitly requests them, never use rounded rectangles or rectangular cards to create hierarchy or alignment. Functional containers such as status indicators, assumption boxes, and quotation frames are not considered cards. Lines, negative space, type scale, and weight contrast are better tools. +2. **Do not use equal-split compositions**: Unless no viable alternative exists, do not default to three equal columns, four equal columns, or a two-by-two matrix. An equal split must be justified by the content structure—three scenarios naturally warrant three columns, and frameworks explicitly named in the body content are exempt. +3. **Do not use ungrounded AI color schemes**: Institutional palettes specified in the content are exempt. The prohibition applies to generic, overfamiliar, unjustified defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **Do not introduce elements that conflict with the overall style**: Never use forms outside the established visual language, such as rounded icons or rounded rectangles in a sharp-edged style. +5. **Keep chart backgrounds transparent**: Use transparency or the slide background color, except when reversing to light graphics on a dark background. +6. **Use large areas of negative space deliberately**: Maintain appropriate density in the content area. Artificially padding or diluting content, or cramming a slide, is a defect. Negative space used for breathing room, grouping, and rhythm is permitted; form must follow content, and content must never be forced in merely to fill the canvas. + +## PART A — Category Baseline (Universal Minimum Standard) + +A brand presentation that leads with emotion while keeping every piece of evidence auditable, benchmarked against top-tier agency annual reports, campaign retrospectives, and destination or product launch decks. Every slide must land one memorable creative idea while keeping every claim verifiable—bold in form, disciplined with numbers. + +Content and layout: +1. Creative-led structure: a single annual/campaign proposition → audience and market evidence → development of the big idea (waves/chapters) → channel and content system → results with full measurement context → direction for the following year. +2. Make headline metrics the protagonists: give a small number of key figures full-slide or oversized-type emphasis; arrange supporting evidence around them in compact modules. +3. Use medium density to create rhythm: alternate evidence-dense slides with spacious statement slides; the deck should rise and fall like a story, not fill every space like a report. + +Visual style: +1. Aesthetic: confident, contemporary, and brand-first; use photography or illustration only when the source style genuinely calls for it—never use stock assets merely to fill space. +2. Typography: one expressive display typeface carries the major propositions, as defined by the style signature; one highly legible workhorse typeface handles body copy and data. Set large numbers in the display typeface. Apply capitalization and tracking rules consistently across the deck. +3. Color: one brand color family per deck—one primary color plus lighter and darker tonal steps—with a single contrasting accent reserved for CTAs and highlighted data; the background follows the style signature. No rainbow charts. +4. Graphics: reduce charts to the story essentials, using few series and direct labels. Timelines, funnels, and audience bars are signature chart forms. Icons must follow the established line or fill language of the style; no multicolor clip art. + +Structure and discipline (derived from the work we recognize as benchmark quality): +1. One big idea per slide: the slide title states the campaign proposition or chapter message, and every module on the slide serves that single idea. +2. Campaign evidence must include complete measurement context: impressions, completion rate, engagement rate, and conversion must always specify platform, period, and sample scope. Vanity metrics without context are a defect. +3. Timeline slides are first-class citizens: every wave, season, or phase has a named beat and phase-specific metric. A campaign deck without a pacing slide is incomplete. +4. Audience slides use funnels, tiers, or audience bars—demographics must be tied to behavior and value; never show bare percentages alone. +5. Results slides distinguish outputs, such as impressions and content volume, from outcomes, such as search lift, share of new customers, and sell-through rate. Outcomes take visual priority over outputs. +6. Deep-dive case studies use fixed fields: context → action → numerical evidence → implication. Parallel cases must use consistent, comparable fields. +7. Social/UGC evidence cites authentic scale and shows representative content structures. Always redraw screenshots from third-party platforms. +8. The ending must provide direction: next year's theme, total budget and allocation, and measurement framework. A closing slide that only says thank you is a defect. +9. Every number must include a unit, time reference, and source/methodology context; label estimates as internal illustrative assumptions. +10. Imagery and shape language: when permitted by the style signature, proactively source authentic imagery and use expressive shapes—torn edges, collage, irregular crops, and signature forms—instead of generic rectangular blocks. Flat rectangles are the last resort, not the default. + +Default baseline (derived from the layout skill; PART B may override): one screen, one proposition; each slide communicates only one core message; continuous body copy on a content slide must not exceed 3 lines. Visual tension must come from at least one clearly defined source—expansive negative space, strong contrast, a large field of the brand color, or full-bleed product/people imagery—and remain consistent throughout the deck. Do not stack tables; prioritize oversized figures, a single chart, or comparison bars for data. Use one decorative language across the deck; never mix two or more decorative systems. + +Density anchor: the specific minimum for each style—the number of evidence modules and charts per slide, plus annotation conventions—must follow the 【Density Baseline】 reverse-engineered from that style's source deck. This baseline does not impose one universal numeric target. + + +## PART B — Signature System (Template-Specific Signature; Overrides PART A in Case of Conflict) + +One-line style signature: a warm, humanistic editorial handbook—gray-beige paper, a river-blue primary axis, and one chapter-level accent such as coral or burgundy, alternating medium-low-density narrative slides with high-density sample slides. + +【Color Palette】 Use #EFEBE5 as the default background. Set primary text and titles consistently in #246B81, which may also be used for dark color fields. Use #F8AA98 as the primary accent for chapter color fields or a small amount of critical information. Select only one supporting color per chapter: light blue #B0D0D9 may fill backgrounds; burgundy #A13846, yellow-green #DCD060, purple #948EC1, warm gray #DAD0C8, and orange #F2B84C each belong to one thematic section. The source deck contains no data charts; limit any newly added series colors to #246B81, #B0D0D9, and #F2B84C. Show both positive and negative values in #246B81, paired with “+/-” or a text judgment; do not invent a red-green semantic pair. A standard slide may use only two hues—primary blue plus one chapter color—excluding photographs. Palette and sample-summary slides are exceptions; when a chapter color occupies a large area, return all other elements to primary blue and off-white. + +【Layout Skeleton】 Source facts: canvas 1224×792, 17:11. Body content uses approximately 6% left and right margins and 7%–8% top margin. Titles sit at the upper left, often split across two uppercase lines; an extremely small chapter eyebrow sits at the upper right, and the page number sits at the lower right. The primary grid is “26% left lead-in + 60% center-right evidence zone,” with the latter optionally divided into two columns. Reading begins with the title and lead-in, then moves horizontally or downward. The cover alone uses a “large title crossing the image’s top edge + a large photo centered in the lower area” composition. Section slides alone use a “30%–42% color band on top + 58%–70% full-width image below” composition, or a full-slide solid color with a short passage. 16:9 migration: standardize final delivery to 16:9 landscape, retain the anchors and 6% horizontal margins, and allocate the added width to the evidence zone. Rework four-tier vertical examples into two to three tiers or two columns. Recrop section-page photographs for the wider frame; do not stretch the type. + +【Typography】 Source typography facts: embedded fonts verified in the PDF are the sans-serif Marr Sans for titles and the serif Capitaine for body copy. Use Capitaine Regular for narrative text; use Marr Sans Semibold/Bold for subheads. Keep the hierarchy of content-slide titles moderately differentiated, and enlarge chapter titles substantially only on transition slides. The source deck establishes no consistent convention for large numbers; use them as local focal points only when the content contains a genuine headline metric. Footnotes and page numbers must recede clearly. Set content-slide titles and chapter eyebrows in uppercase with slightly increased tracking; narrative chapter titles may use sentence case. Render with {latin: SortsMillGoudy, ea: 思源宋体} (serif narrative body) and {latin: Liter, ea: MiSans} (sans titles/structure). In the 16:9 landscape format, preserve the role relationship of “sans serif structures, serif tells the story”; do not retain the source deck’s absolute font sizes or scaling ratios. + +【Chart Language】 No statistical charts were observed; tables appear only in finished sample spreads. ⭐ Leader-line anatomy diagram: connect one large central sample to 6–10 short labels using fine #B0D0D9 lines and hollow circles; this treatment appears consistently on 5 slides and is used to explain composition. ⭐ Image evidence matrix: use a 2×2 grid or a single column of four equal-width cropped images, each with a short heading and description, to compare parallel evidence. ⭐ Pairing matrix (occasional): use square-cornered color blocks to show recommended and not-recommended combinations together, strictly for compatibility judgments. + +【Signature Components】 Photography is a hard constraint: specific people and places must not be replaced with illustrations. On chapter openings with photography, the image occupies the lower 58%–70% of the slide; crop body-slide evidence images with square corners. Select only documentary images with natural light, authentic environments, and unstaged subjects; never substitute cutout figures or generic stock photography. Split-color principles board: use the left 1/3 in #EFEBE5 for the lead-in and fill the right 2/3 with #246B81, holding 3–4 sets of “photo + white-text description”; use this component no more than once per slide. Allow no more than one set of technical annotations per slide; fine lines must not cross body copy or become a decorative grid. + +【Prohibited】 Do not replace #EFEBE5 with a full pure-white slide; white is reserved for sample backgrounds or negative space within images. Do not activate more than one chapter color on a standard content slide. Do not use rounded cards, shadows, gradients, or floating containers; divide regions only with square-cornered color fields, fine lines, and negative space. Do not use staged people, isolated products, or overly retouched stock photography. Do not place small text over complex photographs; a large cover title crossing an image boundary is the sole exception. Do not center long passages; left-align body copy and labels. + +【Slide Types and Layouts】 +Narrative introduction | Establish the chapter viewpoint | Title in the upper-left 25%, narrow column in the center-right 40% | 1–2 long-form text blocks | No additional components | Not suitable for multi-evidence comparisons. +Left lead-in—right arguments | Summarize with 3–4 supporting arguments | Left column 26%, right zone 60% | 4–5 blocks | Two-line uppercase title | Not suitable for a single large image. +Central sample anatomy | Explain an object’s composition | Central sample 45%–55%, annotations around it | 6–10 labels | Fine leader lines, hollow circles | Not suitable for sequential processes. +Image evidence matrix | Compare similar scenes or cases | Left lead-in 25%, right-side 2×2 grid or four rows | 4–6 image-text blocks | Documentary photography or a consistent illustration system | Not suitable for long-form narrative. +Split-color principles | Present a rule overview | Left 1/3 lead-in, right 2/3 dark zone | 3–4 blocks | Split-color principles board | Not suitable for light-colored charts. +Application showcase | Demonstrate finished applications | Open title area above, 1–4 samples arranged horizontally below | 1–4 blocks | Square-cornered samples | Not suitable for complex causality. + +【Density Baseline】 Do not impose one universal hard minimum across slide types. Narrative introduction slides use 1–2 blocks of 180–320 words/characters equivalent each and may contain 6–14 lines of body copy, overriding PART A’s default “three lines.” Left lead-in—right arguments slides use 4–5 blocks of 35–90 words/characters equivalent each. Central sample anatomy slides use 6–10 labels of 10–35 words/characters equivalent each. Image matrices use 4–6 images with 20–60 words/characters equivalent per image. Application showcase slides use 1–4 samples with only brief annotations. Source body slides typically contain 0 statistical charts; when a new deck must add one, use no more than 1 chart per slide and label only series endpoints and conclusion points, not every bar or data point. Concentrate negative space below titles, between columns, and above the footer as deliberately reserved space within the grid. diff --git a/skills/open-kimi-ppt/reference/design_system/work/blue-flame-brand/design.md b/skills/open-kimi-ppt/reference/design_system/work/blue-flame-brand/design.md new file mode 100644 index 0000000..d8ee662 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/work/blue-flame-brand/design.md @@ -0,0 +1,104 @@ +# Blue Flame Brand · work_report STYLE DESIGN SYSTEM + +## PART A — work_report Baseline (Universal Floor) + +Conclusion-first business reporting, benchmarked against top-tier business reviews and project progress briefings: every page scannable in 30 seconds, every number able to withstand drill-down — status backed by evidence, deviations attributed, asks spelled out. + +Content and layout: +1. Management structure: executive overview (one-page verdict on completion) → core metrics vs. targets → revenue/mix analysis → deviation attribution → project status (red/amber/green) → cost and efficiency → next-period actions → items needing decisions and support. +2. Status visualization is the signature: red/amber/green status lights, target vs. actual tables, progress bars with numeric labels, variance waterfalls, milestone timelines. +3. Medium-high density, grid discipline: pages are built from aligned status modules and tables; zero decoration; every module answers "so what" on the spot. + +Visual style: +1. Aesthetics: crisp, corporate, instrumental; the reader can audit the quarter from the pages alone. +2. Type: a single sans-serif family throughout, hierarchy built on weight and size; numbers column-aligned; never use serif display type (except the serif pairing specified in PART B). +3. Color: a neutral structural palette plus one accent for emphasis and current-period highlights; green/amber/red express status only, never decoration. +4. Graphics: simple chart types (bar comparisons, line trends, waterfall attribution); fine table rules, right-aligned numbers; no 3D, no pictographs as data, no gradient fills. + +Structure and discipline: +1. Page one is always the verdict: one sentence on overall completion + target vs. actual for 3–5 headline metrics; no filler cover fluff. +2. Every metric shows the trio — target / actual / attainment rate; actual without target is a defect. +3. Deviation pages attribute quantitatively: the gap decomposes into named causes that sum exactly to the total gap — no unexplained remainder. +4. Project status comes as a trio: status light + evidence (progress %, milestones) + corrective action (with owner and date); a red item without a recovery plan is a defect. +5. Next-period actions are commitments: each carries an owner, a deadline, and an expected quantified effect. +6. Trend pages mark the reporting-period boundary, with inflection causes annotated inside the chart; forecast segments use dashed lines labeled as plan/estimate. +7. Parallel modules align strictly to the grid: same row, same height, same baseline; mixed content is grouped by meaning, not scattered. +8. Numbers must carry unit, period, and basis; estimates and modeled values follow the conventions of the underlying project materials. +9. The deck closes on items for management decision and support — listed one by one, each with the consequence of delay; no thank-you page endings. + +Default baseline (PART B may override): progress / attainment / red-amber-green status use one unified lightweight component, drawn one way across the deck; each page has 1 theme + 2–4 supporting points, the conclusion graspable within 5 seconds; every metric carries its "so what" — cause, impact, or next action — no bare-number piles. Density anchor: per-page minimums for evidence modules, charts, and labeling habits follow this style's density-baseline section; this baseline imposes no uniform numbers. + +**Headline read-through test**: reading only the page titles across the deck should tell the complete story; if the read-through fails, the structure has not been established. + +### Global Prohibitions (AI Default Patterns · Mandatory) + +1. **No default cards**: strictly no rounded-rectangle cards to build hierarchy or alignment — containers serving information functions (status lights, decision cards, quote boxes) do not count as cards. Rules, whitespace, and size/weight contrast are the better solution. +2. **No evenly split compositions**: no default three-way, four-way, or 2×2 matrix splits — even splits must be justified by content structure. +3. **No unmotivated AI color schemes**: palettes specified in the body are exempt; what is banned is the mediocre, unjustified default — blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, glowing borders. +4. **No element that clashes with the overall style**: nothing outside the style may appear. +5. **Transparent chart backgrounds**: transparent or the page background color, except reversed-out on dark. +6. **Care with large empty areas**: whitespace for breathing, grouping, and rhythm is allowed; padding to fill space, or stretching thin content into a crowded page, is treated as a defect. + +## PART B — Signature System + +One-line style signature: a late-night operations war room — on a near-black blue ground, flame cyan and ice blue form two tiers carrying data and attainment, amber owns anomalies and consequences, mixed-weight conclusion titles sit in a fixed four-corner skeleton, and photography stays on the cover only. + +【Color Palette】 +- Background: body pages in near-black blue #06070B (approx.), cover and closing one step deeper at #020307 (approx.); this dark family is the only one allowed, chart areas get no separate fill. +- Main titles / key assertions: cold white #F7F8FA (approx.). +- Body #C6CCD3 (approx.); secondary explanation #969DA3 (approx.); footer / weak annotation #6E757B (approx.); faintest atmosphere layer #414548 (approx., reserved for decorative-quote elements). +- Flame cyan #1FB9D5 (approx.): the brand anchor — sole primary chart color, progress fills, attainment state; no large color blocks in body areas. +- Ice blue #B8ECF9 (approx.): big numbers, in-ring values, table-top rules, milestone nodes, decision-card outlines — the brightest data tier. +- Mid cyan #4FA0BB (approx.): leader lines, route connectors, and other structural hints; the cover eyebrow may use light cyan #88D3E8 (approx.). +- Amber #DFA93C (approx.): reserved for warnings, misses, risks, and consequences of delay — never decoration. +- Status green #58CA8F, coral red #D96A56 (both approx.): enter only status lights and linked progress bars, expressing on-track / delayed; "attained" never borrows green — always flame cyan. +- Structural colors (all approx.): structural lines #1A222C, track beds #141B23, card outline dark cyan #214A59, axis baseline #536780, phase dashes #527490. +- Decorative mist blobs: low-opacity ellipses of deep navy #050A1E and deep teal #06191D (approximate ranges), clipped by the canvas edges, never overlapping text or charts. + +【Layout Skeleton】 +Source facts: 16:9 canvas (sample images 1467×825), left/right safe margins ~6%. Header at ~3%–7% from top: business ownership at top left, report info at top right; title band at ~16%–25%: one-line conclusory title + one-line basis subtitle; body at ~27%–86%; bottom conclusion band at ~83%–90%: full-width hairline + one closing-loop judgment; footer pinned to the bottom: source/basis at lower left, "NN / total pages" page number at lower right. The reading path is fixed: "title conclusion → left-column judgment/annotation → right-side evidence chart → bottom closing sentence". Body column ratios are commonly 35:65 or 60:40; comparison types use a ~23% overview column + three isomorphic columns of ~25% each, separated by ultra-fine vertical rules. No breadcrumbs, no side navigation anywhere; modules are tiered purely by hairlines, whitespace, and weight — never by panels. + +【Typography】 +Source facts: modern sans-serif dominates absolutely, with narrow numerals carrying an industrial-instrument feel; table body text may switch wholesale to a serif face in the Song/Mincho manner, pairing against the sans-serif titles — the most distinctive type signature of this style. Titles use same-sentence mixed setting of "regular-weight statement + bold conclusion", about 2.3–2.5x body size; KPI big numbers 2–3.5x, units shrunk to about half on the same baseline; subtitle/body = 1x; module subheads ~1.2x medium; notes and sources 0.65–0.8x; the two-line cover title collides light and heavy weights. Decorative quotation marks use serif in the faintest color, as atmosphere only. No italics, no script, no display lettering; numbers receive no ornamental treatment. + +【Chart Language】 +- ⭐ Ring progress gauges (many pages): thick ring + dark track, one short tick at 12 o'clock reinforcing the instrument feel; big number + metric name at the ring's center, two lines of target/actual basis below; flame cyan = attained, amber = gap; at most 3 side by side per page. +- ⭐ Single-series bar chart (trend pages): all bars the same flame cyan, small rounded caps, values labeled directly per bar; ~4 ultra-dark horizontal gridlines + one brighter axis baseline; vertical dashed lines split before/after phases, circled-number event callouts hug their bars, mapping one-to-one to left-column notes; no legend, no y-axis title. +- ⭐ Horizontal progress bars (status pages): dark track + status-colored fill, the value or result written to the right of the bar, never on top of it; progress itself uses flame cyan, status lights use green/amber/red — progress and status are deliberately color-separated. +- ⭐ Vertical-line-free matrix table (diagnosis pages): no fill, no vertical lines, no zebra striping; an ice-blue full-width rule on top, a dark rule closing the bottom; number columns aligned, status column as "dot + word", a fixed drill-down note column at far right; table body in serif, the actual column bolded as a vertical anchor. +- Invisible-table scorecard (comparison pages): labels left, values right, fine horizontal and vertical rules dividing zones; no header, no legend, no outer frame. +- Three-phase roadmap (closing page): one full-length hairline + ice-blue hollow nodes; phase names above the nodes, milestones and entry gates below; a narrative route with no time scale. +- Concentric-ring bullseye (attribution pages): double rings + multiple converging rays channeling left-side factors into the core number; a decorative convergence figure that encodes no proportions. + +【Signature Components】 +- Fixed four-corner skeleton: ownership top left / report ID top right / source bottom left / "NN / total" page number bottom right — never missing anywhere in the deck. +- Bottom conclusion strip: full-width hairline + one closing-loop judgment (or a short vertical ice-blue line + single sentence), one per body page, containerless. +- Clipped mist blobs: low-opacity deep teal/navy ellipses entering from canvas edges, at most one per page, never intruding into data zones. +- Status dot + word: ● plus a two-character status word, an in-place legend, never a separate legend area. +- Circled-number cross-references: ①② markers appear both in left-column notes and inside the chart, building the narrative–evidence mapping. +- Serif table pairing: sans-serif titles + serif table bodies, used only on diagnostic table pages. +- Decision-card syntax: ice-blue thin-outlined cards (no shadow, no glow, fill close to the background), fixed as "decision number + main decision sentence + composition note + amber consequence of delay". +- Cover triple KPI: separated by thin vertical rules, number/unit/label on one baseline; ultra-wide night photograph with a dim blue-cyan thin outline, one cover page only. + +【Prohibited】 +- No light full-page backgrounds or white chart frames; the deck is dark throughout, charts get no separate fill. +- No multi-series rainbow chart colors: charts allow the flame-cyan single-hue family only; amber/green/coral red are spent only on status semantics. +- No green as "attained": attainment uses flame cyan; green enters status lights only. +- No legend dependence: labels sit directly beside the data; no axis titles, no explicit y-axes, no complex grids. +- No 3D, shadows, glows, highlight gradients, or glassmorphism; clipped mist blobs are the only permitted gradient element. +- No colored icons, emoji, or illustrations on body pages; photography is allowed on the one cover page only. +- No centered display titles, no thank-you-style endings; the close must land on roadmap + decisions. +- No text overlaid on progress bars; no highlighted card fills or shadows. + +【Slide Types and Layouts】 +Cover | title cluster + triple KPI + ultra-wide photo | text occupies the left ~50%, upper right left dark | photo ~4.2:1, cut off early on the right | ice-blue numerals with thin vertical dividers | the only page with a photo. +KPI overview | one judgment verified by three gauges | left 35% judgment + right 65% three rings | 4–6 status lines + 3 rings | bottom attribution closing sentence | not suited to parallel multi-topic content. +Diagnostic table | metric audit and drill-down | 6-column matrix, metric column ~24%, drill-down column ~32% | 5–8 rows | status-dot column, serif table body, bottom conclusion strip | not suited to narrative pages. +Trend evidence | time series and inflection attribution | left ~24% circled-number notes + right ~71% bar chart | 8–10 bars, 2 event callouts | phase dashes, big number at lower left | not suited to multi-series comparison. +Deviation attribution | gap decomposition and reconciliation | left 60% grouped delta list + right 40% bullseye | 4–6 factor rows in two groups | converging rays, bottom sealing sentence | not suited to precise waterfalls. +Horizontal comparison | same-basis multi-object scoring | ~23% overview + three isomorphic columns of ~25% | per column: 1 primary metric + 3 KV rows + 1 diagnostic passage | invisible tables, status dots | no more than 4 columns. +Status governance | project red/amber/green tracking | 3 equal-height horizontal cards stacked vertically, ~62:38 inside each | five fields per card: status / progress / blocker / correction / owner and date | progress bars, status lights | no more than 3 cards. +Roadmap-decision close | next-phase route + sign-off | upper half three-node roadmap + lower half two decision cards | 2 lines of description per node | ice-blue gates, amber consequences | no thank-you pages. + +【Density Baseline】 +Body pages carry 4–7 core modules and 8–26 independently readable text blocks; diagnostic table pages are densest, at ~6 columns × 5–8 rows and 30+ cell-level information groups. Each page has 1 main chart or 1 set of isomorphic gauges (at most 3); trend bars number 8–10, each directly labeled; progress-bar pages cap at 3 bars; scorecards carry 3–4 KV rows per column. Titles 1 line, subtitles 1 line, bottom closing sentence 1–2 lines; left-column note blocks run 2–3 lines each, roughly 25–60 words/characters equivalent; status cards carry ~5–7 text blocks each. Whitespace concentrates between title and body, in inter-column gutters, in the dark field at right, and at the page edges; the body area holds no large empty block, nor may it be filled to overflow. diff --git a/skills/open-kimi-ppt/reference/design_system/work/electric-violet-business/design.md b/skills/open-kimi-ppt/reference/design_system/work/electric-violet-business/design.md new file mode 100644 index 0000000..92077b5 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/work/electric-violet-business/design.md @@ -0,0 +1,77 @@ +# Electric Violet Business · WORK REPORT STYLE DESIGN SYSTEM + +## PART A — Category Baseline (Universal Floor) + +A conclusion-first business review benchmarked against top-tier operating reviews and project progress briefings. Every slide in this deck must be scannable within 30 seconds, and every figure must withstand drill-down questioning: status is backed by evidence, variances are attributed, and requests are stated explicitly. + +Content and layout: +1. Executive structure: conclusion overview (a one-slide performance verdict) → core metrics vs targets → revenue/mix analysis → variance attribution → project status (red/amber/green) → cost and efficiency → next-period actions → decisions and support required. +2. Status visualization is a signature: red/amber/green indicators, target vs actual tables, progress bars with numeric labels, variance waterfalls, and milestone timelines. +3. Medium-to-high density with strict grid discipline: pages are built from aligned status modules and tables; zero decoration; every module answers “So what?” in place. + +Visual style: +1. Aesthetic: crisp, corporate, and utilitarian; the reader should be able to audit the entire period from the pages alone. +2. Typography: use one sans-serif family throughout; establish hierarchy through weight and size, never decorative type; always align numbers in columns, and never set numbers in serif display type. +3. Color: use a neutral structural palette (dark slate/graphite + gray). Reserve status colors strictly for meaning—green/amber/red communicate status only. Use one accent color (as defined by the style) for emphasis and current-period highlights; never use status colors decoratively. +4. Graphics: use simple charts (bar comparisons, line trends, variance waterfalls); use fine rules in tables and right-align numbers; no 3D, no pictograms as data, and no gradient fills. + +Structure and discipline (distilled from work we recognize as best-in-class): +1. The first slide is always the verdict: one sentence on overall attainment + target vs actual values for 3–5 headline metrics; never pad the deck with a generic cover. +2. Every metric must show target, actual, and attainment rate together; a metric with an actual but no target is a defect. +3. Variance slides must provide quantitative attribution: break the gap into named causes whose amounts sum to the total gap; no unexplained remainder is allowed. +4. Project status requires a complete triad: status indicator + evidence (progress %, milestone) + corrective action (with owner and date); a red item without a recovery plan is a defect. +5. Next-period actions are commitments, not wishes: each must include an owner, timing, and expected quantified impact. +6. Trend slides must mark the reporting-period boundary and annotate the causes of inflection points within the chart; render forecast segments with dashed lines and label them as planned/estimated. +7. Align parallel modules rigorously to the grid: modules in the same row share height and baseline; group mixed content by meaning rather than scattering it. +8. Every number must include its unit, period, and definition (GMV or revenue, order volume or sales value); label estimated values as internally defined examples. +9. The deck must end with items requiring management decisions and support—list each separately with the consequence of delay; never close with a thank-you slide. + +Default baseline (distilled from the layout skill; PART B may override): use one consistent lightweight component system throughout for progress, attainment rates, and red/amber/green status; each slide contains 1 topic + 2–4 supporting points, with the conclusion graspable within 5 seconds; every metric must be paired with a “So what?”—cause, impact, or next action—rather than presented as a bare number. + +**Title read-through test**: reading only the slide titles should tell the complete story; if they do not read coherently in sequence, the structure has not been established. + +Density anchor: the specific floor for each style (evidence modules per slide, chart count, and annotation conventions) is defined by the 【Density Baseline】 reverse-engineered from that style’s source deck—the baseline here imposes no universal number. + +### Global Prohibitions (Default AI Patterns · Mandatory) + +1. **No default card-based layouts**: unless explicitly requested by the user, do not use rounded rectangles or rectangular cards to create hierarchy or alignment—functional containers (status indicators, assumption boxes, quote frames) are not cards. Lines, whitespace, and differences in type size and weight are preferred. +2. **No equal-split compositions**: unless no other layout is viable, do not default to three equal columns, four equal columns, or a two-by-two matrix—equal division must be justified by the content structure (three scenarios naturally support three columns; frameworks explicitly named in the brief are exempt). +3. **No arbitrary AI color palettes**: institution-specific palettes stated in the body are exempt. Prohibited treatments are generic, familiar, and unjustified defaults—blue-purple gradients, cyan-purple neon, rainbow glows, glass cards, and glowing borders. +4. **No elements that conflict with the overall style**: do not introduce out-of-style treatments, such as rounded icons or rounded rectangles in a sharp-edged visual system. +5. **Keep chart backgrounds transparent**: use transparency or the slide background color, except for reversed charts on dark backgrounds. +6. **No unfilled regions**: do not leave large blank areas in the body content zone; every planned region must be filled with real content. Failure to fill a region is the most serious form of roughness. + +## PART B — Signature System (Template-Specific Signatures; Overrides PART A in Case of Conflict) + +One-line style signature: editorial corporate documentary, using a single Electric Violet focal accent on white/near-black backgrounds, alternating large authentic photographs with medium-to-high-density data slides. + +【Color Palette】 +Background: #FFFFFF for body slides; #121212 only for the cover/image-led openers, and #000000 only for the closing slide. Primary text and headings on white: #121212; headings on dark backgrounds: #FFFFFF. Primary accent: #5114F6, used for section backgrounds, key figures, bars/strips/bubbles, and fine outlines—not as decorative blocks in body content. Supporting colors: #9E9E9E only for secondary annotations; #CCCCCC only for gridlines. Charts: #5114F6 for the primary series, #9E9E9E for the baseline, and #000000 occasionally for a priority star marker. Positive/negative colors inherit PART A; the source deck provides no stable hex values. Apart from neutrals, allow only one hue per slide. Full-bleed Electric Violet is reserved for section slides; it may occupy approximately 44%–56% of a body slide only when the content has a genuine binary relationship. + +【Layout Skeleton】 +Source canvas: 10×5.625 inches, 16:9. Standard slides have no full-width header; primary content begins at approximately 12% from the left, ends at 94.5% on the right, starts 10%–20% from the top, and leaves an approximately 10% footer band at the bottom. The footer has no divider: place one short category/period label at bottom left and one page number at bottom right. The stable grid uses a 44/56 image-text split, a 38/62 information split, or a three-column narrative; the default reading path is judgment on the left → evidence on the right. Cover only: near-black upper 49% and photograph lower 51%, with the title left-aligned on the black field. Section slide only: full-bleed #5114F6, with “two-digit index—section title” positioned around 12% from the left and 34% from the top. + +【Typography】 +The source PPTX explicitly uses Tahoma as the primary typeface, a neutral sans serif; Roboto appears sparingly in a few section titles/table labels and must not be elevated to primary status. Body text 1x=7pt; standard titles approximately 3.1x=22pt; section titles approximately 3.7x=26pt; covers occasionally use 5.1x=36pt; large figures approximately 2.4–3.7x=17–26pt; footnotes approximately 0.86–0.93x=6–6.5pt. Titles, KPI figures, and section bands use bold; body copy stays regular, with hierarchy built through weight, scale, and space. Use sentence case for titles; section numbers always use a two-digit index followed by an em dash; large figures may be followed immediately by “+” or a unit. For new non-English content, retain a comparable sans serif and the same scale ratios; render with QuattrocentoSans (Latin text/numerals) and MiSans (Chinese). + +【Chart Language】 +The source deck uses single-series vertical bars, horizontal progress/comparison bars, dot-matrix ratings, number bubbles, bubble matrices, and tables; maps and radial charts appear only occasionally. ⭐Dot-matrix rating: in a row of outlined Electric Violet circles, fill only one circle and place the value at the end of the row; use for a 10-point scale or stage position. ⭐Progress bar: fine Electric Violet outline, solid fill from the left, with the percentage right-aligned inside the frame. ⭐Number bubble: equal-size solid circles as numeric containers; never use area to imply quantity; no more than 4 within one group. ⭐Vertical bar chart: use #5114F6 for every bar with fine light-gray gridlines; do not recolor individual bars; use a #000000 star only occasionally for a small number of focus items. ⭐Bubble matrix, occasional use only: a 44/56 split between an Electric Violet index area on the left and a white coordinate area on the right. + +【Signature Components】 +1. Section index title: use “NN—” to establish rhythm; appears only on full-bleed Electric Violet section slides, once per slide. +2. Near-black statement field + photograph: the left approximately 44% contains one large statement only; the right approximately 56% is a full-height photograph with no additional body copy overlaid. +3. Photography is a hard requirement: approximately half of the slides use documentary photographs of people/work environments, cropped large with square corners and separated from text; never substitute abstract illustrations, colorful icons, or blurred imagery. If no suitable photograph is available, use a pure-white data slide instead. +4. Fine footer: information label at bottom left, page number at bottom right, with no color block or horizontal rule; one footer set on every body slide. + +【Prohibited】 +Do not use a second decorative accent color or multicolored series; charts may introduce PART A status colors only when genuine status semantics exist. Do not place text over photographic texture; do not replace large documentary images with circular headshots, color-tinted photographs, or abstract illustrations. Do not use heavy black, all caps, or decorative type to establish title hierarchy. Do not fill half a slide with Electric Violet unless the content has a clear binary structure; standard data slides retain only lines, bars, figures, and circular accents. + +【Slide Types and Layouts】 +Image-text narrative slide|Best for one conclusion plus context/testimony|Photograph 44%–56% or 28% sidebar, with 1–3 text blocks in the remaining area|2–4 blocks|Large documentary image + fine footer|Not suitable for comparing many metrics. +Data overview slide|Best for parallel outcomes/composition|Title area approximately 20% on the left, two data columns approximately 65% across the center and right|4–8 blocks|Large figures, dot matrices, progress bars, bubbles|Not suitable for long causal chains. +Chart evidence slide|Best for grouped comparisons addressing one question|Conclusion and annotations in the upper/left 20%–35%, one primary chart in the lower right 55%–65%|2–3 blocks|Single-violet series + priority star marker|Not suitable for a multi-topic collage. +Multi-case gallery slide|Best for 2–3 parallel cases|Image above text in each column, with photographs occupying the upper half of the slide|2 blocks per case|Square-corner photographs + left-aligned titles|Not suitable when the three items have unequal importance. +Black-field image opener|Best for a section transition or single-sentence viewpoint|Black field 44% + photograph 56%|1 sentence + 1 image|Large reversed title|Not suitable for evidence or action lists. + +【Density Baseline】 +Long-form pages in the source deck typically contain 2–5 text blocks totaling approximately 900–1800 Latin characters. To preserve PART A scanability in a new business report, retain columns but compress the content to 2–3 blocks, each with an 80–160 words/characters equivalent. Image-text slides should use 1 large image + 1–3 explanatory blocks; data overview slides should contain 4–8 evidence modules; chart slides should contain 1 primary chart or 2–4 microcharts. Label progress bars, bubbles, and horizontal bars in place; vertical bars rely on the y-axis and should not label every bar, highlighting only 1–2 priorities. Keep whitespace at the left entry margin, between columns, and in the bottom footer band. Image-led openers and data slides should differ clearly in density; do not impose a hard deck-wide floor. diff --git a/skills/open-kimi-ppt/reference/design_system/work/moon-white-imagery/design.md b/skills/open-kimi-ppt/reference/design_system/work/moon-white-imagery/design.md new file mode 100644 index 0000000..58cab62 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/work/moon-white-imagery/design.md @@ -0,0 +1,62 @@ +# Moon-White Imagery · WORK REPORT STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum) + +A conclusion-first business performance report benchmarked against top-tier operating review meetings and project progress briefings. Every slide in this deck must be scannable in 30 seconds, and every number must withstand drill-down questioning: status is backed by evidence, variances are attributed, and requests are stated clearly. + +Content and layout: +1. Executive structure: executive overview (a one-slide verdict on completion) → core metrics vs. targets → revenue/mix analysis → variance attribution → project status (red/amber/green traffic lights) → cost and efficiency → next-period actions → decisions and support required. +2. Status visualization is the signature: red/amber/green status lights, target vs. actual tables, progress bars with numeric labels, variance waterfalls, and milestone timelines. +3. Medium-to-high density with strict grid discipline: slides are built from aligned status modules and tables; zero decoration; every module answers “So what?” in place. + +Visual style: +1. Aesthetic: crisp, corporate, and utilitarian; the reader should be able to audit the entire period from the slides alone. +2. Typography: use a single sans-serif family throughout the deck; establish hierarchy through weight and size, never decorative type; always align numbers in columns, and never set numbers in a serif display face. +3. Color: use a neutral structural palette (deep slate/graphite + gray); reserve status colors strictly for meaning—green/amber/red indicate status only, while one accent color (as defined by the style) marks priorities and current-period highlights; never use status colors as decoration. +4. Graphics: use simple chart types (comparative bars, trend lines, variance waterfalls); use fine rules in tables and right-align numbers; no 3D, no pictograms as data, and no gradient fills. + +Structure and discipline (derived from work we recognize as best-in-class): +1. The first slide is always the verdict: one sentence on overall completion + target vs. actual values for 3–5 headline metrics; never pad the deck with an empty cover. +2. Every metric must show all three: target, actual, and achievement rate; a metric with an actual but no target is defective. +3. Variance slides must quantify attribution: break the gap into named causes whose amounts sum to the total gap; no unexplained remainder is allowed. +4. The project-status triad: status light + evidence (progress %, milestone) + corrective action (with owner and date); a red item without a recovery plan is defective. +5. Next-period actions are commitments, not wishes: every action includes an owner, timing, and expected quantified impact. +6. On trend slides, mark the reporting-period boundary and annotate the cause of each inflection point within the chart; use dashed lines for forecast segments and label them as plan/estimate. +7. Align parallel modules strictly to the grid: modules in the same row share height and baseline; group mixed content by meaning rather than scattering it. +8. Every number must include its unit, period, and measurement basis (GMV or revenue, order volume or sales value); label estimates as internal illustrative assumptions. +9. The deck must end with items requiring management decisions and support—list each one with the consequence of delay; never end with a thank-you slide. + +Default baseline (derived from the layout skill; PART B may override): use one unified lightweight component for progress/achievement rate/red-amber-green status throughout the deck; each slide has 1 topic + 2–4 supporting points, with the conclusion clear within 5 seconds; every metric must include a “So what?”—a cause, impact, or next action, never a pile of bare numbers. + +**Title read-through test**: Read only the slide titles from beginning to end; they should tell the complete story. If the sequence does not flow, the structure has not been established. + +Density anchor: The specific minimum for each style—the number of evidence modules and charts per slide, plus annotation conventions—is defined by the 【Density Baseline】 reverse-engineered from that style’s source deck; this baseline does not impose a single universal number. + +### Global Prohibitions (Default AI Patterns · Mandatory) + +1. **Do not use cards by default**: Unless the user explicitly requests them, never use rounded rectangles or rectangular cards to create hierarchy or alignment—functional containers (status lights, assumption boxes, quotation frames) do not count as cards. Lines, whitespace, type size, and weight contrast are better tools. +2. **Do not use equal-split compositions**: Unless no other layout is viable, do not default to three equal columns, four equal columns, or a two-by-two matrix—an equal split must be justified by the content structure (three scenarios naturally warrant three columns; frameworks explicitly named in the brief are exempt). +3. **Do not use arbitrary AI color schemes**: Institution-specific palettes stated in the brief are exempt; prohibited treatments are moderate, generic, and unjustified defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, and glowing borders. +4. **Do not introduce elements that clash with the overall style**: Never use styling outside the established visual language, such as rounded icons or rounded rectangles in a sharp-edged style. +5. **Keep chart backgrounds transparent**: Use transparency or the slide background color, except for reversed charts on dark backgrounds. +6. **Do not leave regions empty**: Do not leave large blank areas within the main content zone; every planned region must be filled with real content. An unfilled region is the most serious form of roughness. + +## PART B — Signature System (Distinctive Signature of This Template; Overrides PART A in Case of Conflict) + +One-sentence style signature: A calm, documentary character built on a moon-white background and a deep forest-green framework, with spring green illuminating key subjects; large-scale photography and generous whitespace create a low-to-medium-density rhythm. + +【Color Palette】Background #FFFFFF, covering 70%–95% of white-background content slides; an occasional solid-color closing slide may use #141414, limited to one slide in the entire deck. Primary body text #99AAA0 for explanatory copy; noncritical notes may use the lighter #D6DDD9. Titles #002A12, reserved for titles, key labels, and dark data series. Primary accent #1ECF77, used only to illuminate the current subject, a core number, or one primary series, occupying less than 10% of the slide. Supporting fills #F2F4EF and #FDF8E0 are used only for pale-green/warm-white zones that compare metrics; large neutral numbers may use #474F58. Chart series colors, in order, are #3D5D48, #7D9385, #A2B2A7, and #B9C8BE, with the primary subject overridden by #1ECF77. Positive status color #1ECF77; negative semantics inherit PART A, with #F3001C used only sparingly when this deck requires a specific anchor. Use no more than two hue families on a slide; the iron rule is that spring green never fills the slide and is never used as meaningless decoration. + +【Layout Skeleton】Source canvas 21.986×12.368 inches, aspect ratio 1.77765, equivalent to 16:9. Keep approximately 2% outer margins on content slides; place the header at roughly 4% of the slide height, with the document role on the left, the current section at approximately 15% across the width, and the page number right-aligned, with no horizontal rule. The main title usually begins 2% from the left and 20% from the top, spanning 30%–39% of the width; common two-column proportions are 38:62 or 42:58, with the reading path moving from the upper-left conclusion → lower-left explanation/metrics → primary visual on the right. This overrides PART A’s “do not leave large blank areas within the main content zone”: a breathing zone equal to 20%–30% of the slide height may remain between the title and the evidence below, but it must not be an unfilled content slot. Cover/section slides are special-use slides only: place a rounded, near-full-bleed photograph inside an approximately 2% white border, with the title at bottom left and the sequence number at bottom right; if PART A does not permit a standalone cover, use this treatment as the visual foundation of the first-slide verdict rather than adding an empty cover. + +【Typography】Verified source fact: text in the PPTX has been converted to images or outlines, and the PDF contains no embedded fonts, so the family name cannot be verified; only a neutral, minimally embellished sans-serif style—primarily in regular and medium weights—can be confirmed (render with {latin: Liter, ea: MiSans}). Body text 1x, standard titles approximately 2.3–2.6x, large numbers approximately 4–7x, and headers/footnotes approximately 0.65–0.75x; section titles may reach 4.5–5.5x. Set titles in sentence case, never all caps; scale percentage signs and units to 0.55–0.7 of the numeral size and align them to the baseline; emphasize key phrases with the dark color rather than bold weight. + +【Chart Language】Types used in the source include bar-line combinations, line charts, horizontal bars/stacked bars, KPI bands, two-subject comparisons, sparse matrices/tables without vertical rules, and relationship network diagrams. ⭐Use #1ECF77 for the primary subject and recede reference subjects through the same gray-green family; this is suited to “current-period/target subject vs. overall” comparison, not rainbow charts. ⭐Charts often sit in the lower-right or lower half, leaving titles and explanations in the upper half. ⭐Keep axes and gridlines extremely faint; label only series, endpoints, current values, and a few key ticks rather than every point. ⭐A KPI group may place pale green, warm white, and deep green side by side at three value levels, but use no more than one group with 2–5 items per slide. + +【Signature Components】Photography is a hard constraint: approximately 23/38 slides use a single documentary photograph as the primary evidence across at least half the slide; never replace it with illustrations, icon collages, or decorative stock imagery, and prefer whitespace on data-only slides. Use a corner radius equal to approximately 1%–1.5% of the canvas width for content photographs, fixed flush to the right, left, or bottom edge. The borderless three-segment header is for content slides only. Use no more than one bottom metric band per slide, containing 2–5 equal-height modules; circular monochrome icons appear only with metrics or further reading, limited to 1–3 per slide. A translucent caption band along the bottom of a photograph is optional and used only for sourcing/explanation. + +【Prohibited】Do not use multi-thumbnail collages: allow only one primary photograph per slide; subject silhouettes may appear only as comparative evidence. Do not place text over photographs on standard white-background slides; text may overlay only full-bleed image statement slides, and the image must be darkened or diffused. Do not let pure black dominate titles or body text; reserve #000000 for micro headers, axes, or special dark slides. Do not label every bar, point, or table cell with a number. Do not use low-contrast pale gray-green for conclusions, targets, variances, or actions; these audit-critical elements must use #002A12 or #1ECF77. + +【Slide Types and Layouts】Split text–image slide|Best for one judgment supported by contextual evidence|Text 35%–42%, single photograph 58%–65%|2–4 independent blocks|Rounded primary image, header, optional metric band|Not suitable for multi-series data. Conclusion-above-evidence slide|Best for a conclusion with KPI/comparison evidence|Upper 45% for the judgment and brief explanation, lower 45%–50% for 2–5 evidence items|3–6 blocks|Metric band, subject silhouette|Not suitable for long passages. Chart-explanation slide|Best for trend or structural comparison|Explanation on the left/top 30%–40%, one primary chart on the right/bottom 55%–65%|2–4 blocks|Green-gray series, sparse annotation|Not suitable for multiple equally weighted charts. Dark image-overlay slide|Best for spatial, process, or technical relationships with a small set of metrics|Full-bleed image/graphic background, conclusion at upper left, metric band at the bottom|3–7 blocks|Reversed text, bottom metric band|Not suitable for long audit tables. Sparse matrix/long-form slide (occasional)|Best for cross-subject certification or policy explanations that must be retained|One table without vertical rules, or 2–3 text columns plus one small image|1 primary table or 3–5 blocks|Fine horizontal rules, small image at lower right|Not suitable for frequent reuse. + +【Density Baseline】White-background text–image slides typically contain 1 title, 1–3 explanatory blocks, and 1 primary image, with 1–2 metrics added when needed; each explanatory block is 45–110 words/characters equivalent. Chart slides retain 1 primary chart or table with 1–2 explanatory blocks; label only the current subject, endpoints, anomalies, and units. Dark image-overlay slides may contain 2–5 numbers in the bottom band, with no more than 2 body-content blocks. Section/point-of-view slides contain only a title and an optional short note, with no mandatory minimum for evidence blocks. Long-form slides are occasional only and may use 2–3 columns, each approximately 160–260 words/characters equivalent. Whitespace belongs below the title, above the chart, and outside the photograph; never fill a breathing zone with cards. diff --git a/skills/open-kimi-ppt/reference/design_system/work/sky-blue-wayfinding/design.md b/skills/open-kimi-ppt/reference/design_system/work/sky-blue-wayfinding/design.md new file mode 100644 index 0000000..971f5cd --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/work/sky-blue-wayfinding/design.md @@ -0,0 +1,84 @@ +# Sky Blue Wayfinding · Work STYLE DESIGN SYSTEM + +## PART A — Category Baseline (General Minimum Standard) + +A conclusion-first business performance report benchmarked against top-tier operating review meetings and project progress briefings. Every page in this deck must be scannable within 30 seconds, and every number must withstand drill-down questions: status is evidenced, variances are attributed, and requests are explicit. + +Content and layout: +1. Executive structure: conclusion overview (a one-page completion verdict) → key metrics vs targets → revenue/mix analysis → variance attribution → project status (red/amber/green) → cost and efficiency → next-period actions → items requiring decisions and support. +2. Status visualization is the signature: red/amber/green status lights, target vs actual tables, progress bars with numeric labels, variance waterfalls, and milestone timelines. +3. Medium-high density with strict grid discipline: pages are built from aligned status modules and tables; zero decoration; every module answers “So what?” in place. + +Visual style: +1. Aesthetic: crisp, corporate, and tool-like; the reader should be able to audit the quarter from the pages alone. +2. Typography: one sans-serif family throughout the deck; hierarchy comes from weight and size, not decorative type; numbers are always column-aligned and never set in serif display faces. +3. Color: a neutral structural palette (deep slate/graphite + gray), with status colors reserved strictly for meaning—green/amber/red indicate status only, while one style-specific accent color marks priorities and current-period highlights; never use status colors decoratively. +4. Graphics: simple charts (bar comparisons, line trends, variance waterfalls); thin table rules and right-aligned numbers; no 3D, no pictograms as data, and no gradient fills. + +Structure and discipline (distilled from the work we recognize as benchmarks): +1. The first page is always the verdict: one sentence on overall completion + target vs actual for 3–5 headline metrics; never pad the deck with generic cover copy. +2. Every metric must show all three: target, actual, and attainment rate; an actual without a target is a defect. +3. Variance pages must quantify attribution: split the gap into named causes whose amounts sum to the total gap; unexplained residuals are not allowed. +4. Every project status requires the full triad: status light + evidence (progress %, milestones) + corrective action (with owner and date); a red item without a recovery plan is a defect. +5. Next-period actions are commitments, not wishes: every item includes an owner, timing, and expected quantified impact. +6. Trend pages mark the reporting-period boundary and annotate causes of inflection points inside the chart; forecast segments use dashed lines and are labeled as plan/estimate. +7. Parallel modules follow the grid precisely: modules in the same row share height and baseline; mixed content is grouped by meaning, never scattered. +8. Every number includes its unit, period, and definition (GMV or revenue, order volume or sales value); estimated values are labeled as internally defined examples. +9. The deck must end with items requiring management decisions and support—list each item with the consequence of delay; never close with a thank-you page. + +Default baseline (derived from the layout skill; PART B may override): use one consistent lightweight component system throughout for progress, attainment, and red/amber/green status; each page has 1 theme + 2–4 supporting points, with the conclusion evident within 5 seconds; every metric must include a “So what?”—the cause, impact, or next action—rather than a pile of bare numbers. + +**Headline read-through test**: reading only the slide titles should tell the complete story; if the sequence does not flow, the structure is not working. + +Density anchor: the specific minimum for each style (number of evidence modules and charts per page, plus annotation conventions) follows that style’s 【Density Baseline】 reverse-engineered from the source deck—this baseline does not impose a single universal number. + +### Global Prohibitions (AI Default Patterns · Mandatory) + +1. **Do not default to cards**: unless explicitly requested by the user, do not use rounded rectangles or rectangular cards to create hierarchy or alignment—containers with a genuine information function (status lights, assumption boxes, quote frames) do not count as cards. Lines, whitespace, and differences in type size and weight are better tools. +2. **Do not default to equal-split compositions**: unless no other layout is viable, do not use default three-way, four-way, or two-by-two grids—equal division must be justified by the content structure (three scenarios naturally warrant three columns; frameworks explicitly named in the brief are exempt). +3. **Do not use ungrounded AI color schemes**: institution-specific palettes defined in the body are exempt; what is prohibited is a generic, conventional, unjustified default—blue-purple gradients, cyan-purple neon, rainbow glows, glass cards, and luminous borders. +4. **Do not use elements inconsistent with the overall style**: nothing outside the visual language may appear, such as rounded icons or rounded rectangles in a sharp-edged style. +5. **Keep chart backgrounds transparent**: use transparency or the page background, except for reversed charts on dark backgrounds. +6. **Do not leave planned regions empty**: no large blank area may remain in the main content zone; every planned region must be filled with real content, and failure to fill it is the most serious form of roughness. + +## PART B — Signature System (Distinctive Template Signatures; This Section Prevails over PART A in Case of Conflict) + +One-sentence style signature: a calm operating-review aesthetic built on white and pale sky blue, with electric blue as the sole strong accent and deep navy anchoring the data; medium-high density throughout, with the rigor of an auditable worksheet. + +【Color Palette】 +Use #FFFFFF as the primary background across most body content and tables. Use #C2E6FF as a sectional background only for right-side explanation panels, full data regions, or section transitions—not as the deck-wide background. Use #D6F1FF for row and column highlights, limited to the current period, priority rows, and small label bands. #000000 is the primary text color for body copy, tables, and footnotes; avoid blue for long-form reading. Use #007ACC consistently for titles, rules, primary bars, and key numbers, concentrating it in title areas, primary chart series, and conclusion values rather than spreading it across ordinary pages. Use #001142 for dark contrast, limited to comparison bars, baselines, dark stacked segments, and a small amount of emphasized text; use #F2F2F2/#F5F6F7 for fine rules and alternating fills. Only feature pages may introduce #00948A and #7E59BD, respectively for two thematic series or color-blocked sections; do not let them spread into standard metric pages. Positive/negative coloring follows PART A, because the source deck has no stable red-green semantics; express negative values with #001142, parentheses, or downward bars. Standard body pages should generally retain only the blue family plus neutrals, with no more than three chromatic colors; flag/feature-chart pages may make localized exceptions without carrying them elsewhere. Never use #007ACC as a full-page fill; reserve an intense full-blue page for special slides such as disclaimers. + +【Layout Skeleton】 +Source-deck facts: the canvas is 720×405pt, 16:9. Body-slide titles are fixed near the upper-left boundary at approximately 34pt, at around 18pt type size. Many slides begin with a pale-blue horizontal bar spanning roughly one quarter of the canvas width, containing a shorter section label; the evidence area begins below the title. The standard reading path is title conclusion → left-side table/chart → right-side explanation or action → bottom footnote and page number. Two columns form the primary skeleton, typically with 55–65% on the left for data and 35–45% on the right for explanation/small charts; side-by-side comparison may also be created with square-corner white and #C2E6FF regions. In multi-period tables, left-align labels and right-align numbers. Project status pages use approximately 25–30% of the left side as a metadata rail and 70–75% of the right side for three to four narratives with leader lines. Only cover, section, Q&A, and appendix divider slides use full-bleed photography or a white title frame; special slides do not inherit the standard body grid. + +【Typography】 +Source-deck font facts: the embedded fonts are the sans-serif OrstedSansOffice (body copy, tables, and standard titles, Regular/Bold) and OrstedSans (cover and section display titles, Regular/Bold); no serif fonts are used. Keep numbers and English text in the same sans-serif family. Record dense body text at approximately 8–9pt as 1x; sparse narrative text may increase to 11–12pt. Standard titles are approximately 18pt≈2x, key figures approximately 12–14pt≈1.5–1.8x, and footnotes approximately 6pt≈0.7x. Section-card titles are approximately 28pt, and Q&A divider titles are larger; both belong only to special slides. Titles generally use English sentence case or Title Case and are limited to two lines. Table numbers consistently include units/percent signs and align by column; negative values use parentheses or a minus sign, never a decorative numeric typeface. Render with Liter (Latin text/numerals) and MiSans (Chinese). + +【Chart Language】 +Chart types present in the source include horizontal or vertical bar charts, waterfall/bridge charts, paired columns, 100% stacked columns, donut charts (occasional), dense multi-period tables, and combination slides with a “table + small chart on the right.” ⭐Waterfall charts use thin connector lines and values above the bars to break down movement from opening to closing, followed immediately by two to four causal explanations. ⭐Paired-column charts place “before/after” or “baseline/current state” side by side, with leader-line annotations above showing the matching ratio or difference. ⭐Multi-period tables use thin blue top/bottom rules, a pale-blue highlight across the entire current-period column, bold total rows, and a methodology footnote at the bottom. Bar charts generally label each bar or group directly; the primary series uses #007ACC and comparison series use #C2E6FF/#001142. Keep legends to the essential two or three items; do not rely on hover states or large color-block legends. + +【Signature Components】 +1. Header section rail: a pale-blue horizontal bar at the upper left overlaid with a shorter label, providing section navigation; place it once at the top of each body slide. +2. Project arc rail: 5–7 concentric blue arcs on the left with a small number of nodes and horizontal leader lines, linking metadata such as “location/scale/stage/next milestone” to the narrative on the right; use one group per project-progress slide only, never as a decorative background. +3. Current-period highlight: use #D6F1FF or #C2E6FF in multi-period or metric tables to identify the current column/priority row, paired with a thin #007ACC rule; use only when comparing time periods or versions. +4. Photographic section board: photography is a hard requirement, but it appears only on covers, section transitions, Q&A/appendix dividers, or in a right-side image column occupying approximately 30–45% of a body slide. A section card may place a square-corner white title frame and circular portrait in the left 20–30%. In ordinary evidence areas, never use photography in place of a table, chart, or explanation. +5. Page numbers remain in a small fixed position at the lower left; reverse them to white on photographic slides for legibility. Do not add a decorative footer bar to body slides. + +【Prohibited】 +1. Do not use full-slide photography or large image backgrounds on ordinary body slides; photography may appear only in the positions defined by the “Photographic section board.” +2. Do not use #007ACC as the background of an ordinary body slide; an intense full-blue slide is limited to one-off special pages, while data slides remain primarily white with pale-blue sections. +3. Do not use rounded cards, pill labels, or luminous borders inside data modules; the square-corner white frame on a photographic section card is the exception. +4. Do not use concentric arcs as general decoration; the arc rail should not appear outside a project-status narrative slide. +5. Do not give all columns equal-weight black-and-white treatment in dense multi-period tables; the current period must be located with a pale-blue column, blue rule, or an equally strong locator. +6. Use #00948A/#7E59BD only for semantic segmentation on thematic feature slides; do not let these secondary colors compete with the primary blue on standard metric, risk, or capital slides. + +【Slide Types and Layouts】 +Photographic section board (occasional)|Opening, section transitions, Q&A/appendix|Full-bleed photograph or photograph + white title frame, title area approximately 20–30% wide|1 theme|Photographic section board|Not suitable for multiple metrics. +Conclusion two-column slide|Operating summary, decision conclusion|Left 45–55% numbered/metric list; right 45–55% highlight narrative or small table; 2 primary regions and 4–8 independent blocks|Section rail, pale-blue section|Not suitable for long row-by-row tables. +Project-progress arc slide|Single-project status, risks, and next steps|Left 25–30% title + 4 metadata items; right 70–75% three to four leader-linked narratives; 4–6 blocks|Project arc rail|Not suitable for comparing multiple projects side by side. +Table + chart two-column slide|Multi-period metrics, risk exposure, capital movement|Table 55–65%; chart/explanation 35–45%; 1–2 charts and 2–4 evidence blocks|Current-period highlight, pale-blue side panel|Not suitable for bare numbers without a defined basis. +Three-chart feature slide|Three parallel metric categories or thematic framework|Three approximately equal-width columns, shared top baseline, shared bottom footnote; 3 primary charts + explanation|Blue bars or thematic secondary colors|Not suitable for long-form narrative. +Dense appendix table slide|Definitions, lists, historical series|Full-slide table with multiple columns and rows (approximately 15–30 rows), with a methodology footnote along the bottom|Blue table header, total-row rule|Not suitable for adding photography or a second primary narrative. + +【Density Baseline】 +Most body slides in the source deck have medium-high density: conclusion slides typically contain 2 primary regions and 4–8 independent evidence blocks; project arc slides contain 4 metadata items plus 3–4 explanations; chart slides contain 1–3 charts, with most values labeled directly above or beside bars; appendix table slides commonly contain 1 main table with 15–30 rows. New slides should retain 1 theme and 2–4 supporting modules per page; table slides should use 1 primary table + no more than 1 supporting chart. Explanatory text usually comprises 2–4 blocks, each approximately 20–60 words/characters equivalent or 2–4 short sentences; footnotes occupy 1–3 lines within the bottom boundary. Whitespace should appear primarily in the left/right margins, at the two-column division, between arcs and leader lines, and above footnotes; it must not create a large empty void in the center of the body content. diff --git a/skills/open-kimi-ppt/reference/design_system/work/warm-clay-works/design.md b/skills/open-kimi-ppt/reference/design_system/work/warm-clay-works/design.md new file mode 100644 index 0000000..51aa8d2 --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/work/warm-clay-works/design.md @@ -0,0 +1,111 @@ +# Warm Clay Works · work_report STYLE DESIGN SYSTEM + +## PART A — work_report Baseline (Universal Floor) + +**Master-crafted**: every page is polished to the standard of a master charging a six-figure fee per slide — layout, type, color, and alignment carry no defaults and no AI-template smell; details decide success. + +Conclusion-first business reporting, benchmarked against top-tier business reviews and project progress briefings: every page scannable in 30 seconds, every number able to withstand drill-down — status backed by evidence, deviations attributed, asks spelled out. + +Content and layout: +1. Management structure: executive overview (one-page verdict on completion) → core metrics vs. targets → revenue/mix analysis → deviation attribution → project status → cost and efficiency → next-period actions → items needing decisions and support. +2. Status visualization is the signature: target vs. actual tables, progress with numeric labels, deviation attribution, milestone timelines; status components drawn one way across the deck. +3. Grid discipline: pages are built from aligned status modules and tables; zero decoration; every module answers "so what" on the spot. + +Visual style: +1. Aesthetics: crisp and corporate; the reader can audit the quarter from the pages alone. +2. Type: a restrained set of families, hierarchy built on weight and size rather than decorative lettering; numbers always column-aligned. +3. Color: a neutral structural palette, status colors strictly reserved for meaning, one accent for emphasis and current-period highlights; status colors never decorate. +4. Graphics: simple chart types; fine table rules, right-aligned numbers; no 3D, no pictographs as data, no gradient fills. + +Structure and discipline: +1. Page one is always the verdict: one sentence on overall completion + target vs. actual for 3–5 headline metrics; no filler cover fluff. +2. Every metric shows the trio — target / actual / attainment rate; actual without target is a defect. +3. Deviation pages attribute quantitatively: the gap decomposes into named causes that sum exactly to the total gap — no unexplained remainder. +4. Project status comes as a trio: status + evidence (progress, milestones) + corrective action (with owner and date). +5. Next-period actions are commitments, not wishes: each carries an owner, a deadline, and an expected quantified effect. +6. Trend pages mark the reporting-period boundary, with inflection causes annotated inside the chart; forecast segments use dashed lines labeled with their basis. +7. Parallel modules align strictly to the grid: same row, same height, same baseline; mixed content is grouped by meaning, not scattered. +8. Numbers must carry unit, period, and basis; estimates and modeled values follow the conventions of the source materials. +9. The deck closes on items for management decision and support, each with the consequence of delay; no thank-you page endings. + +### Global Prohibitions (AI Default Patterns · Mandatory) +1. No default cards — containers serving information functions (status lights, assumption boxes, quote boxes) do not count as cards; rules, whitespace, and size/weight contrast are the better solution. +2. No evenly split compositions — unless the split is justified by content structure. +3. No unmotivated AI color schemes — blue-purple gradients, cyan-purple neon, rainbow flares, glass cards, glowing borders. +4. No element that clashes with the overall style. +5. Transparent chart backgrounds — transparent or the page background color, except reversed-out on dark. +6. Care with large empty areas — whitespace for breathing, grouping, and rhythm is allowed; padding to fill space, or stretching thin content into a crowded page, is treated as a defect. + +Density anchor: per-page minimums for evidence modules, charts, and labeling habits follow the density-baseline section reverse-engineered from the source deck for this style — this baseline imposes no uniform numbers. + +## PART B — Signature System + +One-line style signature: a "kiln-crafted" business narrative on warm off-white — ink-brown kai-flavored serif titles, a single terracotta-orange accent point, blush-pink soft ornaments, hairline-split columns, big numbers with their basis — low density and generous whitespace, like a handmade annual fired with restraint. + +【Color Palette】 +All hex values are approximations sampled from the reference images (fine strokes anti-aliased, sampling deviation ±8): +- Page background warm off-white, approx. #F9F4E9: full-bleed throughout, chart areas get no separate fill. +- Primary text ink brown, approx. #5C4630: titles, big numbers, in-table emphasis, step titles; fine serif strokes read lighter in the samples (sampled ~#8F5A27) — the deep ink brown is authoritative. +- Primary accent terracotta orange, approx. #C0651F (solid dots and bars in the samples read ~#C96E25): the single lit point per page — key numbers, negative status words, short thick rules, quote bars, bar charts; no large color blocks in body areas (corner-ornament circles excepted). +- Secondary accent label orange-brown, approx. #C0762F: used only for kicker section labels. +- Soft ornament blush pink, approx. #F2DCD4: corner-ornament circles, photo backing, numbered pink chips (chips may go half a step deeper, approx. #F5D9CE); soft ornament only, carrying no information hierarchy. +- Body gray-brown, approx. #7A6A56: body text, subtitles, explanatory passages. +- Light note taupe, approx. #A08F78: source lines, basis footnotes, page numbers. +- Secondary header camel brown, approx. #A37850: table header rows, column labels. +- Two hairline sets: vertical dividers approx. #DCD2BE, bottom rules and row dividers approx. #CBBFA9; coil outlines approx. #7A5732. +- In-bar labels reverse out in the page's off-white; positive/negative semantics borrow no red or green — negative = terracotta orange bold, positive = ink brown regular. + +【Layout Skeleton】 +Canvas 960×540 pt (16:9). Body pages: left margin 60 pt, content width 840 pt; cover and special pages may widen the left margin to ~98 pt. Fixed top sequence: kicker (y≈46, "NN | section name") → title (y≈72, one-line assertion) → subtitle (y≈116, one line of basis and how-to-read). Body zone y≈150–460: left/right columns split by a 1 pt vertical hairline at ratios of 55/45, 60/40, or a left 25–30% stats rail + right 70–75% main zone; full-width multi-column layouts likewise separate columns with 1 pt vertical hairlines. Fixed bottom close: full-width 1 pt rule at y≈484 → one verdict/summary line (key phrases in terracotta orange) → page number at lower right. Reading path constant: section label → assertion title → basis subtitle → body evidence → bottom verdict line. Corner-ornament circle groups hug the four bleed corners only, 1–2 groups per page, never entering the body area. The closing/commitment page may center everything (label, title, column groups, bottom note all centered) — the deck's only exception. + +【Typography】 +The source deck assigns three families distinct roles; never introduce a fourth: +- Kai-flavored serif (recreated with LXGW Bright): page titles, cover quotations, CJK big numbers and units; titles 26 pt with +3 tracking, cover 30 pt. +- Sans-serif (recreated with MiSans): section labels, subtitles, body, tables, notes; body 10.5–12 pt with 1.5–1.65 line height, labels 12 pt with +3–4 tracking. +- Display serif numerals (recreated with Oranienbaum): big numbers and page numbers; big numbers 28–34 pt set beside 13–14 pt small units on one baseline; page numbers 10.5 pt. +Hierarchy rests on size, weight, and tracking alone — no decorative lettering, no italic titles; numerals always use the display serif, tight against units and signs. + +【Chart Language】 +Only types that actually appear in the samples: +- ⭐ Single-series vertical bar chart (recurs in samples): flat terracotta-orange bars, reversed-white values labeled inside each bar, baseline only — no y-axis, no grid; basis and reading notes below the chart, no curve fitting. +- ⭐ Borderless comparison table (recurs in samples): fine horizontal rules only, generous row height; latest/key column lit in terracotta orange, blanks as em dashes; 1–2 lines of notes hang below every table. +- ⭐ Full-width status table: text status chips instead of status lights, negative chips in bold terracotta, rows sorted by deviation severity; sorting and basis noted below the table. +- KPI big-number strip: 4–5 columns split by thin vertical rules, each column a three-part stack of "small label + big number with small unit + two lines of explanation"; exactly one column per page lit in terracotta. +- Big-number stats rail: 2–3 stacked on the left, each with one small terracotta basis note. +- Baseline→target transition figures: "value → value + unit" set in one line, with a faint source line below. +- Horizontal step-flow axis: pink numbered chips + hairline connectors + step titles + 2–3 lines of explanation. +- Photography: cover-type pages only — portrait-format photo with an offset blush-pink backing (shifted ~20 pt up-left); body pages use no photos. +Absent: lines, pies/donuts, areas, scatters, radars, dual axes, and any 3D, gradient, or dense-grid chart. + +【Signature Components】 +- Corner-ornament circle groups: solid circles overlapped by thin outlined rings, hugging the bleed corners, in terracotta orange or blush pink (occasionally clay camel, approx. #DEC7B5); 1–2 groups per page, all four corners on the cover — the style's most instantly recognizable mark. +- Blush-pink numbered chips: 01–04 pink squares for numbered lists, numerals in terracotta orange. +- Kicker section label: "NN | section name" in small wide-tracked orange-brown type, on every page. +- Short thick terracotta cover rule: ~40×3 pt beneath the title, cover and closing pages only. +- Bottom hairline verdict row: full-width hairline + one-line summary with key phrases in terracotta — closes every body page. +- Quote bar block: terracotta vertical bar + quotation + em-dash attribution, side columns only. +- Offset pink photo-backing frame: blush-pink rectangle shifted behind the photo, cover-type pages only. +- Text status chips: on-target / off-target / shortfall — unified wording deck-wide, two colors only (terracotta negative, ink brown positive). + +【Prohibited】 +- No cool hues or AI default colors: blues, greens, purples, blue-purple gradients, cyan-purple neon, glass textures — zero color outside the warm-clay family. +- No red/green/amber traffic lights, no decorative status colors; status uses text chips + the terracotta/ink-brown pair only. +- No pies, donuts, lines, radars, 3D, shadows, gradient fills, dense gridlines, or dual-axis charts. +- No rounded-rectangle card walls, evenly split matrix piles, or "icon + title + paragraph" three-part AI modules. +- No dark full-page reversal or large dark blocks; the deck is off-white throughout. +- No decorative icons, illustrations, pictographs, or sticker-style embellishment. +- No centered display titles on body pages (the closing page excepted); no photos on body pages. +- No white chart frames or separate chart fills; the chart area is the page background. + +【Slide Types and Layouts】 +Cover | text left, image right: label + serif display title + short terracotta rule + one-line quotation + one-line description, 3 big numbers in a row; portrait photo at right with pink backing; ornaments at all four corners; two-line basis footnote at bottom | no charts. +Overview verdict page | left 30% three stacked big numbers + vertical rule + right 65% pink-chip numbered list of 4 items (title + two lines each) + bottom verdict row | a one-page completion judgment. +Chart attribution page | left 55% single-series bar chart + caption + vertical rule + right 40% attribution column (terracotta subhead + paragraph + hairline + big-number conclusion) | one chart tells one cause. +Comparison table + evidence rail page | left 55% comparison table (key column lit) + table notes + vertical rule + right 35% two or three stat rows + quote bar block | suited to generational/option comparisons. +Process page | left 25% two big numbers + vertical rule + right 70% horizontal 4-step flow axis + bottom summary | suited to handling chains / procedures. +KPI full-width strip page | 5 columns of big numbers with vertical dividers, a single terracotta-lit column + bottom summary | suited to resource/capacity inventories; the lower half may hold a broad breathing field. +Status table page | full-width 5-column status table (metric / evidence / target / status chip / next step) + bottom note | shortfalls unvarnished, negatives in terracotta. +Commitment closing page | centered label + title, 4 columns of "baseline → target" transition figures + faint source notes, one centered mechanism line at bottom | the deck's only centered type, corner ornaments echoing the cover. + +【Density Baseline】 +Low density with generous whitespace is this style's signature, not a defect: 1 theme + 3–5 evidence modules per page; 2–5 big numbers per page, each with a small basis note; body blocks run 2–4 lines, roughly 30–70 words/characters equivalent; titles are one-line assertions, subtitles one line of basis. Tables 4–6 rows × 3–5 columns; bar charts 3–4 bars, each labeled; numbered lists of 4 items, flows of 4 steps, KPIs in 4–5 columns. Exactly one terracotta-lit point per page; at most 2 corner-ornament groups per page. The mid-lower body may hold broad whitespace (the samples' norm), but the top sequence and bottom verdict row must be complete; whitespace between columns and between title and body is a grouping device — never fill it with walls of text. diff --git a/skills/open-kimi-ppt/reference/design_system/work/warm-jade-annual-report/design.md b/skills/open-kimi-ppt/reference/design_system/work/warm-jade-annual-report/design.md new file mode 100644 index 0000000..08afdcf --- /dev/null +++ b/skills/open-kimi-ppt/reference/design_system/work/warm-jade-annual-report/design.md @@ -0,0 +1,77 @@ +# Warm Jade Annual Report · Work Report STYLE DESIGN SYSTEM + +## PART A — Category Baseline (Universal Minimum) + +Lead with the conclusion in an operational performance report benchmarked against top-tier business reviews and project progress briefings. Every page in this deck must be scannable within 30 seconds, and every number must withstand drill-down scrutiny: status must be evidenced, variances attributed, and requests stated clearly. + +Content and layout: +1. Executive structure: conclusion overview (a one-page verdict on overall attainment) → core metrics vs targets → revenue/mix analysis → variance attribution → project status (red/amber/green) → cost and efficiency → next-period actions → decisions and support required. +2. Status visualization is the signature: red/amber/green status indicators, target vs actual tables, progress bars with numeric labels, variance waterfalls, and milestone timelines. +3. Medium-high density with strict grid discipline: pages are built from aligned status modules and tables; zero decoration; every module answers “So what?” in place. + +Visual style: +1. Aesthetic: crisp, corporate, and utilitarian; readers should be able to audit the quarter from the pages alone. +2. Typography: use one sans-serif family throughout; establish hierarchy through weight and size, not decorative type; always align numbers in columns, and never use serif display type for numerals. +3. Color: a neutral structural palette (deep slate/graphite + gray), with status colors reserved strictly for meaning—green/amber/red indicate status only, while one accent color (defined by the style) marks priorities and the current period; never use status colors decoratively. +4. Graphics: simple chart types (comparative bars, trend lines, variance waterfalls); fine table rules and right-aligned numbers; no 3D, no pictograms as data, and no gradient fills. + +Structure and discipline (distilled from benchmark-quality deliverables): +1. The first page is always the verdict: one sentence on overall attainment + target vs actual values for 3–5 headline metrics; never pad it with generic cover-page language. +2. Every metric must show target, actual, and attainment rate together; a metric with an actual but no target is defective. +3. Variance pages must quantify attribution: break the gap into named causes whose values sum to the total gap; unexplained residuals are not allowed. +4. The three-part project status unit: status indicator + evidence (progress %, milestone) + corrective action (with owner and date); a red item without a recovery plan is defective. +5. Next-period actions are commitments, not aspirations: every item includes an owner, timing, and expected quantified impact. +6. Trend pages must mark the reporting-period boundary and annotate the reasons for inflection points within the chart; use dashed lines for forecast segments and label them as planned/estimated. +7. Align parallel modules rigorously to the grid: modules in the same row share height and baseline; group mixed content by meaning rather than scattering it. +8. Every number must include unit, period, and definition (GMV or revenue, order volume or sales value); label estimated values as internally defined examples. +9. End with decisions and support required from management—list each item separately with the consequence of delay; never close with a thank-you page. + +Default baseline (distilled from the layout skill; PART B may override): use one consistent lightweight component language for progress, attainment, and red/amber/green status throughout the deck; each page carries 1 topic + 2–4 supporting points, with the conclusion clear within 5 seconds; every metric must be accompanied by a “So what?”—the reason, impact, or next action—rather than left as a bare number. + +**Sequential-title test**: Read only the slide titles from beginning to end; they should tell the complete story. If they do not flow, the structure has not been established. + +Density anchor: the specific minimum for each style (evidence modules per page, chart count, annotation conventions) follows the 【Density Baseline】 reverse-engineered from that style’s source deck—this baseline imposes no universal number. + +### Global Prohibitions (Default AI Patterns · Mandatory) + +1. **Do not default to cards**: Unless explicitly requested by the user, rounded-rectangle or rectangular cards must not be used to create hierarchy or alignment—functional containers such as status indicators, assumption boxes, and quotation frames do not count as cards. Rules, whitespace, type size, and weight differences are the preferred tools. +2. **Do not default to equal-split compositions**: Unless no other layout is viable, do not default to three equal columns, four equal columns, or a two-by-two matrix—equal division must be justified by the content structure (three scenarios naturally warrant three columns; frameworks named explicitly in the brief are exempt). +3. **Do not use unmotivated AI color palettes**: Institution-specific palettes defined in the brief are exempt; prohibited choices are bland, common, and unjustified defaults—blue-purple gradients, cyan-purple neon, rainbow flares, glassmorphism cards, and glowing borders. +4. **Do not use any element that conflicts with the overall style**: Out-of-style treatments are forbidden, such as rounded icons or rounded rectangles in a sharp-edged visual system. +5. **Keep chart backgrounds transparent**: Use transparency or the page background, except for reversed charts on dark backgrounds. +6. **Do not leave planned regions empty**: The main content area must not contain large blank regions; every planned zone must be filled with real content. Failure to fill it is the most serious form of roughness. + +## PART B — Signature System (Template-Specific Signature; Overrides PART A in Case of Conflict) + +One-sentence style signature: a warm ivory ground, charcoal-black type with serif body copy, and honey-amber accents, shaped into an auditable editorial annual report through fine column rules and high-density tables; photography occupies large areas only on section openers and at key narrative moments. + +【Color Palette】Use warm ivory close to `#FBF9EE` across most content pages; ESG/data-table sections use a continuous white ground of `#FFFFFF`, confined to those sections. Primary text is `#181716`; titles use the same color and reverse to `#FBF9EE` on photography or dark backgrounds. Body and table text never use fully saturated colors. The primary accent is `#FDC356`, reserved for the latest period, core figures, conclusion bars, or a small metric background; any single block should occupy no more than approximately 15% of the content area. Supporting colors are `#A09B93` (light-gray bars and current/total column fills) and `#6B625D` (dark-gray series and secondary text); separator rules may use a tone close to `#CCC5BE`. Chart series are fixed to amber + black `#181716` + dark gray `#6B625D` + light gray `#A09B93`, assigned by meaning within each chart rather than varied as a rainbow. Do not introduce separate red/green colors for positive and negative values: express them with signs, arrows, and black/gray scales, using only `#FDC356` when emphasis is necessary. A page typically uses no more than 3–4 hues; amber never floods an ordinary content page. + +【Layout Skeleton】Source-deck fact: the canvas is 13.333×7.5 inches, 16:9. Content pages use a fixed micro-navigation strip at the top: three fine horizontal lines at top left, a section label beginning around 0.5 inches from the edge, and the report name centered; a small page number sits at bottom left, with small organization/report text at bottom right. Main titles are left-aligned by default, placed in a title band approximately 0.5 inches from the left edge and 0.7–1.1 inches from the top; overview pages such as “At a glance” instead use a large centered title. The content area generally uses 3–4 columns divided by approximately 1 px vertical rules; tables are grouped with horizontal rules, not enclosed in containers. The reading path is title conclusion → left-side metric/chart → right-side explanation → bottom footnote. Section openers use a dedicated structure: the left 40–45% contains a warm off-white large title and an underlined table of contents, while the right 55–60% is full-height photography; another section-page type uses a full-bleed photograph with a white-text table of contents overlaid. The cover uses only full-page photography and a centered white title, without the content-page grid. + +【Typography】Source-deck fact: titles, navigation, numeric labels, and table headers primarily use the sans-serif Tahoma; long-form body copy explicitly uses the serif Cambria, creating a “sans-serif heading + serif body” pairing that overrides PART A’s single-sans-serif default. Render with {latin: QuattrocentoSans, ea: MiSans} (sans titles/labels) and {latin: Unna, ea: 思源宋体} (serif body). Cambria body text at 8 pt is defined as 1x; module headings use Tahoma at 8–12 pt; standard page titles use Tahoma at 36–40 pt, approximately 4.5–5x; large figures/percentages are 24–28 pt, approximately 3–3.5x; footnotes are 6 pt, approximately 0.75x; cover titles are approximately 75 pt and reserved for special pages. Use sentence case for titles, with all caps permitted for short labels; keep years, percentages, and units adjacent to their values, and right-align table numbers by column. When adapting to other languages, preserve these weight and scale relationships, prioritizing the readability of 8 pt body copy in a 960×540 preview. + +【Chart Language】Chart types actually used include donut-share charts, multi-year trends combining gray bars with a black line, horizontal or vertical stacked bars, multi-year financial tables with grouping rules, two-column side-by-side data tables, and a small number of ESG charts with broken axes/hatched target bars. +⭐ Donut chart (recurring): place two donuts side by side, use amber to highlight one primary share, and assign black/dark gray/light gray to the remaining shares; place labels outside the rings and connect them with fine leader lines. Use only for conclusions about composition/breakdown. +⭐ Composite bars (recurring): show one stacked bar for each of two periods or years, write values directly within each segment, and place a compact color legend below; use for comparing regional, category, or channel mix. +⭐ Financial tables (high frequency): fill the entire current-period or total column with `#A09B93`, using white text or bold type; distinguish group headings and subtotals with horizontal rules and bold weight, not zebra striping. Use for statements and notes. +⭐ Target comparison chart (occasional): place an axis break between the actual bar and the long-range target bar, with the target bar rendered in a light hatched fill; use only when the scale difference is excessive, and do not extend it into a deck-wide chart convention. + +【Signature Components】The three-fine-line menu mark is fixed at the top left, appears no more than once per page, and serves only as a navigation anchor. The top section label, centered report name, bottom-left page number, and bottom-right small organization text form a micro header/footer system whose reserved positions must not be occupied by content. Multi-column body layouts repeatedly use approximately 1 px vertical separators, while tables use fine horizontal rules in the same color to establish rhythm between groups. An amber conclusion bar/large-number block carries only one decisive metric and is limited to 1 block per page; it must never become a wall of cards. Photography is a hard constraint: retain full-frame or right-half lifestyle/product photography on covers and section openers, and commonly place one image at the bottom of a column on event pages; never replace these image zones with gradients, abstract color blocks, or icons. Thin-line circular icons may appear sparingly before risk/ESG metrics, with each icon explaining only one metric. + +【Prohibited】 +1. Do not use only sans-serif type throughout the deck; body paragraphs must retain a Cambria-style serif reading layer, with Tahoma reserved for titles, labels, and numbers. +2. Do not expand amber into a full-page background or the primary background across consecutive pages; ordinary pages permit it only in a small metric band, the latest-period bar, or one conclusion block. +3. Do not introduce red/green warning colors or neon hues into body charts; communicate positive and negative values using signs + grayscale/amber semantics. +4. Do not replace column separators and table rules with rounded cards or shadowed containers; hierarchy in this deck comes from type weight, rules, and whitespace. +5. Do not crop section-opener photography into small pasted-on images or shrink it into a decorative corner mark; retain at least one full-height photographic zone on every section page. +6. Use large three-color conceptual panels cautiously and only on section concept pages; do not carry them over as a standard content-page template. + +【Slide Types and Layouts】 +Conclusion/metric overview|Best for a one-page verdict and operating highlights|Large centered title with 3 columns below: small chart/trend on the left, primary donut or headline figure in the center, metric column on the right|4–7 independent blocks|Donut chart, large amber figure|Not suitable for long-form explanation. +Multi-column narrative|Best for strategy, retrospectives, and ESG explanation|Title and introduction on the left; 3–4 body columns on the right with vertical rules between them; the final column may carry a conclusion bar|6–12 text blocks|Vertical separators, one metric block|Not suitable for wide tables. +Event/milestone page|Best for describing events by quarter or phase|4–5 equal-width vertical columns, each containing “period + large title + 1–2 explanatory paragraphs + bottom photograph”|4–5 independent stories|Amber period labels, bottom photography, vertical rules|Not suitable for detailed financial data. +Regional/segment performance|Best for comparing geographies or business units|KPIs and stacked bars on the left, 1–2 explanatory columns in the center, supplementary metrics/small table on the right|5–9 independent blocks|Stacked bars, top-right product/subject photograph|Not suitable for a pure opinion essay. +Financial statement/notes|Best for multi-year data and accounting explanation|Title at top left, wide table spanning the main body, with 1–3 explanatory or footnote blocks below; gray fill for the current/total column|1 primary table or 2 side-by-side tables + 1–3 text blocks|Gray current column, horizontal rules between groups|Not suitable for photography-led pages. + +【Density Baseline】Narrative content pages typically use 3–4 columns with 2–4 paragraphs per column; when adapting across languages, each paragraph should contain approximately 80–180 words/characters equivalent, with a blank line between paragraphs instead of splitting them into cards. Metric pages typically contain 4–7 evidence modules and 1–3 charts per page, with values labeled directly on bar segments, donut segments, or table columns; chart notes remain 1–2 lines. Event pages use a fixed 4–5 independent story blocks, each with 1 title, 1–2 short paragraphs, and 1 image; imagery commonly occupies the lower 30–45% of each column. Financial pages center on 1 wide table, split into upper/lower sections or two side-by-side tables when necessary, with 1–3 footnote/definition blocks below; gray fills on the current-period and total columns create vertical anchors. Whitespace belongs mainly in the top title band, on either side of fine column rules, around charts, and in the bottom footnote zone; do not leave large content-free areas in the body. diff --git a/skills/open-kimi-ppt/reference/fonts.md b/skills/open-kimi-ppt/reference/fonts.md index 8a1b186..8c0100d 100644 --- a/skills/open-kimi-ppt/reference/fonts.md +++ b/skills/open-kimi-ppt/reference/fonts.md @@ -45,3 +45,9 @@ | 精品点阵体 | Pixel font | Jingpin Dianzhen; 9×9 dot-matrix pixel style with an extremely retro electronic feel | Games, tech, pixel art | Yes | | LXGW Bright | Serif (fangsong/kaiti) | LXGW WenKai family; combines fangsong and kaiti characteristics; gentle and clear letterforms | Literature, education, humanities | No | | ZCOOL KuaiLe | Handwriting (rounded) | ZCOOL KuaiLe; lively, cute, playful and cartoonish; youthful energy | Anime, children, entertainment | No | + +## Custom fonts (Google Fonts) + +Use custom fonts to strengthen expressiveness or to fill font categories the built-in list does not cover (e.g. JetBrains Mono for monospace, Archivo Black for ultra-heavy sans-serif, EB Garamond for classical serif), brought in from Google Fonts via `customFonts`: declare `customFonts` in the `.pptd` entry file (see CustomFont in [pptd.md](./pptd.md)); the `family` name must match Google Fonts exactly, and once declared it can be referenced in `fontFamily`. + +Note: custom fonts follow the same "exactly identical names" requirement diff --git a/skills/open-kimi-ppt/reference/pptd.md b/skills/open-kimi-ppt/reference/pptd.md index d350929..569b5f7 100644 --- a/skills/open-kimi-ppt/reference/pptd.md +++ b/skills/open-kimi-ppt/reference/pptd.md @@ -19,7 +19,7 @@ PPTD (PPT-DSL) is a YAML abstraction layer for PowerPoint presentations, used to ### Coordinate System and Units - All geometry and size units are **px**; the origin `(0, 0)` is the top-left corner of the page -- Recommended sizes: 16:9 → `[960, 540]`; 4:3 → `[720, 540]` +- Default presentation sizes: 16:9 → `[960, 540]`; 4:3 → `[720, 540]`. Default poster sizes: 16:9 → `[1280, 720]`; 9:16 → `[720, 1280]`; 4:3 → `[1280, 960]`; 3:4 → `[960, 1280]`; 1:1 → `[1080, 1080]` - This specification defines 1px = 1pt (i.e., `fontSize: 18` is 18pt in PPTX) - Element stacking order is determined by the order of the `Page.elements` array; the later an element, the higher its layer @@ -332,7 +332,8 @@ fill: interface Presentation { version: "v2"; // required, fixed to "v2" (version identifier) title?: string; // default: no title - size: [number, number]; // [width, height]; 16:9 recommended [960, 540], 4:3 recommended [720, 540] + customFonts?: CustomFont[]; // default: no custom fonts are loaded + size: [number, number]; // [width, height]; see "Coordinate System and Units" for PPT and poster recommendations theme?: Theme; pages: string[]; // list of relative paths to page files, e.g. "pages/cover.page" } @@ -344,6 +345,9 @@ interface Presentation { version: v2 title: Annual Work Summary size: [960, 540] +customFonts: + - family: Noto Serif SC + src: "https://fonts.googleapis.com/css2?family=Noto+Serif+SC" theme: colors: primary: "#2563EB" @@ -453,6 +457,17 @@ interface TableStyleConfig { > For fallback rules, see [Style Priority and Default Values](#style-priority-and-default-values) +### CustomFont + +```ts +interface CustomFont { + family: string; // font family name for use in fontFamily fields + src: string; // Google Fonts CSS URL; format: https://fonts.googleapis.com/css2?family=Noto+Serif+SC; only the default weight is supported — weight selection is not supported +} +``` + +--- + ## 4. Page Files (.page) ### Page @@ -463,6 +478,7 @@ interface Page { background?: Fill; // default: {type: solid, color: "#FFFFFF"} (white solid fill) notes?: string; // default: none; speaker notes; plain text elements: Element[]; // the later an element, the higher its layer + animations?: Animation[]; // default: none; orchestrated in array order; see [Animations](#6-animations) } ``` @@ -1884,3 +1900,130 @@ bar / line / area / scatter / bubble may coexist with each other freely; candles fill: "$primary" dataLabels: {show: true} ``` + +--- + +## 6. Animations + +The optional `animations` array can be used to orchestrate animations for elements on the current page. `animations` is a page-level field and references elements in the page's `elements` array through `elementId`. Array order determines the sequence relationships among animations, while `trigger` determines when each animation starts. + +```ts +type AnimationEffect = + | "appear" | "fade-in" | "fly-in" | "zoom-in" | "wipe-in" | "float-in" | "peek-in" | "rise-in" + | "pulse" | "grow-shrink" | "spin" | "teeter" | "fill-color" | "transparency" | "color-pulse" + | "disappear" | "fade-out" | "fly-out" | "zoom-out" | "wipe-out" | "float-out" + | "motion-path"; + +type AnimationTrigger = "onClick" | "withPrevious" | "afterPrevious"; +type AnimationDirection = "up" | "down" | "left" | "right"; +type AnimationEasing = "linear" | "ease-in" | "ease-out" | "ease-in-out"; + +interface Animation { + elementId: string; // required; must reference an existing element on this page + effect: AnimationEffect; // required; animation effect + trigger?: AnimationTrigger; // default: "onClick" + direction?: AnimationDirection; // default: "up"; only used by fly/wipe/peek/float effects + durationMs?: number; // default: the default duration of the corresponding effect; constraint: > 0 + delayMs?: number; // default: 0; constraint: >= 0 + easing?: AnimationEasing; // default: "linear" + repeat?: number; // default: 1; constraint: positive integer + path?: string; // required when using motion-path + color?: string; // required for fill-color / color-pulse; 6-digit HEX, with optional # + amount?: number; // required for transparency; target opacity; constraint: [0, 1] +} +``` + +**Example:** + +```yaml +elements: + - elementId: title + elementType: text + bounds: [60, 40, 600, 60] + content: {fontSize: 40, text: Title} + - elementId: photo + elementType: image + bounds: [60, 140, 400, 300] + src: media/pic.png +animations: + - elementId: title + effect: fade-in + trigger: onClick + - elementId: photo + effect: fly-in + direction: up + trigger: withPrevious + - elementId: photo + effect: pulse + trigger: afterPrevious +``` + +### Effects + +- Entrance: `appear` appears immediately, `fade-in` fades in, `fly-in` flies in, `zoom-in` zooms in, `wipe-in` wipes in, `float-in` fades in with a short drift (about 10% of the page height and gentler than `fly-in`), `peek-in` slides out from behind the element's own edge mask without fading in, and `rise-in` rises linearly from below the page without fading in +- Emphasis: `pulse` pulses (scales to 110% and rebounds), `grow-shrink` scales to 150%, `spin` rotates 360°, `teeter` rocks from side to side, `fill-color` changes the fill color and preserves the result, `transparency` changes the opacity and preserves the result, and `color-pulse` changes the fill color and then restores the original color +- Exit: `disappear` disappears immediately, `fade-out` fades out, `fly-out` flies out, `zoom-out` zooms out, `wipe-out` wipes out, and `float-out` fades out with a short drift +- Path: `motion-path` moves along a path + +| Effect | Default duration | +|---|---| +| `fade-in`, `fade-out`, `fly-in`, `fly-out`, `zoom-in`, `zoom-out`, `wipe-in`, `wipe-out`, `float-in`, `float-out`, `peek-in` | 500ms | +| `pulse` | 600ms | +| `grow-shrink`, `spin`, `fill-color`, `transparency`, `color-pulse` | 2000ms | +| `teeter`, `rise-in` | 1000ms | +| `motion-path` | 2000ms | +| `appear`, `disappear` | Instantaneous; ignores `durationMs` | + +### Parameterized Emphasis Effects + +| Effect | Parameter | Visual behavior | +|---|---|---| +| `fill-color` | `color`, required | Transitions the fill from its current color to `color` and preserves the target color after the animation ends | +| `transparency` | `amount`, required | Transitions opacity from its current value to `amount` and preserves the target opacity after the animation ends; `0` is fully transparent and `1` is fully opaque | +| `color-pulse` | `color`, required | Transitions the fill color to `color`, then restores the original color without preserving the intermediate state | + +```yaml +animations: + # Highlight a process step: change the fill to amber and preserve it + - elementId: step-2 + effect: fill-color + color: "#F59E0B" + trigger: onClick + + # Dim a secondary element: reduce its opacity to 30% + - elementId: bg-decoration + effect: transparency + amount: 0.3 + trigger: withPrevious + + # Emphasize the current card: pulse red once, then restore the original color + - elementId: card-current + effect: color-pulse + color: "#EF4444" + trigger: afterPrevious + + # Bring body text in gently + - elementId: body-text + effect: float-in + direction: up + easing: ease-out +``` + +### Triggers and Groups + +- `onClick` starts a new click group and plays on click +- `withPrevious` starts at the same time as the preceding animation +- `afterPrevious` starts automatically after the preceding animation ends +- If the first animation on a page uses `withPrevious` or `afterPrevious`, the group beginning with it plays automatically when the page is entered +- To make multiple elements enter together after a click, set the first animation to `onClick` and the rest to `withPrevious` +- Use `afterPrevious` for animations that should play sequentially + +### direction + +`direction` indicates the travel direction or wipe progression direction. For entrance effects, `up` means entering upward from below the page; for exit effects, `up` means leaving the page upward. This field only affects fly/wipe/peek/float effects and is ignored by other effects. Float effects support only `up` and `down`; `rise-in` does not use this field and always rises from below the page. + +### motion-path + +`path` is an SVG path string. Path coordinates are offsets relative to the element's current position, measured in page px. The path must start with `M 0 0`, contain only one subpath, and may use `L` (line), `Q` / `C` (curves), and `Z` (close). For example, `M 0 0 L 200 -100` moves the element 200px to the right and 100px upward. + +The same element may define multiple animations in array order. Keep each page to 1–3 animation groups when possible, prefer simple effects such as fade, fly, and zoom, and avoid applying multiple emphasis effects to the same element in succession. diff --git a/skills/open-kimi-ppt/reference/slides_categories/academic-research.md b/skills/open-kimi-ppt/reference/slides_categories/academic-research.md index a93c29c..f966af7 100644 --- a/skills/open-kimi-ppt/reference/slides_categories/academic-research.md +++ b/skills/open-kimi-ppt/reference/slides_categories/academic-research.md @@ -31,6 +31,7 @@ Academic presentations in different research fields have different emphases: thi - Empirical analysis: essentially also experimental research, but social-science work should be more narrative-driven than science-and-engineering work. - Humanities/architecture/arts: archives, maps, manuscripts, image details, chronological threads, and textual evidence... Beyond academic rigor, there should also be brand-level refinement — go read `brand-creative.md` again. - Use shapes, lines, and arrows as annotations to emphasize or explain chart and image content. +- When needed, click-triggered animations may progressively present formula derivations, experimental workflows, mechanism explanations, and image annotations. ## Prohibitions @@ -84,7 +85,7 @@ Academic presentations in different research fields have different emphases: thi - Body pages may set an extremely thin header or footer rule, with a short title, section name, and page number fixed in place — or a section navigation. **Research content**: -- Formulas keep their numbering, conditions, and symbol explanations; key derivations may appear step by step, but each page must form a complete local argument. +- Formulas keep their numbering, conditions, and symbol explanations; each page must form a complete local argument. - Tables preferably adopt the three-line table structure from papers, highlighting only the rows and columns directly relevant to the conclusion. **Page grammar**: diff --git a/skills/open-kimi-ppt/reference/slides_categories/analysis-decision.md b/skills/open-kimi-ppt/reference/slides_categories/analysis-decision.md index 14c2293..d6b3a89 100644 --- a/skills/open-kimi-ppt/reference/slides_categories/analysis-decision.md +++ b/skills/open-kimi-ppt/reference/slides_categories/analysis-decision.md @@ -6,6 +6,7 @@ 2. Every page has enough depth: the core conclusion can be grasped quickly, while reading the full page takes 5 minutes. 3. Support cascades from conclusion to evidence: once the title states a judgment, the page should carry several self-standing supporting judgments that connect the conclusion to the evidence, each with one verifiable sentence of support. 4. Body-page titles are preferably declarative sentences ("Europe's electric heavy-truck batteries reach 48 GWh by 2030 — 16x growth in six years under a strong policy push"), but decide whether to use a declarative sentence based on the actual content. +5. Do not add animations by default; if the user requests animations, use them only to reveal reasoning, comparisons, or decision logic step by step during live presentations. ## Make data and structured information the body of the argument @@ -33,4 +34,3 @@ 8. Table conventions: dark header with white text, extremely thin horizontal separators (no vertical lines or heavy borders), numbers right-aligned and text left-aligned, subject names in the first column bolded; large tables get an interpretation panel beside them. 9. Line and alignment discipline: all elements align to a unified left edge and invisible column lines; separation uses only extremely thin lines, emphasis uses only primary-color short bars or thick vertical bars, never thick frames; panels are square-cornered with no shadows; rounded corners are allowed only on small labels. 10. Clean surfaces: no shadows, no gradients, no textures, no glow effects, no default colors; the texture is achieved entirely through whitespace, alignment, a single-hue color scale, and line discipline. - diff --git a/skills/open-kimi-ppt/reference/slides_categories/brand-creative.md b/skills/open-kimi-ppt/reference/slides_categories/brand-creative.md index 216b43d..f3ca448 100644 --- a/skills/open-kimi-ppt/reference/slides_categories/brand-creative.md +++ b/skills/open-kimi-ppt/reference/slides_categories/brand-creative.md @@ -18,6 +18,7 @@ Use strong font-size contrast and extreme asymmetric layouts to build an exagger 1. **Make extreme choices**: oversized type, giant images, intense whitespace, high-density multi-columns, a single vivid color, or heavy lines. Build an ultimate style: old-newspaper front page, Memphis, Constructivism, Swiss style... 2. **Vary the pages**: cover, opinion, data, and image pages each have different compositions. There is no need to strictly follow one identical "page skeleton," but the deck's consistency should still be recognizable through palette, typeface, font sizes, same-style decorative elements, and the same grid alignment. 3. **Have a visual rationale**: the visual language must come from the deck's subject, brand, industry, era, or material, and must help the audience understand the content. +4. **Animation strengthens impact**: live launches, brand proposals, events, or portfolio presentations may use animation to strengthen rhythm, emotion, and brand narrative, but motion direction, speed, and amplitude must follow a unified visual motif, with only one main dynamic idea per page. ## Prohibitions 1. **No cards by default**: unless the user explicitly requests it, strictly forbid using rounded rectangles or rectangular cards to build hierarchy or alignment: line segments, whitespace, and font/size differences are better solutions. @@ -83,10 +84,10 @@ Visual references are only "references": they show you something good so you kno - No transparent gradients; colors appear only as flats, overprints, and halftones. **Type**: -- Cover title: ultra-heavy condensed poster type, 88–120 pt, allowed to rotate -3 degrees and cross the canvas edge. +- Cover title: ultra-heavy condensed poster type, 88–120 pt (for Latin, bring in ultra-heavy display faces like Anton via customFonts — see fonts.md), allowed to rotate -3 degrees and cross the canvas edge. - Page titles: 42–58 pt, may be reversed white on a black ground. - Body text: 14–17 pt, in a clear sans-serif or serif face. -- Annotations: 10–12 pt monospaced, mimicking typewriter labels. +- Annotations: 10–12 pt monospaced (bring in JetBrains Mono etc. via customFonts — see fonts.md), mimicking typewriter labels. **Grid and geometry**: - Use unequal-width two and three columns and cut-and-paste modules. @@ -126,10 +127,10 @@ Visual references are only "references": they show you something good so you kno - No blue-purple gradients and no colored status blocks. **Type**: -- Masthead: ultra-heavy sans-serif, 72–100 pt, all caps where supported or otherwise set as ultra-bold short text. +- Masthead: ultra-heavy sans-serif, 72–100 pt (for Latin, bring in Archivo Black etc. via customFonts — see fonts.md), all caps where supported or otherwise set as ultra-bold short text. - Headlines: 44–72 pt, tight leading. - Body text: 11–14 pt serif, line spacing 1.25–1.4. -- Data and labels: monospaced, 10–14 pt. +- Data and labels: monospaced (bring in JetBrains Mono etc. via customFonts — see fonts.md), 10–14 pt. - Pull quotes: 28–40 pt serif italic or bold. **Grid and geometry**: diff --git a/skills/open-kimi-ppt/reference/slides_categories/business-plan.md b/skills/open-kimi-ppt/reference/slides_categories/business-plan.md index 725851b..bf37cd2 100644 --- a/skills/open-kimi-ppt/reference/slides_categories/business-plan.md +++ b/skills/open-kimi-ppt/reference/slides_categories/business-plan.md @@ -5,6 +5,7 @@ - The storyline of the whole deck is clear and builds step by step. - If a page has a core claim, that most important sentence enjoys the visual privilege of being "marked." - **Emotion has a curve**: the deck's emotion is not flat — from unease (the pain point) to hope (the solution) to belief (the evidence) to urge (the action). +- For a live pitch, click-triggered animations may progressively present “pain point → solution → evidence → action,” the business model, milestones, or the ask; each click should advance only one claim or evidence step. - Make good use of data support: assist the proposal with data, tables, and charts at the right positions. Data must be truthful and reliable, with sources stated. ## Tell a more complete story through SmartArt structural diagrams diff --git a/skills/open-kimi-ppt/reference/slides_categories/education-training.md b/skills/open-kimi-ppt/reference/slides_categories/education-training.md index 4d2730c..0b4144b 100644 --- a/skills/open-kimi-ppt/reference/slides_categories/education-training.md +++ b/skills/open-kimi-ppt/reference/slides_categories/education-training.md @@ -30,6 +30,7 @@ The following are red lines running through the entire deck; they take effect be The default learning path is: **orientation → comprehension → demonstration → practice → feedback → transfer**. Not every short material needs a separate page for each stage, but when a stage is missing, you must be able to say that the task itself does not call for it — not that the page ran out of space. +- In live teaching, click-triggered animations may progressively present questions and answers, derivations, physical or mathematical processes, operational steps and error correction, or simulated physics or chemistry experiments; each click advances only one learning step, and self-study and printed materials use no animations by default. - **Orientation:** explain why this is worth learning, what the learner can do after completing it, and how it relates to the chapters before and after. Use a real problem or scenario instead of grand slogans. - **Comprehension:** first give one core definition the learner can retell, then the boundaries, composition, counterexamples, or relationships. New terms must not appear only in figure captions. - **Demonstration:** show the process and the intermediate judgments, not just the final answer; put the key forks, the basis for each choice, and the common misconceptions on the same reading path. diff --git a/skills/open-kimi-ppt/reference/slides_categories/management-report.md b/skills/open-kimi-ppt/reference/slides_categories/management-report.md index 20c648e..3f7ad67 100644 --- a/skills/open-kimi-ppt/reference/slides_categories/management-report.md +++ b/skills/open-kimi-ppt/reference/slides_categories/management-report.md @@ -6,6 +6,7 @@ - Open the first page and know how the period went overall: besides the title, the cover presents the single most critical status line of the whole deck — fulfillment rate of core metrics, a red/green/yellow traffic-light overview, or the biggest gap. - Information is truthful and never fabricated: user-provided numbers and facts are neither exaggerated nor selectively clipped; any baseline that exists in the material travels alongside the results, and anything not in the material is not invented on the user's behalf; use numbers, charts, and tables flexibly to present key information. - Professional wording that fits the user's identity: no layman's language, and no one-size-fits-all generic business-speak. +- For live reporting, click-triggered animations may progressively present “status → cause → action,” “issue → owner → deadline,” or before-and-after changes, but core metrics, current status, and items requiring confirmation must remain directly visible. ## Visualize information with structural diagrams diff --git a/skills/open-kimi-ppt/reference/slides_categories/tech-engineering.md b/skills/open-kimi-ppt/reference/slides_categories/tech-engineering.md index 34a74ea..92e5e6d 100644 --- a/skills/open-kimi-ppt/reference/slides_categories/tech-engineering.md +++ b/skills/open-kimi-ppt/reference/slides_categories/tech-engineering.md @@ -73,6 +73,7 @@ When no better structure fits, start from "decision summary → goals and constr - Alternate text-explanation pages and visual-evidence pages; avoid consecutive stacks of structurally identical bullet lists. - For complex concepts, give the whole first, then expand layer by layer along stable coordinates; do not redraw the same architecture on every page. - Show the normal path, exception paths, and migration path in layers; keep the unchanged parts and highlight only what changes. +- In live explanations, animations may progressively show data flow, control flow, state changes, failure recovery, or migration processes along stable coordinates; each animation group should express only one causal or state change. - Accent pages prioritize key architectures, key comparisons, incident causality, or the final decision — do not manufacture climaxes with big-type slogans. - Section transitions appear only when a genuine change of rhythm is needed; short materials are not force-fitted with tables of contents and section covers. - End by returning to the decision, the validation results, or the next steps — never replace the conclusion with a lone "Thank you." @@ -154,7 +155,7 @@ When no better structure fits, start from "decision summary → goals and constr - When the brand has existing visual assets, inherit them first; without brand constraints, build the palette along the lines of "background color, structural color, critical-path color, status colors, neutrals." - Each color carries a stable meaning throughout the deck; critical states are additionally distinguished by text, line style, or shape. - Titles and body text prefer highly legible sans-serif faces; when a document feel is needed, titles may use a restrained serif. -- Code uses monospaced fonts; one deck usually uses no more than two body-type families. +- Code uses monospaced fonts (the built-in list has no monospace; bring in JetBrains Mono etc. via customFonts — see fonts.md); one deck usually uses no more than two body-type families. - When content grows, first condense the text, split pages, or adjust the text-to-graphic ratio — only then shrink font size slightly. ### 8.3 Lines, icons, and effects diff --git a/theme.md b/theme.md new file mode 100644 index 0000000..802b00d --- /dev/null +++ b/theme.md @@ -0,0 +1,434 @@ +# 预设设计主题(Design System Presets) + +[简体中文](theme.md) | [English](theme_EN.md) + +Skill 内置多套设计系统,**仅在用户点名时使用**(自选设计不会自动套用)。 + +## 怎么用 + +在 Prompt 里点名主题 ID,例如: + +```text +使用 open-kimi-ppt,主题用 pine-green-strategy,做一份 AI 战略咨询 PPT,12 页左右 +``` + +Agent 会读取对应 `design.md`(或补充目录下的同名 `.md`)作为唯一风格源。 + +--- + +## 主目录(推荐) + +### 咨询策略 · Consulting / Strategy + +*适合战略咨询、尽调、转型、高管汇报* + +#### `apricot-white-brief` — Apricot White Brief + +- **风格**: 杏白底咨询简报风,高密度论证、细线图表 +- **文件**: [`consulting/apricot-white-brief/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/apricot-white-brief/design.md) +- **点名**: `用 apricot-white-brief` + +![Apricot White Brief](docs/themes/consulting/apricot-white-brief.jpg) + +#### `indigo-due-diligence` — Indigo Due Diligence + +- **风格**: 靛蓝尽调风,麦肯锡式信息密度与框架图 +- **文件**: [`consulting/indigo-due-diligence/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/indigo-due-diligence/design.md) +- **点名**: `用 indigo-due-diligence` + +![Indigo Due Diligence](docs/themes/consulting/indigo-due-diligence.jpg) + +#### `marine-blue-research` — Marine Blue Research + +- **风格**: 海蓝研究风,专业咨询研究报告版式 +- **文件**: [`consulting/marine-blue-research/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/marine-blue-research/design.md) +- **点名**: `用 marine-blue-research` + +![Marine Blue Research](docs/themes/consulting/marine-blue-research.jpg) + +#### `moss-green-transformation` — Moss Green Transformation + +- **风格**: 苔绿转型风,战略落地与变革叙事 +- **文件**: [`consulting/moss-green-transformation/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/moss-green-transformation/design.md) +- **点名**: `用 moss-green-transformation` + +![Moss Green Transformation](docs/themes/consulting/moss-green-transformation.jpg) + +#### `pine-green-strategy` — Pine Green Strategy + +- **风格**: 松绿战略风,深色题头条 + 薄荷绿强调 +- **文件**: [`consulting/pine-green-strategy/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/pine-green-strategy/design.md) +- **点名**: `用 pine-green-strategy` + +![Pine Green Strategy](docs/themes/consulting/pine-green-strategy.jpg) + +#### `red-black-growth` — Red-Black Growth + +- **风格**: 红黑增长风,强对比结论导向 +- **文件**: [`consulting/red-black-growth/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/red-black-growth/design.md) +- **点名**: `用 red-black-growth` + +![Red-Black Growth](docs/themes/consulting/red-black-growth.jpg) + +--- + +### 商务财务 · Finance / Business + +*适合投研、年报、备忘录、财务分析* + +#### `black-gold-ledger` — Black Gold Ledger + +- **风格**: 黑金台账风,机构级投研报告 +- **文件**: [`finance/black-gold-ledger/design.md`](skills/open-kimi-ppt/reference/design_system/finance/black-gold-ledger/design.md) +- **点名**: `用 black-gold-ledger` + +![Black Gold Ledger](docs/themes/finance/black-gold-ledger.jpg) + +#### `ebony-ledger` — Ebony Ledger + +- **风格**: 乌木台账风,深色金融研究气质 +- **文件**: [`finance/ebony-ledger/design.md`](skills/open-kimi-ppt/reference/design_system/finance/ebony-ledger/design.md) +- **点名**: `用 ebony-ledger` + +![Ebony Ledger](docs/themes/finance/ebony-ledger.jpg) + +#### `honey-orange-memo` — Honey Orange Memo + +- **风格**: 蜜橙备忘录风,温暖商务投研备忘 +- **文件**: [`finance/honey-orange-memo/design.md`](skills/open-kimi-ppt/reference/design_system/finance/honey-orange-memo/design.md) +- **点名**: `用 honey-orange-memo` + +![Honey Orange Memo](docs/themes/finance/honey-orange-memo.jpg) + +#### `lake-blue-memo` — Lake Blue Memo + +- **风格**: 湖蓝备忘录风,清爽财务研究备忘 +- **文件**: [`finance/lake-blue-memo/design.md`](skills/open-kimi-ppt/reference/design_system/finance/lake-blue-memo/design.md) +- **点名**: `用 lake-blue-memo` + +![Lake Blue Memo](docs/themes/finance/lake-blue-memo.jpg) + +#### `prospect-annual` — Prospect Annual + +- **风格**: 展望年报风,机构年度研究出版感 +- **文件**: [`finance/prospect-annual/design.md`](skills/open-kimi-ppt/reference/design_system/finance/prospect-annual/design.md) +- **点名**: `用 prospect-annual` + +![Prospect Annual](docs/themes/finance/prospect-annual.jpg) + +#### `rice-paper-annual` — Rice Paper Annual + +- **风格**: 宣纸年报风,米白纸感大标题编辑风 +- **文件**: [`finance/rice-paper-annual/design.md`](skills/open-kimi-ppt/reference/design_system/finance/rice-paper-annual/design.md) +- **点名**: `用 rice-paper-annual` + +![Rice Paper Annual](docs/themes/finance/rice-paper-annual.jpg) + +--- + +### 工作汇报 · Work Report + +*适合经营复盘、项目进展、品牌与业务综述* + +#### `blue-flame-brand` — Blue Flame Brand + +- **风格**: 蓝焰品牌风,结论先行的业务复盘 +- **文件**: [`work/blue-flame-brand/design.md`](skills/open-kimi-ppt/reference/design_system/work/blue-flame-brand/design.md) +- **点名**: `用 blue-flame-brand` + +![Blue Flame Brand](docs/themes/work/blue-flame-brand.jpg) + +#### `electric-violet-business` — Electric Violet Business + +- **风格**: 电紫商务风,经营复盘与进展汇报 +- **文件**: [`work/electric-violet-business/design.md`](skills/open-kimi-ppt/reference/design_system/work/electric-violet-business/design.md) +- **点名**: `用 electric-violet-business` + +![Electric Violet Business](docs/themes/work/electric-violet-business.jpg) + +#### `moon-white-imagery` — Moon-White Imagery + +- **风格**: 月白影像风,大图叙事 + 经营结论 +- **文件**: [`work/moon-white-imagery/design.md`](skills/open-kimi-ppt/reference/design_system/work/moon-white-imagery/design.md) +- **点名**: `用 moon-white-imagery` + +![Moon-White Imagery](docs/themes/work/moon-white-imagery.jpg) + +#### `sky-blue-wayfinding` — Sky Blue Wayfinding + +- **风格**: 天蓝导视风,清晰导航式工作汇报 +- **文件**: [`work/sky-blue-wayfinding/design.md`](skills/open-kimi-ppt/reference/design_system/work/sky-blue-wayfinding/design.md) +- **点名**: `用 sky-blue-wayfinding` + +![Sky Blue Wayfinding](docs/themes/work/sky-blue-wayfinding.jpg) + +#### `warm-clay-works` — Warm Clay Works + +- **风格**: 暖陶作品风,高完成度作品集式汇报 +- **文件**: [`work/warm-clay-works/design.md`](skills/open-kimi-ppt/reference/design_system/work/warm-clay-works/design.md) +- **点名**: `用 warm-clay-works` + +![Warm Clay Works](docs/themes/work/warm-clay-works.jpg) + +#### `warm-jade-annual-report` — Warm Jade Annual Report + +- **风格**: 暖玉年报风,经营年报与复盘 +- **文件**: [`work/warm-jade-annual-report/design.md`](skills/open-kimi-ppt/reference/design_system/work/warm-jade-annual-report/design.md) +- **点名**: `用 warm-jade-annual-report` + +![Warm Jade Annual Report](docs/themes/work/warm-jade-annual-report.jpg) + +--- + +### 品牌推广 · Promotion / Brand + +*适合品牌叙事、杂志风、活动与公益传播* + +#### `aqua-charity-report` — Aqua Charity Report + +- **风格**: 水色公益报告风,品牌公益传播 +- **文件**: [`promotion/aqua-charity-report/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/aqua-charity-report/design.md) +- **点名**: `用 aqua-charity-report` + +![Aqua Charity Report](docs/themes/promotion/aqua-charity-report.jpg) + +#### `cream-collage` — Cream Collage + +- **风格**: 奶油拼贴风,情绪化品牌拼贴叙事 +- **文件**: [`promotion/cream-collage/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/cream-collage/design.md) +- **点名**: `用 cream-collage` + +![Cream Collage](docs/themes/promotion/cream-collage.jpg) + +#### `pine-soot-pictorial` — Pine Soot Pictorial + +- **风格**: 松烟画报风,画报感品牌年刊 +- **文件**: [`promotion/pine-soot-pictorial/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/pine-soot-pictorial/design.md) +- **点名**: `用 pine-soot-pictorial` + +![Pine Soot Pictorial](docs/themes/promotion/pine-soot-pictorial.jpg) + +#### `silk-yellow-magazine` — Silk Yellow Magazine + +- **风格**: 丝黄杂志风,高密度杂志编辑排版 +- **文件**: [`promotion/silk-yellow-magazine/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/silk-yellow-magazine/design.md) +- **点名**: `用 silk-yellow-magazine` + +![Silk Yellow Magazine](docs/themes/promotion/silk-yellow-magazine.jpg) + +#### `silver-gray-luxury-magazine` — Silver-Gray Luxury Magazine + +- **风格**: 银灰奢华杂志风,高端品牌刊感 +- **文件**: [`promotion/silver-gray-luxury-magazine/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/silver-gray-luxury-magazine/design.md) +- **点名**: `用 silver-gray-luxury-magazine` + +![Silver-Gray Luxury Magazine](docs/themes/promotion/silver-gray-luxury-magazine.jpg) + +#### `travel-green-handbook` — Travel Green Handbook + +- **风格**: 旅行绿手册风,旅行/目的地手册气质 +- **文件**: [`promotion/travel-green-handbook/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/travel-green-handbook/design.md) +- **点名**: `用 travel-green-handbook` + +![Travel Green Handbook](docs/themes/promotion/travel-green-handbook.jpg) + +--- + +### 学术教育 · Academic + +*适合答辩、课件、论文汇报、数据推导* + +#### `blue-line-courseware` — Blue-Line Courseware + +- **风格**: 蓝线课件风,严谨学术课件排版 +- **文件**: [`academic/blue-line-courseware/design.md`](skills/open-kimi-ppt/reference/design_system/academic/blue-line-courseware/design.md) +- **点名**: `用 blue-line-courseware` + +![Blue-Line Courseware](docs/themes/academic/blue-line-courseware.jpg) + +#### `deep-blue-atlas` — Deep Blue Atlas + +- **风格**: 深蓝图集风,研究讲座与图集叙事 +- **文件**: [`academic/deep-blue-atlas/design.md`](skills/open-kimi-ppt/reference/design_system/academic/deep-blue-atlas/design.md) +- **点名**: `用 deep-blue-atlas` + +![Deep Blue Atlas](docs/themes/academic/deep-blue-atlas.jpg) + +#### `paper-white-courseware` — Paper White Courseware + +- **风格**: 纸白课件风,论文答辩级排版 +- **文件**: [`academic/paper-white-courseware/design.md`](skills/open-kimi-ppt/reference/design_system/academic/paper-white-courseware/design.md) +- **点名**: `用 paper-white-courseware` + +![Paper White Courseware](docs/themes/academic/paper-white-courseware.jpg) + +#### `pastel-derivation` — Pastel Derivation + +- **风格**: 粉彩推导风,公式/推导渐进揭示 +- **文件**: [`academic/pastel-derivation/design.md`](skills/open-kimi-ppt/reference/design_system/academic/pastel-derivation/design.md) +- **点名**: `用 pastel-derivation` + +![Pastel Derivation](docs/themes/academic/pastel-derivation.jpg) + +#### `teal-green-academic-defense` — Teal-Green Academic Defense + +- **风格**: 青绿答辩风,硕博答辩正式感 +- **文件**: [`academic/teal-green-academic-defense/design.md`](skills/open-kimi-ppt/reference/design_system/academic/teal-green-academic-defense/design.md) +- **点名**: `用 teal-green-academic-defense` + +![Teal-Green Academic Defense](docs/themes/academic/teal-green-academic-defense.jpg) + +#### `wine-red-data` — Wine Red Data + +- **风格**: 酒红数据风,学术数据可视化 +- **文件**: [`academic/wine-red-data/design.md`](skills/open-kimi-ppt/reference/design_system/academic/wine-red-data/design.md) +- **点名**: `用 wine-red-data` + +![Wine Red Data](docs/themes/academic/wine-red-data.jpg) + +--- + +## 补充目录 + +与主目录互补的编号英文稿;同样可按主题 ID 点名。 + +### 策略 · Strategy + +#### `dusk-violet-consulting` — Dusk Violet Consulting + +- **风格**: 暮紫咨询思想领导力报告风 +- **文件**: [`01/en/dusk-violet-consulting.md`](skills/open-kimi-ppt/reference/design_system/01_strategy/01/en/dusk-violet-consulting.md) +- **点名**: `用 dusk-violet-consulting` + +![Dusk Violet Consulting](docs/themes/extra/dusk-violet-consulting.jpg) + +#### `red-black-business` — Red Black Business + +- **风格**: 红黑管理咨询全案模板风 +- **文件**: [`04/en/red-black-business.md`](skills/open-kimi-ppt/reference/design_system/01_strategy/04/en/red-black-business.md) +- **点名**: `用 red-black-business` + +![Red Black Business](docs/themes/extra/red-black-business.jpg) + +#### `map-strategy` — Cartographic Strategy + +- **风格**: 地图战略风,国际化/区域布局 +- **文件**: [`06/en/map-strategy.md`](skills/open-kimi-ppt/reference/design_system/01_strategy/06/en/map-strategy.md) +- **点名**: `用 map-strategy` + +![Cartographic Strategy](docs/themes/extra/map-strategy.jpg) + +### 商务 · Business + +#### `xuan-paper-annual` — Xuan Paper Annual + +- **风格**: 宣纸年刊风,超重标题编辑研究刊 +- **文件**: [`03/en/xuan-paper-annual.md`](skills/open-kimi-ppt/reference/design_system/02_business/03/en/xuan-paper-annual.md) +- **点名**: `用 xuan-paper-annual` + +![Xuan Paper Annual](docs/themes/extra/xuan-paper-annual.jpg) + +#### `lead-gray-quarterly` — Lead Gray Quarterly + +- **风格**: 铅灰季报风,财经报纸式数据监测 +- **文件**: [`04/en/lead-gray-quarterly.md`](skills/open-kimi-ppt/reference/design_system/02_business/04/en/lead-gray-quarterly.md) +- **点名**: `用 lead-gray-quarterly` + +![Lead Gray Quarterly](docs/themes/extra/lead-gray-quarterly.jpg) + +#### `ink-green-market-trends` — Ink Green Market Trends + +- **风格**: 墨绿行情风,深色加密/市场季报 +- **文件**: [`05/en/ink-green-market-trends.md`](skills/open-kimi-ppt/reference/design_system/02_business/05/en/ink-green-market-trends.md) +- **点名**: `用 ink-green-market-trends` + +![Ink Green Market Trends](docs/themes/extra/ink-green-market-trends.jpg) + +#### `orange-tech` — Orange Tech + +- **风格**: 橙色科技年报与商业洞察风 +- **文件**: [`06/en/orange-tech.md`](skills/open-kimi-ppt/reference/design_system/02_business/06/en/orange-tech.md) +- **点名**: `用 orange-tech` + +![Orange Tech](docs/themes/extra/orange-tech.jpg) + +### 工作 · Work + +#### `mist-blue-travelogue` — Mist Blue Travelogue + +- **风格**: 雾蓝游记风,旅行酒店行业研究 +- **文件**: [`02/en/mist-blue-travelogue.md`](skills/open-kimi-ppt/reference/design_system/03_work/02/en/mist-blue-travelogue.md) +- **点名**: `用 mist-blue-travelogue` + +![Mist Blue Travelogue](docs/themes/extra/mist-blue-travelogue.jpg) + +#### `color-stripes-documentary` — Color Stripes Documentary + +- **风格**: 彩条纪实风,影响力/ESG 长叙事 +- **文件**: [`04/en/color-stripes-documentary.md`](skills/open-kimi-ppt/reference/design_system/03_work/04/en/color-stripes-documentary.md) +- **点名**: `用 color-stripes-documentary` + +![Color Stripes Documentary](docs/themes/extra/color-stripes-documentary.jpg) + +#### `red-white-business` — Red White Business + +- **风格**: 红白商务风,雇主品牌与组织能力 +- **文件**: [`06/en/red-white-business.md`](skills/open-kimi-ppt/reference/design_system/03_work/06/en/red-white-business.md) +- **点名**: `用 red-white-business` + +![Red White Business](docs/themes/extra/red-white-business.jpg) + +### 推广 · Promotion + +#### `gold-orange-type-journal` — Gold Orange Type Journal + +- **风格**: 金橙字体趋势刊风 +- **文件**: [`04/en/gold-orange-type-journal.md`](skills/open-kimi-ppt/reference/design_system/04_promotion/04/en/gold-orange-type-journal.md) +- **点名**: `用 gold-orange-type-journal` + +![Gold Orange Type Journal](docs/themes/extra/gold-orange-type-journal.jpg) + +#### `fresh-brand` — Fresh Brand + +- **风格**: 清新品牌权益/影响力报告风 +- **文件**: [`06/en/fresh-brand.md`](skills/open-kimi-ppt/reference/design_system/04_promotion/06/en/fresh-brand.md) +- **点名**: `用 fresh-brand` + +![Fresh Brand](docs/themes/extra/fresh-brand.jpg) + +### 学术 · Academic + +#### `pink-purple-diagnosis` — Soft Cloud-Layer Diagnostic Narrative + +- **风格**: 粉紫云层诊断叙事风 +- **文件**: [`01/en/pink-purple-diagnosis.md`](skills/open-kimi-ppt/reference/design_system/05_academic/01/en/pink-purple-diagnosis.md) +- **点名**: `用 pink-purple-diagnosis` + +![Soft Cloud-Layer Diagnostic Narrative](docs/themes/extra/pink-purple-diagnosis.jpg) + +#### `dark-themed-data` — Dark Themed Data + +- **风格**: 深色数据主题,加密/市场研究仪表盘 +- **文件**: [`06/en/dark-themed-data.md`](skills/open-kimi-ppt/reference/design_system/05_academic/06/en/dark-themed-data.md) +- **点名**: `用 dark-themed-data` + +![Dark Themed Data](docs/themes/extra/dark-themed-data.jpg) + +--- + +## 快速索引 + +| 分类 | 主题 ID | +|---|---| +| 咨询策略 | `apricot-white-brief` · `indigo-due-diligence` · `marine-blue-research` · `moss-green-transformation` · `pine-green-strategy` · `red-black-growth` | +| 商务财务 | `black-gold-ledger` · `ebony-ledger` · `honey-orange-memo` · `lake-blue-memo` · `prospect-annual` · `rice-paper-annual` | +| 工作汇报 | `blue-flame-brand` · `electric-violet-business` · `moon-white-imagery` · `sky-blue-wayfinding` · `warm-clay-works` · `warm-jade-annual-report` | +| 品牌推广 | `aqua-charity-report` · `cream-collage` · `pine-soot-pictorial` · `silk-yellow-magazine` · `silver-gray-luxury-magazine` · `travel-green-handbook` | +| 学术教育 | `blue-line-courseware` · `deep-blue-atlas` · `paper-white-courseware` · `pastel-derivation` · `teal-green-academic-defense` · `wine-red-data` | +| 补充 | `dusk-violet-consulting` · `red-black-business` · `map-strategy` · `xuan-paper-annual` · `lead-gray-quarterly` · `ink-green-market-trends` · `orange-tech` · `mist-blue-travelogue` · `color-stripes-documentary` · `red-white-business` · `gold-orange-type-journal` · `fresh-brand` · `pink-purple-diagnosis` · `dark-themed-data` | + +## 统计 + +- 主目录:**30** 套 +- 补充目录:**14** 套 +- 合计:**44** diff --git a/theme_EN.md b/theme_EN.md new file mode 100644 index 0000000..37cf937 --- /dev/null +++ b/theme_EN.md @@ -0,0 +1,434 @@ +# Design System Presets + +[简体中文](theme.md) | [English](theme_EN.md) + +The skill ships multiple design systems. Use them **only when the user names one** (self-directed design does not auto-pick a preset). + +## How to use + +Name a theme ID in the prompt, for example: + +```text +Use open-kimi-ppt with theme pine-green-strategy to make an AI strategy consulting deck, about 12 pages +``` + +The agent loads the matching `design.md` (or the numbered catalog `.md`) as the sole style source. + +--- + +## Primary catalog (recommended) + +### Consulting / Strategy + +*Strategy consulting, due diligence, transformation, executive briefings* + +#### `apricot-white-brief` — Apricot White Brief + +- **Look**: Apricot-white consulting brief; dense argumentation, fine-line charts +- **File**: [`consulting/apricot-white-brief/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/apricot-white-brief/design.md) +- **Invoke**: `use apricot-white-brief` + +![Apricot White Brief](docs/themes/consulting/apricot-white-brief.jpg) + +#### `indigo-due-diligence` — Indigo Due Diligence + +- **Look**: Indigo due-diligence look; McKinsey-like density and frameworks +- **File**: [`consulting/indigo-due-diligence/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/indigo-due-diligence/design.md) +- **Invoke**: `use indigo-due-diligence` + +![Indigo Due Diligence](docs/themes/consulting/indigo-due-diligence.jpg) + +#### `marine-blue-research` — Marine Blue Research + +- **Look**: Marine-blue research report layout for professional consulting +- **File**: [`consulting/marine-blue-research/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/marine-blue-research/design.md) +- **Invoke**: `use marine-blue-research` + +![Marine Blue Research](docs/themes/consulting/marine-blue-research.jpg) + +#### `moss-green-transformation` — Moss Green Transformation + +- **Look**: Moss-green transformation narrative for strategic change +- **File**: [`consulting/moss-green-transformation/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/moss-green-transformation/design.md) +- **Invoke**: `use moss-green-transformation` + +![Moss Green Transformation](docs/themes/consulting/moss-green-transformation.jpg) + +#### `pine-green-strategy` — Pine Green Strategy + +- **Look**: Pine-green strategy; dark title banner + mint accents +- **File**: [`consulting/pine-green-strategy/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/pine-green-strategy/design.md) +- **Invoke**: `use pine-green-strategy` + +![Pine Green Strategy](docs/themes/consulting/pine-green-strategy.jpg) + +#### `red-black-growth` — Red-Black Growth + +- **Look**: Red-black growth story; high-contrast, conclusion-led +- **File**: [`consulting/red-black-growth/design.md`](skills/open-kimi-ppt/reference/design_system/consulting/red-black-growth/design.md) +- **Invoke**: `use red-black-growth` + +![Red-Black Growth](docs/themes/consulting/red-black-growth.jpg) + +--- + +### Finance / Business + +*Investment research, annual reports, memos, financial analysis* + +#### `black-gold-ledger` — Black Gold Ledger + +- **Look**: Black-gold ledger; institutional investment research +- **File**: [`finance/black-gold-ledger/design.md`](skills/open-kimi-ppt/reference/design_system/finance/black-gold-ledger/design.md) +- **Invoke**: `use black-gold-ledger` + +![Black Gold Ledger](docs/themes/finance/black-gold-ledger.jpg) + +#### `ebony-ledger` — Ebony Ledger + +- **Look**: Ebony ledger; dark financial-research tone +- **File**: [`finance/ebony-ledger/design.md`](skills/open-kimi-ppt/reference/design_system/finance/ebony-ledger/design.md) +- **Invoke**: `use ebony-ledger` + +![Ebony Ledger](docs/themes/finance/ebony-ledger.jpg) + +#### `honey-orange-memo` — Honey Orange Memo + +- **Look**: Honey-orange memo; warm business research notes +- **File**: [`finance/honey-orange-memo/design.md`](skills/open-kimi-ppt/reference/design_system/finance/honey-orange-memo/design.md) +- **Invoke**: `use honey-orange-memo` + +![Honey Orange Memo](docs/themes/finance/honey-orange-memo.jpg) + +#### `lake-blue-memo` — Lake Blue Memo + +- **Look**: Lake-blue memo; clean financial research notes +- **File**: [`finance/lake-blue-memo/design.md`](skills/open-kimi-ppt/reference/design_system/finance/lake-blue-memo/design.md) +- **Invoke**: `use lake-blue-memo` + +![Lake Blue Memo](docs/themes/finance/lake-blue-memo.jpg) + +#### `prospect-annual` — Prospect Annual + +- **Look**: Prospect annual; institutional yearbook / research publishing feel +- **File**: [`finance/prospect-annual/design.md`](skills/open-kimi-ppt/reference/design_system/finance/prospect-annual/design.md) +- **Invoke**: `use prospect-annual` + +![Prospect Annual](docs/themes/finance/prospect-annual.jpg) + +#### `rice-paper-annual` — Rice Paper Annual + +- **Look**: Rice-paper annual; warm off-white paper, bold editorial headlines +- **File**: [`finance/rice-paper-annual/design.md`](skills/open-kimi-ppt/reference/design_system/finance/rice-paper-annual/design.md) +- **Invoke**: `use rice-paper-annual` + +![Rice Paper Annual](docs/themes/finance/rice-paper-annual.jpg) + +--- + +### Work Report + +*Operating reviews, project progress, brand and business summaries* + +#### `blue-flame-brand` — Blue Flame Brand + +- **Look**: Blue-flame brand; conclusion-first business review +- **File**: [`work/blue-flame-brand/design.md`](skills/open-kimi-ppt/reference/design_system/work/blue-flame-brand/design.md) +- **Invoke**: `use blue-flame-brand` + +![Blue Flame Brand](docs/themes/work/blue-flame-brand.jpg) + +#### `electric-violet-business` — Electric Violet Business + +- **Look**: Electric-violet business; operating review and progress updates +- **File**: [`work/electric-violet-business/design.md`](skills/open-kimi-ppt/reference/design_system/work/electric-violet-business/design.md) +- **Invoke**: `use electric-violet-business` + +![Electric Violet Business](docs/themes/work/electric-violet-business.jpg) + +#### `moon-white-imagery` — Moon-White Imagery + +- **Look**: Moon-white imagery; photo-led narrative + business conclusions +- **File**: [`work/moon-white-imagery/design.md`](skills/open-kimi-ppt/reference/design_system/work/moon-white-imagery/design.md) +- **Invoke**: `use moon-white-imagery` + +![Moon-White Imagery](docs/themes/work/moon-white-imagery.jpg) + +#### `sky-blue-wayfinding` — Sky Blue Wayfinding + +- **Look**: Sky-blue wayfinding; clear navigational work reports +- **File**: [`work/sky-blue-wayfinding/design.md`](skills/open-kimi-ppt/reference/design_system/work/sky-blue-wayfinding/design.md) +- **Invoke**: `use sky-blue-wayfinding` + +![Sky Blue Wayfinding](docs/themes/work/sky-blue-wayfinding.jpg) + +#### `warm-clay-works` — Warm Clay Works + +- **Look**: Warm-clay works; portfolio-grade polished reviews +- **File**: [`work/warm-clay-works/design.md`](skills/open-kimi-ppt/reference/design_system/work/warm-clay-works/design.md) +- **Invoke**: `use warm-clay-works` + +![Warm Clay Works](docs/themes/work/warm-clay-works.jpg) + +#### `warm-jade-annual-report` — Warm Jade Annual Report + +- **Look**: Warm-jade annual report; operating yearbook and retros +- **File**: [`work/warm-jade-annual-report/design.md`](skills/open-kimi-ppt/reference/design_system/work/warm-jade-annual-report/design.md) +- **Invoke**: `use warm-jade-annual-report` + +![Warm Jade Annual Report](docs/themes/work/warm-jade-annual-report.jpg) + +--- + +### Promotion / Brand + +*Brand storytelling, magazine layouts, campaigns and nonprofit comms* + +#### `aqua-charity-report` — Aqua Charity Report + +- **Look**: Aqua charity report; brand nonprofit storytelling +- **File**: [`promotion/aqua-charity-report/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/aqua-charity-report/design.md) +- **Invoke**: `use aqua-charity-report` + +![Aqua Charity Report](docs/themes/promotion/aqua-charity-report.jpg) + +#### `cream-collage` — Cream Collage + +- **Look**: Cream collage; emotional brand collage narrative +- **File**: [`promotion/cream-collage/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/cream-collage/design.md) +- **Invoke**: `use cream-collage` + +![Cream Collage](docs/themes/promotion/cream-collage.jpg) + +#### `pine-soot-pictorial` — Pine Soot Pictorial + +- **Look**: Pine-soot pictorial; pictorial brand annual +- **File**: [`promotion/pine-soot-pictorial/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/pine-soot-pictorial/design.md) +- **Invoke**: `use pine-soot-pictorial` + +![Pine Soot Pictorial](docs/themes/promotion/pine-soot-pictorial.jpg) + +#### `silk-yellow-magazine` — Silk Yellow Magazine + +- **Look**: Silk-yellow magazine; dense editorial magazine layout +- **File**: [`promotion/silk-yellow-magazine/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/silk-yellow-magazine/design.md) +- **Invoke**: `use silk-yellow-magazine` + +![Silk Yellow Magazine](docs/themes/promotion/silk-yellow-magazine.jpg) + +#### `silver-gray-luxury-magazine` — Silver-Gray Luxury Magazine + +- **Look**: Silver-gray luxury magazine; premium brand periodical feel +- **File**: [`promotion/silver-gray-luxury-magazine/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/silver-gray-luxury-magazine/design.md) +- **Invoke**: `use silver-gray-luxury-magazine` + +![Silver-Gray Luxury Magazine](docs/themes/promotion/silver-gray-luxury-magazine.jpg) + +#### `travel-green-handbook` — Travel Green Handbook + +- **Look**: Travel-green handbook; travel / destination guidebook tone +- **File**: [`promotion/travel-green-handbook/design.md`](skills/open-kimi-ppt/reference/design_system/promotion/travel-green-handbook/design.md) +- **Invoke**: `use travel-green-handbook` + +![Travel Green Handbook](docs/themes/promotion/travel-green-handbook.jpg) + +--- + +### Academic + +*Defenses, courseware, research talks, data-driven derivations* + +#### `blue-line-courseware` — Blue-Line Courseware + +- **Look**: Blue-line courseware; rigorous academic lecture layout +- **File**: [`academic/blue-line-courseware/design.md`](skills/open-kimi-ppt/reference/design_system/academic/blue-line-courseware/design.md) +- **Invoke**: `use blue-line-courseware` + +![Blue-Line Courseware](docs/themes/academic/blue-line-courseware.jpg) + +#### `deep-blue-atlas` — Deep Blue Atlas + +- **Look**: Deep-blue atlas; research talk and atlas narrative +- **File**: [`academic/deep-blue-atlas/design.md`](skills/open-kimi-ppt/reference/design_system/academic/deep-blue-atlas/design.md) +- **Invoke**: `use deep-blue-atlas` + +![Deep Blue Atlas](docs/themes/academic/deep-blue-atlas.jpg) + +#### `paper-white-courseware` — Paper White Courseware + +- **Look**: Paper-white courseware; thesis-defense-level typesetting +- **File**: [`academic/paper-white-courseware/design.md`](skills/open-kimi-ppt/reference/design_system/academic/paper-white-courseware/design.md) +- **Invoke**: `use paper-white-courseware` + +![Paper White Courseware](docs/themes/academic/paper-white-courseware.jpg) + +#### `pastel-derivation` — Pastel Derivation + +- **Look**: Pastel derivation; formula / step-by-step reveal +- **File**: [`academic/pastel-derivation/design.md`](skills/open-kimi-ppt/reference/design_system/academic/pastel-derivation/design.md) +- **Invoke**: `use pastel-derivation` + +![Pastel Derivation](docs/themes/academic/pastel-derivation.jpg) + +#### `teal-green-academic-defense` — Teal-Green Academic Defense + +- **Look**: Teal-green academic defense; formal thesis defense look +- **File**: [`academic/teal-green-academic-defense/design.md`](skills/open-kimi-ppt/reference/design_system/academic/teal-green-academic-defense/design.md) +- **Invoke**: `use teal-green-academic-defense` + +![Teal-Green Academic Defense](docs/themes/academic/teal-green-academic-defense.jpg) + +#### `wine-red-data` — Wine Red Data + +- **Look**: Wine-red data; academic data visualization +- **File**: [`academic/wine-red-data/design.md`](skills/open-kimi-ppt/reference/design_system/academic/wine-red-data/design.md) +- **Invoke**: `use wine-red-data` + +![Wine Red Data](docs/themes/academic/wine-red-data.jpg) + +--- + +## Extra catalog + +Numbered English sheets that complement the primary catalog; invoke by theme ID the same way. + +### Strategy + +#### `dusk-violet-consulting` — Dusk Violet Consulting + +- **Look**: Dusk-violet consulting thought-leadership report +- **File**: [`01/en/dusk-violet-consulting.md`](skills/open-kimi-ppt/reference/design_system/01_strategy/01/en/dusk-violet-consulting.md) +- **Invoke**: `use dusk-violet-consulting` + +![Dusk Violet Consulting](docs/themes/extra/dusk-violet-consulting.jpg) + +#### `red-black-business` — Red Black Business + +- **Look**: Red-black management-consulting full-package template +- **File**: [`04/en/red-black-business.md`](skills/open-kimi-ppt/reference/design_system/01_strategy/04/en/red-black-business.md) +- **Invoke**: `use red-black-business` + +![Red Black Business](docs/themes/extra/red-black-business.jpg) + +#### `map-strategy` — Cartographic Strategy + +- **Look**: Map strategy; internationalization / regional footprint +- **File**: [`06/en/map-strategy.md`](skills/open-kimi-ppt/reference/design_system/01_strategy/06/en/map-strategy.md) +- **Invoke**: `use map-strategy` + +![Cartographic Strategy](docs/themes/extra/map-strategy.jpg) + +### Business + +#### `xuan-paper-annual` — Xuan Paper Annual + +- **Look**: Xuan-paper annual; ultra-heavy headlines, editorial research journal +- **File**: [`03/en/xuan-paper-annual.md`](skills/open-kimi-ppt/reference/design_system/02_business/03/en/xuan-paper-annual.md) +- **Invoke**: `use xuan-paper-annual` + +![Xuan Paper Annual](docs/themes/extra/xuan-paper-annual.jpg) + +#### `lead-gray-quarterly` — Lead Gray Quarterly + +- **Look**: Lead-gray quarterly; financial-newspaper data monitor +- **File**: [`04/en/lead-gray-quarterly.md`](skills/open-kimi-ppt/reference/design_system/02_business/04/en/lead-gray-quarterly.md) +- **Invoke**: `use lead-gray-quarterly` + +![Lead Gray Quarterly](docs/themes/extra/lead-gray-quarterly.jpg) + +#### `ink-green-market-trends` — Ink Green Market Trends + +- **Look**: Ink-green market trends; dark crypto / market quarterly +- **File**: [`05/en/ink-green-market-trends.md`](skills/open-kimi-ppt/reference/design_system/02_business/05/en/ink-green-market-trends.md) +- **Invoke**: `use ink-green-market-trends` + +![Ink Green Market Trends](docs/themes/extra/ink-green-market-trends.jpg) + +#### `orange-tech` — Orange Tech + +- **Look**: Orange tech annual report and business-insight deck +- **File**: [`06/en/orange-tech.md`](skills/open-kimi-ppt/reference/design_system/02_business/06/en/orange-tech.md) +- **Invoke**: `use orange-tech` + +![Orange Tech](docs/themes/extra/orange-tech.jpg) + +### Work + +#### `mist-blue-travelogue` — Mist Blue Travelogue + +- **Look**: Mist-blue travelogue; travel / hospitality industry research +- **File**: [`02/en/mist-blue-travelogue.md`](skills/open-kimi-ppt/reference/design_system/03_work/02/en/mist-blue-travelogue.md) +- **Invoke**: `use mist-blue-travelogue` + +![Mist Blue Travelogue](docs/themes/extra/mist-blue-travelogue.jpg) + +#### `color-stripes-documentary` — Color Stripes Documentary + +- **Look**: Color-stripes documentary; impact / ESG long-form narrative +- **File**: [`04/en/color-stripes-documentary.md`](skills/open-kimi-ppt/reference/design_system/03_work/04/en/color-stripes-documentary.md) +- **Invoke**: `use color-stripes-documentary` + +![Color Stripes Documentary](docs/themes/extra/color-stripes-documentary.jpg) + +#### `red-white-business` — Red White Business + +- **Look**: Red-white business; employer brand and org capability +- **File**: [`06/en/red-white-business.md`](skills/open-kimi-ppt/reference/design_system/03_work/06/en/red-white-business.md) +- **Invoke**: `use red-white-business` + +![Red White Business](docs/themes/extra/red-white-business.jpg) + +### Promotion + +#### `gold-orange-type-journal` — Gold Orange Type Journal + +- **Look**: Gold-orange type-trends journal +- **File**: [`04/en/gold-orange-type-journal.md`](skills/open-kimi-ppt/reference/design_system/04_promotion/04/en/gold-orange-type-journal.md) +- **Invoke**: `use gold-orange-type-journal` + +![Gold Orange Type Journal](docs/themes/extra/gold-orange-type-journal.jpg) + +#### `fresh-brand` — Fresh Brand + +- **Look**: Fresh brand equity / impact report +- **File**: [`06/en/fresh-brand.md`](skills/open-kimi-ppt/reference/design_system/04_promotion/06/en/fresh-brand.md) +- **Invoke**: `use fresh-brand` + +![Fresh Brand](docs/themes/extra/fresh-brand.jpg) + +### Academic + +#### `pink-purple-diagnosis` — Soft Cloud-Layer Diagnostic Narrative + +- **Look**: Pink-purple cloud-layer diagnostic narrative +- **File**: [`01/en/pink-purple-diagnosis.md`](skills/open-kimi-ppt/reference/design_system/05_academic/01/en/pink-purple-diagnosis.md) +- **Invoke**: `use pink-purple-diagnosis` + +![Soft Cloud-Layer Diagnostic Narrative](docs/themes/extra/pink-purple-diagnosis.jpg) + +#### `dark-themed-data` — Dark Themed Data + +- **Look**: Dark-themed data dashboard for crypto / market research +- **File**: [`06/en/dark-themed-data.md`](skills/open-kimi-ppt/reference/design_system/05_academic/06/en/dark-themed-data.md) +- **Invoke**: `use dark-themed-data` + +![Dark Themed Data](docs/themes/extra/dark-themed-data.jpg) + +--- + +## Quick index + +| Category | Theme IDs | +|---|---| +| Consulting / Strategy | `apricot-white-brief` · `indigo-due-diligence` · `marine-blue-research` · `moss-green-transformation` · `pine-green-strategy` · `red-black-growth` | +| Finance / Business | `black-gold-ledger` · `ebony-ledger` · `honey-orange-memo` · `lake-blue-memo` · `prospect-annual` · `rice-paper-annual` | +| Work Report | `blue-flame-brand` · `electric-violet-business` · `moon-white-imagery` · `sky-blue-wayfinding` · `warm-clay-works` · `warm-jade-annual-report` | +| Promotion / Brand | `aqua-charity-report` · `cream-collage` · `pine-soot-pictorial` · `silk-yellow-magazine` · `silver-gray-luxury-magazine` · `travel-green-handbook` | +| Academic | `blue-line-courseware` · `deep-blue-atlas` · `paper-white-courseware` · `pastel-derivation` · `teal-green-academic-defense` · `wine-red-data` | +| Extra | `dusk-violet-consulting` · `red-black-business` · `map-strategy` · `xuan-paper-annual` · `lead-gray-quarterly` · `ink-green-market-trends` · `orange-tech` · `mist-blue-travelogue` · `color-stripes-documentary` · `red-white-business` · `gold-orange-type-journal` · `fresh-brand` · `pink-purple-diagnosis` · `dark-themed-data` | + +## Counts + +- Primary catalog: **30** +- Extra catalog: **14** +- Total: **44**