人机交互 · 做产品的方法 / 第 N 讲

做产品的完整知识地图
水面上一句话,水面下一个组织

“一句话就能做产品”,那是冰山露出水面的一角。水面下是真实的复杂度——产品不是写出来的,是一个组织协同出来的。战略、用户、产品、设计、前端、后端、测试、运维、数据、财务、法务、运营、行政……过去分给一支队伍的十几门专业,在 vibe coding 里被压回一个人 + AI。这张图,把水面下的全貌摊开。

授课 邱懿武 浙江大学国际设计研究院 时间戳 2026-06-26 入门版(开餐厅比方) → 可视化图谱 → 方法篇 → ← 教学日志索引

底层判断

角色,可以拆给 AI;责任,拆不掉。
所有复杂度最终压回一个人——最终决策、最终判断、最终兜底、最终对外负责。

← 过去:一支队伍各守一门现在:一个人指挥全栈 →

第一层能力
会做 · Craft
亲手把每门做出来
→
第二层能力
会看 · Judgment
认得出每门的好坏
→
第三层能力
会指挥 · Direction
定标准、派活、兜底

AI 接管了“会做”。值钱的能力整体上移到会看与会指挥。可它要求的恰恰更多:你得对水面下的每一门,都懂到能下判断、能兜底的程度。这就是为什么要先看清这张全图。

一 · 一个人必须串起的链路

在指挥这十几门专业之前,有八件事没人替你做——它们把所有域串成一条能走通的链路。

串接链路 · 8 个动作

输入端把模糊的意图翻译进去,输出端把结果判断、兜底、对齐、推进出来。

这八个动作怎么练得更深、更稳,是另一讲的主题 → 《做好 vibe coding 的知识结构 · 方法篇》。本页专注水面下那张知识全图。

二 · 水面下 · 知识全景一图

十三门职能,分三大簇:想清楚做什么 · 把它做出来 · 算得过、守得住。点任一门跳到详解。

水面上 · 看起来很简单
“一句话就能做产品?”——Codex、Claude Code 让露出水面的那一角,几乎不要钱。
水 面真实复杂度在下面
A想清楚做什么· 方向与人 · 贴近“为什么 / 为谁”
1
战略与决策 · Strategy

方向对不对、先做什么、资源往哪押

方向赌对,下面十二门才有意义。

+
它管什么

为谁创造什么价值、靠什么活下去;众多事项里先做哪个、有限资源押在哪。

知识子领域
商业模式画布价值主张 Value Prop 市场定位与细分竞争分析差异化 OKR / 目标管理北极星指标优先级与取舍 产品路线图 Roadmap关键假设验证
“好”长什么样

一句话说清“给谁 · 解决什么 · 凭什么是你”;有一条想清楚的主路径和几个被验证的关键假设。

AI 接管 × 你兜底

AI 帮你扫竞品、列方案、做推演;赌哪个方向、押多少资源,你拍板——这一门最不可外包。

2
用户研究与体验洞察 · UX Research

为谁做、他怎么想、卡在哪

把“我以为用户要”换成“我看见用户怎么用”。

+
它管什么

真实用户是谁、在什么场景、想完成什么任务、在哪一步受阻。体验做的不是加功能,是减摩擦。

知识子领域
用户访谈问卷调研可用性测试 用户画像 Persona客户旅程地图 Journey Map 服务蓝图 Service Blueprint用户目标 JTBD 心智模型痛点与触点同理心地图 尼尔森十大可用性原则
“好”长什么样

画得出一条客户旅程,每个触点的情绪与卡点被看见;改的是关键摩擦,而不是凭空堆功能。

AI 接管 × 你兜底

AI 能帮你整理访谈、生成画像;但把作品放到真人面前看反应,是它给不了的最硬参照系。

3
市场与增长运营 · Growth & Ops

怎么让人知道、来、留下、愿意付

做得好,也得有人用、用得住。

+
它管什么

获客、转化、留存、变现的整条链路;品牌怎么被记住、内容怎么传播、社区怎么运营。

知识子领域
增长模型 AARRR获客渠道(SEO / 内容 / 社媒 / 投放) 转化漏斗留存与复购用户运营与社区 品牌与传播内容营销私域 / 用户分层 定价与变现活动运营
“好”长什么样

有清晰的获客 → 转化 → 留存路径,每一环都有可看的数字,知道钱和人从哪来、为什么留。

AI 接管 × 你兜底

AI 能批量产内容、写文案、做素材;增长策略与品牌调性的判断在你——别让平均值稀释了你的味道。

B把它做出来· 交付链 · 从贴近人到贴近机器
4
产品与交互设计 · Product / IxD

做什么、信息怎么组织、怎么流转

把发散的需求,收敛成“做什么、到哪为止、怎么操作”。

+
它管什么

需求那么多先做哪个;一个任务怎么一步步走通;每个界面在说什么、操作后给什么反馈、出错了怎么办。

知识子领域
产品定义需求优先级 RICE / MoSCoW PRD信息架构 IA导航与分类 用户流程 User Flow交互设计反馈与微交互 状态设计(空 / 错 / 加载 / 无权限)线框与原型
“好”长什么样

信息架构清晰、关键路径短;每一个状态都被设计过——包括空状态、错误态、边界 case。

AI 接管 × 你兜底

边界与异常态最容易被 AI 漏掉。你得主动点名:“空的时候显示什么?出错呢?没权限呢?”

5
视觉与设计系统 · Visual / UI

长什么样、第一眼的层级与气质

把“感觉好看”拆成可复用的规则:层级、节奏、系统。

+
它管什么

第一眼的观感、信息主次、品牌气质,怎么稳定做出来——而不是每页靠手感重造一遍。

知识子领域
版式与网格字体排印 Typography 色彩与对比间距与节奏视觉层级 设计系统(Token / 组件 / 规范)品牌 VI 动效图标与插画UX 文案
“好”长什么样

克制、统一、有清晰层级;背后有一套设计系统当“单一事实源”,颜色间距组件都从一处取。

AI 接管 × 你兜底

给 AI 一套设计 token / 参照图,远胜一堆形容词。你建的设计系统,就是喂给它的品味内核。

6
前端工程 · Frontend

怎么变成浏览器里能用的界面

贴近人与贴近机器的交界,各种屏上都不能塌。

+
它管什么

把设计变成真正能点、能输入、在手机和电脑上都好用的界面。

知识子领域
HTML 语义CSS 布局(Flex / Grid)响应式与断点 JavaScript框架 React / Vue组件化 状态管理路由构建与打包 前端性能可访问性 a11y跨端适配
“好”长什么样

响应式不塌、首屏快、语义清晰、可访问;状态可预期——点了有反馈、加载有提示、出错不白屏。

AI 接管 × 你兜底

AI 写前端最顺手,所以更要你定标准:性能、响应式、可访问这些它不会主动较真的,你来抽查验收。

7
后端工程 · Backend

数据怎么存、逻辑在哪算、谁能访问

界面背后看不见的那一半:数据、规则、权限。

+
它管什么

数据存在哪、怎么组织;业务规则在哪计算;谁有权读写、怎么验证身份。这层错了,前面再美也立不住。

知识子领域
系统架构API 设计 REST / GraphQL 数据建模数据库(关系型 / NoSQL) 鉴权与权限(认证 / 授权 / 会话)业务逻辑 缓存消息队列第三方集成错误处理与日志
“好”长什么样

数据模型清晰、接口契约稳定、鉴权严谨、出错可观测;改一处不会牵连一片。

AI 接管 × 你兜底

鉴权和数据安全不能“看起来对就行”。要追问“这真的拦住越权了吗?”——最该“分清我以为和验证过”的地方。

8
测试与质量 · Test / QA

怎么保证它真的对、改一处不塌一片

“能跑”和“可靠”之间,隔着一整门学科。

+
它管什么

怎么验证它在各种情况下都对;怎么让一次改动不悄悄弄坏别处;发布出问题怎么退回。

知识子领域
测试计划单元测试集成测试 端到端 E2E回归测试边界与异常用例 性能 / 压力测试兼容性测试验收标准 缺陷管理灰度 / 回退
“好”长什么样

关键路径有自动化覆盖;异常与边界被显式测过;发布有灰度、能回退。

AI 接管 × 你兜底

AI 爱报“测试通过”。你要问的是:测了哪些边界?没测什么?覆盖率不等于覆盖了重点。

9
运维与基础设施 · Infra / DevOps

怎么上线、怎么不挂、出问题怎么查

把“我电脑上能跑”,变成“别人能稳定访问”。

+
它管什么

怎么部署上线、绑定域名、保持不挂;出问题怎么定位;怎么备份、怎么扩容。

知识子领域
部署与托管域名与 DNSHTTPS / 证书 Nginx / 反向代理进程与服务 systemd容器化 CI / CD监控与告警日志 备份与容灾扩容密钥管理
“好”长什么样

稳定可访问、出问题能定位、有备份与回退;上线是数据闭环的起点,不是终点。

AI 接管 × 你兜底

最容易“跑通就完事”却最该较真:密钥别泄露、服务别误杀、上线要可回退。

C算得过 · 守得住· 支撑与边界 · 决定走不走得远
10
数据与分析 · Data & Analytics

怎么知道用户真实在干什么

让下一步建立在测量,而不是猜测上。

+
它管什么

用什么指标看健康度;用户真实行为是什么样;一个改动到底有没有用,怎么用数据回答。

知识子领域
埋点与事件设计指标体系北极星指标 漏斗分析留存分析用户行为分析 A / B 实验数据看板 / BI数据仓库 数据质量数据驱动决策
“好”长什么样

关键行为可量化、有看板、能用数据回答“改了到底有没有用”,而不是停在感觉。

AI 接管 × 你兜底

把“我以为有用”换成“数据显示”。埋点要在做功能时就想好,否则上线后无据可查。

11
财务与商业化 · Finance

算不算得过账、可不可持续

做得出来,还得养得活。

+
它管什么

钱怎么进、怎么出;每个用户 / 订单赚不赚钱;跑得久不久、撑不撑得到下一步。

知识子领域
预算与成本定价与毛利现金流 单位经济模型 LTV / CAC收入模型 账务与对账发票与税务成本核算财务合规
“好”长什么样

知道每个用户 / 订单的单位经济账赚不赚钱、跑得久不久;钱账清楚,不糊涂。

AI 接管 × 你兜底

AI 能算模型、跑测算;但商业可持续性的判断与取舍是你的——数字之外的赌注它替不了。

12
法务与风控 · Legal & Risk

守不守得住边界、会不会踩雷

最不能靠“看起来没事”的一门。

+
它管什么

用户数据合不合规、内容版权清不清晰、协议合同有没有坑、关键风险有没有预案。

知识子领域
用户协议与隐私政策数据合规(个人信息保护法 / GDPR) 知识产权与版权内容授权合同 内容风控与审核安全合规风险评估责任边界
“好”长什么样

用户数据合规、版权清晰、关键风险被识别并有预案;不把雷留给上线后的自己。

AI 接管 × 你兜底

AI 生成的内容、用到的素材,版权与合规要你把关。这条边界踩了,前面所有努力可能一夜归零。

13
人力 · 协作 · 项目管理 · People & PM

一个人怎么把事推进、不丢球

你既是 PM,也是全员;还是 AI 的总指挥。

+
它管什么

事情怎么有节奏地推进;什么自己做、什么外包给人或 AI;判断怎么不丢、经验怎么沉淀。

知识子领域
项目管理任务拆解与排期优先级管理 外包与协作角色分工沟通对齐 知识沉淀与文档自我管理复盘产品日志
“好”长什么样

事情有节奏地推进、判断被记录、经验沉淀成可复用资产——下一个项目起点更高。

AI 接管 × 你兜底

把判断显性化、留时间戳、每步登记进产品日志,是一个人也要有的项目管理——也正是这套教学专区的工作习惯。

三 · 横切关注 · 与为什么它难

有些事不属于某一门,而是贯穿全图;还有一些,是这件事天然就难的原因。

横切关注 Cross-cutting

贯穿十三门、从上到下都要在视野里。

  • 性能 · 前端、后端、基建每层都能拖慢体验
  • 可访问性 · 从设计层就开始,不是前端补丁
  • 安全与隐私 · 鉴权、越权、密钥、数据合规
  • 数据与度量 · 让每个决定回到真实行为上验证
  • 沟通与对齐 · 与人、与 AI 都要先复述目标
  • 时间与优先级 · 永远资源有限,先做最锋利的

现实中的挑战 Why it's hard

就算图看懂了,做起来仍难——难在这些地方。

  • 需求经常变更
  • 信息分散割裂
  • 依赖多方协作
  • 上下游不确定
  • 标准难以统一
  • 时间压力巨大
  • 问题难以复盘

一句话收束 · 责任,最终压回一个人

最终决策最终判断最终兜底最终对外负责

角色可以拆给 AI——Planner、Coder、Test、Review、Ops 各司其职;但这是“三省六部式的幻觉”:看起来分工协作,实际责任内聚。

AI 能执行,但无法替你负责。最后拍板的人,永远是你。

所以这张图不是用来吓人,是给你一张全貌:知道水面下有哪十三门、每门的好坏标准,你才指挥得动 AI、兜得住底。配套的方法篇,讲怎么把它一圈圈做好 → 做好 vibe coding 的知识结构。