关于 ss-studio
ss-studio 是 StyleSeed 项目中构建设计概念并验证原型的技能,面向产品设计与实现工作流。它通过定向方案选择、场景与媒体任务编排以及证据验证,管理从参考调研到交付的完整流程。
主要功能
- 01按角色整理设计参考
- 02产出三种设计方向供选择
- 03编排交互场景与媒体任务
- 04构建可运行原型并录制
- 05基于证据执行验证
适用场景
- 01为产品界面探索并比较设计方向
- 02将选定方向落实为交互原型
- 03记录原型并检查视觉与时序结果
安装
复制下面的命令,在终端中运行。
npx skills add https:/ / github.com/ bitjaru/ styleseed --skill ss-studio安装后在 Claude Code 中输入/ss-studio确认已加载。
包含的文件
除 SKILL.md 外,安装时一起下载的参考资料和脚本。
agents/openai.yamlreferences/artifact-contract.mdprovider-adapters.mdscripts/studio-run.mjs详细介绍
在此工作流开始前,请先执行每个会话一次的更新预检。
构建有向交互概念
注册表优先的产物边界
当 .styleseed/project.json 和 .styleseed/artifacts/index.json 存在时,先解析所请求的产物 ID,然后只读取 .styleseed/bundles/<artifact-id>.md 和 .styleseed/manifests/<artifact-id>.json。对于使用注册表的项目,绝不要回退到全局旧版 bundle。只有在不存在注册表时,旧版项目才可以使用 .styleseed/effective-rules.md。
运行完整的 Studio 流程。不要将其简化为情绪板、静态图片或一组随意的动态效果。
开始运行
先阅读 STUDIO-PIPELINE.md、PRODUCT-PRINCIPLES.md 和解析后的项目规则。如果项目没有有效的 STYLESEED.md,请先运行 setup 并完成解析,再进入 Studio。
初始化一个持久化运行:
node <skill-dir>/scripts/studio-run.mjs init \
--project-root . \
--artifact <artifact-id> \
--name "<project or concept>" \
--brief "<product job and desired interaction>" \
--surface mobile-app \
--platform web
该命令会输出 .styleseed/studio/ 下的运行目录。使用 references/artifact-contract.md 中的产物架构。只有在需要生成媒体或录制时,才使用 references/provider-adapters.md。
如果项目使用产物注册表,则必须提供 --artifact,并且运行会在初始化时绑定当前产物清单和方法哈希。
1. 按角色侦察
将提供和发现的参考资料归类为 structure、navigation、signature、motion 或 asset-language。记录来源 URL/路径、日期、可见观察、可迁移原则、置信度和权利说明。绝不要声称看到了实际上未查看的参考资料中的视觉证据。
不要让用户收集通用情绪板。只寻找缺失的角色。除非需求说明明确将它们关联起来,否则应将产品 UI、营销展示和生成媒体分开处理。
2. 产出三个方向
在 directions.json 中准确写入三个条目:native、signature 和 experimental。保持产品目标和内容不变;至少改变两个结构轴。每个方向都必须包含:
- 构图和焦点逻辑;
- 导航界面与内容画布;
- 一套语义色彩方案、字体和材质角色;
- 生成式素材策略;
- 动效和连续性逻辑;
- 一个产品专属的标志性设计;
- 输出语法、品牌方案、权衡、实现成本和风险。
只有在方向验证通过后才继续:
node <skill-dir>/scripts/studio-run.mjs advance --project-root . --run <id> --stage directed
3. 必须进行选择
同时展示三个方向。记录用户的选择和理由。不要将它们折中平均,也不要悄悄选择最容易实现的方案。
node <skill-dir>/scripts/studio-run.mjs select \
--project-root . --run <id> --direction <direction-id> \
--by "<reviewer>" --rationale "<decision>"
4. 编译场景和媒体任务
根据选定的方向编写 scenes.json、assets.json 和 video.json。
- 交互场景定义触发条件、状态、连续性、进入/退出、反馈、中断、减少动态效果时的行为,以及渲染器目标。
- 素材任务定义能力、提示词、输入、输出、来源、权利说明、回退方案和使用该素材的场景。
- 视频计划从真实的原型录制开始。明确标记生成式镜头;绝不要用它们伪造无法正常工作的交互。
只有在执行时才将所需能力映射到可用的提供方。如果缺少所需提供方,将任务标记为 blocked,并准确报告缺少的能力。
记录提供方执行情况,不要手动编辑运行记录:
node <skill-dir>/scripts/studio-run.mjs media \
--project-root . --run <id> --job <job-id> --status complete \
--provider <tool/model> --output <project-relative-path> \
--provenance "<model · date · source inputs>"
5. 生成、构建并录制
仅为图像、纹理、插画、影像或产品材质生成光栅素材。UI 几何、图标和最终文案应以代码原生方式实现,并确保无障碍。将最终生成的文件复制到运行目录,并保留提示词和来源信息。
将选定方向构建为可运行的原型。实现其主要导航、标志性场景、取消/返回行为,以及减少动态效果时的回退方案。通过代码和像素检查后,录制实际原型。可选的生成影像可以合成到视频中,但必须标明为媒体素材。
通过 CLI 保存原型和录制文件的路径,然后将状态推进到 built:
node <skill-dir>/scripts/studio-run.mjs output \
--project-root . --run <id> --prototype <route-or-path>
node <skill-dir>/scripts/studio-run.mjs advance \
--project-root . --run <id> --stage built
node <skill-dir>/scripts/studio-run.mjs output \
--project-root . --run <id> --recording <project-relative-path>
6. 验证并交付
运行 StyleSeed 评分和视觉验证,然后根据证据门禁推导 Studio 验证结果。
Studio 证据命令只会存储计算得出的验证器摘要,而 advance --stage verified
会重新运行验证,而不是信任先前存储的通过结果。
node <skill-dir>/scripts/studio-run.mjs evidence \
--project-root . --run <id> --evidence-run <gate-run-id>
node <skill-dir>/scripts/studio-run.mjs advance --project-root . --run <id> --stage verified
node <skill-dir>/scripts/studio-run.mjs status --project-root . --run <id>
fail 和 blocked 仍是有用的进度状态:
node <skill-dir>/scripts/studio-run.mjs gate \
--project-root . --run <id> --gate temporal --status blocked \
--note "recording still missing"
不要使用 gate --status pass。只有证据验证器才能推导出 pass。原型 URL 可以
定位已构建的原型,但它不是证据。如果需要进行时序验证,录制内容必须是本地的哈希文件。
交付完整的运行文件夹、可运行的原型、实际录制内容以及未解决的风险。仅有一段精心制作的短片,不算完成 Studio 运行。
不容妥协的要求
- 始终只选择一个设计方向,并保持统一连贯的产品语言。
- 先由人工选择,再进行高成本生成和实现。
- 不得克隆受保护的品牌素材、文案或商标化布局。
- 不得伪造参考观察、提供方输出、文件路径或验证通过结果。
- 不得让生成的图像承载关键的 UI 文本或交互语义。
- 未查看像素内容和时序结果前,不得将运行标记为已验证。