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

2
00:00:06,382 --> 00:00:11,875
上一集我们立住了交互工程的地基，交互的病比审美的病更隐蔽。

3
00:00:11,875 --> 00:00:17,584
这一集往下拆三个抓手，防错与可逆、流程克制、习惯用法。

4
00:00:17,584 --> 00:00:19,963
先说本集解决什么问题。

5
00:00:19,963 --> 00:00:25,528
模型生成的应用有一个通病，它默认把功能做完就算交付。

6
00:00:25,528 --> 00:00:33,076
但用户真正会出问题的地方，不是功能有没有，而是敢不敢点、走不走得完、看不看得懂。

7
00:00:33,076 --> 00:00:36,814
这一集给你三把尺子，专门量这三件事。

8
00:00:36,814 --> 00:00:39,651
再说为什么产品经理要关心。

9
00:00:39,651 --> 00:00:45,144
因为这三类问题有一个共同特征，它们在演示里完全看不出来。

10
00:00:45,144 --> 00:00:53,737
演示时数据现成、路径笔直、每一步都顺；而真实的用户会手滑、会走神、会第一次打开。

11
00:00:53,737 --> 00:00:58,437
你替用户把这些时刻想一遍，成本很低，收益是留存。

12
00:00:58,437 --> 00:01:00,264
顺便交代结构。

13
00:01:00,264 --> 00:01:13,533
第一节讲怎么让用户敢点，核心是防错和可逆；第二节讲怎么砍掉多余的步骤，核心是负担；第三节讲为什么不能让模型发明新交互，核心是习惯用法和能供性。

14
00:01:13,533 --> 00:01:16,442
还有一句我特别想放在开头。

15
00:01:16,442 --> 00:01:23,197
这三节的共同立场是，不要指望用户小心一点，要设计得让用户不用小心。

16
00:01:23,332 --> 00:01:24,928
先立一个立场。

17
00:01:24,878 --> 00:01:33,195
有一本交互设计经典在第 15 章讲得很清楚，从用户的心理模型看，根本没有错误操作这回事。

18
00:01:33,195 --> 00:01:41,669
人用软件就是在探索，点点这个、试试那个，走进死胡同再退出来，这是学会一个工具的正常方式。

19
00:01:41,669 --> 00:01:48,159
把探索标记成错误、动不动弹框拦截的软件，用户会越用越缩手缩脚。

20
00:01:48,159 --> 00:01:51,284
作者给撤销打的比方特别形象。

21
00:01:51,284 --> 00:01:57,498
人进山洞探险，洞口挂一条随时能爬回地面的绳梯，胆子就大得多。

22
00:01:57,498 --> 00:02:03,832
撤销就是那条绳梯，它救的次数不多，但它挂在那里，用户才敢往深处走。

23
00:02:03,832 --> 00:02:08,087
所以他的主张可以压成四个字，做，不要问。

24
00:02:08,087 --> 00:02:13,472
与其用弹窗要用户确认，不如先自信地执行，再备好撤销。

25
00:02:13,472 --> 00:02:18,628
这句话听起来激进，但它其实是在纠正一个很常见的偷懒。

26
00:02:18,628 --> 00:02:24,373
弹窗是最省事的设计，不用想清楚后果，把责任推给用户就行。

27
00:02:24,373 --> 00:02:31,429
而撤销要求设计者真正想明白，这个操作会造成什么后果，怎么把它还原回去。

28
00:02:31,429 --> 00:02:36,453
前者的成本在用户身上，后者的成本在你自己身上。

29
00:02:36,604 --> 00:02:39,594
与其事后报错，先让错误发生不了。

30
00:02:39,544 --> 00:02:45,217
素材给了三板斧，三样都很便宜，模型也都会做，前提是你提了。

31
00:02:45,217 --> 00:02:47,790
第一板斧，禁用不可用项。

32
00:02:47,790 --> 00:02:51,828
条件不满足的按钮置灰，旁边说明缺什么。

33
00:02:51,828 --> 00:02:55,915
让用户点一下再报错，等于设好陷阱看人踩。

34
00:02:55,915 --> 00:02:58,751
第二板斧，危险操作拉开距离。

35
00:02:58,751 --> 00:03:00,758
清空别挨着保存。

36
00:03:00,758 --> 00:03:08,126
作者的比方很毒，无害的功能和弹射座椅拉杆排在一起，像坐在打开的烤肉炉边上。

37
00:03:08,126 --> 00:03:10,674
第三板斧，默认值兜底。

38
00:03:10,674 --> 00:03:14,052
默认选项永远是最安全的那个。

39
00:03:14,052 --> 00:03:19,172
群发邮件默认发所有人，等于把手滑的代价预设到最大。

40
00:03:19,172 --> 00:03:22,862
三板斧防住大半，剩下的交给可逆性。

41
00:03:22,862 --> 00:03:25,879
那确认弹窗到底顶不顶用。

42
00:03:25,879 --> 00:03:32,585
素材做了一个实验，左边用确认弹窗，右边用立即删除加可撤销提示条。

43
00:03:32,585 --> 00:03:44,364
结果很清楚，弹窗只负责事前拦一下，拦过之后两手一摊，删掉的救不回来；而立即删除加五秒可撤销，全程零弹窗，后悔窗口敞开。

44
00:03:44,364 --> 00:03:48,763
你可能不服，弹窗好歹拦了一下，怎么就最弱。

45
00:03:48,763 --> 00:03:51,047
作者的解释是习惯化。

46
00:03:51,047 --> 00:03:59,592
在常规位置反复出现的确认框，用户很快就看也不看地点掉，等真正的危险到来，手指比脑子快。

47
00:03:59,592 --> 00:04:07,237
素材里那个实验就是让你连点八个弹窗，看看能拦住第几个，结论是后面几个基本拦不住。

48
00:04:07,237 --> 00:04:08,991
这就是狼来了。

49
00:04:08,991 --> 00:04:12,814
所以四道防线从弱到强排下来是这样的。

50
00:04:12,814 --> 00:04:23,823
最弱是删除前弹确认框；往上是危险操作和常用操作拉开距离；再往上是禁用不可用项并配说明；最强是立即执行加可撤销。

51
00:04:23,823 --> 00:04:38,018
给模型提需求的时候，一句话的差别就很大，说删除要有确认，产出的是弹窗；说删除立即生效、弹出可撤销的提示条、保留五秒，产出的是完全另一个档次的东西。

52
00:04:38,164 --> 00:04:40,193
接下来看整条路。

53
00:04:40,143 --> 00:04:46,994
用户从进来到办完事，中间有多少步是在伺候软件，而不是在办他自己的事。

54
00:04:46,994 --> 00:04:52,222
有一本交互设计经典在第 12 章把用户的操作分成两类。

55
00:04:52,222 --> 00:04:57,511
一类直接推进目标，比如开车上班这件事里的踩油门、打方向。

56
00:04:57,511 --> 00:05:04,963
另一类在伺候工具，开车库门、热车、等红灯，这些动作一步也没让你离办公室更近。

57
00:05:04,963 --> 00:05:08,532
第二类，作者给它起了个名字，叫负担。

58
00:05:08,532 --> 00:05:10,780
软件里的负担长这样。

59
00:05:10,780 --> 00:05:17,390
你想发一条动态，先登录、找入口、点掉引导气泡、翻过一个升级弹窗。

60
00:05:17,390 --> 00:05:20,612
发动态是目标，前面四步都是税。

61
00:05:20,612 --> 00:05:22,991
这笔税可以拆成四种。

62
00:05:22,991 --> 00:05:29,181
第一，认知税，琢磨这个产品怎么用，按钮是什么意思、结构怎么组织。

63
00:05:29,181 --> 00:05:34,686
第二，记忆税，背下密码、命令、东西放在哪一层菜单里。

64
00:05:34,686 --> 00:05:41,477
第三，视觉税，在屏幕上找，眼睛从哪开始看、哪块能点、哪块是装饰。

65
00:05:41,477 --> 00:05:47,883
第四，体力税，点击、移动、切输入法、一层层导航过去的手上功夫。

66
00:05:47,883 --> 00:05:50,624
判据只有一条，特别好记。

67
00:05:50,624 --> 00:05:54,326
把这一步删掉，用户的目标还能达成吗。

68
00:05:54,326 --> 00:05:56,441
能，它就是负担。

69
00:05:56,441 --> 00:06:04,698
带着这条判据看模型的产出，你会发现一个规律，模型爱交完整的流程，而完整恰恰是它的病。

70
00:06:04,698 --> 00:06:14,434
让它生成一个注册页，它大概率给你一个五步向导，邮箱、手机验证、完善资料、兴趣标签、确认提交，一步不少。

71
00:06:14,434 --> 00:06:24,542
它在训练数据里见过太多规范的注册流程，就把最全的那套端给你，每一步单看都有道理，合起来是一条收税走廊。

72
00:06:24,542 --> 00:06:34,362
作者对向导这种形式本来就没好话，向导把过程写死成一问一答，用户很快学会只点下一步，脑子全程没参与。

73
00:06:34,362 --> 00:06:41,116
他给的替代方案是把活直接干完，用合理的默认值兜底，事后允许用户改。

74
00:06:41,116 --> 00:06:46,213
放到现在，这条要由你写进需求里，它自己想不起来。

75
00:06:46,348 --> 00:06:48,209
砍之前先认脸。

76
00:06:48,159 --> 00:06:52,173
有三个负担源在模型产出里出现得最密。

77
00:06:52,173 --> 00:06:54,385
第一个，导航负担。

78
00:06:54,385 --> 00:06:58,507
病征是换页、换窗口、翻菜单找功能。

79
00:06:58,507 --> 00:07:03,495
用户在赶路，路上没有风景，走的每一步都在扣耐心。

80
00:07:03,495 --> 00:07:10,707
典型病是一个功能一个新页面，改个昵称也要跳三层，常用工具埋在二级菜单里。

81
00:07:10,707 --> 00:07:17,401
给模型的话术是，常用操作就地完成，别新开页面，导航层级最多两层。

82
00:07:17,401 --> 00:07:19,565
第二个，打断负担。

83
00:07:19,565 --> 00:07:27,461
病征是确认框、成功提示对话框、无关紧要的报告，把人从做事的状态里拽出来伺候软件。

84
00:07:27,461 --> 00:07:33,447
典型病是每次保存都弹保存成功，点掉确定才能继续干活。

85
00:07:33,447 --> 00:07:39,180
话术是，反馈用页面内的轻提示，对话框只留给不可逆的大事。

86
00:07:39,180 --> 00:07:41,740
第三个，重复输入负担。

87
00:07:41,740 --> 00:07:49,973
病征是让用户报一遍软件已经知道的事，重复登录、重复填资料、每次都要重新设置一遍偏好。

88
00:07:49,973 --> 00:07:55,250
典型病是表单提交失败，回来一看填的内容全被清空了。

89
00:07:55,250 --> 00:08:02,257
话术是，填过的信息记住，出错保留已填内容，能推断的默认值直接给。

90
00:08:02,257 --> 00:08:07,293
素材里有个五步注册的流程审计，右边挂着一只漏斗。

91
00:08:07,293 --> 00:08:14,709
按每一步百分之七十八的通过率算，一千个人进门，走完五步只剩二百八十九个。

92
00:08:14,709 --> 00:08:18,892
你把没在推进目标的步骤砍掉，漏斗就往上走。

93
00:08:18,892 --> 00:08:23,291
砍对了它涨，砍错了它会告诉你为什么砍不得。

94
00:08:23,291 --> 00:08:31,536
注册只是最好算的例子，下单、发布、报名、提交工单，凡是有流程的地方都有这只漏斗。

95
00:08:31,536 --> 00:08:34,240
步骤和留存是反着走的。

96
00:08:34,240 --> 00:08:38,110
为什么砍步骤这么有效，有一层理论撑腰。

97
00:08:38,110 --> 00:08:47,233
作者在讲流的那一章引了一位心理学家的概念，人全神贯注做事时会进入一种高产出的状态，察觉不到时间。

98
00:08:47,233 --> 00:08:56,175
交互设计的任务就是保住这个状态，好的交互应该透明，用户直接面对自己要办的事，感觉不到软件的存在。

99
00:08:56,175 --> 00:08:58,327
而流的天敌是打断。

100
00:08:58,327 --> 00:09:06,007
每多一步、每弹一个框、每换一个页面，用户都要从状态里出来一次，回去要重新酝酿。

101
00:09:06,007 --> 00:09:16,031
这也解释了漏斗为什么掉人，掉的多半就发生在被打断的那一下，用户抬头一想我为什么要填这个，就把页面关了。

102
00:09:16,180 --> 00:09:21,130
接下来讲第三个抓手，也是我觉得最容易被忽略的一个。

103
00:09:21,080 --> 00:09:24,673
你会用的交互，没有一个是天生就会的。

104
00:09:24,673 --> 00:09:28,652
有一本交互设计经典把界面分成三种路数。

105
00:09:28,652 --> 00:09:34,625
按程序内部结构长的，靠画得像现实物件的，还有靠学的。

106
00:09:34,625 --> 00:09:39,625
作者的立场很干脆，现代图形界面基本靠第三种撑着。

107
00:09:39,625 --> 00:09:46,921
窗口、滚动条、下拉菜单、超链接，没有一个靠直觉，全是用户一个个学来的。

108
00:09:46,921 --> 00:09:48,904
他举的例子是鼠标。

109
00:09:48,904 --> 00:09:55,743
没有人看一眼鼠标就知道它控制屏幕上的光标，得有人教，或者自己摸索半分钟。

110
00:09:55,743 --> 00:09:58,495
但学会之后一辈子忘不掉。

111
00:09:58,495 --> 00:10:05,334
滚动、双击、拖放、下拉刷新、左滑删除，都是这样，学一次，到处用。

112
00:10:05,334 --> 00:10:12,834
作者有一句话说得特别准，所有的习惯用法都需要学习，好的习惯用法只需要学习一次。

113
00:10:12,834 --> 00:10:16,428
这条对做产品的人来说是天大的便宜。

114
00:10:16,428 --> 00:10:23,219
全世界的产品已经替你把用户教好了，你直接用现成的习惯用法，学习成本为零。

115
00:10:23,219 --> 00:10:26,104
顺手说一句另一条路，隐喻。

116
00:10:26,104 --> 00:10:33,736
图形界面刚火起来那几年，功劳被记在画得像头上，桌面画成桌面、文件夹画成文件夹。

117
00:10:33,736 --> 00:10:42,786
作者不买账，隐喻界面让用户在图标和功能之间连线猜谜，简单功能还能猜，稍微抽象一点就画不出来了。

118
00:10:42,786 --> 00:10:46,572
批量重命名五十个文件，你打算画成什么。

119
00:10:46,572 --> 00:10:55,406
更麻烦的是隐喻会赖着不走，用户学会基本操作之后，那些拟真的皮革纹理、翻页动画就从帮手变成拖累。

120
00:10:55,406 --> 00:11:02,462
有个手机系统早期那本皮质日历，到后面版本被清得干干净净，就是这个道理。

121
00:11:02,620 --> 00:11:04,817
那模型会怎么犯错。

122
00:11:04,767 --> 00:11:12,532
素材里有个云盘设置页，藏着三个自作聪明的发明，每一个都打破了一条学好的习惯用法。

123
00:11:12,532 --> 00:11:15,416
第一个发明，横着滑的表单。

124
00:11:15,416 --> 00:11:21,895
表单的习惯用法是从上往下，滚动、填写、提交，三十年没变过。

125
00:11:21,895 --> 00:11:28,361
横滑分页等于把必填项装进暗格，用户以为填完了，一点保存全是报错。

126
00:11:28,361 --> 00:11:32,532
想省高度，用折叠或分组都行，方向别动。

127
00:11:32,532 --> 00:11:35,200
第二个发明，要双击的链接。

128
00:11:35,200 --> 00:11:39,154
带下划线的蓝字，网页的契约是单击就走。

129
00:11:39,154 --> 00:11:47,207
双击属于桌面图标那套习惯用法，两套规则混着用，没人猜得到，只好靠一行小字来教。

130
00:11:47,207 --> 00:11:51,402
要配说明书才能用的控件，等于宣布自己失败。

131
00:11:51,402 --> 00:11:54,599
第三个发明，进度环保存按钮。

132
00:11:54,599 --> 00:11:59,491
保存有全世界最烂大街的写法，一个写着保存的实心按钮。

133
00:11:59,491 --> 00:12:05,596
做成环以后，用户第一反应是它在加载什么，第二反应是这东西能点吗。

134
00:12:05,596 --> 00:12:09,443
控件不再自我说明，创新反而把能供性丢了。

135
00:12:09,443 --> 00:12:12,171
为什么模型会干这种事。

136
00:12:12,171 --> 00:12:19,178
它的训练数据里什么都有，正经产品、获奖概念稿、设计社区里炫技的作品集。

137
00:12:19,178 --> 00:12:27,724
让它做个有设计感的设置页，它就把几种来源的花样搅在一起端出来，语法上都通，规则上互相打架。

138
00:12:27,724 --> 00:12:31,895
它还有一样东西永远学不到，你的用户学过什么。

139
00:12:31,895 --> 00:12:38,721
习惯用法长在用户的经验里，模型看得见控件长什么样，看不见三十年的教学史。

140
00:12:38,721 --> 00:12:41,498
所以这道关只能你来把。

141
00:12:41,498 --> 00:12:46,053
凡是需要配一行小字解释怎么用的控件，都值得怀疑。

142
00:12:46,053 --> 00:12:53,541
第二个词叫能供性，出自一位认知心理学家的经典著作，说的是东西的样子透露它怎么用。

143
00:12:53,541 --> 00:13:00,464
作者把这个定义修得更锋利，能供性管的是你以为它能干什么，和它实际能干什么分开算。

144
00:13:00,464 --> 00:13:08,445
门旁边装个小圆钮，人人都当它是门铃，哪怕按下去触发的是别的，它的能供性仍然是门铃。

145
00:13:08,445 --> 00:13:10,404
经典例子是门把手。

146
00:13:10,404 --> 00:13:16,330
门上横着装一根金属杆，形状高度都在喊拉我，结果这扇门要推。

147
00:13:16,330 --> 00:13:19,575
店家贴上推字，没用，人们照拉。

148
00:13:19,575 --> 00:13:22,676
手能读懂的信号，比字大声。

149
00:13:22,676 --> 00:13:26,113
在屏幕上，这件事变成一纸契约。

150
00:13:26,113 --> 00:13:32,375
你画一个按钮，就是向用户承诺它能点、点了有反应、干的是标签上写的事。

151
00:13:32,375 --> 00:13:36,257
毁约的控件，作者管它叫诱饵式能供性。

152
00:13:36,257 --> 00:13:38,794
这里有个零成本的检验法。

153
00:13:38,794 --> 00:13:44,839
把界面截图发给一个没用过它的人，只给五秒，让他指出哪里能点。

154
00:13:44,839 --> 00:13:48,469
他指错的每一处，都是一起能供性事故。

155
00:13:48,469 --> 00:13:55,080
这个测试对模型生成的界面尤其管用，因为它画界面时压根没想过这个问题。

156
00:13:55,080 --> 00:13:57,075
最后是那把尺子。

157
00:13:57,075 --> 00:14:03,024
讲到这儿容易得出一个错误结论，交互永远抄现成的，谁创新谁死。

158
00:14:03,024 --> 00:14:07,760
作者给的尺子精确得多，重大改变必须显著优秀。

159
00:14:07,760 --> 00:14:12,291
让用户重学一遍的改动，收益必须大到肉眼可见。

160
00:14:12,291 --> 00:14:24,971
导航、保存、表单这些基础操作，用户每天在别的产品里练几百遍，你换花样等于逼人重新学走路，而且给不出像样的回报，这里就该用最烂大街的模式。

161
00:14:24,971 --> 00:14:34,947
创新预算留给核心差异点，你的产品独有的那个能力，那里没有现成习惯用法可抄，做好了轮到别人抄你。

162
00:14:35,068 --> 00:14:39,344
最后给你一份可以马上用的判断清单，一共五条。

163
00:14:39,294 --> 00:14:42,023
第一条，别把探索当犯错。

164
00:14:42,023 --> 00:14:45,004
做，不要问，然后备好撤销。

165
00:14:45,004 --> 00:14:53,814
给模型提需求时说删除立即生效、弹出可撤销的提示条、保留五秒，而不是删除要有确认。

166
00:14:53,814 --> 00:14:57,347
第二条，四道防线从弱到强排清楚。

167
00:14:57,347 --> 00:15:06,025
最弱是弹确认框，然后是危险操作拉开距离，再是禁用不可用项并配说明，最强是立即执行加可撤销。

168
00:15:06,025 --> 00:15:10,629
确认弹窗会因为习惯化而失效，别把它当主防线。

169
00:15:10,629 --> 00:15:13,645
第三条，用一条判据清负担。

170
00:15:13,645 --> 00:15:18,429
把这一步删掉，用户的目标还能达成吗，能就是负担。

171
00:15:18,429 --> 00:15:24,679
重点查三个负担源，导航、打断、重复输入，模型产出三样俱全。

172
00:15:24,679 --> 00:15:28,621
第四条，基础操作只用最烂大街的模式。

173
00:15:28,621 --> 00:15:40,052
下拉刷新、左滑删除、底部导航、购物车、撤销快捷键、蓝字下划线链接、放大镜搜索，这些用户早就学会了，照抄就是白得的易用性。

174
00:15:40,052 --> 00:15:44,607
凡是需要配一行小字解释怎么用的控件，都值得怀疑。

175
00:15:44,607 --> 00:15:47,540
第五条，创新要花在刀刃上。

176
00:15:47,540 --> 00:15:53,357
重大改变必须显著优秀，给不出肉眼可见回报的新花样就是负担。

177
00:15:53,357 --> 00:15:58,165
创新预算留给核心差异点，那里做好了轮到别人抄你。

178
00:15:58,165 --> 00:16:00,917
这五条背后是同一个态度。

179
00:16:00,917 --> 00:16:05,424
不要指望用户小心一点，要设计得让用户不用小心。

180
00:16:05,424 --> 00:16:08,068
下一集我们继续往下拆。