SuperAPI AI 工具集

brand-design

设计与创作

查看项目

更新于 10-16 07:59

技能介绍

用途:把“想显得可信、现代”这类模糊品牌语言,翻译成具体且经数学验证的设计系统,并在项目中强制执行。适用于新项目需要定义设计系统、现有系统需细化、UI 与品牌不一致,或智能体构建 UI 前缺少设计权威时。不适用于已有 creative-brief.md 的单组件实现,或仅需重新生成框架 token。

主要能力:先做模式检测(无 brief 走发现模式,有则走细化模式),扫描 README、package.json、CSS/token 等推断上下文;通过 Q1–Q5 品牌访谈收集意图;按 semantic-map.md 规则映射色相、圆角、字体、模块化比例与文案语气;用 math-toolkit.md 以 OKLCH 公式推导色板与字号,并用 WCAG 公式计算对比度,低于 4.5:1(普通文本)或 3:1(大文本)自动调整明度;按 atomic-states.md 定义 Button、Input、Badge、Link 四类原子及 Default/Hover/Focus/Disabled/Error 五态,并生成分子与微文案;用 html-preview-template.md 生成自包含预览,用户确认后才写 creative-brief.md。

使用方式:各步骤必须先加载对应 references 文件,否则无效。Step 7 写入 .claude/rules/brand-design.md 静态规则,并创建可执行的 .claude/hooks/session-start.sh,通过 jq 幂等注册到 .claude/settings.json 的 SessionStart(matcher 为 startup|resume|clear)。Step 8 为可选 token 导出,需先加载 token-export.md,且项目存在 CSS 表面;按 Tailwind v4/v3 或纯 CSS 生成对应 token 文件。

限制:硬性门禁不可跳过——未答完 Q1–Q5 不得进入 Step 2;未确认预览不得写 brief;对比度必须验证;细化模式不得绕过预览确认。原子范围固定为四类,额外原子需手动添加。纯 CLI/后端项目跳过 token 导出。具体收费、价格、平台支持等资料暂未提供。