马斯克豪掷600亿美金收购Cursor的传闻，让AI编程工具再次成为焦点。作为产品设计师，我深度体验了Cursor的交互设计，从多线程对话到代码联动，再到原型图秒变网页，它如何重塑开发流程？本文从体验视角拆解Cursor的独特魅力，带你感受AI编程的新可能。

前段时间，刚刷到新闻的第一反应，就是刚写完 Cursor 项目“Vibe coding”，网传它被马斯克买下了。

作为产品设计师，我深度体验过市面上几乎所有AI编程工具——Claude Code、Cursor、WorkBuddy、TraeWork……最后，三个月以来留在电脑里的最高频使用的，还是Cursor和VS code+opencode。现在，我每天用它写代码、做项目，甚至用这篇教程带大家入门Vibe Coding。不要觉得它已经过时话题了，你要知道，如果你是刚开始学习AI工具，一定要从一个最简单的切入点开始，培养自己的兴趣，激发你的好奇心，然后用它大胆的去创作和探索。

所以，这条新闻对我而言，不只是一个财经头条。它验证了我一直在说的一个判断：我近期分享过AI编程的“三种流派”——视觉派（Figma→代码）、代码派（自然语言→代码）、意图派（目标→Agent协同）。

Cursor正是“代码派”的独立IDE路线的佼佼者：你描述需求，它生成代码，你调试部署，而且它还会给你提供一些操作建议…而且,从学费上来说，也不算太贵。

你肯定会说，那你之前是不是会写些代码习惯这个呢？

我想说，我没有自己写过代码，而且也是第一次使用IDE编辑器编写代码。所以，作为一个产品设计师、体验专家、交互设计师，我仍然是强推“Cursor”或者“IDE编辑器模式下的AI工具”做产品开发、AI agent skill开发。

当然，在我写完这篇文章的此刻，马上又有新的大模型版本可能随时发布，但是，我们无法预言哪家会有一次突围，但是，我们可以做的是理解这些工具该如何为我们所用。在此，我以 Cursor 为代表的 IDE 模式，分享近期的一些使用感受。

1.Cursor事件速览

据外媒报道（网传消息，尚未经官方确认），SpaceX 完成上市融资、创造历史之后的第一件事，就是马不停蹄地花费 600 亿美金（约 4055 亿人民币）收购了 Cursor。

上半年有人觉得“IDE+AI”好像已经是过时的搭配了，大家都开始认为Claude Code和Codex才是主流。但是，我仍然觉得这似乎有些片面，我想Claude Code 等工具展现了一种新的可能性：AI 正在从“副驾驶”变成“能够独立工作的工程师”。这无疑会引发大家对未来开发工作的设想，认为“直接委派AI任务”会成为主流。

但是，今天Cursor也持续在升级变得更加强大，通过Agent模式也让委派任务的能力融入到了 IDE 这样的开发模式当中（注：Cursor 近年也加入了 Agent/委派能力，但交互重心仍在 IDE 内的结对协作，与 Claude Code 的纯命令行委派形成差异）。

作为新一代AI的领衔工具们，它们不过是应对开发工作流中的不同层面问题，先对比下最明显的四个维度:

这是我用Cursor做了一个Vibe coding网站，整个网站的结构还是相对比较复杂，之前用了其它的友商进行同样的功能测评，结果我仍然觉得vibe coding是还原图效果是最高的。

通过Cursor的协助，开发效率和设计师能力得到的显著提高。那今天我们就用体验的视角来分享下Cursor之好用。

2.Cursor的交互体验剖析

2.1 主页面分区

Cursor的主页面采用了现代化的设计思想，Cursor将界面分为三个区域：左栏文件管理、中间IDE编辑区、右侧AI对话框，三栏宽度可自由调节，也可以关闭。

从体验层上说：工作台既注重实用性，又能极大提升操作效率。通过清晰的面板组合和强大的功能底座为支撑，让设计师都能很快的接手。

2.2 多AI对话线程

这个区域位于Cursor的右侧，提供了内置的AI Chat，你可以直接进行自然语言与AI进行提需求，不需要特定的去学习命令和语法；

你也可以让它自己写代码之前，先理解下你的意思；如果你想变学习边理解它为什么这样修改，你还可以让他给你解释它为什么要修改这些代码、和它的目的是什么。

我目前会让一个网站不同的页面模块拆分成不同的AI对话框，这样保证它上下文的理解连贯性，也可以减少token的消耗。

2.3 重构项目

我之前让其它的工具进行撰写的代码，欠下了很多“架构债”，比如**重复嵌套、文档与代码混合、脚本散落、CSS 不分模块、无忽略规则等等，这导致我的“修改”过程和token消耗开始变得每次“AI”思考极其慢。

后来，我又回到cursor软件里，让它跟我进行诊断、提供代码重构的建议、进行问题排查、调试过程中的错误分析、如果出现了BUG让它自己修改。

最终，我的代码又回到“轻快修改”的时候，在 Cursor 中修改样式时，又可以享受从“10秒变1秒”的响应。

这里我发现不是AI不够聪明，而是你给的AI信息不够完整。也不是代表有了AI你就能“躺平”完全依靠它给你干活，也不意味着你能够放弃对复杂页面逻辑理解的思考。

2.4 AI对话框和IDE联动

在AI对话当中，你所有发的“要求”和“如何修改”的代码都可以在右侧对话框中“高亮显示”。点击每一段代码的时候，左侧会自动跳转到对应的地方，同时有绿色高亮显示。

这样你随时都可以掌握你修改了多少代码量，哪个区域进行了对应修改，非常的清晰，如图：

它还有局部手动修改的模式，如果你能掌握一点代码基础，那么对于简单的任务修改，手动调整有时候比“AI对话”效果高很多。

找到你所需要修改的代码，框选你想修改的代码区域：

模式1：如果你是”Add to Chat”，那么你就会在右侧的对话框里面，看到你引用的修改代码地方，也可以多个地方的联动修改引用。

模式2：如果你是”Quick Edit”，那么在代码的上面，就会出现一个便捷AI对话框，让它进行修改。

2.5 给一个原型图，就可以出效果

我们一般给原型是用Figma给图，让“Cursor+MCP”进行联动的，但是我有一些旧项目的图是Axure和sketch格式的，就直接丢了Axure截图进去，Cursor自己识别布局、提取颜色、生成HTML，整个流程不到2分钟，这点完全是“王炸功能”。

具体的图我就不贴了，留个悬念自己试试。

今辅助编程工具越来越智能，设计师、程序员、产品经理的工作方式都在被重塑。既然变化不可逆，我们能做的只有一件事：用好工具，而不是被工具淘汰。

如果你也想尝试工具，你可以挑选手边任何的AI产品进行体验，不要等待都搞懂再开始，不用担心不会写代码……从vibe coding开始进行大胆尝试，至于考虑AI工程化、数据库挑选之类的高级任务可以后期再说，毕竟，要学会游泳的第一件事情，是跳下水去亲身实践。