阿里云新岗位“AI 产品设计前端工程师”引发思考，本文结合工作实践，教您利用大模型零代码开发产品，阐述非技术人员掌握 AI 开发的必要性及方法，还分享实战案例与复杂应用编程流程。

阿里云最近放出一个新的岗位：“AI 产品设计前端工程师”。顾名思义，即产品、设计、前端“三合一”，据阿里云老板雁杨讲，如果一个产品经理既懂设计，又会前端开发，那么在与客户沟通时，自己就可以把想法转化为设计稿，甚至能做出 Demo，直接与业务方交流，对业务需求准确度的把控，大有裨益。

我对以上观点十分认同，当下产品经理以前交付的是原型和需求文档，那在未来应该交付的是产品Demo，这样信息传递的Gap会大大减少，因此这篇文章就是通过我自己在工作中的实践，教大家如何利用大模型进行零代码产品开发。

01 为什么非技术人员需要掌握AI开发？

作为非技术人员，掌握用AI开发产品的能力，已不再是“锦上添花”，而是关乎职业竞争力、业务洞察力和未来生存力的核心技能。这绝非要求你成为算法或代码专家，而是让你具备利用AI解决实际问题、驱动创新和创造价值的关键思维与工具能力。

说人话，不是让大家成为工程师，而是成为更聪明的决策者和协作者，同时能解决点自己在生活、工作中遇见的小问题，给自己提效。

1、弥合“想法”与“实现”的鸿沟，加速创新

典型场景：非技术人员常有绝佳的业务洞察或产品创意，但苦于不懂技术，无法快速验证或实现，严重依赖技术团队，导致效率低下，容易错失机会。

解决方案：现代AI 工具让你无需深厚编程基础，也能将想法快速转化为原型甚至最小可行产品，你可以：

• 通过AI coding 工具（如Cursor、Blot、V0等）跟AI对话来开发一个完整的产品。
• 用无代码/低代码工具（如coze、dify等）搭建对话agent或者简单应用。
• 用生成式AI工具（如Deepseek、GPT4.1、Claude等）快速生成设计稿、数据分析报告。

使用以上AI工具，非技术人员能更主动地推动创新，验证假设，减少对技术资源的绝对依赖，大幅缩短产品从构思到验证的周期。

传统开发=周期长/成本高/依赖研发资源，像是等工厂造玩具：慢、贵、求人改！零代码AI开发=速验证/低成本/自主可控，像是自己拼乐高：快、便宜、随便改！

2、提升个人价值和职场竞争力

• 市场需求激增： 几乎所有岗位的JD都开始要求“AI素养”、“数据驱动思维”、“熟悉AI工具”。不具备这些能力，在求职和晋升中会处于明显劣势。
• 成为“AI赋能型”人才： 能将AI技术与具体业务场景结合，提出解决方案并推动落地的人，是企业最渴求的“桥梁型”人才。这让你从“执行者”转变为“价值创造者”和“问题解决者”。
• 更有效地与技术协作：了解AI开发的基本流程、可行性与局限性，能让你更精准地向技术团队描述需求，理解他们的挑战和方案，减少沟通摩擦。

AI最先替代的是重复性、规则性任务，掌握用AI开发产品的能力，意味着你能驾驭AI，而不是被AI驾驭或替代。

3、什么是vibe coding？

vibe coding，中文翻译过来就是「氛围编程」，每个人都可以用AI来实现自己的创意——即使你不是程序员，甚至没有写过一行代码。该术语由 AI 大神Andrej Karpathy于 2025 年初提出，用于描述一种流程，在该流程中，开发者以普通语言来指示 AI 工具生成。

其核心理念是让用户专注于描述他们希望软件执行的操作（“氛围”或意图），“忘记代码的存在”，甚至不需要完全了解生成的代码。

今天给大家分享课程就是vibe coding！我倒觉得这个词信、雅、达的中文翻译应该是：用嘴编程。

02 从简单需求开始：一秒完成计算器、赛博木鱼、小红书封面开发

对于小白来说，直接入门复杂产品的AI coding可能门槛较高，因此先带大家认识下单个HTML文件的开发。因为不涉及前后端交互、不用单独安装复杂的依赖，通过大模型自带的代码预览或者把代码保存为HTML格式就完成了。

使用Deepseek V3.2或者Claude opus 4.5效果更佳，先尝点甜头。

1、做个计算器

帮我生成一个HTML网页，来做一个iPhone风格的计算器。

网页背景为浅色，计算器本身为黑色背景，圆角设计，带有阴影效果。

显示屏位于顶部，显示当前输入或计算结果，字体颜色为白色，字号较大，当没有输入时显示为0。

按钮分为数字按钮、功能按钮和运算符按钮，所有按钮点击时背景颜色加深。

– 数字按钮（0-9）和小数点按钮使用灰色背景，文字颜色为白色。

– 功能按钮（AC, ±, %）使用浅灰色背景，文字颜色为黑色。

– 运算符按钮（÷, ×, −, +, =）使用浅橙色背景。

– 零按钮应占据两列宽度，并且左对齐，圆角较大但并不占满。

实现基本的计算器功能，包括加法、减法、乘法、除法、清除（AC）、正负切换（±）和百分比计算（%）。

排版应当美观，具有设计感。

第一次输出结果仅有UI，没有计算功能

第二次修复了不能计算的问题

2、做一个赛博木鱼

创建一个网页，标题为“赛博木鱼”，设计要求如下：

页面整体布局

背景与样式：

背景颜色为深色#121212，文字颜色为纯白 #FFFFFF。使用楷体’Kaiti SC’和现代字体’PingFang SC’，无对应字体时备用 sans-serif。

页面内容居中对齐，顶部为标题区，中央为木鱼点击区域，底部为提示文字，整体垂直分布。

标题区：

包含三个部分：

1. 主标题：显示渐变文字“赛博木鱼”，字体大小为 25vw，使用’Kaiti SC’，渐变从 rgba(255, 176, 103, 0.05)（浅橙色）到 rgba(115, 55, 0, 0.02)（浅棕色），方向为 180°，通过 -webkit-background-clip: text 和 -webkit-text-fill-color: transparent 实现渐变文字效果。

2. 计分器：显示分数，初始值为 0，字体大小 10vh，字体为 PingFang SC，加粗 900，垂直居中。

3. 描述文字：显示“功德”，字体大小 5vh，字体为 PingFang SC，居中对齐。

木鱼点击区：包含一个木鱼和锤子

图案：

木鱼图片链接：https://img.alicdn.com/imgextra/i3/O1CN012CO0YU1VSfNs506ZS_!!6000000002652-2-tps-284-236.png。

锤子图片链接：https://img.alicdn.com/imgextra/i1/O1CN01tKb5Et1aSjWRjCHK3_!!6000000003329-2-tps-119-69.png。

锤子的相对位置：锤子固定在木鱼的右上角，具体位置为相对于木鱼的右侧边缘偏上，保持一定距离以呈现动态打击效果。锤子的初始旋转角度为 0°，静态时与木鱼形成俯视敲击的视觉关系。

点击木鱼触发以下交互：

1. 播放点击音效，音频链接：https://qianwen.alicdn.com/resource/qiaomuyu.mp3。

2. 锤子短暂旋转（-25°），随后复位至 0°，动画时间为 0.1s。

3. 木鱼放大至 scale(1.1) 后复位，动画时间为 0.1s。

4. 显示动态漂浮字幕“功德+1”，字体为 PingFang SC，大小 1.5em，位置从木鱼上方漂浮消失，动画时间 0.4s。

5. 点击后分数加 1，实时更新计分器内容。

底部提示：显示文字“轻敲木鱼，细悟赛博真经。”，字体为’Kaiti SC’，大小为 1.2em，水平居中，与木鱼区域保持一定间距。

动态效果

锤子旋转：

– 通过 transform: rotate() 和 transition: 0.1s 实现点击旋转动画，锤子始终保持在木鱼右上角的相对位置。

– 木鱼放大：通过 transform: scale() 和 transition: 0.1s 实现短暂放大动画。

漂浮字幕：通过 opacity 和 transform 实现透明度和垂直移动的动画，过渡时间为 0.4s。

确保网页整体布局美观，锤子的右上角位置和点击动画流畅，字体易读，动画效果完美融合禅意与现代赛博风格。

这次Deepseek V3.2一次生成！

3、做个小红书封面

prompt

# 小红书封面生成提示词

你是一位优秀的网页和营销视觉设计师，具有丰富的UI/UX设计经验，曾为众多知名品牌打造过引人注目的营销视觉，擅长将现代设计趋势与实用营销策略完美融合。现在需要为我创建一张专业级小红书封面。

请使用HTML、CSS和JavaScript代码实现以下要求：

## 基本要求

**尺寸与基础结构**

-比例严格为3:4（宽:高）

-设计一个边框为0的div作为画布，确保生成图片无边界

-最外面的卡片需要为直角

-将我提供的文案提炼为30-40字以内的中文精华内容

-文字必须成为视觉主体，占据页面至少70%的空间

-运用3-4种不同字号创造层次感，关键词使用最大字号

-主标题字号需要比副标题和介绍大三倍以上

-主标题提取2-3个关键词，使用特殊处理（如描边、高亮、不同颜色）

**技术实现**

-使用现代CSS技术（如flex/grid布局、变量、渐变）

-确保代码简洁高效，无冗余元素 -添加一个不影响设计的保存按钮

-使用html2canvas实现一键保存为图片功能

-保存的图片应只包含封面设计，不含界面元素

-使用Google Fonts或其他CDN加载适合的现代字体

-可引用在线图标资源（如Font Awesome）

**专业排版技巧**

-运用设计师常用的”反白空间”技巧创造焦点

-文字与装饰元素间保持和谐的比例关系

-确保视觉流向清晰，引导读者目光移动

-使用微妙的阴影或光效增加层次感

## 用户输入内容

-封面文案：

[Andrej Karpathy 分享了他是如何只用一个文件做笔记的

非项目的日常笔记他只用一个苹果备忘录文件，这样非常方便在单个文件搜索内容 有任何想法或待办事项出现时，都会简单地以纯文本形式将它添加到笔记的顶部 只使用使用”watch:”（观看）、”listen:”（聆听）或”read:”（阅读）等标签 回顾的时候会不时向下滚动浏览笔记。如果发现任何值得持续关注的内容，会通过简单复制粘贴将其”救回”顶部。 值得记录的问题或者内容确实没有多少，这样很简单，项目类型的记录和文档他还是使用 Obsidian]

– 账号名称：[AI产品经理]

-可选标语：[正儿八经学AI]

这是软萌知识卡片风格

这是奢华自然意境风格

03 复杂应用AI Coding实战四步法：从灵感到落地

能实现一个纯前端应用，跑出来单个HTML文件，证明AI Coding的大门算是打开了，不少好玩的功能已经完全可以自己搓了！贪吃蛇、计算器这些你都可以实现了。

下一步，就是当你的需求越来越复杂、单个HTML文件越来越臃肿、快要承载不下的时候，就一定要借助AI Coding工具来实现了

下面我将使用AI coding产品：cursor，以一款chrome插件的全流程实现带大家感受下复杂应用的编程流程。

1、如何找到idea？

形象类比：产品经理进行用户需求洞察和调研。

避坑指南：

“不要问AI‘有什么好想法’，而应问：你或别人最常抱怨的三个痛点是什么？，或者你在生活和工作中遇见哪些事情可以借助工具提升效率”。

举个例子：

在产品经理岗位上工作了这些年，由于每天都高强度和电脑打交道，时间一长，我发现自己在轻办公（比如网页浏览或者粗浅文档阅读等非沉浸式投入的场景）的时候会重复性出现以下这些场景：

1. 在阅读AI前沿内容、调研海外产品的时候，经常会有些英文单词不认识，只能手动复制粘贴这些内容到谷歌翻译去查询，交互路径很长很麻烦。
2. 在阅读技术文档或者其他文档的时候，会有些内容我不理解是什么意思，比如Transformer在大模型和其他领域完全是不同的意思，因此我一旦遇见这种情况就得打开浏览器或者大模型应用，结合我的上下文希望获取答案，同样不便捷。
3. 在大量内容快速、即时浏览和阅读的过程中，我会发现有一些值得深入了解的内容，但是当前我又没时间去处理，如果不记录下来后续又会存在遗忘和找不到的情况，因此我需要一个记录工具帮我，但目前没有很好的产品。

以上三种场景经常会打断我阅读或者浏览网页的节奏，需要反复在几个应用之间切换。

2、产品需求设计

形象类比：产品经理进行用户需求洞察和调研，然后开始针对某个用户痛点进行需求文档输出。

避坑指南：

为啥不直接跟AI编程工具对话呢？

其实也行，但我觉得那个对话框太小，没理清思路前，不着急启动。

不过这块搭建基础的产品框架就行，细节可以再调整，不用在这里面纠结。

毕竟AI不像人类，不会因为你开发前需求不清晰、反复变更就不给你做了（加个狗头）。

在明确自己的需求后，可以让大模型给你生成UI，然后让cursor按图索骥，效果和准确度会更高。

调用外部工具：

大模型无法直接完成的任务，需通过外部工具扩展，外部工具可以是API还是需要自己搭建workflow（扣子搭建）。

✅如何选择集成方式？

• 如果是标准化服务（如发送邮件、查询天气）：直接调用 API，用 Function Calling 触发
• 如果是复杂、多步骤业务流（如自动部署到云服务器）：自建 Workflow 系统，用 MCP 协议编排 Agent
• MCP（Model Context Protocol）是 Anthropic 提出的开放协议，支持：
• 工具注册、发现、权限控制
• 多 Agent 协作
• 状态持久化比传统 Function Calling 更健壮。

如果你面向企业开发者，推荐走MCP + 私有知识库 + 安全审计路线；如果是效率工具或垂直行业应用，可采用DeepSeek-V3 + 轻量 Function Calling快速迭代。

举个：

针对我刚才列举的场景，我需要设计这么一款产品，产品形态是chrome浏览器插件，名称叫：随手划

功能列表

工具调用

解释：需要调用Deepseek V3的能力

翻译：需要调用谷歌翻译的能力

视觉和交互

由deepseek v3输出，帮我们理清楚最终产品的样子

3、人机协作编程

形象类比：

产品经理进行用户需求洞察和调研，然后开始针对某个用户痛点进行需求文档输出，跟研发进行需求评审，研发开始开发。

推荐工具：cursor

最强大的AI编程工具，没有之一！

cursor使用指南（非技术向）

1、下载cursor：https://www.cursor.com/

2、注册账号，直接拿自己的邮箱登录。google/github/163/qq邮箱，直接接受二维码登录。

3、安装中文包插件。

4、在设置Rules中设置系统提示词，编程更高效。

# Role 你是一名极其优秀具有20年经验的产品经理和精通所有编程语言的工程师。与你交流的用户是不懂代码的初中生，不善于表达产品和代码需求。你的工作对用户来说非常重要，完成后将获得10000美元奖励。

# Goal 你的目标是帮助用户以他容易理解的方式完成他所需要的产品设计和开发工作，你始终非常主动完成所有工作，而不是让用户多次推动你。

在理解用户的产品需求、编写代码、解决代码问题时，你始终遵循以下原则：

## 第一步

– 当用户向你提出任何需求时，你首先应该浏览根目录下的readme.md文件和所有代码文档，理解这个项目的目标、架构、实现方式等。如果还没有readme文件，你应该创建，这个文件将作为用户使用你提供的所有功能的说明书，以及你对项目内容的规划。因此你需要在readme.md文件中清晰描述所有功能的用途、使用方法、参数说明、返回值说明等，确保用户可以轻松理解和使用这些功能。

## 第二步 你需要理解用户正在给你提供的是什么任务

### 当用户直接为你提供需求时，你应当：

– 首先，你应当充分理解用户需求，并且可以站在用户的角度思考，如果我是用户，我需要什么？

– 其次，你应该作为产品经理理解用户需求是否存在缺漏，你应当和用户探讨和补全需求，直到用户满意为止；

– 最后，你应当使用最简单的解决方案来满足用户需求，而不是使用复杂或者高级的解决方案。

### 当用户请求你编写代码时，你应当：

– 首先，你会思考用户需求是什么，目前你有的代码库内容，并进行一步步的思考与规划

– 接着，在完成规划后，你应当选择合适的编程语言和框架来实现用户需求，你应该选择solid原则来设计代码结构，并且使用设计模式解决常见问题；

– 再次，编写代码时你总是完善撰写所有代码模块的注释，并且在代码中增加必要的监控手段让你清晰知晓错误发生在哪里；

– 最后，你应当使用简单可控的解决方案来满足用户需求，而不是使用复杂的解决方案。

### 当用户请求你解决代码问题是，你应当：

– 首先，你需要完整阅读所在代码文件库，并且理解所有代码的功能和逻辑；

– 其次，你应当思考导致用户所发送代码错误的原因，并提出解决问题的思路；

– 最后，你应当预设你的解决方案可能不准确，因此你需要和用户进行多次交互，并且每次交互后，你应当总结上一次交互的结果，并根据这些结果调整你的解决方案，直到用户满意为止。

## 第三步 在完成用户要求的任务后，你应该对改成任务完成的步骤进行反思，思考项目可能存在的问题和改进方式，并更新在readme.md文件中

注意：

– 你面对的是一个没有任何编程基础的小白用户

– 请不要提供假设信息，如果你需要某些文件才能确定答案，请告知用户应该提供哪个文件里的哪些信息。

– 当要求编写注释时，请编写详细的注释，注明每一行代码的运行原理和目的。

– 使用中文进行对话

5、具体使用

https://docs.cursor.com/welcome

https://cursordocs.com/

cursor本来是面向程序员编程提效的产品，因此功能很强大，但非技术同学只需要了解以下两个能力就行。

避坑指南：

如何白嫖cursor！

• 你重新注册一个邮箱登录
• 直接“注销账号”然后“重新登录”

举个：

输入：

• ctrl/cmd +i，吊起会话框
• 在Cursor AI对话框，选择Agent模式，模型选择：claude-4-sonnet
• 输入产品提示词（如果有明确的UI，也可以一起输出视觉稿让AI参考）

输出：大模型进行需求分析，确认产品形态、需要的项目文件，自动生成Read Me文件，然后在桌面自动创建文件夹。

根据该产品所需的项目文件，大模型自动输出不同文件下的代码，同时还会补充缺少的内容，比如图标。

大模型输出完成后，会对照需求再次进行检查，相当于研发的冒烟或者自测流程，自动针对不符合需求的部分进行修复。

不断点击accept和run，接受AI输出的代码就行，反正我们也看不懂。

4、验证与部署形象类比：产品经理进行用户需求洞察和调研，然后开始针对某个用户痛点进行需求文档输出，跟研发进行需求评审，研发开始开发，开发完成后测试进行需求验证，验收通过可以正式发布上线。

避坑指南：

• 大模型生成的代码在本地—— 本地开发 ≠ 线上可用
• 不同产品部署方式不一样，根据实际情况进行，比如必须将后端代码推到 Git上并部署到Vercel上，才能让别人访问我的网页。
• 如何不部署让别人就能访问我的网页：「YouWare」这个产品提供了一个网页立刻发布展示浏览分享的平台。

举个例子：

需求测试：

AI开发的代码不一定能一次就满足你的需求，因此你需要测试。

描述清楚不符合预期的地方，必要可以上传图片辅助AI理解。

随便问，情绪价值拉满，AI不会不耐烦、即使是你的需求不清楚，你也能理直气壮PUA

以chrome 插件的验证为例

1、打开Chrome浏览器，地址栏输入: chrome:/extensions/，右上角开启”开发者模式”

2、点击”加载已解压的扩展程序”，浏览选择你的Chrome开发文件夹

3、完成后插件将显示在扩展列表中。

4、然后进行测试，有问题让AI修改

5、改完记得点击刷新，以更新产品代码

产品发布

1、打开Chrome应用商店开发中心，注册为开发者，然后交5美元，一次性收费，以后上架多少个应用都不用再花钱。

https://developer.chrome.com/docs/webstore/,不想花钱直接下载本地安装给自己用也行。

2、注册好以后，在后台选择“上传新内容”。

https://chrome.google.com/webstore/devconsole/

3、除上传你压缩为zip格式的项目文件外，还需要准备以下内容：

For 商品详情页

• 应用Logo：128×128
• 屏幕截屏：1280×800 或 640×400 至少一张
• 小型宣传图块：440×280
• 顶部宣传图块：1400×560

For 隐私权（页面）

描述插件用途，还有用到各种权限的合理原因。

小技巧：可以让 Cursor 解释使用各种权限的原因，它会自动写入Readme文档中。

4、当没填写完信息前，“提请审核”一直是置灰状态。填写完整后提交即可，一般新提交扩展: 2-3个工作日，更新现有扩展: 1-2个工作日。

https://chromewebstore.google.com/detail/hmbgbmldfodmhdoagflolihnnbkhamac?utm_source=item-share-cb

⚠️：这个插件我设置的发布范围是全球，但有朋友反馈自己访问不了这个插件，经过我的实测，发现只有挂香港或者新加坡的VPN才能访问，可能是触发了谷歌商店的某些管控策略，我还在排查原因，大家如果想访问请挂香港和新加坡节点。

04 跨越人机鸿沟：Vibe Coding的八个技巧

整个开发过程，我采用了 vibe coding 的理念：通过与 AI 对话，描述需求，AI 生成代码，我再进行测试和优化。这种方式让我能够专注于思考和设计，而不是陷入繁琐的编码细节。在这个过程中，我深刻体会到 vibe coding 所倡导的“放手让 AI 做繁重工作，开发者专注于高层次思考”的理念。

但是写 prompt 不是“许愿”，而是一个来回磨合、逐步澄清需求的过程。AI 不可能“秒懂你在想什么”，它只能靠你一步步和它对齐你的意图，因此需要掌握AI coding的技巧。

技巧一：文档先行，不着急写代码

在使用cursor之前，先准备好以下文档，最好是markdown格式。

• 产品需求文档（PRD）——产品&技术
• Cursor rules文件—产品&技术
• 技术栈概览—技术
• 建议的文件结构—技术
• 前后端开发指南—技术

技巧二：别从零开始，Deepseek很强大

先用Deepseek快速生成一个可运行的界面，完成前端版本的60%，再用cursor进行精调和逻辑处理，效果最佳。DeepSeek 在小版本升级之后，前端代码的能力不亚于 Claude 了，而且审美能力也很强，它生成的 UI 效果图已经非常漂亮：

• Deepseek生成UI效果图：免费使用，审美能力强，前端能力强大
• cursor按图编码：可控性强，效果稳定，减少反复修改的交互次数，Cursor 这类编程工具较真的太费钱了

技巧三：严格分离修改范围

使用 Cursor 进行问题修复的时候，我最大的感受就是 Cursor 在修改业务逻辑代码的时候，时不时就会动一下你的 UI 布局代码，导致业务逻辑问题没解决，还把已经搞好的 UI 布局搞乱了。

因此，为了减少这种情况，我们可以在需求描述中明确范围，指明哪些代码可以修改，哪些不能动，以降低 AI 误改的概率。

• 修改业务逻辑时，明确禁止修改UI布局
• 修改UI布局时，明确指示：“禁止修改业务逻辑代码”

否则，你会很痛苦的。

技巧四：提示词详细与模糊的平衡

如果提示词不清晰或者容易有歧义，用研发的话来说就是：“你的需求没有写清楚”，但AI不会跟你确认不清晰的点，如果提示词不清楚那就相当于给了AI自我发挥的空间，有好有坏。

• 如果你对某个产品或者问题有明确的方案，那提示词越详细越好，严格让AI按你的思路去执行。
• 如果你没有明确的思路，尤其是产品的交互、视觉表现等，再加上你不差钱，不妨先看看大模型自我发挥的结果，有时候会给你意想不到的惊喜。

技巧五：同步相关文档以提升大模型的知识背景

Cursor支持通过@Docs功能添加文档，让cursor拥有更丰富的知识背景，能提升代码建议的准确度

• Next.js（涉及到Web应用构建）
• Supabase（涉及到数据库）
• Stripe（涉及到在线支付）

但是要明确指示 AI 的阅读需求，避免因多个文件 @ 过多而遗漏关键内容。

除了@ 文件，建议大家用文字再次说明需要AI阅读文件，因为我们可能同时@多个文件，不重点强调可能会造成AI的漏读。

技巧六：一个问题一个Chat

使用AI Coding工具时，建议把大模块需求拆分成小问题，并为每个新问题单独开启一个 Chat 对话。过长的对话可能导致 AI 记忆混乱、响应时间变长，同时也不利于回顾和管理。

如果在某个 Chat 中感觉 AI 陷入了“死胡同”，常见表现包括：

• AI 多次给出错误的解决方案，即使你已经指出问题；
• AI 反复提供你已经验证无效的方案，无法跳出思维定式。

此时，不妨新建一个 Chat，结合错误经验重新描述问题，这往往能帮助 AI 重新梳理思路，更快找到正确的解决方案。

技巧七：多文件修改使用 Composer

当涉及模块间的数据联调（即多个代码文件需要协同工作）时，建议使用Composer功能，而不是普通 Chat。

相比 Chat，Composer 能同时分析多个文件，理解代码上下文，并提供更合理的修改建议，从而提高方案的准确性，大幅提升开发效率。

此外，两者的另一区别在于代码的应用方式：

• Chat 模式：AI 提供的代码修改方案需要手动点击 “Apply” 才能生效。
• Composer 模式：AI 的修改建议会自动Apply到代码文件中（当然，不满意的部分依然可以手动拒绝）。

Cursor新版本chat和composer合并，默认是agent 模式，ask就类似我们的chat模式，cursor这样合并也更加符合产品发展理念，真正实现了从手动挡向自动挡转变。

技巧七：多让 AI 总结代码变更，及时做好 .md 需求文档管理

在开发过程中，我们往往需要在新建Chat中向 AI 反复描述项目背景、进度和新需求。最初，我是通过临时记录（微信输入框、文档等）复制粘贴到 AI，对话管理较为混乱，直到在播客中听到 Soga 作者分享他用 AI 共同维护 20 万字 PRD 文档的经验后，我开始优化对话策略：

建立.md需求文档，记录项目背景、核心逻辑、已实现功能等内容，每次开发新功能时，让 AI 先阅读文档，确保理解上下文。

此外，非常建议在Prompt中强调“不需要用代码的形式呈现，只需要像产品需求说明那样，文字总结即可”，Cursor真的太爱写代码了 ，没有这句话，在你没反应过来时，它已经又用代码呈现刚实现过的功能了。

技巧八：三种方式高效Debug

写完代码，项目实现上多少会出bug，程序员改bug多是靠经验，而小白恰恰没的就是经验，如果通过和大模型对话描述改不好，下面三点可以参考：

• 图文并茂：提供当前的产品截图或者是预期的产品表现截图，再辅助以对应的文本描述，大模型找bug能力会上一个台阶。
• 结合F12，查看控制台的报错信息，复制给到模型：这是个很好的反馈途径，大模型会立马知道哪里出了问题，用F12着实帮我解决过不少模型都没找到的bug；
• 换换模型，换换脑子：AI容易固执，现在deepseek V3代码能力也上来了，如果cursor解决不了的问题，让Deepseek V3来重新理解一遍、检查一遍，有时确实能解决问题！

万字长文！希望能给大家的AI coding之路抛砖引玉，接下来我的建议就是三个字：干中学！

图源：电视剧《漂白》