1
00:00:00,100 --> 00:00:06,432
本内容改编自小山学堂《学 AI 产品，从入门到精通》，为二次演绎配音版。

2
00:00:06,382 --> 00:00:09,170
交互工程这一章走到收尾。

3
00:00:09,170 --> 00:00:16,382
前面七节教的是识别好交互，这一集讲后半段，怎么把识别出来的要求翻译给模型听。

4
00:00:16,382 --> 00:00:18,762
先说本集解决什么问题。

5
00:00:18,762 --> 00:00:24,098
识别出来问题不难，难的是把问题说成模型能执行的条款。

6
00:00:24,098 --> 00:00:35,156
很多人在这里掉链子，跟模型提需求时列了一堆功能，要上传、要表单、要导出，每一项它都做了，合起来却谁的问题都没解决。

7
00:00:35,156 --> 00:00:40,420
这一集给你两套翻译方法，一套讲要什么，一套讲别糊弄。

8
00:00:40,420 --> 00:00:43,257
再说为什么产品经理要关心。

9
00:00:43,257 --> 00:00:47,307
因为需求描述的颗粒度，直接决定产出的档次。

10
00:00:47,307 --> 00:00:53,365
你写功能清单，它交回一个柜台；你写人物和场景，它交回一个工具。

11
00:00:53,365 --> 00:00:58,401
同样的模型，同样的时间，差的就是你开口那几句话。

12
00:00:58,401 --> 00:01:00,228
顺便交代结构。

13
00:01:00,228 --> 00:01:13,605
第一节讲怎么用目标描述需求，核心是人物模型和场景；第二节讲怎么把状态和边界写死，核心是五态和边界自查；最后一节交付上线前的第二张清单，十四项。

14
00:01:13,605 --> 00:01:15,204
还有一句提醒。

15
00:01:15,204 --> 00:01:19,951
这一集的两个方法不是理论，是可以直接复制粘贴的模板。

16
00:01:19,951 --> 00:01:23,846
听完至少用一次，你会明显感觉到差别。

17
00:01:24,004 --> 00:01:26,490
先看一个反直觉的判断。

18
00:01:26,440 --> 00:01:33,291
跟模型提需求，多数人的第一反应是列功能，要有上传、要有表单、要有导出。

19
00:01:33,291 --> 00:01:40,646
清单看着专业，其实把最重要的信息漏掉了，这些功能凑在一起，到底要帮谁完成什么。

20
00:01:40,646 --> 00:01:49,048
有一本交互设计经典把这件事定成方法论的地基，交互设计先研究用户的目标，再从目标推导功能。

21
00:01:49,048 --> 00:01:56,944
作者强调目标和任务是两种东西，目标是对最终状态的预期，任务只是达成目标的中间步骤。

22
00:01:56,944 --> 00:01:59,060
这个区分为什么重要。

23
00:01:59,060 --> 00:02:07,834
目标几十年不变，比如把报销交出去、让老板知道我干完了；任务隔几年就换一茬，从贴发票到拍照识别。

24
00:02:07,834 --> 00:02:16,091
你盯着任务提需求，模型给你的是旧任务的电子版；你盯着目标提需求，它才有机会把任务本身省掉。

25
00:02:16,091 --> 00:02:19,384
怎么分辨目标和任务，判据就一条。

26
00:02:19,384 --> 00:02:26,836
追问一句，做这个是为了什么，还答得上来的是任务，答不上来的是目标，因为目标本身就是答案。

27
00:02:26,836 --> 00:02:28,843
举个素材里的例子。

28
00:02:28,843 --> 00:02:34,529
要有上传按钮，追问为什么，为了把发票交给系统，这是任务。

29
00:02:34,529 --> 00:02:38,891
再追问为什么，为了把报销交出去，这还是任务。

30
00:02:38,891 --> 00:02:44,565
再追问，为了月底不用惦记这件事，到这里答不上来了，这就是目标。

31
00:02:44,565 --> 00:02:50,250
目标导向设计的第一步，就是先问为谁、为什么，再问做什么。

32
00:02:50,404 --> 00:02:58,767
素材做了一场对决，同一个报销工具，左边把功能清单喂给模型，右边把人物和场景喂给模型。

33
00:02:58,717 --> 00:03:02,046
左边那份提示词是逐项列功能。

34
00:03:02,046 --> 00:03:13,068
做一个报销页面，要有发票上传、金额输入框、类别下拉、备注、审批人选择、提交按钮、历史记录表格、筛选、导出表格。

35
00:03:13,068 --> 00:03:19,703
产出是什么样呢，一个标准的表单页，每个字段都摆好了，下面一张历史记录表。

36
00:03:19,703 --> 00:03:24,979
能用，但它本质上是一张电子表格，用户该填的还得填。

37
00:03:24,979 --> 00:03:28,429
右边那份提示词一个控件名都没提。

38
00:03:28,429 --> 00:03:37,275
它写的是，用户是销售小美，每月底攒一叠出租车发票，目标是在三分钟内交完报销、不打断手头工作。

39
00:03:37,275 --> 00:03:47,130
场景是，她拖入发票照片，系统自动识别金额和类别，她扫一眼确认，点提交，看到已提交、预计三天到账。

40
00:03:47,130 --> 00:03:49,041
产出完全不一样。

41
00:03:49,041 --> 00:04:00,544
界面变成了三步，拖入发票、确认、完成，上面写着把发票照片拖到这里，支持批量，金额和类别自动识别，提交后还能在五分钟内撤回。

42
00:04:00,544 --> 00:04:10,965
请留意一个细节，右边这份提示词里一个控件名都没提，但产出里的拖放、自动识别、撤回，反而都是左边清单里没有的。

43
00:04:10,965 --> 00:04:17,671
这说明一件事，功能是从目标里长出来的，你把土壤给够，模型自己会结果。

44
00:04:17,671 --> 00:04:23,489
素材还留了一道题，要做一个记账应用的记一笔页面，哪句需求最好。

45
00:04:23,489 --> 00:04:41,353
列控件清单的那句最差，说参考主流应用、好看一点的那句次差，说页面分三个区块的那句是设计者视角，最好的是这一句，用户是上班族，目标是排队买咖啡的间隙五秒记完一笔，常记的就那几类，最好两下点完。

46
00:04:41,353 --> 00:04:46,413
差别在哪里，只有最后一句把人和目标交代清楚了。

47
00:04:46,564 --> 00:04:48,304
目标得有主人。

48
00:04:48,254 --> 00:04:58,891
素材给的工具叫人物模型，从真实用户里提炼出一个有名字、有职业、有目标的具体人，设计时所有取舍都拿他当裁判。

49
00:04:58,891 --> 00:05:04,516
那位作者反复敲打的一点是，每个界面只伺候一位首要人物。

50
00:05:04,516 --> 00:05:10,863
想讨好所有人，界面就会变成什么都摆一点的柜台，谁来了都得先找半天。

51
00:05:10,863 --> 00:05:12,954
素材里有三个角色。

52
00:05:12,954 --> 00:05:20,081
小美是销售，每月报销一次，目标是三分钟交完、别打断我跟单，她是首要人物。

53
00:05:20,081 --> 00:05:28,194
老周是财务，每天审几十单，目标是一眼看出哪单有问题、批量处理没问题的，他是次要人物。

54
00:05:28,194 --> 00:05:34,889
大刘是总监，常年出差，目标是多币种发票别让我自己换算，也是次要人物。

55
00:05:34,889 --> 00:05:40,826
次要人物的需求可以做，但只能在不挤占首要人物的前提下塞进角落。

56
00:05:40,826 --> 00:05:46,247
素材还做了一个贪多实验，演给你看每个人都照顾一点的下场。

57
00:05:46,247 --> 00:05:51,163
小美的报销首页本来很干净，拖入、确认、提交。

58
00:05:51,163 --> 00:05:55,262
每点一次按钮，就往里塞一位新用户的需求。

59
00:05:55,262 --> 00:06:17,585
先是老周要的审批工作台，待审二十三单、异常两单、批量通过、驳回原因库；再是大刘要的汇率中心，美元七点一八、欧元七点八二、日元零点零四八、还有历史汇率曲线；再是经理要的团队报表，本月部门报销四万多、同比涨百分之十八；再是行政要的发票归档打印。

60
00:06:17,585 --> 00:06:24,232
塞到第四位的时候，整页已经面目全非，小美的三分钟目标被埋在了最底下。

61
00:06:24,232 --> 00:06:26,576
这个实验的结论很直接。

62
00:06:26,576 --> 00:06:33,282
一个界面只伺候一位首要人物，谁都想照顾的界面，最后谁都用不顺。

63
00:06:33,412 --> 00:06:38,061
人物和目标就位之后，最后一件工具是情境场景。

64
00:06:38,011 --> 00:06:44,562
不谈技术、不点名控件，像讲故事一样写这个人从头到尾怎么达成目标。

65
00:06:44,562 --> 00:06:50,247
场景一写，哪些功能必须有、哪些纯属想象，自己就浮出来了。

66
00:06:50,247 --> 00:06:56,581
这也正是喂给模型最好的格式，它读得懂故事，也补得出故事里缺的零件。

67
00:06:56,581 --> 00:07:01,088
素材里有个场景改写器，把四条功能语翻成场景语。

68
00:07:01,088 --> 00:07:05,583
第一条，要有会议室预订功能，支持按时间筛选。

69
00:07:05,583 --> 00:07:09,537
第二条，要有日历视图和列表视图切换。

70
00:07:09,537 --> 00:07:12,951
第三条，要有会议提醒推送设置。

71
00:07:12,951 --> 00:07:16,545
第四条，要有取消预订和改期功能。

72
00:07:16,545 --> 00:07:19,706
四条翻完，拼出来的是这样一段话。

73
00:07:19,706 --> 00:07:28,191
用户是行政专员阿哲，每周要给三个团队订会议室，目标是十秒内订到一间能用的，订错了能马上改。

74
00:07:28,191 --> 00:07:43,856
走一遍场景，他说出时间和人数，系统只给他看当下订得到的房间；订完顺手看一眼这周的安排；开会前收到一条刚刚好的提醒；同事临时改期，他在原记录上一步改完，不用取消重订。

75
00:07:43,856 --> 00:07:49,361
界面的状态和控件选择你来定，以帮阿哲达成十秒目标为准。

76
00:07:49,361 --> 00:07:53,808
留意每条翻译的共同点，主语从系统换成了人。

77
00:07:53,808 --> 00:08:00,791
这就是目标导向提需求的核心动作，你不是在描述一个系统，你是在讲一个人的一天。

78
00:08:00,791 --> 00:08:03,808
素材还给了一个可以背下来的模板。

79
00:08:03,808 --> 00:08:06,296
用户是谁，目标是什么。

80
00:08:06,296 --> 00:08:09,000
走一遍场景，怎么怎么样。

81
00:08:09,000 --> 00:08:12,738
界面细节你来定，以帮用户达成目标为准。

82
00:08:12,738 --> 00:08:17,282
这三句话，比一份二十行的功能清单管用得多。

83
00:08:17,428 --> 00:08:22,930
上一节把要什么翻译成了目标和场景，这一节补上别糊弄的部分。

84
00:08:22,880 --> 00:08:29,118
规律很简单，模型只认真写你提到的状态，没提到的一律按晴天想象。

85
00:08:29,118 --> 00:08:37,015
你说做一个订单列表页，它脑补的画面永远是网络通畅、数据正好一屏、用户不会点错。

86
00:08:37,015 --> 00:08:40,909
它不是偷懒，是你给的描述里只有晴天。

87
00:08:40,909 --> 00:08:43,734
素材给了一个状态机补全器。

88
00:08:43,734 --> 00:08:48,650
一段典型的晴天版提示词，右边五个格子全是问号。

89
00:08:48,650 --> 00:08:55,236
哪五个状态，加载中、空列表、加载失败、弱网超时、操作成功。

90
00:08:55,236 --> 00:09:00,044
你点一个状态芯片，就往提示词里写进一条对应规格。

91
00:09:00,044 --> 00:09:07,291
不写会怎样，自由发挥这四个字在交互上的意思通常是，白屏、弹窗、没反应。

92
00:09:07,291 --> 00:09:10,224
同一个空列表，两种命运。

93
00:09:10,224 --> 00:09:25,324
左边提示词没提空态，产出的是一行灰字暂无数据；右边多写了一句空态规格，产出的变成你的订单会出现在这里，下第一单后物流和发票都在这页管，还配了一个去逛逛的按钮。

94
00:09:25,324 --> 00:09:28,497
多写一句，留住的可能是新用户。

95
00:09:28,497 --> 00:09:32,764
状态列全之后，还有一批藏得更深的边界情况。

96
00:09:32,764 --> 00:09:38,509
它们共同的特点是演示时永远碰不到，上线第一周全都来报到。

97
00:09:38,509 --> 00:09:43,533
素材列了六种，每一个都要在提示词里补一句明确要求。

98
00:09:43,533 --> 00:09:53,028
列表为空时、网络失败时、重复提交时、权限不足时，每个时后面接一句具体要求，别让模型自己猜。

99
00:09:53,164 --> 00:09:57,489
状态和边界要写到多细，取决于界面的姿态。

100
00:09:57,439 --> 00:10:02,907
有一本交互设计经典把产品分成几种姿态，最常用的两种。

101
00:10:02,907 --> 00:10:05,107
第一种，主权姿态。

102
00:10:05,107 --> 00:10:10,251
用户整天开着的主力工具，比如开发工具、后台、表格。

103
00:10:10,251 --> 00:10:13,232
屏幕归它独占，用户是熟手。

104
00:10:13,232 --> 00:10:21,753
这种界面的状态可以密，骨架屏、行内校验、批量操作的进度、快捷键提示，都值得写进规格。

105
00:10:21,753 --> 00:10:23,941
第二种，临时姿态。

106
00:10:23,941 --> 00:10:28,544
用完就走的小工具，比如扫码、计算器、请假申请。

107
00:10:28,544 --> 00:10:31,056
用户每次来都像第一次来。

108
00:10:31,056 --> 00:10:38,785
这种界面的状态要少而醒目，一屏一件事，反馈大而直白，别摆密密麻麻的仪表盘。

109
00:10:38,785 --> 00:10:49,987
姿态报错的典型翻车是，给用完就走的请假页配上主权级的筛选器和统计图，或者给整天盯着的监控后台配上大字报式的单屏流程。

110
00:10:49,987 --> 00:10:54,674
记住一句话，密度跟着姿态走，姿态跟着使用频率走。

111
00:10:54,674 --> 00:11:01,753
讲完翻译，最后交付这一章的第二张清单，交互验收清单，十四项，分六组。

112
00:11:01,753 --> 00:11:10,167
状态三项，防错与可逆三项，流程两项，习惯用法与控件三项，文案两项，体贴一项。

113
00:11:10,167 --> 00:11:12,426
其中体贴那一项有出处。

114
00:11:12,426 --> 00:11:21,657
那本交互设计经典把好软件比作体贴的人，列了一整张体贴清单，记性好是里面最省事也最见效的一条。

115
00:11:21,657 --> 00:11:28,689
用户选过一次的城市、填过一次的发票抬头，第二次还要重填，就是软件在装失忆。

116
00:11:28,689 --> 00:11:30,768
清单的用法很关键。

117
00:11:30,768 --> 00:11:41,285
审美的验收看截图就行，交互的验收必须上手点，把网络调慢、把列表清空、把危险按钮按下去、把流程从头走到尾。

118
00:11:41,285 --> 00:11:45,383
没过哪一项，就把那一项的原话发给模型。

119
00:11:45,383 --> 00:11:59,169
素材里做了个对比，说交互不太好用、再优化一下，模型改不准；说删除没有撤销、只有确认弹窗，改成立即执行加五秒撤销提示条加回收站保留三十天，它改得准。

120
00:11:59,169 --> 00:12:03,015
清单当打回话术用，比再优化一下快十倍。

121
00:12:03,015 --> 00:12:05,996
清单是冷的，演练是热的。

122
00:12:05,996 --> 00:12:14,277
素材里有个云笔记应用，按模型一把梭的真实水平做的，五处交互事故分别踩了这一章五节的雷。

123
00:12:14,277 --> 00:12:21,453
反馈方式、按钮位置、流程步数、控件长相、按钮文案，各有一处出了事。

124
00:12:21,453 --> 00:12:26,417
第一处，清空全部紧挨着全选，危险操作没拉开距离。

125
00:12:26,417 --> 00:12:31,934
第二处，新建笔记是四步向导，第一步选笔记类型，明显能砍。

126
00:12:31,934 --> 00:12:37,066
第三处，双击分享本页，链接的习惯用法被改成双击。

127
00:12:37,066 --> 00:12:45,515
第四处，操作已完成、您的请求已被系统处理，这是典型的机器人文案，没说什么操作，也没说成没成。

128
00:12:45,515 --> 00:12:49,494
第五处，反馈用了一个必须点确定的弹窗。

129
00:12:49,494 --> 00:12:55,011
拿清单当地图，找到就点，这是这一章验收姿势的完整演示。

130
00:12:55,011 --> 00:12:58,268
顺便把这一章九节串成三句话。

131
00:12:58,268 --> 00:12:59,975
第一句，识别。

132
00:12:59,975 --> 00:13:08,725
前五节讲了四个抓手，状态三件套齐不齐、危险操作可逆吗、流程还能砍一步吗、有没有发明奇怪交互。

133
00:13:08,725 --> 00:13:12,282
看一个产品好不好用，按这个顺序上手点。

134
00:13:12,282 --> 00:13:14,001
第二句，细节。

135
00:13:14,001 --> 00:13:25,852
第六到第七节抠界面零件，互斥用单选钮、多选用复选框、立即生效用开关、超一屏才用下拉；按钮用动词说清后果，标签说用户的话。

136
00:13:25,852 --> 00:13:27,775
第三句，翻译。

137
00:13:27,775 --> 00:13:36,801
第八到第九节把要求写给模型，需求用人物加目标加场景讲，规格把五态列全、边界说死、防错写明。

138
00:13:36,801 --> 00:13:39,386
到这里三张清单就齐了。

139
00:13:39,386 --> 00:13:43,544
审美管好看，交互管好用，心理学管感受。

140
00:13:43,544 --> 00:13:46,958
上线前按顺序过，谁也不替谁。

141
00:13:47,092 --> 00:13:51,777
想把这一章往外延伸，素材给了几本书和几份框架。

142
00:13:51,727 --> 00:14:02,965
最该读的是那本交互设计经典的母本，这次别只读视觉设计那一章，目标导向的方法、体贴清单、编配与错误处理都值得完整过一遍。

143
00:14:02,965 --> 00:14:09,792
还有一本很薄的可用性经典，核心就是书名那句话，别让我思考，两小时能读完。

144
00:14:09,792 --> 00:14:20,225
另外一本把单个交互拆成触发、规则、反馈、循环四段，这一集讲的状态与反馈，在那本书里能找到更细的刻度。

145
00:14:20,225 --> 00:14:31,583
框架类可以看一位可用性研究者的十条启发式，用了四十年还没过时；还有一家大厂的界面规范里的模式章节，是习惯用法的标准答案库。

146
00:14:31,732 --> 00:14:36,008
最后给你一份可以马上用的判断清单，一共五条。

147
00:14:35,958 --> 00:14:40,081
第一条，用目标描述需求，别用功能清单。

148
00:14:40,081 --> 00:14:45,766
追问一句做这个是为了什么，还答得上来的是任务，答不上来的是目标。

149
00:14:45,766 --> 00:14:50,766
盯着目标提需求，模型才有机会把多余的任务整个省掉。

150
00:14:50,766 --> 00:14:54,564
第二条，一个界面只伺候一位首要人物。

151
00:14:54,564 --> 00:15:00,345
次要人物的需求塞进角落，别做贪多实验里那个什么都摆一点的柜台。

152
00:15:00,345 --> 00:15:04,047
第三条，喂模型的最佳格式是场景。

153
00:15:04,047 --> 00:15:11,992
人物加目标加从头到尾走一遍的故事，控件和状态让它自己推，你只验收目标达没达成。

154
00:15:11,992 --> 00:15:18,543
模板就三句，用户是谁，目标是什么，走一遍场景怎么怎么样，界面细节你来定。

155
00:15:18,543 --> 00:15:21,908
第四条，状态列全，边界说死。

156
00:15:21,908 --> 00:15:34,336
加载、空、错误、弱网、成功，五态点名列全；列表为空时、网络失败时、重复提交时、权限不足时，每个时后面接一句明确要求。

157
00:15:34,336 --> 00:15:38,098
没点名的状态，就是白屏和弹窗的温床。

158
00:15:38,098 --> 00:15:41,379
第五条，先报姿态再谈密度。

159
00:15:41,379 --> 00:15:46,668
主权姿态的界面状态可以密，临时姿态的界面要少而醒目。

160
00:15:46,668 --> 00:15:52,148
写提示词时先报姿态，模型对状态密度的拿捏会准很多。

161
00:15:52,148 --> 00:15:57,533
这五条合起来是两段提示词，目标场景打头，交互规格殿后。

162
00:15:57,533 --> 00:16:01,511
这两段拼起来，就是喂给模型的完整需求。

163
00:16:01,511 --> 00:16:07,269
交互工程这一章到这儿收尾，下一章我们聊产品手感之外的东西。