早期 GitHub Copilot 先出来，后来 Cursor 火起来了，Claude Code 现在也能处理复杂的工程任务，Codex 也还有不少人在用，现在 AI 辅助编程确实强得离谱。

以前写个带增删改查的表格组件，结构要搭，Tailwind 样式要调，接口逻辑要写，折腾下来小半天没了。现在用 Cursor，上下文一选，Cmd+K 敲个需求，几秒就生出一套完整代码，连错误处理都顺手给你补上。按理说效率上来了，准点下班也不难吧？结果呢，代码敲得确实快了，项目上线却没快多少，加班一点没少。

代码写得再快，项目该延期还是延期

上个月我们复盘了一个延期上线的项目，发现整个研发链路最拖时间的，不是写代码本身。敲下回车之后，Cursor 刷刷输出几百行代码，看着很爽，但这其实是软件工程里最后那一环。

真实日常是这样的：产品经理扔过来一份 PRD，或者干脆就是几句聊天记录，写着：“这里加个数据看板，放核心指标就行。”然后你看着这句话完全不知道怎么做。没有设计图，没有交互细节，字段定义也没有。但进度不能拖，只能凭感觉用 Cursor 先撸一个看板出来，Vue 写的，样子倒是不错。结果第二天发到测试环境，产品经理一看就说：“不对吧，我要折线图不是饼图，左边还得加二级联动菜单，你没做？”得，代码删掉，让 Cursor 重新来一遍。

问题是 AI 根本不知道你和产品到底想要什么。计算机里有个老说法，叫垃圾进垃圾出。源头需求就不清不楚，Codex 再强、Cursor 再快，也只是高速写出错的代码，后面全是扯皮和返工。

解决了怎么写，那“写什么”谁来管？

Cursor 管的是"怎么写"，但"写什么"这个事谁来解决？一个软件从想法到上线，中间要经历需求、原型设计、前端开发、测试这几个环节。现在大家用的工具基本都集中在"开发"这个环节，下游效率确实拉上来了，但上游还是老一套，慢吞吞的。下游跑得越快，上游就越显得卡。

如果需求和界面设计这块也能用 AI 提提速，提前把细节定死，整体效率是不是能上一个台阶？

前阵子我们内部试着重搞了一下上游流程。产品经理不出图，前端只能盲写，这个事不能再忍了。没必要回到之前手画原型的方式，我们就找那种能一句话生成界面的工具。试了 Claude Design、Stitch、Lovable，一圈下来，还是国内的墨刀 AI 在这个环节比较顺手，其实选什么工具无所谓，生成效果差距不算大。纯粹是分享一下我们现在用的流程，反正这套组合确实让前端少了很多扯皮的事。

实战工作流：从墨刀 AI 到 Cursor

上周临时要加一个电商后台模块。产品经理打开 AI，敲了一段 Prompt："生成一个深色模式的电商后台管理首页，左侧是导航菜单。右侧主区域顶部是四个关键数据卡片（销售额、订单数等），中间需要一个展示近七天走势的折线图，右侧带一个订单状态的环形图，底部是商品分类占比的进度条等。"等了一会，AI 出了这套高保真原型：

作为前端，拿到这张图的时候，脑子一下就清楚了。结构很清晰，标准的 Sidebar + Grid 布局，Echarts 占位、卡片排版、Mock 数据全给你摆好了。目标明确，没有歧义。确认完直接开工。

现在 AI 能直接把这种 UI 转成代码骨架，配合页面结构，我们能直接拿到像下面这样的基础代码：

看一下这段代码质量，不是那种乱七八糟的代码，是正经的 Vue 3 script setup 语法。它把 lucide-vue-next 的图标组件（TrendingUp、ShoppingBag）自动 import 了，kpiCards 配置数组也写好了，颜色直接用的 Tailwind 的 text-emerald-500 语义化类名。

接下来让 Cursor 接手。UI 结构和代码骨架都有了，我不用再去手写那些 div 和 CSS。把这段骨架扔到项目里，选中图表或数据那块代码，调出 Cursor，敲一句："将这里的 mockProducts 替换为调用 /api/v1/dashboard/stats 接口，并使用 Pinia 管理状态，处理好 loading 和 error 状态。"以前这种后台页面至少干大半天，现在设计图有了，Cursor 补业务逻辑，不到一小时联调就通了。

总结

代码生成再强，也代替不了团队沟通和需求对齐。这个流程里，两个工具分工很明确：

• 墨刀 AI 负责解决“写什么”：把文字需求变成可视化的 UI，产品和开发提前对好，减少返工。
• Cursor / Codex 负责解决“怎么写”：根据明确的 UI 和代码骨架去对接 API、处理状态、补逻辑，把体力活顶掉。

如果你们团队也在因为需求不清晰、天天调样式改功能而头疼，建议从上游捋一捋。别只盯着代码生成这个环节，把整个链路顺一遍，上游有图、下游有码，节奏才能快起来。

注：文中配图由AI生成