海报设计skill 算法海报Skill 设计哲学构建SVG极简海报一键生成

算法海报哲学Skill 设计哲学构建 SVG极简海报生成

产品描述

　　算法海报哲学Skill采用"先哲学后视觉"的设计理念，先构建一套完整的设计哲学体系，再基于该哲学生成可渲染的SVG海报，适用于品牌视觉、作品集封面、极简主义海报等场景。

　　设计哲学构建：通过5个维度构建设计哲学，包括概念定义、视觉逻辑、系统行为、参数化思维和涌现效果，确保每一个设计决策都有明确的理论支撑。

　　参数化设计：将设计转化为可控变量，包括字体大小比例、对齐规则、边距比例、色彩数量、元素数量等，实现精确的设计控制。

　　SVG海报生成：基于设计哲学直接渲染SVG海报，支持3:4比例，通过show_widget工具内联展示，无需文字描述，让视觉效果直接呈现。

　　极简美学：严格遵循极简主义原则，限制信息块数量（最多3个）、活跃元素数量（最多5个）、色彩数量（最多2个），注重排版、布局和留白的精妙运用。

　　概念嵌入：将用户概念隐藏于系统结构中，通过网格逻辑、间距节奏、排版对齐来表达，而非直接书写，创造"感受到而非读到"的深层含义。

　　技术适配：输出SVG格式海报，支持Google Fonts在线加载字体，适用于OpenClaw平台。

算法驱动的海报设计理念生成器

概述

这项技能让这项任务从原来的状态彻底改变了：

• “生成设计方案”

进入：

• “确立一种设计理念，并将其以视觉形式呈现出来”

哲学永远是第一位的。
视觉输出仅仅是该系统的一种表现形式而已。

输出工具：

• 哲学 → 以结构化 Markdown 格式进行排版
• 海报 → 通过 show_widget 以 SVG 格式呈现（在文本中从未被描述过，但始终会以该格式显示）

---

工作流程

第一步——确立算法理念/制定算法原则

在生成任何视觉内容之前，先以结构化的 Markdown 格式明确设计理念。

请撰写 4 到 6 段文字，涵盖以下内容：

1. 概念/核心思想

请阐述其中心美学理念。

• 避免使用含糊不清的艺术性表达方式。
• 保持抽象性，但同时要具有可操作性。
• 必须能够转化为具体的设计行为。

2. 视觉逻辑

将概念转化为布局逻辑：

• 网格系统与非网格系统
• 信息密度（低/高）
• 空白策略

3. 系统行为

请描述该设计的运作方式：

• 层级结构（一级/二级/三级）
• 一致性与偏差
• 节奏、重复、错位

4. 参数化思维

将设计转化为各种变量：

• 字体大小比例（例如：标题：副标题：元信息 = 10：3：1）
• 对齐规则（例如：左对齐，中间有一个故意留下的空格）
• 利润率指标（例如：顶部边缘的高度占整体高度的 15%）
• 颜色数量（建议不超过 2 种）
• 活跃元素的数量（建议不超过 5 个）

避免使用以结果为导向的描述方式（例如“很酷的风格”）。
专注于那些可以控制的参数。

5. 出现/产生

请说明该系统在运行时会产生什么结果：

• 视觉感受/视觉效果
• 感知到的结构/所认为的结构
• 情绪化的语气/带有情绪色彩的表达方式

---

关键指导原则（哲学阶段）

• 避免重复内容/避免冗余
• 每一句话都必须能够被转化为设计规则。
• 没有纯粹用于装饰或毫无实质内容的语言。
• 既要像设计师那样思考，也要像系统构建者那样思考。

---

第二步——视觉呈现（通过 show_widget 功能展示 SVG 格式的海报）

根据这一理念，拨打 show_widget 即可生成内嵌式的 SVG 海报。

切勿用文字描述海报的内容。请直接展示海报即可。

---

SVG 海报规格说明

• 格式：SVG
• 宽高比：3:4（推荐值： viewBox="0 0 600 800" ）
• 背景颜色：只能是白色或接近黑色的颜色。
• 字体：通过 SVG 中的 <style>@import url('https://fonts.googleapis.com/css2?family=...')</style> 来加载
• 渲染方式：通过 show_widget 进行内联渲染

---

设计准则（源自哲学理念）

信息战略

• 自动减少内容——仅保留必要的文本
• 最多 3 个信息块（标题/副标题/元数据）
• 清除所有不符合层级结构的元素。

布局系统

• 采用严格的对齐方式，或者根据设计理念，有意识地让某些部分稍有偏差。
• 保持良好的垂直阅读流畅性
• 充足的空白空间——让“负空间”也发挥其作用吧。

排版系统

• 清晰的层级结构：标题（大号）/次要内容（中号）/元信息（小号）
• 建议使用 1 到 2 种字体即可。
• 精心设计的间距——刻意使用 letter-spacing 和 line-height 来调整间距。

色彩系统

• 黑色/白色/灰度色系，或低饱和度的色彩方案
• 最多可使用 2 种颜色（白色/黑色除外）
• 色彩的作用应是体现层次感，而非用于装饰。

元素控制

• 仅包含最少的元素数量（画布上活跃的元素不超过 5 个）
• 没有装饰性的图标、插图或装饰元素。
• 设计依赖于布局、排版和空间安排——而非单纯的图形元素。
• 只有那些有助于增强结构强度的细线条或几何形状线条才被允许使用。

---

高级原理/高级原则体系

概念嵌入

用户的概念绝不能明确写在海报上。

相反，应将其嵌入到：

• 结构与网格逻辑
• 间距节奏
• 排版的对齐方式或偏差情况

想想看：“系统内部存在着某种隐含的参照机制——是能够被感知到的，但无法用文字来表达。”

---

受控的混乱状态

可以有所变化，但必须始终符合既定限制条件。

这不是随机现象。
这是一种在既定体系内被刻意设计出来的、有目的的变动或调整。

---

工艺标准

输出效果必须如下：

• 平衡且经过深思熟虑的/有条不紊且经过精心规划的
• 经过多次迭代后得以完善
• 最小化——没有添加任何可以删除的内容。

就像那位资深设计师花了整整一周时间才设计出来的海报一样。

---

输出格式

1 — 哲学

以结构化的 Markdown 格式撰写（4 到 6 段文字，遵循上述的五部分结构）。

2 — 海报

通过 show_widget 直接以 SVG 格式呈现。
宽高比为 3:4。以文字排版为主。没有装饰性元素。
这张海报只是该系统的可视化呈现而已，并非对该系统的完整总结。

---

完整示例

输入

"帮我做一张关于'沉默'主题的极简海报"

哲学相关成果（内嵌 Markdown 格式）

概念：沉默并非没有声音，而是信号之间的空白。该设计将“空白空间”视为主要元素，而文字则被视为对这种空白空间的干扰。

视觉逻辑：近乎空白的网格结构。只有一个主要的视觉焦点。所有次要信息都被置于边缘位置。整体密度几乎为零。

系统样式：单个主要元素位于中心位置，或者偏离中心恰好一个网格单位。次要文字的透明度为 8%，字体粗细也有所减小——虽然存在，但不太显眼。没有第三级元素。

参数化思维：标题字体大小为画布高度的 11%。各边的边距均为 18%。次要文字的字体大小为标题字体的 0.18 倍。颜色数量为 1 种（白色背景上使用黑色字体）。可交互的元素数量为 2 个。

“浮现”：观众感受到的是一种静止感。视线会停留在某个点上，然后不再移动。意义则蕴藏在那些未被展现的内容之中。

海报输出结果

→ show_widget 生成的 SVG 图像尺寸为 600×800：
一个较大的单词位于几乎居中的位置，略微向左偏移。右下角有一行很短的辅助文字。没有边框，也没有任何装饰元素。纯粹的文字呈现方式而已。