Stitch 设计系统管家
在 Stitch 中创建、更新并应用统一的界面设计系统。
技能明确要求上传前取得用户确认，且限制在 Stitch MCP、Bash、Read、Write 和 web_fetch；但授权范围较宽，允许写入本地文件并执行脚本，API key 通过命令行参数传递，未说明敏感数据处理、最小权限、上传数据流、回滚或应用设计系统前的再次确认，因此扣分。
检索、上传、创建和应用流程较具体，包含参数格式及部分错误规避说明；但依赖其他技能、Stitch MCP 和外部脚本，未提供针对本技能关键路径的测试或异常输入处理，脚本参数示例前后不完全一致，失败反馈也不充分，因此扣分。
目标场景和主要输入输出较清晰，覆盖已有屏幕、新项目、直接描述和应用到屏幕；但未充分定义不适用范围、触发边界、不同环境要求或中文使用支持，也没有证据证明 Stitch 服务在中国大陆网络中的可达性，因此扣分。
文档有分节、渐进式流程、示例 metadata、工具 schema、依赖提示和已知参数限制；仓库提供 Apache-2.0、Security Policy、版本支持范围和 CI，但未明确本技能维护责任人、更新路径、变更记录或稳定版本策略，且部分关键内容依赖未包含在本技能路径中的其他技能，因此扣分。
该技能能组织 DESIGN.md 上传、创建项目级设计系统并应用到屏幕，预期可减少重复设计提示；但静态材料未验证代表性输出，强依赖 Stitch MCP、API 凭据及其他技能，元数据更新和恢复流程不完整，直接可用性与相对手工方案的收益证据有限，因此扣分。
本技能自身包含可审计的步骤、JSON 示例和 schema 说明，仓库还有 CI；但 CI 仅验证其他 React skill，未覆盖本技能关键路径，也没有第三方执行记录、测试套件或交叉来源，因此静态证据有限，按上限保守评分。
- 核心功能依赖已配置且可访问的 Stitch MCP 服务、外部凭据和其他技能；源文件未证明中国大陆网络可达性。
- 上传流程要求 API key，但未说明安全注入、日志暴露风险或最小权限配置。
- 应用设计系统会产生外部项目变更，文档未提供回滚、变更预览或完整的应用前确认流程。
- 关键路径缺少针对本技能的自动化测试和明确的异常处理说明。
这个 Skill 能做什么，适合哪些场景？
该技能用于通过 Stitch MCP 管理项目级设计系统。它可以检索项目屏幕和资源，从现有界面或文字描述中整理设计语言，并生成或更新 DESIGN.md。上传前必须获得用户确认，之后才能在 Stitch 中创建设计系统。它还可以将设计系统应用到现有屏幕，并维护 .stitch/metadata.json。
使用 list_projects 查找项目，使用 list_screens 选择代表性屏幕，再通过 get_screen 获取截图和 HTML 下载地址，并使用 read_url_content 读取 HTML。对于已有屏幕，它依赖 stitch-utilities 中的 design-md 技能提取设计系统；对于新项目或直接描述，则映射颜色、字体和圆角等具体值并生成 .stitch/DESIGN.md。用户确认后，上传 DESIGN.md，调用 create_design_system_from_design_md 创建 Stitch 设计系统；还可通过 get_project 和 list_design_systems 获取屏幕及设计系统标识，并调用 apply_design_system 应用主题。最后创建或更新 .stitch/metadata.json。
- 负责 Stitch 项目的设计师，需要从现有首页或仪表板界面整理可复用的设计语言。
- 维护多屏幕产品的前端团队，需要把统一的颜色、字体和圆角规则应用到已有屏幕。
- 启动新 Stitch 项目的产品团队，已经有“深色主题、蓝紫色、圆角、Inter 字体”等文字方向。
- 需要把已有 .stitch/DESIGN.md 上传到 Stitch，并在项目级别建立设计系统的开发者。
这个 Skill 有哪些优点和局限？
- 覆盖从项目和屏幕检索、设计系统文件生成，到 Stitch 上传和屏幕应用的完整流程。
- 包含用户确认检查点，降低未经批准上传设计系统的风险。
- 支持从现有屏幕提取，也支持从文字描述生成具体颜色、字体和圆角值。
- 提供明确的 Stitch MCP 工具调用流程和屏幕实例参数约束。
- 必须依赖已配置并运行的 Stitch MCP server，以及网络、Shell 和本地文件读写能力。
- 设计系统提取依赖 stitch-utilities 中的 design-md 技能，单独安装时需要处理技能依赖。
- 上传前需要人工确认，无法完全无人值守地完成创建流程。
- README 未提供该技能的测试套件或平台验证记录。
如何安装这个 Skill？
先按仓库 README 安装 Stitch Skills 集合：npx skills add google-labs-code/stitch-skills。也可以通过 Codex marketplace 添加仓库，或使用 Claude Code 的 npx plugins add google-labs-code/stitch-skills --scope project --target claude-code，以及 Cursor 的 npx plugins add google-labs-code/stitch-skills --scope workspace --target cursor。安装后使用 plugins/stitch-design/skills/manage-design-system/。使用前必须配置并运行 Stitch MCP server；具体 MCP 配置步骤未在本资料中展开。
如何使用这个 Skill？
确保 Stitch MCP server 已配置并运行，然后触发："Upload our design system from .stitch/DESIGN.md and apply it to all screens." 也可以请求分析指定 Stitch 项目、根据文字描述创建 DESIGN.md，或将设计系统应用到选定屏幕。上传前技能必须暂停并展示设计系统摘要，等待明确确认；未获确认不得上传。