Google Stitch 这次更新，让它从「等一整屏生成完」变成「边做边改、边预览边同步代码」，一起看看主要更新。

1. Streaming 生成/编辑过程实时流到画布；未完成即可纠偏；尊重系统减少动态偏好

2. 从现有设计起步从代码库 / .fig / 活站生成 DESIGN.md；入口在主提示框上方及每个提示框内；公开仓库分析靠 Gemini Agents API

3. In-place AI Edits 点选 + 指令局部改（换图、删元素、挪区块）；支持直接上传替换图片

4. Motion + HTML Canvas JS / SVG / Shader 在 HTML 原生 canvas 上渲染；默认原生 HTML；选中屏可点按、测 hover（双击进编辑）

5. Import / Export .fig → DESIGN.md；一键导出 Netlify（可 claim 的 live URL）、Lovable、Bolt

Bonus：代码库 <-> Stitch 通过 MCP + Agent Skills（Antigravity 等）导入屏到 Stitch，视觉改完后，同步回代码库

官方入口：http://stitch.withgoogle.com Skills 仓库：google-labs-code/stitch-skills

非常值得单独理解的三个「架构级」变化

1. DESIGN.md 成为中枢，而不只是文档上月已开源 DESIGN.md（单文件描述产品 look & feel，面向 agent）。本次把它推到工作流中心： · 进：代码 / Figma / 网站 → 自动生成 DESIGN.md → 再在 Stitch 里续设计 · 出：.fig 上传也能抽出 DESIGN.md · 横移：一键落到 Netlify / Lovable / Bolt

含义：设计意图被结构化、可版本化、可被 coding agent 读写，降低「截图 + 口头描述」的信息损耗。

2. 画布从「展示层」变成「可交互运行时」 · 默认原生 HTML 渲染（不再只是静态 mock） · 动效、hover、按钮可在画布内试--更接近原型 + 前端预览，而不是纯视觉稿 · 与局部编辑、流式生成组合：改一小块 → 立刻看交互与动效，而不是等整屏重绘

对团队：设计评审可更早覆盖状态与动效；对工程：输出更接近可落地的前端形态（仍须以实际导出/同步质量为准）。

3. Bonus 才是「设计-开发闭环」的完整拼图前五条偏 Stitch 产品内体验；Bonus 明确 Agent + MCP 路径： · 从现有代码库把 screen 导入 Stitch · 在 Stitch 视觉编辑（vibe design） · 经 MCP 写回仓库

这与 Cursor / Antigravity 等 coding agent 生态对齐，Stitch 定位为可视化编辑层，代码库仍是 source of truth（双向同步的具体粒度、冲突策略需看 skills 文档与实测）。

meng shao@shao__meng · X

67导出 Markdown

2026-05-20 09:14·44天前

在 X 看原推· x.com

AI 摘要

Google Stitch 在 I/O 2026 推出五大核心更新，标志着从异步生成转向实时可交互协作模式。新增 Streaming 功能，支持边生成边预览与纠偏；能从代码、Figma 或网站自动生成 DESIGN.md 作为设计中枢；画布升级为原生 HTML Canvas 交互运行时，可实时测试动效；支持一键导出至 Netlify 等平台，打通设计到部署流程；通过 Agent 与 MCP 技术，实现视觉设计与代码仓库双向同步，形成完整设计-开发闭环，定位为连接设计师与开发者的可视化编辑枢纽。

Google Stitch 也在 Google I/O 2026 首日发布了五个重要更新（Google 真是每年 I/O 爆一次啊，都憋着呢？）