品牌视觉规则工作台

换工具，也不换品牌视觉。

将已确认的品牌素材整理成一份视觉规则，生成做图提示词、可编辑封面／横幅／信息卡、网页变量和 Figma 交接表；修改规则后，检查哪些交付文件已过期。

一份可持续维护的 visual-rules.md：语义配色、字体层级、版式、图片风格与决策依据。
本地工具生成 11 个文件及校验清单：三种版式的可编辑预览、CSS/JSON 变量、做图提示词、Agent 说明与 Figma 映射。
规则变更报告、文字颜色对比度检查、文件改动检测，以及视觉与接入检查指引。

现已开放 · v1.0.0

USD 9.99 · 单次购买，或通过 Pro 获取。

你想完成哪件事？

从现有素材提炼规则

头像、横幅和封面看起来有联系，但我说不清哪些部分应该保持一致。

有素材依据的规则文件，明确标出不确定项，并提供代表性样例。

制作统一的内容套组

我有已确认的规则，需要围绕同一主题制作封面、横幅与信息卡。

可编辑 HTML 样例、三份生图需求、CSS/JSON 变量及待执行的 Figma 交接表。

改版后检查是否同步

我修改了强调色或字体，想知道哪些输出已经过期。

字段级变更、适用时的源文件／产物不一致提示，以及具体重新生成清单。

SIGNAL / FIELD · 可复用品牌规则

AI 生成效果示意 · 非网页运行截图

给它什么

原创虚构通讯品牌，深蓝／钴蓝配色与已确认的封面、横幅、信息卡文案。

怎么处理

Codex 生成概念效果图；独立编写的本地工具从一份规则生成中英文可编辑版式、变量、需求与交接说明。

浏览全部输出示例

AI 效果示意 · 同一虚构品牌的多种版式 — Codex 生图制作的原创 SIGNAL / FIELD 概念展示。用于说明视觉方向，不是编译器或 Figma 截图。
真实编译输出 · 英文 — 运行安装包内工具后的真实浏览器截图。三种可编辑版式共用相同变量，可切换查看；Figma 交接仍为本地规范。
真实编译输出 · 中文 — 运行安装包内工具后的真实浏览器截图。三种可编辑版式共用相同变量，可切换查看；Figma 交接仍为本地规范。

从你的材料，到交付文件

提炼并消除冲突
Agent 检查素材、记录重复规律，标出字体识别不确定项和互相冲突的参考；确认关键选择后再作为品牌规则。
从同一源文件生成
对 visual-rules.md 运行包内 Node 工具，生成可编辑样例、变量文件、生图需求与 Figma 交接说明；此步骤不调用外部服务。
核验实际使用结果
检查源文件与产物哈希，再审阅浏览器／图片结果。Figma 映射需单独执行，检查实际绑定的实例后才能报告已同步。

把这项任务带到你的 Agent

先准备这些材料

准备已确认的视觉素材及使用权、已有品牌规范、本次文案与需要的版式。已有规则需整理为工具支持的结构化区块，不会自动解析任意 Markdown。

登录后获取安装包。
将整个文件夹解压到项目中： .agents/skills/visual-rules-studio/SKILL.md (Codex) 或 .claude/skills/visual-rules-studio/SKILL.md (Claude Code).
在该项目打开新对话，附上材料，将下方需求中的方括号替换为真实信息，先让 Agent 检查说明与依赖。

使用 $visual-rules-studio 分析我提供且有权使用的品牌素材，识别重复出现的配色职责、字体层级、间距与图片风格，区分观察和提案，不猜测精确字体。按支持的结构写 visual-rules.md，使用[已确认文案]编译到新的本地样例目录，暂不上传素材或编辑 Figma。

安装与排错指引

得到第一版后，可以这样继续改

仅修改源文件中的强调色并提升版本，比较差异后生成到新目录，再核对变量、提示词和 Figma 映射是否一致。

安装包交付什么

一份可持续维护的 visual-rules.md：语义配色、字体层级、版式、图片风格与决策依据。
本地工具生成 11 个文件及校验清单：三种版式的可编辑预览、CSS/JSON 变量、做图提示词、Agent 说明与 Figma 映射。
规则变更报告、文字颜色对比度检查、文件改动检测，以及视觉与接入检查指引。

你需要另外准备什么

自己的 Codex 或 Claude Code 服务；本地工具需要 Node.js 22+ 与浏览器，无 npm 依赖，不要求在线账号。
生成新图片需要可用生图工具；执行 Figma 交接需要自己的 Figma 访问权限与编辑器或连接工具。

使用前须知

会自动同步 ChatGPT 和 Figma 吗？

不会。它生成一致的本地文件并检测过期或改动；ChatGPT 需读取当前规则，Figma 需在编辑器中执行并核验。映射表不是原生导入格式。

和 GPT Prompt Studio 有什么区别？

Prompt Studio 主要打磨单次生图提示词；本商品负责跨任务维护品牌规范、生成多类交付物并检查改版，不代替生图模型。

是把原文章重新包装出售吗？

不是。方法启发来自 Morry.AI 的文章 https://x.com/Morry4AI/status/2112429478471414101；工作流、编译工具、数据结构与虚构案例由 SiSkill 独立编写，不打包原文、原提示词或作者素材。

AI 概念图为效果示意；另附 HTML 截图来自真实工具运行。不自动从图片识别精确字体、不代替生图服务、不直接编辑 Figma、不导入任意 Markdown、不自动同步云端工具或发布。Figma 需另行在编辑器中落地；模型、生图与 Figma 费用另计。