余晖落尽暮晚霞,黄昏迟暮远山寻
本站
当前位置:网站首页 > 编程知识 > 正文

从第一性原理看界面设计的一致性

xiyangw 2023-09-27 17:40 18 浏览 0 评论

一致性,不是形式与形式保持一致,而是形式与用户认知保持一致。

谁与谁一致

设计原则都是有理可循的。很多设计原则是由人对大脑和人体工程学的认识,加上实际经验,总结得来的,例如7±2法则、费兹定律等等。设计师如果不知道对这些原则追本溯源,理解它最根本是要解决什么问题,只是应用,难免会偏离初衷,遇到问题。

下面以一致性设计原则为例,讲述在应用原则的过程中我们可能遇到的问题,以及为什么会遇到这些问题。

产品经理A:“这个页面的视觉焦点有点跳,还有优化的空间吗?”

设计师B:“因为其中一个模块在其他页面也有,为了保持统一和可复用性,所以产生了你说的问题。”

产品经理A:“这三个前后页面太像了,用户会不会迷路啊?”

设计师B:“不会吧,这三个页面的内容都是关于xx的,前后保持一致,应该更好理解吧。”

通过这些对话发现,设计师B经常用来阐述自己设计思路的一致性,在面对产品经理A以用户视角发起的疑问时,不能很好地解释说明,原则似乎“不灵了”,原因出在哪里?其实,从设计师B的说辞可以分析出,他提出的一致性的出发点是存在偏差的。

一致性的第一性原理

如何纠偏,我将从第一性原理来重新解读一致性。

所有设计原则的出发点是用户。为了让用户更好地使用产品,我们才通过设计原则来指导完成好用的设计方案。它不是为了方便设计师对照原则画界面,提高设计效率,或输出一套遵循原则的漂亮规范,或成为与产品经理争论时的有力依据。它是为了方便用户,让用户能够理解界面中的信息时不会困难,在屏幕中操作时不会觉得麻烦。理解了这一前提,我们再更深一层看,一致性到底解决了用户什么问题?

用户在浏览界面信息时,是通过大脑处理信息,这一过程和大脑的运行机制有关:人类大脑的运行是建立在经验的基础上。以往的记忆和认识会影响对当下新事物的判断,大脑会寻求新事物与已有经验的联系,将它们关联,一视同仁地去理解,从而降低大脑的负担。对,人类就是这么懒,一致性简直就是人类大脑的福音。

综上,从第一性原理解读后的一致性原则为:与用户已有的认知保持一致。在此基础上延伸,才有了我们常说的那些道理:“我们要让用户再次看到xx时能够很快明白它的用途,才将这个元素或模块在多处保持统一”;“我们通过运用映射物理世界的方法去设计表现层,为的是让用户更容易理解xx”等等。

所以,我们常用的一致性也没错,只不过是核心思想落地到具体情况的具体表现,它是多样的,但我们不应该将多样的表现总结为规律,去遵循,而应该探究到本质,再从本质出发,解决多样的问题。

下面举两个实际工作中应用一致性和选择不用一致性的例子。

应用一致性的例子:背景是顾客在餐厅就餐后,用手机扫描桌台上美团点评提供的二维码即可查看订单直接支付,如果商家提供会员服务且顾客还不是商家会员,即可看到申请成为会员的入口,如下左图,如果顾客已是会员,则看到的是右图。

这里的一致性体现在前后页面会员模块的位置上,都位于页面的头部,与商家信息在一块儿。原因是,顾客从商家信息下方的申请入口完成申请流程后,重新进入支付订单页时,想确认自己是否已是会员,这时,根据之前已有的认知,会先入为主地从头部的商家信息附近开始寻找,故将会员标识也与商家信息放一块儿,与用户的认知保持一致。

再来看一个选择不用一致性的例子:背景是顾客在餐厅就餐后选择美团智能POS机进行支付,并且该顾客支付时使用了会员余额,剩下的零头使用了微信支付,如下左图是顾客完成支付后手机上的支付结果页,右图是商家完成收款后POS机上的收款结果页。

这里的不一致体现在页面头部重点展示的金额上。大家一定会疑问,同一笔消费的支付结果页,为什么要展示不一样的金额呢?同样的金额难道不也会让顾客和商家达成某种一致吗?通过询问商家的想法发现,商家更关注订单的总金额,因为这才是他们实际得到的收益,并且在对账时也需要订单总金额才能对平。反观顾客,作为注重优惠的消费者自然更在意自已实际付了多少,有没有多付或者少付,并且,显示减去各种优惠的实付金额,在心理感受上也有捞了大便宜的快感。由此可见,一致性在这里,并没有认知上的重合,也就没有必要遵循了。

延伸思考

除了一致性原则,很多其他设计原则,甚至设计工具和设计方法都可以用第一性原理的思路去剖析:做可用性测试的本来目的是什么?用户场景分析究竟为的是什么?HEART模型是怎么来的又可以衍生出什么?马斯洛需求层次理论的本质是什么?

相信通过第一性原理的层层剖析后,你会对这些平时常用的知识产生全新的认识。

本文由 @王文俊 原创发布于人人都是产品经理。未经许可,禁止转载。

题图来自PEXELS,基于CC0协议

相关推荐

华为交换机配置命令总结

1、配置文件相关命令[Quidway]displaycurrent-configuration显示当前生效的配置[Quidway]displaysaved-configuration显示fla...

解决账户无法登录的故障
解决账户无法登录的故障

在优化系统时错误地根据网上的提示,将唯一的Administrator账户设置为禁用,导致重启后无法进入系统。类似的故障还有使用组策略限制本地账户登录,导致重启后...

2023-10-11 17:16 xiyangw

S5720交换机登录提示初始密码存在安全风险
S5720交换机登录提示初始密码存在安全风险

问题描述客户每次登录输密码时,提示初始密码不安全,现在客户嫌麻烦想要去掉:Username:huaweiPassword:Warning:Theinitia...

2023-10-11 17:15 xiyangw

Springboot,Mybatis修改登录用户的密码
Springboot,Mybatis修改登录用户的密码

一、Mybatis.xml<updateid="changePassword"parameterType="string...

2023-10-11 17:15 xiyangw

PHP理论知识之沐浴更衣重看PHP基础(二)
PHP理论知识之沐浴更衣重看PHP基础(二)

接上篇,咱们继续讲解PHP基础八、标准PHP组件和框架的数量很多,随之产生的问题就是:单独开发的框架没有考虑到与其他框架的通信。这样对开发者和框架本身都是不利的...

2023-10-11 17:15 xiyangw

新鲜出炉UCloud云主机“数据方舟”评测报告(5)— — 关其城
新鲜出炉UCloud云主机“数据方舟”评测报告(5)— — 关其城

2015年10月29日,UCloud云主机黑科技——“数据方舟”功能正式上线,首轮内测随即开放。截止至2015年12月6日,我们共收到了534位用户的评测申...

2023-10-11 17:14 xiyangw

业余无线电Q简语及英文缩语
业余无线电Q简语及英文缩语

Q简语:语音通信及CW通信通用(加粗为常用)QRA电台何台QRB电台间之距离QRG告之正确频率QRH频率是否变动QRI发送音调QRJ能否收到QRK信号之可...

2023-10-11 17:14 xiyangw

非常详细!如何理解表格存储的多版本、生命周期和有效版本偏差
非常详细!如何理解表格存储的多版本、生命周期和有效版本偏差

表格存储在8月份推出了容量型实例,直接支持了表级别最大版本号和生命周期,高性能实例也将会在9月中旬支持这两个特性。那么,最大版本号和生命周期以及特有的...

2023-10-11 17:14 xiyangw

H3C交换机恢复出厂和各种基本配置,这20个要点你知道吗?
H3C交换机恢复出厂和各种基本配置,这20个要点你知道吗?

私信“干货”二字,即可领取138G伺服与机器人专属及电控资料!H3C交换机不知道密码如何恢复出厂设置1、开机启动,Ctrl+B进入bootrom菜单,选择恢复出...

2023-10-11 17:13 xiyangw

在使用移动支付系统的时候如何保护信息安全?

移动支付的方式近年来不断被更新,使得Venmo(据嘉丰瑞德理财师了解,此为美国的“支付宝”)之类的支付方式已经可以某种意义上代替随身携带现金了。但是你必须防范那些第三方应用程序轻松地获取你的银行卡以及...

界面控件DevExpress WinForms MVVM入门指南——登录表单(下)

从本文档中,您将了解如何向应用程序添加登录表单。在本节教程中着重讨论了如何实现此任务,这基本上是附加应用程序功能的一部分。DevExpressUniversalSubscription官方最新版免...

linux基础命令(一)
linux基础命令(一)

为啥要学linux?您可能熟悉WindowsXP、Windows7、Windows10和MacOSX等操作系统。Linux就是这样一种强大的操...

2023-10-11 17:13 xiyangw

MySQL数据库密码忘记了,怎么办?

#头条创作挑战赛#MySQL数据库密码忘记了且没有其他可以修改账号密码的账户时怎么办呢?登录MySQL,密码输入错误/*密码错误,报如下错误*/[root@TESTDB~]#mysql-u...

MobaXterm忘记Session密码,如何查看已保存的密码
MobaXterm忘记Session密码,如何查看已保存的密码

MobaXterm工具登录过SSH终端后,如果存储了Session(存储后再连接ssh的时候只需要输入账号不需要输入密码就可以直接连接上ssh),则可以...

2023-10-11 17:12 xiyangw

华为交换机密码丢失修改方法
华为交换机密码丢失修改方法

华为S2300交换机找回密码设置一、目的交换机的console和telnet密码丢失,无法登录设备。交换机已进行过数据配置,要把密码恢复而数据配置不能丢失。二、...

2023-10-11 17:12 xiyangw

取消回复欢迎 发表评论: