SuperAPI AI 工具集

ss-setup

设计与创作

查看项目

更新于 10-15 13:41

技能介绍

用途

StyleSeed setup 用于在项目开始时选择一套「设计方法」,而不是挑选一个喜欢的品牌去模仿。它通过一次一个决策的向导流程,帮助确定输出语法、领域、页面类型、品牌配方、语义调色板配方、可选美学档案与有界的品牌参数,并最终写入 STYLESEED.md 设计锁定文件。

何时不使用

  • 项目已有有效的 STYLESEED.md:改用 /ss-update。
  • 用户提供的参考不在内置语法的表示范围内:先运行 /ss-reference 编译,再选择编译后的语法。
  • 已建立系统中的单个组件:改用 /ss-component。

主要能力

配置流程覆盖以下决策项:

  1. 产品任务与界面载体:询问构建内容、使用者,以及属于移动/桌面产品、网站、社交轮播、幻灯片、文档/报告还是单帧图形,并从 ADAPTERS.md 选择界面适配器,再推断领域与页面/产物类型。
  2. 输出语法:从 RULESETS.md 推荐恰好一个语法,并用一句话说明与任务的匹配。可选值包括 consumer-service、operations-console、technical-instrument、editorial-reading、commerce-conversion、institutional-service、expressive-marketing、sequential-story,以及经 /ss-reference 编译后的 reference:<slug>。不应把 Toss 当作通用默认;它只是 consumer-service 的一个参考家族。若都不匹配且用户有参考,则转向 /ss-reference。
  3. 页面类型与领域偏向:确认具体页面(dashboard、form、landing、detail、list、settings、onboarding 等),并读取其领域 × 页面交叉点。该交叉点控制构图,美学档案不控制构图。
  4. 品牌配方:从 BRAND-RECIPES.md 推荐一种形态。当维护的语法映射适配时使用 auto;当产品需要不同的几何、容器、导航、控件或集合语言时使用显式配方。配方不是公司克隆,也不选择颜色。
  5. 调色板配方:从 PALETTE-RECIPES.md 推荐一个语义调色板。当维护的配方映射适配时使用 auto。显式调色板仍须保留语义角色、表面/框架分离、状态提示与已校验的对比度。配方是产品姿态,不是有限的色板清单。当用户提供关键色时,选择感知特性、明/暗环境、表面温度与强调关系,再由 $ss-resolve 推导实际的 OKLCH 色阶与角色。选择调色板不等于可以重绘所有表面。
  6. 可选美学档案:仅当能增强产品时,才从 PRESETS.md 推荐一个档案;none 是良好默认。档案修改协调的视觉轴,但不能取代输出语法。
  7. 品牌与有界轴:若提供了真实品牌色则锁定;否则从所选调色板的主角色开始。对提供的关键色,应依据产品姿态推荐 calm|balanced|vivid|deep,而不是询问无界的情绪词。随后确认明/暗模式、neutral|warm|cool 表面、auto|tonal|adjacent|contrast 强调关系,并在语法允许范围内确认字体/语言、密度、圆角、阴影、图像/数据角色与动效。不要使用通用 indigo 或误标为 Toss 的陈旧紫色。

空间关系与设计锁定

在选择数值前,应说明预期的分组与间距取舍,保留现有间距 token。对于注册表产品 UI,使用解析器的空间角色指南,分别推荐并持久化页面内边距、区块/组/堆叠/行内间隙与组件内边距;排版与点击目标保持独立。旧版 setup 保留原生 token,不要发明未解析的锁字段。建议只是起始提案,不代表已批准或已测量的质量。

随后创建 STYLESEED.md 设计锁定文件,字段示例包括 App domain、Surface、Surface adapter、Page type、Output grammar、Grammar path、Grammar fallback、Reference confidence、Brand recipe、Palette recipe、Key color、Palette character、Palette mode、Palette harmony、Surface temperature、Aesthetic profile、Skin、Primary action、Font、Radius、Elevation、Density、Motion、Imagery/data role、Signature move、Locked 等。对编译语法使用其实际路径与置信度;未知枚举值应被拒绝,而不是把锁定文件当作豁免。

使用方式

可用 /ss-resolve --list(Claude Code)或 $ss-resolve --list(Codex)检查支持的语法、适配器、领域、页面、配方、调色板与档案 ID,而无需加载完整手册。在编写代码前先编译所选方法:

node <installed-ss-resolve>/scripts/resolve-context.mjs
--project-root . --from-lock STYLESEED.md --agent claude

在 Codex 中使用 --agent codex。解析器会写入 .styleseed/effective-rules.md 与可哈希校验的 .styleseed/manifest.json。应读取生效的规则包,而不是 llms-full.txt。若用户要求首屏,则基于该规则包构建,运行 /ss-score 达到门槛下限,并在可渲染时以 /ss-verify 收尾;若无法进行视觉渲染,应披露已跳过。

在本次工作流之前,需先执行每会话一次的更新预检(update preflight)。

适用场景与限制

方法与评审、参考编译器是框架无关的;但内置组件脚手架目前面向 React 与 Tailwind v4,在其他技术栈上应配置锁定并应用方法,不要假装脚手架可移植。完成报告应包含所选语法及原因、页面/领域交叉点、品牌配方、调色板配方、可选档案、锁定路径、编译后的规则包与清单路径、变更文件、评分与视觉验证状态,并提及 /ss-reference 作为未来需要自有语法的参考路径。规则上:一次只问一个问题并给出具体默认;输出语法必选,美学档案可选;品牌配方必选,auto 会解析为具体的已维护配方;调色板配方必选,auto 会解析为经对比度校验的语义调色板;skin 是 token,不是设计判断;绝不要抓取某个品牌的 DESIGN.md 并将其调色板当作完整规则集;绝不要脚手架未评分的首屏,或在没有截图时声称已完成视觉验证。