【产品】03_你的新搭档 Claude——比任何开发都听话
你的新搭档 Claude——比任何开发都听话
「产品经理用 Claude 实现产品」系列 · 第3篇
如果有一个开发，24 小时在线、从不请假、改需求不抱怨、秒回消息——你信不信？今天正式请出你的新搭档 Claude。我们会真刀真枪地对话，5 秒钟做出一个页面，然后疯狂改需求，它全程零抱怨。
👋 关注博主，不迷路
🎯 你将获得
✅ 产品经理视角 - 从你熟悉的工作流出发
✅ 完整实战项目 - 做一个你自己日常能用的工具
✅ 即学即用 - 每篇都有可运行的阶段成果
✅ 方法论沉淀 - 掌握"AI 实现产品"的完整方法论
💬 互动交流
📢 评论区答疑 - 产品 & 技术问题都能聊
🔥 源码开放 - GitHub 同步更新
📝 踩坑日记 - 一个产品经理的真实编程之旅
🎁 提示词模板 - 可复用的 Claude 对话模板
🌟 点击右上角「关注」，不错过每一篇精彩内容！
一、如果有一个开发，24 小时在线、从不请假、改需求不抱怨
上一篇我们搞懂了前端、后端、数据库、API 这些概念，也知道了产品经理其实一直在做"技术设计"。
但有一个关键问题还没解决：谁来帮你把设计变成代码？
以前的答案是：开发。但你已经知道了，找开发意味着排期、等待、反复沟通、信息损耗……
现在，我要给你介绍一个新选择——Claude。
先来看看它的"简历"：
| 维度 | Claude |
|---|---|
| 工作时间 | 24 小时 × 7 天，全年无休 |
| 响应速度 | 平均 5 秒出结果 |
| 改需求态度 | “好的，已修改” |
| 请假频率 | 从不请假 |
| 情绪波动 | 永远平和，不会甩脸色 |
| 技术栈 | 前端、后端、数据库、算法……全都会 |
| 薪资要求 | 每月几十到几百块（取决于使用量） |
这份简历是不是有点不真实？
但它就是真实的。
当然，Claude 也有它的局限性——它不会主动帮你想需求，对超长的项目上下文记忆有限，生成的代码偶尔有 Bug，复杂架构需要你多次引导。
但对于我们的目标——一个产品经理做自己的产品——它绝对够用，而且远超你的预期。
说了这么多，口说无凭。接下来，我们真刀真枪地跟 Claude 对话一次。
💡 本系列全程使用 weelinking大模型聚合平台 访问 Claude，国内可稳定，安全使用
二、第一次跟 Claude “提需求”
2.1 注册与访问 Claude
在国内，直接访问 Claude 官网不太方便。推荐使用 weelinking 中转服务，稳定且体验一致。
注册步骤：
- 打开 weelinking 注册页面
- 填写邮箱和密码完成注册
- 登录后，在控制台中找到 Claude 对话入口
- 选择 Claude 模型（推荐 Claude Sonnet，性价比最高；复杂任务用 Claude Opus）
套餐选择建议：
| 使用场景 | 推荐套餐 | 适合人群 |
|---|---|---|
| 先试试水 | 免费额度 / 最低档 | 刚开始学的同学 |
| 跟着系列做项目 | 中档套餐 | 认真学的同学 |
| 重度使用 | 高档套餐 | 已经上瘾的同学 |
注册好之后，你就有了一个随叫随到的"AI 开发"。接下来，我们来提第一个需求。
2.2 用产品经理的方式跟 Claude 对话
准备好了吗？我们来提第一个需求。
打开 Claude 对话框，输入：
你： 帮我做一个登录页面，要有用户名输入框、密码输入框和登录按钮，风格简洁现代。
Claude 会在几秒钟内回复你一段完整的代码。类似这样：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>登录</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
.login-card {
background: white;
border-radius: 16px;
padding: 48px 40px;
width: 400px;
box-shadow: 0 20px 60px rgba(0,0,0,0.15);
}
.login-card h1 {
text-align: center;
color: #333;
margin-bottom: 32px;
font-size: 24px;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
color: #555;
margin-bottom: 8px;
font-size: 14px;
}
.form-group input {
width: 100%;
padding: 12px 16px;
border: 2px solid #e1e5e9;
border-radius: 8px;
font-size: 15px;
transition: border-color 0.3s;
outline: none;
}
.form-group input:focus {
border-color: #667eea;
}
.login-btn {
width: 100%;
padding: 14px;
background: linear-gradient(135deg, #667eea, #764ba2);
color: white;
border: none;
border-radius: 8px;
font-size: 16px;
cursor: pointer;
margin-top: 8px;
transition: opacity 0.3s;
}
.login-btn:hover { opacity: 0.9; }
</style>
</head>
<body>
<div class="login-card">
<h1>欢迎登录</h1>
<div class="form-group">
<label>用户名</label>
<input type="text" placeholder="请输入用户名">
</div>
<div class="form-group">
<label>密码</label>
<input type="password" placeholder="请输入密码">
</div>
<button class="login-btn">登 录</button>
</div>
</body>
</html>
等等，就这么快？
是的，就这么快。你把这段代码保存成一个 .html 文件，用浏览器打开——一个带渐变背景、圆角卡片、悬停效果的现代登录页面就出现在你眼前了。
你花了 10 秒钟打字，Claude 花了 5 秒钟生成。总共 15 秒，你得到了一个比大多数原型都好看的真实页面。
此刻你的内心 OS 大概是：
“这也……太快了吧？”
别急，好戏还在后面。
2.3 迭代需求——改到你满意为止
做产品的你最清楚：第一版永远不是最终版。来，开始改需求。
第一次改：
你： 按钮颜色改成蓝色渐变，别用紫色了。
Claude 秒回修改后的代码，按钮变成了蓝色渐变。
第二次改：
你： 加一个"忘记密码？"的链接，放在登录按钮下面，居中。
Claude 又是秒回，链接出现了。
第三次改：
你： 表单加个验证——用户名不能为空，密码至少 6 位，不满足的时候在输入框下面显示红色提示文字。
Claude 不但加了验证逻辑，还贴心地加了输入框变红的视觉反馈。
第四次改：
你： 再加一个"记住我"的勾选框，放在密码框和按钮之间。
秒回。出现了。
你改了四次需求。 如果是真人开发，这个场景大概是这样的：
你："帮我改个颜色。"
开发："行，我记一下，等我改完手头这个。"
（2 小时后）
你："再加个忘记密码链接。"
开发："你怎么不一次说完？"
（第二天）
你："表单加个验证。"
开发："这个要加 JavaScript 逻辑，排到明天吧。"
（又一天）
你："再加个记住我。"
开发：（已读不回）
而 Claude 呢？四次修改，总耗时不到 1 分钟，全程零抱怨。
这就是为什么我说它比任何开发都"听话"——不是贬低开发，而是 AI 天生没有沟通成本。
三、Claude 的"工作方式"——跟带开发完全不同
在跟 Claude 深入合作之前，你需要了解它的"工作方式"。它和真人开发有本质的不同，理解这些差异能帮你更高效地协作。
3.1 它不需要上下文铺垫
跟真人开发协作，你得先铺垫背景：
“我们这个项目是做需求管理的，用户主要是产品经理，目前在用飞书但觉得不够好用，所以我们想自己做一个，第一版先做 MVP……”
说了 5 分钟，开发才勉强明白你要什么。
跟 Claude 不需要这样。你可以直奔主题：
“帮我做一个需求列表页面，表格包含：需求标题、优先级（P0-P3）、状态（待评审/开发中/已完成）、创建人、创建时间。支持按状态筛选。”
Claude 不需要知道你的项目背景、团队结构、商业模式。你说什么，它做什么。
当然，如果你提供了背景信息，它能做得更好——比如你说"风格参考 Ant Design"，它就会用 Ant Design 的设计语言。但这不是必须的。
3.2 它不会说"这个做不了"
你有没有遇到过开发跟你说：“这个做不了”？
Claude 不会。任何需求它都会尝试。
“帮我做一个拖拽看板。” —— 做。
“帮我加一个富文本编辑器。” —— 做。
“帮我做一个数据统计图表。” —— 做。
“帮我做一个实时聊天功能。” —— 也做。
但这里有一个重要的注意点：Claude 不会说"做不了"，不代表它做的每个方案都是最优的。
有时候它给的方案能跑但不够好，有时候复杂功能需要你分步引导。你需要学会判断和追问：
“这个方案有没有更简单的实现方式？”
“如果数据量很大，这个方案性能怎么样？”
“有没有现成的开源库可以直接用？”
Claude 就像一个永远积极的初级开发——什么都肯做，但偶尔需要你这个"PM"把把关。
3.3 它的记忆是有限的
这是跟 Claude 协作最需要注意的一点：Claude 的记忆是有限的。
它有一个"上下文窗口"（你可以理解为"短期记忆"）。在同一个对话里，它能记住你们之前聊了什么。但如果对话太长，前面的内容它就会慢慢"忘记"。
具体表现：
- 短对话（10 轮以内）：Claude 记忆清晰，前后一致
- 中等对话（10-30 轮）：可能会忘记一些早期的细节
- 长对话（30 轮以上）：大概率会遗忘前面的代码和需求
应对策略：
| 策略 | 具体做法 |
|---|---|
| 分话题开对话 | 一个功能模块开一个新对话，别把所有事塞在一个对话里 |
| 关键信息重复提 | 如果当前对话很长，在新消息里重复一下关键上下文 |
| 保存代码到本地 | 每次 Claude 给你代码，立刻保存到文件里。别依赖对话记录 |
| 用"项目说明"开头 | 开新对话时，先用一段话简述项目背景和当前进度 |
举个例子，开新对话时可以这样起头：
“我在做一个需求管理平台，技术栈是 React + Node.js + SQLite。目前已经完成了登录页面和需求列表页面。现在我需要做需求创建的表单页面，字段包括：标题（必填）、描述（富文本）、优先级（P0-P3）、标签（多选）。”
这样 Claude 就有了足够的上下文，能够给出准确的代码。
四、产品经理跟 Claude 协作的五个原则
经过大量实践，我总结了产品经理与 Claude 协作的五个核心原则。记住这五条，你和 Claude 的配合效率会翻倍。
原则一：像写 PRD 一样描述需求——越具体越好
反面教材 ❌
“帮我做一个列表页面。”
Claude 能做，但做出来的可能不是你想要的——因为它不知道你要什么样的列表。
正确示范 ✅
"帮我做一个需求列表页面。要求：
- 顶部有搜索框和筛选区域
- 筛选项包括：状态（全部/待评审/开发中/已完成）、优先级（全部/P0/P1/P2/P3）
- 列表用表格展示，列包括：需求标题、优先级、状态、创建人、创建时间、操作（编辑/删除）
- 底部有分页
- 风格参考 Ant Design，简洁清爽"
看出差别了吗？你写 PRD 的时候不会只写"做一个列表"——你会写清楚有哪些字段、什么交互、什么风格。跟 Claude 提需求也一样。
产品经理在这方面有天然优势——你本来就擅长描述需求。只需要把跟开发沟通的习惯搬过来就行。
原则二：一次一个功能——别一次性把所有需求都丢给它
反面教材 ❌
“帮我做一个完整的需求管理系统，包括登录注册、需求列表、看板视图、数据统计、用户权限……”
一次丢太多，Claude 容易顾此失彼，每个功能都做得不够好。
正确示范 ✅
对话1：帮我做登录页面
对话2：帮我做需求列表页面
对话3：帮我做需求创建表单
对话4：帮我做看板视图
……
一次一个功能，做完做好再做下一个。 就像你拆分 Sprint 任务一样——每个任务颗粒度要小，交付物要明确。
原则三：先看效果再优化——不要一次追求完美
反面教材 ❌
“帮我做一个需求列表页面，要有搜索筛选、排序、分页、表格列可拖拽、行可展开、支持批量操作、可以导出 Excel、表格主题要可自定义……”
第一次就要求十全十美，结果往往什么都做不好。
正确示范 ✅
第一步：先做一个基本的表格，展示数据就行
第二步：加上搜索和筛选
第三步：加上分页
第四步：优化样式和交互
MVP 思维用在跟 Claude 协作上同样适用。 先出最小可用版，再迭代。你作为产品经理，这个道理再清楚不过了。
原则四：不满意就说——它不会生气，改到你满意为止
这是 Claude 相比真人开发最大的优势之一。
你："这个表格太丑了，换个风格。"
Claude："好的，已经重新设计了表格样式。"
你："间距不对，上下边距改成 16px。"
Claude："好的，已经修改。"
你："算了，还是第一版好看，改回去。"
Claude："好的，已经恢复为第一版的设计。"
你："嗯……还是有点不对，能不能把两版的优点结合一下？"
Claude："好的，我结合了两版的优点，请查看。"
改了四次，Claude 的态度始终如一。没有叹气，没有甩脸，没有"你到底想要什么"。
所以不要客气，不要怕麻烦它。不满意就说，改到你满意为止。
原则五：保存好代码——Claude 不会帮你记住上次的代码
这是很多新手容易踩的坑：在对话里改了半天，终于满意了，然后关掉浏览器……代码没了。
Claude 不会帮你保存代码。 它不是你的硬盘，它是你的"临时开发"。
养成好习惯：
- Claude 每次给你代码，立刻复制到本地文件里保存
- 每完成一个功能，保存一次
- 后面我们会学用 Git 做版本管理，但在那之前，手动保存是底线
五、实战演练：5 分钟做一个产品需求卡片页面
说了这么多原则，来一次完整的实战。我们要做一个"产品需求卡片"页面——在一个页面上漂亮地展示多张需求卡片，就像看板里的卡片一样。
第一步：描述需求
打开 Claude，输入：
你： 帮我做一个产品需求卡片展示页面。具体要求：
- 页面标题是"需求看板"
- 页面上展示 6 张需求卡片，分两行三列排列
- 每张卡片包含：需求标题、优先级标签（P0 红色、P1 橙色、P2 蓝色、P3 灰色）、需求描述（一段简短文字）、状态标签（待评审/开发中/已完成）、创建人和创建时间
- 卡片有圆角和阴影，鼠标悬停时有轻微上浮效果
- 用一些模拟数据填充
- 整体风格简洁现代，白色背景
第二步：查看 Claude 的回复
Claude 会给你一段完整的 HTML 代码（大约 200 行左右）。别被代码吓到——你不需要看懂每一行，你只需要：
- 全选复制 Claude 给的代码
- 打开电脑的"记事本"（或任何文本编辑器）
- 粘贴进去
- 保存为
requirements.html（注意后缀是.html，不是.txt） - 双击这个文件，浏览器会自动打开
你看到了什么？
一个漂亮的需求卡片页面。有标题、有卡片、有优先级颜色标签、有状态标签、有悬停动效。这是一个真实的网页，不是原型图。
第三步：开始迭代
页面有了，但你觉得还可以更好。继续在同一个对话里提需求：
你： 不错！再改几个地方：
- 页面顶部加一个统计栏，显示"总需求数: 6"、“进行中: 2”、“已完成: 1”
- 每张卡片右上角加一个"…"的更多操作按钮
- 状态标签的颜色区分一下：待评审用黄色、开发中用蓝色、已完成用绿色
Claude 秒回修改后的完整代码。你替换掉本地文件的内容，刷新浏览器——新效果出来了。
你： 再优化一下：
- 加一个搜索框，放在统计栏下面
- 搜索框旁边放一个优先级筛选的下拉框
- 卡片按优先级从高到低排列
Claude 继续修改。你继续替换、刷新。
三轮迭代，总计不到 5 分钟。
你用 Figma 画同样的页面需要多久？至少 30 分钟以上吧？而且画出来的是静态的，不能交互。
Claude 做出来的，是一个"活的"页面——能搜索、能筛选、能悬停、能点击。
这就是产品经理用 Claude 的第一个"震撼时刻"。
对比一下
| 维度 | 用 Figma 画原型 | 用 Claude 做页面 |
|---|---|---|
| 耗时 | 30 分钟 - 1 小时 | 3 - 5 分钟 |
| 产出物 | 静态效果图 | 可交互的真实页面 |
| 修改成本 | 调组件、重对齐 | 说句话就改 |
| 能否运行 | 不能 | 能，浏览器直接打开 |
| 能否给老板看 | 能，但"没感觉" | 能，而且"很有感觉" |
六、Claude vs 真人开发：各自的适用场景
看到这里，你可能已经很兴奋了。但我要帮你冷静一下——Claude 不是万能的。
了解它的边界，才能更好地用它。
Claude 擅长的（适合你自己做的）
✅ 生成完整的前端页面 —— 给它描述，秒出页面
✅ 写后端接口 —— 描述业务逻辑，它帮你写 API
✅ 数据库操作 —— 告诉它数据结构，它帮你建表、写查询
✅ 修复 Bug —— 把报错信息丢给它，它帮你找原因并修复
✅ 解释代码 —— 看不懂的代码，问它就行
✅ 做 MVP / 原型 —— 快速验证想法的最佳工具
Claude 不擅长的（需要专业开发的）
⚠️ 超大型项目的整体架构 —— 它擅长局部实现，全局架构需要人来把控
⚠️ 高并发、高可用系统 —— 线上百万用户的系统还是交给专业团队
⚠️ 复杂的业务逻辑链 —— 涉及十几个模块联动的复杂流程，需要人来拆解
⚠️ 安全敏感的系统 —— 涉及支付、隐私数据的核心系统需要专业安全审查
⚠️ 长期维护和迭代 —— 大型项目的持续维护需要完整的工程体系
简单一句话：Claude 是"从 0 到 1"的利器，但"从 1 到 100"仍然需要专业开发团队。
而对产品经理来说，"从 0 到 1"恰好是最需要、也最缺的能力——快速验证想法、做出可用的 MVP、拿出能演示的 Demo。
Claude 补上的，正是这一块。
七、总结与下期预告
🎯 本篇核心要点
1. Claude 是你的"超级开发"。 24 小时在线、秒回、不抱怨、改到你满意为止。它不是取代真人开发，而是给产品经理补上了"快速实现"的能力。
2. 跟 Claude 协作有五个原则。 描述具体、一次一个功能、先出 MVP 再优化、不满意就说、及时保存代码。这五条原则能让你的协作效率翻倍。
3. Claude 有明确的能力边界。 它擅长"从 0 到 1"——做页面、写接口、改 Bug、做 MVP。但大型系统的架构、高并发、安全敏感场景仍然需要专业开发。
📋 Claude 对话技巧速查表
| 技巧 | 说明 | 示例 |
|---|---|---|
| 具体描述 | 说清楚要什么、有几个、什么样 | “做一个表格，包含 5 列：标题、状态、优先级、创建人、时间” |
| 指定风格 | 告诉它参考什么设计风格 | “风格参考 Ant Design” 或 “简洁现代风” |
| 分步实现 | 复杂功能拆成小步骤 | “先做基本表格 → 加搜索 → 加筛选 → 加分页” |
| 给示例 | 不确定怎么描述时给个例子 | “类似飞书项目的看板视图” |
| 丢报错 | 代码出问题直接把错误信息给它 | “运行报错了：Cannot read property ‘map’ of undefined” |
| 追问优化 | 觉得方案不够好就追问 | “有没有更简洁的写法？” “能不能用 XXX 库实现？” |
📌 记住这句话
Claude 就是你的"新搭档"——你说需求，它写代码，你验收。这跟你带开发没什么区别，只是这个开发永远在线、从不抱怨。
📣 下期预告
第4篇：《搭建你的开发环境——产品经理的"新工位"》
前三篇我们完成了认知转变——你知道了技术是什么、Claude 能做什么、怎么跟它协作。
从下一篇开始，我们要动真格了。
先搭建一个开发环境——就像产品经理入职第一天要装 Figma 和飞书一样，你要装一个"代码编辑器"和一些基础工具。别担心，全程保姆级教程，截图详解每一步。
装好工具之后，你就正式拥有了一个"开发者工位"。
💡 本系列全程使用 weelinking 访问 Claude，国内可稳定使用
📎 配套资源
📋 产品经理与 Claude 协作的五个原则（速查版）
原则一：像写 PRD 一样描述需求 ——→ 越具体，结果越准确
原则二：一次一个功能 ——→ 别贪多，做完一个再做下一个
原则三：先看效果再优化 ——→ MVP 思维，先出再迭代
原则四：不满意就说 ——→ 它不会生气，改到你满意
原则五：保存好代码 ——→ Claude 不是你的硬盘
📋 实战对话完整记录（摘要）
【对话1】做登录页面
你：帮我做一个登录页面，要有用户名输入框、密码输入框和登录按钮，风格简洁现代。
Claude：（完整 HTML 代码）
效果：渐变背景 + 圆角卡片 + 现代输入框
【对话2】迭代四次
你：按钮颜色改成蓝色渐变 → 加忘记密码链接 → 加表单验证 → 加记住我
Claude：每次秒回修改后的完整代码
效果：功能完善的登录页面
【对话3】需求卡片页面
你：做一个需求看板页面，6 张卡片，两行三列，带优先级和状态标签
Claude：（完整 HTML 代码）
你：加统计栏 → 加更多操作按钮 → 加搜索和筛选
效果：可交互的需求卡片展示页面
🌟 如果这篇文章对你有帮助，请点赞👍 收藏⭐ 关注🔔
你的支持是我持续更新的最大动力！
💬 评论区聊聊：你试着跟 Claude 提了什么需求？它给你的结果怎么样？
📌 系列导航： 产品经理用 Claude 实现产品 · 系列目录
⏪ 上一篇： 第2篇：从原型到代码——理解"实现"到底是什么
⏩ 下一篇： 第4篇：搭建你的开发环境——产品经理的"新工位"
推荐阅读
AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念，把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起，为开发者提供从开发、训练到部署的一站式体验。
更多推荐
19
0- 0
已为社区贡献28条内容
所有评论(0)