加入收藏 | 设为首页 | 会员中心 | 我要投稿 核心网 (https://www.hxwgxz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 运营 > 正文

微交互的设计案例与思考(下篇)

发布时间:2017-06-16 23:56:45 所属栏目:运营 来源:woshipm
导读:在上篇中,我们聚焦产品中的用户流程行为,讨论为减少用户操作负担和优化等待而做的交互设计;在中篇中,我们从人的主观感受出发,讨论产品的礼仪和为舒适而做的交互设计;在本篇中,我们将讨论人的感知和目标,探究那些”人们其实已经知道,却没有被发现
副标题[/!--empirenews.page--]

在上篇中,我们聚焦产品中的用户流程行为,讨论为减少用户操作负担和优化等待而做的交互设计;在中篇中,我们从人的主观感受出发,讨论产品的礼仪和为舒适而做的交互设计;在本篇中,我们将讨论人的感知和目标,探究那些”人们其实已经知道,却没有被发现“,但伟大产品为此做的动人细节。

微交互的设计案例与思考(下篇)

为感知而做的设计:交互设计的基石

谈到“感知”和“目标”将无法回避认知心理学,今天我们所讨论的“交互设计”成形于人机界面(GUI)产生之后。这因为随GUI发展,不可视操作与概念化过程中发生的问题,必须通过“交互设计”予以合理解决。这时认知心理学家通过理解人的认知和行为模式,不但评估具体化设计的优劣,还进一步指导交互设计的具体实施。

此处不得不提到,80年代加州圣迭戈大学的认知心理学教授Don Norman将心理学引入到设计中,奠定了交互设计和体验设计的基石。后来者Steve Mulder、Alan Cooper、Jeff Patton则完善了交互设计的方法工具。

在增强感知方面,Norman在《日常的设计》中提到了五种方法,即可供性、意符、反馈、映射和概念模型。而后来者如深泽直人提出的阈下设计,在可供性方面走的更远,所以在这里稍做调整,以直觉化、可视化反馈,保持一致,方位感,符合心智模型五个方面讨论为感知而设计。

案例一 MACBOOK和iOS的输入键盘:直觉化设计

微交互的设计案例与思考(下篇)

我们生活的世界充满了线索,我们随手将瓶子放在桌子上,是因为桌子平整和刚刚好的高度;我们爬山走累了,坐在石头上,是因为石头的轮廓给让我们感知可以就坐。人们每时每刻都在测量周遭的物体的可供性,只是大多时候都没有发现这一点。

Norman在《日常的设计》中所阐述的可供性是事物客观特征和人印象的结合,而深泽直人提出的阈下意识(无意识设计)中的可供性,则强调通过产品轮廓构建属性,增强人的直觉化感知。

当意识到人的感知会被物体的轮廓所左右,我们就会发现身边的直觉化设计。

微交互的设计案例与思考(下篇)

MACBOOK相比Thinkpad的键盘更具可供性,不是因为MACBOOK的键盘比Thinkpad的更大,而是前者通过不同材质和不同颜色增强了按键轮廓,以及通过轮廓展示出舒适刚好的间隔。

微交互的设计案例与思考(下篇)

同样,IOS的键盘相比安卓键盘更具可供性,也并非因为它画的比安卓更像键盘,而是简洁的信息,饱满的字体设定与疏密刚好的轮廓,让人更容易聚焦按键。

微交互的设计案例与思考(下篇)

直觉化设计不是强调给予用户感官上的刺激,而是通过产品轮廓和位置与用户的直觉产生高度共振。比如我们经常会见到领红包的模态视图,多点将领取按钮的位置下移至离用户更近位置,用户在阈下意识下点击领取从而注册,不是因为这个红包画的更像红包导致的。

案例二 iOS的按键显示与放大镜:可视化反馈

微交互的设计案例与思考(下篇)

乘坐电梯时常见到一种现象,人们按了一下关门按键,过了1秒,又按了一下,然后又按,最后门关上了,这源于电梯关门存在延迟与没有提供及时反馈,虽然人们知道电梯存在这个问题,但当再次来到这电梯中,却又重复反复按键的一幕。人们在操作的时候,需要获得可视化与及时反馈,否则就会感受到强烈的不稳定感。

微交互的设计案例与思考(下篇)

前边提到OFO使用了一个糟糕的解锁键盘,大按键设计与输入反馈可以让我们少犯错误。但当键盘不是数字而是字母,受限于屏幕尺寸,我们并不能加大按键尺寸,该如何做呢?iOS早就想到了这一点,在第一代iPhone上就提供了输入可视化反馈,让人们及时知道是否已经准确输入,同时不干扰视觉焦点。

同样的模式,iOS在长按文本复制也有用到,用户的手指长按时会覆盖焦点位置,此时提供放大镜的可视化反馈,有助于让用户充分感知是否准确框取。

微交互的设计案例与思考(下篇)

iOS的系统键盘通过可视化反馈增强了操作感知,而糟糕的三星手机,在窄小的键盘上输入根本看不到按键反馈,手指按压文字复制时也看不到反馈,如同电梯中不亮的关门键一样每一次都让人不安。

案例三 iOS的天气开启流量:保持一致

我们知道产品不论视觉设计还是交互设计都应保持一致。当我们看到加重的文字理解这是标题,随着我们阅读再次看到加重文字,就会马上感知到这就是标题;当我们拖动一个文件到垃圾箱代表删除,我们会感知拖动另外一个也可以删除。如果视觉元素排版不一致,就会让我们感到内容混乱,不容易理解;同样如果一致的交互行为结果截然不同,我们就会感觉到困惑,甚至怀疑系统本身。

微交互的设计案例与思考(下篇)

今天在网络上有无数人抱怨iOS的天气数据无法打开,而造成困扰的原因在于,对于开启应用数据流量的操作,iOS竟然为天气应用设计了不同的流程。

当我们需要开启普通应用的数据流量步骤是:

进入设置滚动列表选择某个应用列表选择无线数据开启无线数据与蜂窝数据

而在设置列表里并不包含天气,开启天气数据流量的步骤是:

进入设置进入蜂窝移动网络列表选择使用无线与蜂窝数据应用滚动列表选择”天气“开启无线与蜂窝数据

不一致的交互让用户无法正确感知和找到开启天气数据流量的入口,从而倍感困惑。

案例四 iOS与摩拜单车的转场动画:方位感

微交互的设计案例与思考(下篇)

在办公室里我们经常使用中央空调温控器,糟糕的温控器按钮的空间排列无法与用户内心产生共振,每一次使用都需要重新观察和理解每个按键的含义;优秀的温控器设计,风力上升下降,温度按键调节与数字,都能够使用空间布局和人内心产生共鸣,只要是用一次,下一次闭上眼睛都可以操作。

(编辑:核心网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读