代码已有了,这款Skill送回设计台

帮你把现有前端代码转换成 Stitch Design。

stitch-design 在原文中名为 stitch::code-to-design,是把已有前端页面转入 Stitch 继续设计的 Skill。提供运行中的开发服务或构建目录,以及目标 Stitch 项目,AI 会组织独立 HTML 提取、设计系统整理和上传流程。

这条路线适合产品已经写出了页面,后来又想回到设计工具调整。它要求同时处理两种材料:一个可独立查看的页面 HTML,以及从组件、样式和主题配置中提炼出的 DESIGN.md。只传一张截图,无法替代这两份交付物。

文档还要求用页面路由给上传的界面命名,例如设置页或收件箱路径,方便进入 Stitch 后辨认每张页面来自哪里。

真正提取和上传由配套 Skill 完成,这份入口负责安排顺序;复杂交互和运行时数据是否能体现在提取结果里,需要检查生成页面,不能把静态提取当成整个应用原样迁移。

它需要可用的 Stitch 项目、相应授权和下游工具。适合希望沿用已有页面与设计语言继续迭代的人,而不是从零生成一个与原产品无关的新界面。

分类:设计创作

来源仓库:google-labs-code/stitch-skills

适合用来做什么

  • 使用 Stitch 设计一个现代风格的网页界面
  • 为这个应用设计一个统一的设计系统

安装 stitch-design

npx skills add https://www.iskills.cc/skills/google-labs-code/stitch-skills/stitch-design/SKILL.md

在本机终端执行安装命令。安装前请阅读原始说明,确认所需工具、账号和权限。

查看安装步骤 · 查看常见问题

查看 stitch-design 的用途与原始说明

浏览全部 Skill 指南