开源项目已核验

Stitch 设计技能

面向 Google Stitch 的设计技能合集,帮助代理从界面探索走到可用的前端实现,并保持视觉与结构的一致性。

查看 GitHub
7873收藏Google Labs Code作者1.0版本Apache-2.0许可证

Skill 概览

仓库提供围绕 Stitch 设计工作流的多个技能,适用于生成界面方向、处理设计输出和衔接前端开发。它可以通过通用 Skills CLI 或支持的插件方式安装,并覆盖多种编码代理。使用时应提供清晰的产品目标、页面状态和技术栈;生成结果仍需做响应式、可访问性和真实内容检查。

核心功能

  • 围绕 Google Stitch 组织设计到代码工作流
  • 提供多个可组合的界面设计技能
  • 支持多种编码代理和安装方式
  • 兼顾设计探索与前端交付

适用场景

  • 从产品描述探索新的页面方向
  • 将 Stitch 设计结果转为前端实现
  • 为已有界面补齐视觉和交互状态

安装方式

bash
npx skills add google-labs-code/stitch-skills

使用说明

安装后提供产品目标、目标用户、页面范围、品牌约束和前端技术栈。先让代理生成或整理设计方向,再选择一个方向实施;最后在不同视口和键盘操作下检查成品。

示例工作流

  1. 安装 Stitch 技能合集
  2. 提供产品与品牌约束
  3. 生成并选择设计方向
  4. 转换为目标前端技术栈
  5. 验证响应式和可访问性

更新记录

1.0

对应仓库发布的 1.0 版本;后续提交活动记录在 GitHub 仓库中。

常见问题

使用这些技能后还需要设计评审吗?

需要。技能能加快探索和实现,但产品适配、品牌一致性、可访问性与跨设备表现仍应由团队检查。