用户体验定律:简单好用的产品设计法则
上QQ阅读APP看书,第一时间看更新

你是否想过为什么表单控件会如图 1-1 中的右图所示?这是因为设计它的人基于现实生活中大家熟悉的控制面板建立了关于控件元素样式的心智模型。网页元素(例如切换开关、单选框,甚至按钮)的设计都源自对应实物的设计。

图 1-1:控制面板部件与典型表单元素的对比[图片来源:Jonathan H. Ward(左)、谷歌的 Material Design(右)]

如果设计与用户的心智模型不相符,就会出现问题。这种“不相符”不仅会影响用户对产品或服务的评价,还会影响他们熟悉该产品或服务的速度。这种被称为“心智模型失衡”的情况一般出现在用户所熟悉的产品突然发生改变时。

众所周知,2018 年 Snapchat 的改版是心智模型失衡的典型例子。Snapchat 并没有循序渐进地改版(比如小步迭代,或是进行大范围β测试),而是直接改头换面,把好友发布的“故事”和会话消息放到同一个页面上,这样做极大地改变了用户所熟悉的页面布局。这一举动立刻引发了用户的不满,他们纷纷在 Twitter 上“吐槽”。更糟糕的是,很多用户转而投向了竞争对手 Instagram 的怀抱。Snap 公司首席执行官 Evan Spiegel 原本希望新的设计能重新激发广告商的活力,并为用户投放定制广告,但结果广告浏览量和收入双双下降,用户数量也急剧减少。Snapchat 的错误就在于没能将新的设计与用户的心智模型相匹配,这种失衡引发了用户的强烈抵制。

不过,并非所有的重大改版都会造成用户流失,谷歌就是一个例外。谷歌一直允许用户自行选择是否使用其产品的新设计版本,这些产品包括谷歌日历(Google Calendar)、YouTube 和 Gmail 邮箱。2017 年,谷歌推出了改版后的 YouTube 网站,如图 1-2 所示。多年来,这个网站的界面设计基本没变过,所以这一次,桌面用户可以先尝试适应全新的 Material Design 用户界面,而非一下子切换过去。用户可以预览新的界面设计,慢慢熟悉,还可以提交反馈。如果用户愿意,他们甚至可以恢复使用旧版本。仅仅是允许用户在准备好之后再切换版本,就可以极大地缓解本来不可避免的心智模型失衡问题。

图 1-2:2017 年,YouTube 重新设计前后的界面对比(左边为旧版,右边为新版。图片来源:YouTube)

大多数电子商务网站还会利用已有的心智模型。通过使用用户熟悉的模式,像 Etsy(如图 1-3 所示)这样的购物网站可以有效地让用户专注于更重要的事情——寻找和购买产品。选择产品、将其加入购物车、付款,通过顺应用户对购买过程的预期,设计师可以帮助用户运用他们的网购经验。整个购买过程让人感到舒服又熟悉。

图 1-3:Etsy 的用户界面。Etsy 等电子商务网站利用已有的心智模型让用户专注于购买产品,而不是学习新的交互模式(图片来源:Etsy,2019 年)

利用心智模型告知用户相关的设计信息,这种做法并非只存在于数字世界中。在汽车行业,尤其是在汽车控制方面,就可以找到我最喜欢的一些例子,例如 2020 款梅赛德斯–奔驰 EQC 400 原型车,如图 1-4 所示。每个座椅旁边的车门面板上的座椅控件都体现了座椅的状态。这样的设计让用户很容易通过识别相应的按钮来了解它们可以调整座椅的哪个部分。这是有效的设计,因为它建立在已有的汽车座椅心智模型之上,然后将控件与该心智模型相匹配。

图 1-4:以汽车座椅心智模型为依据设计的 2020 款梅赛德斯−奔驰 EQC 400 原型车的座椅控制装置(图片来源:MotorTrend,2018 年)

这些例子展示了如何利用用户已有的心智模型来使设计效果立竿见影。相反,如果不考虑用户已经形成的心智模型,就可能会导致困惑和不满。这里的结论引出了一个重要问题:根据雅各布定律,是否所有的网站或应用程序都应该遵循相同的模式呢?此外,即使有了更合适的新解决方案,设计师也只能使用现有的用户体验模式吗?

技巧

用户画像

你是否曾听公司的其他设计师提到“用户”一词,却不清楚这个难以捉摸的群体到底指谁?当设计团队没有明确定义目标受众时,设计过程就会变得困难重重,因为每个设计师都会以自己的方式来理解目标受众。用户画像便是解决这个问题的工具。使用它,设计团队可以根据实际需求来做设计决策,而不是根据未定义“用户”的需求。目标受众里某一特定人群的虚拟画像(如图 1-5 所示)并不是凭空构建的,而是基于聚合数据。这些数据来源于产品或服务的真实用户。

图 1-5:用户画像示例

用户画像既可以引起共鸣,也可以辅助记忆,还可以建立起一个关于特定群体的特征、需求、动机和行为的通用心智模型。根据用户画像定义的目标受众对设计团队来说非常有价值,它让团队成员摆脱主观臆断,专注于用户的需求和目标,进而确定新功能的优先级。

任何与功能或产品相关的用户细节都是有用的。用户画像通常包含如下模块。

信息

照片、个性签名、姓名、年龄和职业等都是用户画像信息的组成元素。此模块的目的是构建一个人物形象,使其能够真实地代表目标受众的某一特定群体。因此,这些数据应该反映该特定群体的共同点。

详情

详情模块中的信息有助于产生共鸣,以及将重点放在影响设计内容的特征上。常见的详情信息包括个人经历,用于更深入地介绍用户画像,还包括与用户相关的行为和这个群体可能有的痛点。其他详情信息包括目标、动机或用户在使用产品或功能时可能需要执行的任务。

见解

见解模块有助于理解用户的态度。此模块意在添加额外的说明,以进一步定义特定群体及其思维方式。它通常会直接引用用户调研报告中的内容。

 

关键考虑因素

相同性

你可能会想:如果所有的网站或应用程序都遵循相同的设计模式,那么网上的一切都会变得枯燥乏味。这种顾虑很合理,特别是在今天这样一个惯例无处不在的时代。设计之所以千篇一律,可以归结于以下几个因素:可加速开发的框架变得流行,数字平台及其标准变得成熟,客户渴望模仿竞争对手,设计师缺乏创造力。虽然大部分雷同设计纯粹是随波逐流的结果,但一些惯例的存在并不是没有原因的,例如搜索栏的位置、页脚的导航栏和付款的流程。

花些时间思考另一种可能性:假设你使用的每个网站或应用程序在各个方面都完全不同,从布局、导航到如搜索栏位置这样的常规元素都截然不同。根据心智模型,我们知道这意味着用户不能再依赖已有的经验。如此一来,他们实现目标的动力就会立即被削弱,因为在实现目标前,他们首先要学习如何使用网站或应用程序。不难想象,这并不是理想状态。因此,约定俗成仍然是必要的。

这并不是说创新永远不合适——创新肯定需要时间和空间。然而,设计师必须先考虑用户需求、环境和技术限制,以确定最佳的方法,然后才能去追求创新,但绝不能牺牲产品的易用性。