习惯用法:别让 AI 发明新交互
用户靠习惯用法操作软件,学一次到处用。识别哪个控件在装创新,哪个长得像按钮的不是按钮
本页解决的问题
先给结论「习惯用法:别让 AI 发明新交互」要解决的关键问题是什么?
用户靠习惯用法操作软件,学一次到处用。识别哪个控件在装创新,哪个长得像按钮的不是按钮
把品味变成产品可重复的行为。 有用的结果不是一句“我觉得更好”。它应该是一条看得见的规则、一个小例子,以及判断体验何时低于标准的方法。
记录一个前后对比,让别人不用听解释也能看懂质量线。
表面更精致了,却没有减少用户的不确定感。
《About Face 4》第 13 章把界面分成三种路数:按程序内部结构长的(实现中心),靠画得像现实物件的(隐喻),还有靠学的(习惯用法)。Cooper 的立场很干脆:现代图形界面基本靠第三种撑着。窗口、滚动条、下拉菜单、超链接,没有一个靠直觉,全是用户一个个学来的。
他举的例子是鼠标:没有人看一眼鼠标就知道它控制屏幕上的光标,得有人教,或者自己摸索半分钟。但学会之后一辈子忘不掉。滚动、双击、拖放、下拉刷新、左滑删除,都是这样:学一次,到处用。
Alan Cooper,《About Face 4》第 13 章。
这条对做产品的人来说是天大的便宜:全世界的产品已经替你把用户教好了,你直接用现成的习惯用法,学习成本为零。麻烦在于 AI 有时不领这个情,它把训练数据里的花样拼一拼,就能发明出一个谁也没学过的控件。
顺手把第二条路数也埋了。图形界面刚火起来那几年,功劳被记在「画得像」头上:桌面画成桌面、文件夹画成文件夹,用户看图识意。Cooper 在第 13 章不买账:隐喻界面让用户在图标和功能之间连线猜谜,简单功能还能猜,稍微抽象一点就画不出来了。「批量重命名 50 个文件」,你打算画成什么?
更麻烦的是隐喻会赖着不走。用户学会基本操作之后,那些拟真的皮革纹理、翻页动画就从帮手变成拖累,占地方、限制交互,还把机械时代的规矩带进来。苹果自己也认了:iOS 6 上那本皮质日历,到 iOS 7 被清得干干净净。
所以习惯用法赢在轻装:它没打算让你猜,直接让你学,学起来还快。下面看看这套词汇是怎么搭起来的。
第 13 章里有一张倒金字塔,解释习惯用法为什么容易学:整套图形界面的交互词汇分三层,越往下越少、越简单。点每一层看它装着什么。
用户能把这套词汇从别的产品搬进你的产品,靠的是心智模型:他默认你的界面和他用过的一万个界面遵守同一套规则。模型对不上时用户有多懵,心理学篇讲过了,放跳转卡,不重教。
跨章引用 · 心智模型:用户脑子里那张图用户拿着旧产品的模型来套你的界面,错配一次就迷路一次。模型从哪来、错配怎么修,心理学篇第 7 节讲透了,点这里跳过去。下面是 AI 生成的云盘设置页,功能都能跑,界面也不丑,但里面藏着三个自作聪明的发明,每一个都打破了一条学好的习惯用法。把它们逐个点出来,点中会给判词。
顺便解释一下 AI 为什么会干这种事。它的训练数据里什么都有:正经产品、获奖概念稿、设计社区里炫技的作品集。让它「做个有设计感的设置页」,它就把几种来源的花样搅在一起端出来,语法上都通,规则上互相打架。
它还有一样东西永远学不到:你的用户学过什么。习惯用法长在用户的经验里,AI 看得见控件长什么样,看不见三十年的教学史。所以这道关只能你来把:凡是需要配一行小字解释怎么用的控件,都值得怀疑。
第二个词来自诺曼的《设计心理学》:能供性(affordance),东西的样子透露它怎么用。Cooper 在第 13 章把定义修得更锋利:能供性管的是你以为它能干什么,和它实际能干什么分开算。门旁边装个小圆钮,人人都当它是门铃,哪怕按下去触发的是别的,它的能供性仍然是门铃。
经典例子是门把手:门上横着装一根金属杆,形状高度都在喊「拉我」,结果这扇门要推。于是店家贴上「推」的标字,没用,人们照拉。手能读懂的信号,比字大声。
在屏幕上,这件事变成一纸契约:你画一个按钮,就是向用户承诺它能点、点了有反应、干的是标签上写的事。毁约的控件,Cooper 叫它诱饵式能供性(bait-and-switch)。
他还点了扁平化的名:早年的界面靠阴影和立体感喊「来按我」,扁平风把这些全刮掉了,视觉上是清爽,能供性跟着受了伤。所以扁平界面里可点的元素更要守纪律:同一种颜色、同一种形状,专门留给能点的东西,谁都别客串。
下面两个会员中心,同一块升级卡片两种画法,点你认为守约的那个。
能供性有个零成本的检验法:把界面截图发给一个没用过它的人,只给 5 秒,让他指出哪里能点。他指错的每一处,都是一起能供性事故。这个测试对 AI 生成的界面尤其管用,因为 AI 画界面时压根没想过这个问题。
讲到这里容易得出一个错误结论:交互永远抄现成的,谁创新谁死。Cooper 给的尺子精确得多:
Alan Cooper,《About Face 4》:让用户重学一遍的改动,收益必须大到肉眼可见。
导航、保存、表单这些基础操作,用户每天在别的产品里练几百遍,你换花样等于逼人重新学走路,而且给不出像样的回报,这里就该用最烂大街的模式。创新预算留给核心差异点:你的产品独有的那个能力,那里没有现成习惯用法可抄,做好了轮到别人抄你。
用这把尺子量一道题。AI 给一个批量文件管理工具加了四个「亮点设计」,哪个创新花对了地方?
最后备一张速查表。下面这些习惯用法,用户早在别的产品里学到滚瓜烂熟,你的产品照抄就是白得的易用性。验收 AI 产出时对着查,右列的话术可以整段抄进提示词。
| 习惯用法 | 用户在哪学的 | 给 AI 的默认要求 |
|---|---|---|
| 下拉刷新 | 每一个信息流 App | 列表刷新用下拉,别自创刷新浮层 |
| 左滑删除 | 系统邮件、微信聊天列表 | 列表项删除用左滑或明确按钮,别藏进长按菜单 |
| 底部导航栏 | 手机 App 的标配位 | 主导航用底部标签栏,图标配文字,3 到 5 个 |
| 购物车 | 电商三十年的教学成果 | 多选加结算沿用购物车模型,别发明新比喻 |
| 拖放上传 | 网盘和邮箱附件 | 上传区域支持拖放,同时保留「点击选择文件」 |
| Ctrl / Cmd + Z | 桌面软件的老规矩 | 编辑类功能必须支持撤销快捷键 |
| 蓝字下划线链接 | Web 的第一课 | 链接保持可识别样式,单击直达 |
| 放大镜搜索框 | 浏览器和每个内容 App | 搜索入口用放大镜图标加占位提示文字 |
| 红点角标 | 手机通知系统 | 未读提醒用角标数字,别自创闪烁标记 |
表里没有一项需要用户学,这正是它们的价值。省下来的学习预算,按上一节的尺子,投给你的核心差异点。
界面靠习惯用法运转:滚动、双击、拖放没有一个靠直觉,全是学来的。好的习惯用法学一次用一辈子,全世界的产品已经替你把用户教好了(Cooper,《About Face 4》第 13 章)。
能供性是契约:控件长什么样,就得干什么事。画一个按钮等于承诺能点、点了有反应;长得像按钮的东西点不动,赔上的是整页控件的信用。
创新要花在刀刃上:导航和基础操作用最烂大街的模式,创新预算留给核心差异点。重大改变必须显著优秀,给不出回报的新花样就是负担。
给 AI 的话术:「导航、表单、基础按钮一律用最常见的标准模式,不要发明新交互;可点的元素必须长得可点。」抓手讲完四个,下一节进细节:控件本身怎么选。
内容来源:newwebplay AI「交互工程」专题原创;部分交互原则整理自《About Face 4:交互设计精髓》,能供性概念出自唐纳德·诺曼《设计心理学》。
从「你会用的交互,没有一个是天生就会的」把感觉变成判断
「《About Face 4》第 13 章把界面分成三种路数:按程序内部结构长的(实现中心),靠画得像现实物件的(隐喻),还有靠学的(习惯用法)。Cooper 的立场很干脆:现代图形界面基本靠第三种撑着。窗口、滚动条、下拉菜单、超链接,没有一个靠直觉,全是用户一个个学来的」指出,AI 降低了做出“能用”成品的门槛,读者真正需要练的是看出哪里不对,并把感觉说成可以执行的要求。
观察用户的下一步,而不是只看表面
「他举的例子是鼠标:没有人看一眼鼠标就知道它控制屏幕上的光标,得有人教,或者自己摸索半分钟。但学会之后一辈子忘不掉。滚动、双击、拖放、下拉刷新、左滑删除,都是这样: 学一次,到处用」可以转成几个可观察的问题:用户是否知道现在发生了什么,是否知道下一步做什么,出错或空白时能否恢复,以及信息层级是否让重要内容先被看见。
漂亮不等于容易用
把「给 AI 的话术: 「导航、表单、基础按钮一律用最常见的标准模式,不要发明新交互;可点的元素必须长得可点。」抓手讲完四个,下一节进细节:控件本身怎么选」用在第二个页面或流程上,记录一个具体犹豫点和一个改动后的用户动作;能被观察到的变化,才是体验改善。
从「你会用的交互,没有一个是天生就会的」走到「隐喻这条路走不远」
「你会用的交互,没有一个是天生就会的」先把问题落在「《About Face 4》第 13 章把界面分成三种路数:按程序内部结构长的(实现中心),靠画得像现实物件的(隐喻),还有靠学的(习惯用法)。Cooper 的立场很干脆:现代图形界面基本靠第三种撑着。窗口、滚动条、下拉菜单、超链接,没有一个靠直觉,全是用户一个个学来的」上;到了「隐喻这条路走不远」,讨论继续推进到「顺手把第二条路数也埋了。图形界面刚火起来那几年,功劳被记在「画得像」头上:桌面画成桌面、文件夹画成文件夹,用户看图识意。Cooper 在第 13 章不买账:隐喻界面让用户在图标和功能之间连线猜谜,简单功能还能猜,稍微抽象一点就画不出来了。「批量重命名 50 个文件」,你打算画成什么」。两段连起来,重点就不只是记住一个结论,而是看清它成立所依赖的条件。
把这条判断带到下一个场景
评估体验时,把抽象的“好看”或“顺手”换成用户动作:他是否看懂状态、找到了下一步、能从错误中恢复,并且愿意继续使用。
- 「你会用的交互,没有一个是天生就会的」:《About Face 4》第 13 章把界面分成三种路数:按程序内部结构长的(实现中心),靠画得像现实物件的(隐喻),还有靠学的(习惯用法)。Cooper 的立场很干脆:现代图形界面基本靠第三种撑着。窗口、滚动条、下拉菜单、超链接,没有一个靠直觉,全是用户一个个学来的
- 「隐喻这条路走不远」:顺手把第二条路数也埋了。图形界面刚火起来那几年,功劳被记在「画得像」头上:桌面画成桌面、文件夹画成文件夹,用户看图识意。Cooper 在第 13 章不买账:隐喻界面让用户在图标和功能之间连线猜谜,简单功能还能猜,稍微抽象一点就画不出来了。「批量重命名 50 个文件」,你打算画成什么
- 「最后的要点」:用户能把这套词汇从别的产品搬进你的产品,靠的是心智模型:他默认你的界面和他用过的一万个界面遵守同一套规则。模型对不上时用户有多懵,心理学篇讲过了,放跳转卡,不重教
最后的「最后的要点」把讨论落到「用户能把这套词汇从别的产品搬进你的产品,靠的是心智模型:他默认你的界面和他用过的一万个界面遵守同一套规则。模型对不上时用户有多懵,心理学篇讲过了,放跳转卡,不重教」。回看这条线索时,最值得保留的是:当输入、规模或风险改变,哪些判断需要重新做一遍。
我把这篇文章里的一个判断改写成了今天可以验证的小实验。比记住结论更有用的是,知道下一步要观察什么。
读完以后我先回头找它成立的条件,而不是直接把方法搬进项目。这个顺序让后面的取舍清楚很多。
如果把这个判断放到真实工作里,最先需要补的约束是什么?我想知道从阅读到第一次实践之间,哪一步最值得先做。
还没有这篇文章的讨论。