经验|调教 AI Prompt 超全教程+案例!减少返工80%!

⬆️ 关注「长弓小子」看更多设计干货！

Hi，我是元尧。一线互联网大厂 AI 体验设计专家。欢迎长按下图二维码加我微信，带你进设计师交流群，与上万小伙伴一起交流成长！

「👇 添加好友请备注：设计交流」

全文共 2722 字，阅读需要 8 分钟

很多同学跟我说，做设计稿时自己跟 AI 聊了大半天，结果生成的内容还是不符合预期，来回改了十几次，本来想靠 AI 提效，最后反被 AI 消耗。

其实不是 AI 不行，是你没找对和 AI 对话的方法。我们与 AI 对话的底层逻辑：不是“求 AI 帮忙”，而是“教 AI 做事”。通常，与 AI 对话有五个环节：

1. 确定目标

2. 输入指令

3. 输出结果

4. 校验迭代

5. 沉淀复用

本文就从这五个环节来分享与 AI 对话的实用技巧，帮助你相对精准地控制 AI 的输出质量。

阶段 1‍‍‍‍‍‍‍

预设目标

‍‍‍‍‍‍

预设目标是为了让 AI 读懂你的“隐性需求”，更明确地执行指令。磨刀不误砍柴工，在和 AI 对话前，花几分钟在脑中打个草稿，具体做法如下：

1. 明确任务目标

清晰界定最终产出成果，颗粒度越精细越好。比如：

❌ 错误描述：“做个 B 端产品的 Table 页面。”

✅ 正确描述：“输出可直接对接开发的 B 端用户数据管理的 Table 页面的交互设计方案。”

2. 清晰划定边界

明确“要什么、不要什么”，给 AI 设置硬性红线。比如：

“必须要使用 Ant Design 5.0 的组件和规范，不要使用自定义的组件。”

3. 备好参考资料

将相关设计规范（如 AntD 组件官网链接或者 Skill 安装包）、同类产品的 Table 页面设计样例、业务背景 BRD、PRD（如用户画像、核心操作场景）提前整理，随指令一并提供，或者提前安装在 AI Coding 工具的设置中，减少 AI 脑补空间。

要知道，AI 输出的质量，取决于你输入的信息密度。想要获得精准反馈，你的需求就要足够具体。

阶段 2

输入指令

预设好目标后，接下来的重点就是“怎么表达”。结构化的指令对 AI 来说更加有效。分享几个经验：

1. 参考公式

你描述的逻辑可以参考以下公式：

AI 角色 + 业务背景 + 核心任务 + 硬性规则

+ 输出格式 = 好的 Prompt

举个例子：

❌ 错误描述：“做个 B 端产品的 Table 页面。”

✅ 正确描述：“你是一位资深的 B 端交互设计师，擅长 B 端后台页面交互体验设计（角色）。需求背景是公司新出的一款办公管理后台产品，帮助企业管理 xxx 群体的 xxx 数据和 xxx 信息，当前需要你设计用户数据管理模块的 Table 页面……（背景）；你的核心任务是输出该 Table 页面的交互设计方案，能让用户操作高效、数据展示清晰（任务）；页面设计的规则是使用 AntD5.0 组件搭建，并严格贴合其规范，组件库链接：xxxxxxx（规则）；输出格式是一份交互的设计稿、一份可预览和操作的 html 格式的 Demo，以及一份设计思路说明文档（格式）”

2. 调用技能

作为交互设计师，我们都有自己和团队常用的固定设计规范及组件库，这些常用的设计规范、组件库、业务规则，你可以提前做成 AI 的 Skills 或知识库，直接装在 AI 产品上，输入指令时调用，既能节省指令长度，也能确保设计输出的一致性，避免每次生成的方案风格不一。

3. 多案并行

以前在设计过程中，我们也常需要产出多个方案，并对比不同方案之间的优劣。对于 AI，我们也可以尝试让它一次性输出多套方案并横向对比，确定最优解之后，继续深化方案或融合几个方案的长处与优势。

我们还是以设计师做 B 端交互 Table 页面为例，你可在刚刚的指令中继续补充：

“同时输出两套设计方案，两套方案的功能逻辑和信息呈现内容相同，但是交互细节和视觉效果有所差异，体现不同的设计风格，分别是 xxxx 风格和 xxxx 风格。并在设计思路说明中，明确标注两套方案的核心优劣。”

或者：

“同时输出两套设计方案，方案一侧重高效操作，强化批量处理、快速筛选功能，方案二侧重数据可视化，并在设计思路说明中，明确标注两套方案的核心差异、优劣及适用场景，方便我快速决策。”

一定要让 AI 自己先评估不同方案的优劣，给出一个总结，这样可以极大提升你的决策效率。

阶段 3

输出结果

这一步就是等待 AI 给出方案了，经验如下：

1. 选择适配场景的 AI 工具

水涨船高，还是要优先选用大厂、行业顶尖的 AI 产品，不同的底层大模型的质量和水平会直接决定方案交互逻辑的合理性、组件调用的规范性。

2. 不中途打断或临时加需求

不论如何，先让 AI 完整的完成一次输出，即便是你发现忘记增加了某个参考条件，也不要在生成的中途进行打断，而是在之后迭代阶段进行处理。

阶段 4

校验迭代

在现阶段，不要指望 AI 输出方案后就一定能直接使用，所有的产出都需要我们进行人工校验，这也是训练 AI 产出的关键一环。你可以试试以下几个方法：

1. 反复追问，补充具体细节

AI 输出的方案往往在局部细节上不够完善。先不要急于否定，而是针对具体细节反复追问，这个时候就很需要你的工作经验和对于方案细节的把控能力了。比如：

当 Table 的分页逻辑不够合理时，你可以给出更加具体的优化指令：“请补充 Table 分页的交互逻辑，增加填写页码跳转的功能，以及无数据时的空状态设计”。通过精准追问让方案细节更落地。

2. 及时刹车，避免无效内耗

如果你发现 AI 给出的方案从一开始就是跑偏的，或者纠正了几次之后，方案依旧是跑偏的，那就要立即止损，重新开启一个窗口进行新的对话，根据我们上面的建议和上一次产出的结果重新调整和优化你的提示词内容，看看是不是指令中的哪些内容让 AI 产生了误区。

3. 梯度提需，分步落地需求

对于复杂的产品页面和业务流程，可以试着进行功能拆分，不要一次性把所有需求都丢给 AI，而是分梯度提需，逐步细化。比如：

第一阶段：先让 AI 输出两套 Table 页面基础布局方案，确定核心框架（如列数、组件排布、核心操作入口）；

第二阶段：选中其中一种最优布局，再补充核心交互功能逻辑（如排序、筛选、分页、批量操作的逻辑）；

第三阶段：完善异常反馈和边缘场景（如无数据、加载失败、操作错误的提示设计）、和屏幕适配细节等。

这样既能避免 AI 逻辑混乱、遗漏细节，也能让我们更好地把控设计方向。

4. 手动调节，高效优化细节

对于大部分 AI Coding 工具来说，AI 在设计细节比如组件间距、圆角大小、字体层级的调整，往往不如设计师手动调整来得更精准高效。比如字节的 Trae 在接入 Figma MCP 后，AI Coding 的参数可以和设计稿保持一致，对于这类局部细节，设计师直接手动输入数值，比反复跟 AI 描述“把圆角调成 12px ”、“间距缩小 4px” 更高效、更精准：