# 在 Design Mode 中通过视觉提示直接指挥智能体

- 来源：Cursor Blog
- 作者：Erik Nilsson, Ian Huang & Ryo Lu
- 发布时间：2026-06-05 08:00
- AIHOT 分数：74
- AIHOT 标记：精选
- AIHOT 链接：https://aihot.virxact.com/items/cmq16tduz0d15sltr5ig4ei0x
- 原文链接：https://cursor.com/blog/design-mode

## 精选理由

Cursor这次的Design Mode把「指哪改哪」做成了标准流程，不再靠一句prompt猜你的意图，而是直接给agent看元素、画圈圈，前端开发的反馈循环被压缩到秒级，赶紧试试。

## AI 摘要

Cursor 更新 Design Mode，支持点击元素、在页面上绘制区域或语音描述来向 AI 智能体传达修改意图。智能体将元素身份（xpath、组件、属性、计算样式等）与页面截图一并纳入上下文，快速定位源代码并高效编辑。借助 Composer 2.5 模型的快速执行能力，可连续下达多个编辑指令，智能体完成后应用热更新即时显示效果。这一更新将视觉交互融入正常编辑循环，使 UI 迭代更直观高效。

## 正文

聊天是与智能体协作的一种界面形式，但 UI 工作往往具有空间性。设计师、产品经理和前端开发人员通常通过指向页面元素、区域或状态的标注来进行沟通。

设计模式（Design Mode）——我们今天正在对其进行更新——是我们缩小所见内容与智能体所理解内容之间距离的方式之一。它让你能够在上下文中直接编辑产品，同时保持工作流不中断。

在 Cursor 浏览器中，你可以点击任意元素、在页面上绘制、或通过语音描述更改，Cursor 便能获取所需的上下文来编辑代码，而你则可以继续处理下一个编辑任务。

这是一种更快、更简单的方式，用于通过智能体迭代设计变更，因为指令不再仅仅是一句话——它现在可以包含所选元素、其背后的代码、周围的布局以及页面上的视觉关系。

这使得从发现问题到进行编辑的循环更加紧密。你可以直接指向你意图修改的界面部分，而无需离开正在运行的产品，然后在智能体在底层进行编辑的同时，持续以产品本身为参照进行交互。

指向、绘制或口述更改

设计模式提供了多种方式让你向智能体传达意图。你可以选择一个元素、添加多个引用、在界面上绘制、或使用语音描述更改。

媒体内容 · 前往原文查看

在运行中的应用中点击一个元素，针对该选中元素输入提示词，然后让智能体编辑代码。

当更改依赖于元素之间的关系时，多选功能非常有用。你可以引用两个组件，要求智能体让其中一个与另一个匹配、删除重复内容、或一起调整一组组件。

媒体内容 · 前往原文查看

选择多个元素，并描述它们应如何一起变化。

当智能体需要知道指令适用于页面的哪个区域时，绘制功能非常有用。你可以圈出一个拥挤的区域、框选一个范围、或标记动画页面的一部分。标注会叠加在视口的冻结帧上，这样智能体就能看到你当时所针对的精确页面状态。

在此版本中，您还可以使用语音叙述指令，我们让目标选取更精确，体验也更快。总的来说，这使得设计模式中的视觉交互感觉更像是正常编辑循环的一部分。

媒体内容 · 前往原文查看

结合使用语音输入和绘图来描述一项更改。

在底层，选取一个元素会向上下文中添加两个互补信号：元素的标识（xpath、组件、属性、计算样式、来自 fiber 树的 props）以及用于空间上下文（布局、周围元素和精确的页面状态）的截图。这为智能体提供了精确定位源代码并高效编辑代码所需的一切信息。

让模型与工作节奏相匹配

当您优化用户界面时，一个编辑链通常会引出下一个。您调整一个组件，注意到它周围的间距，然后看到另一个组件应该如何匹配。

设计模式让您可以在注意到这些编辑需求时立即发送出去。您可以指向一个元素，描述更改，移动到页面的另一部分，然后在第一个编辑完成之前发送另一个编辑。设计模式让您更轻松地执行多任务，并使得管理多个子智能体成为可能。

这种流程最适合能够快速进行针对性 UI 更改的模型。Composer 2.5 在这方面表现出色，因为它既快速又擅长界面工作。当智能体完成时，应用程序会热重载。您会看到更改出现在运行中的产品里，并继续调整，直到界面感觉合适为止。

我们相信，构建软件的未来是让用户能够在更高层次的抽象和更低层次的细节之间无缝切换，同时在他们想要的时候保持心流状态进行工作。设计模式为用户提供了实现这一目标所需的控制力、自主权和精确编辑工具。

在智能体窗口中尝试设计模式。阅读浏览器文档了解更多信息，或下载 Cursor 开始使用。

2025 年 12 月 10 日

推出调试模式：带运行时日志的智能体

Alexey & Albert

认识全新的 Cursor

Michael & Sualeh

在画布中与智能体创建的可视化内容进行交互

Alex Vandak Maloney
