2017 年 2 月 13 日

网站设计中的微互动 – 《Microinteractions》读后感

北京网站建设资讯 - 网站设计中的微互动 – 《Microinteractions》读后感 - (1)

刚刚看完我的第二本原版书,写一篇读后感来总结一下学到的理论。

《Microinteractions》这本书是一个多月前我从 Spell 姐的知乎文章《2017,这五条设计趋势将惊艳整个设计圈》中得知的,既然 Spell 姐说这是必读书目,二话不说就看起来。这本书很薄,虽然只有170页,也花了我40 小时。之前没有去详细了解过这本书的影响和作者生平,只知道“微交互”这个概念貌似几年前就有了,并且越来越火。
看完后果然很受启发,作者想传达的“微交互”并不是简单地让设计师关注细节,而是一整套设计方法。它很微小以至于用户毫无察觉,但是它有时候又具有决定性的作用。每一个伟大的产品都是由无数个微交互组成,其中几个代表性的微交互甚至反映了整个产品的调性。

写到这里我觉得微交互和某原型设计工具中的“动态面板”挺相似的,也许你画的一个“按钮”,它同时应用在产品的很多地方,它的形状样式,触发方式,功能点,反馈属性等都是统一的,那么你和这个“按钮”发生的这一整套交互过程就是一个的微交互。
规范的重要性不言而喻,为什么设计师越来越重视设计规范,我想大概就是因为规范中包含了许许多多的微交互,很多厉害的设计师帮我们把一些基础的微交互给定义好了。我们在相应的平台遵照相应的规范能避免踩很多坑。
那么设计师的价值体现在哪里呢,我们须要设计符合产品和业务本身的微交互,并让这几者和谐统一。

书中举了大量的例子,从正反面印证微交互的实践意义。
作者传达的方法可行性也很高,可以很快地应用到工作中,或者说我们可以利用这些方法来训练交互的思维,从细节入手多角度地去思考产品。
下图就是书中主要介绍的微交互的组成结构:

北京网站建设资讯 - 网站设计中的微互动 – 《Microinteractions》读后感 - (2)

Figure 1-13

触发器(Trigger)

触发器就是触发装置,它可以是主动操作的(Manual Triggers),也可以是系统操控的(System Triggers)。上面我说的“按钮”就是一个常见的主动操作的触发器。一个触发器必须要满足以下几个基本原则:

  1.  要让触发器看上去像个触发器;
  2.  统一性:无论在何时操作,都是触发同一个功能;
  3. 数据前置:如果可以,把微交互内的数据显示在触发器上。书中的例子是 Mac 系统中,文本编辑器的图标上会显示内容的开头几个字;
  4. 视觉与功能一致性:假如你画了一个按钮,就不应该是输入框的功能;
  5. 突出高频:越是常用的越要突出;
  6. 指示准确:触发器要准确,不要模棱两可,让用户觉得迷惑。

北京网站建设资讯 - 网站设计中的微互动 – 《Microinteractions》读后感 - (3)

Figure 2-2

主动操作的触发器也分可见的和不可见的,不可见的一般需要基于传感器,例如摄像头、陀螺仪等。在智能电灯这个例子中,我们需要设置2秒去检测一次是否有人在房间里,有人在,灯又刚好是关着的,那么它就亮起来。在这里2秒就去检测一次这是系统触发的,所以就叫系统触发器,设置为2秒去触发这是规则(Rules),如果没有人就会一直循环(Loop)检测过程,这是下面会讲到的过程。

规则(Rules)

书中介绍了一个例子,2010年10月苹果发布了 Mac 的新系统,开创性地把“另存为(Save as)”给干掉了,这次创新引起了很大的争议。作者通过这个例子展现了“另存为”原本的规则(Rules),和之后苹果每次更新的新规则。这颇似我们的流程图,把每一个用户的步骤和微交互背后的逻辑列出来,更加清晰直观。
这个例子之后有一句话印象很深刻:

“Things which are different in order simply to be different are seldom better, but that which is made to be better is almost always different.”
—— Dieter Rams

一个伟大的产品并不是去标新立异,我们应该着眼于每一个微交互,把它们优化到极致。
规则必须要通过商业,环境,技术等多方面的考虑。

话说回来,为了产品的商业价值我们往往会做一些妥协,但作为一名设计师产品的可用性应该是我们优先要考虑的。

你不需要从零去设计每个基础的微交互,熟练掌握交互的基本类型,然后应用到产品中,无论是 PC、Web、iOS 还是 Android 平台,都有他们相应的设计规范,要学会合理地使用。
规则更像是产品背后的逻辑,它会变成产品背后的算法。我们要简化流程,减少用户选择,适当地帮用户智能填充,防止用户出错。

反馈(Feedback)

反馈很重要,我对书中老虎机的例子深有感触。为什么人们会如此痴迷于玩老虎机,不仅仅是它能给你金钱上的回报(当然是极小概率的),更重要的是“反馈”。你的每次操作,机器都能给你“及时反馈”,屏幕上的画面给你一种这是“随机滚动”的错觉,尤其是“near win”画面的刺激,它会给人一种“我马上要得奖”的错觉。

北京网站建设资讯 - 网站设计中的微互动 – 《Microinteractions》读后感 - (4)

Figure 4-1

设计者还利用声音上的反馈,例如特定的情景下播放特定的音效,音效的音调和响度会随着游戏的进行不断地变化。
这一切反馈间歇强化用户的行为,使人沉溺其中。我始终觉得,游戏是目前把认知心理学应用地最好的产品。

与游戏反馈不同的是,在其他产品中我们要尽量把规则跟用户讲清楚,什么可以做,什么不能做。像老虎机这里,你以为自己在操控游戏,不过是被游戏背后的规则操控罢了,每个图案出现的权重是什么,你并不知道。

在一般的产品中我们需要给用户提供他们想知道的反馈,或是强化/确认行为的反馈。
反馈有以下几个基本原则:

  1. 不要让反馈信息过载;
  2. 反馈从来都不是随意主观的:只有连接动作和结果的反馈才是有意义的;
  3. 用最少的元素传递最多的信息:这里可以理解为用多种反馈形式(例如图案加声音)代替单一形式(许多的文字);
  4. 利用常用元素的变化传递信息:例如光标的多种形态。

反馈的拟人化以及形式,目前,就移动端来说基本有三种形式:视觉、听觉、触觉(主要是震动来实现)。视觉反馈就是最常见的图形和文字,这里有一个小插曲:

我大学有段时间做过纸媒的销售,那时候老板跟我们说纸媒广告是最安静的,它就放在你的桌子上,你不主动拿起它,他就不会对你产生干扰。
然而问题是你太安静了吧,几乎没人会去看它啦。

在我们的产品中,你要不是正在使用某个应用,它上面的文字和图形反馈对你的影响可能就是最小的。听觉反馈就不一样,书中作者说了很多有关交互的秘史,交互本来是从物理设备中产生的,长期以来我们的物理工具都是没有屏幕画面的,这时候就需要声音的反馈。书里开头说到,人们对于声音的反映速度要略快于画面,接受声音的广度也是远大于接受画面,这是长期进化的结果。
对于触觉反馈,主要是震动,就是比较新的一种反馈形式了,基本是从移动设备发展起来的,而且的它的效果也很好。
我想在未来,反馈的形式一定不会局限于移动端,只能硬件技术的发展和普及一定会产生更多样的交互形式,这也激励我们不断地学习和紧跟时代潮流。

循环和模式(Loops and Model)

这一章节开头的例子有点萌萌哒,2004年精神号火星探测车在火星上因为软件更新问题导致内存不足,于是它就自动重启打算检查并修复故障,然而谁都没有发现导致故障的根本原因,于是精神号就独自在火星无限重启了。。。(我仿佛听到了精神号的哀鸣)

北京网站建设资讯 - 网站设计中的微互动 – 《Microinteractions》读后感 - (5)

image by Wikipedia-Spirit (rover)

模式还是不太好理解的,我理解为由一定规则主动/自动触发进入另外一种模式的情况。
简单举几个例子,比如“设置”就是一种模式,当你在闹钟应用中,增加一个闹钟,删除一个闹钟,修改闹钟时间等,又或者是在天气应用中,你想增加一个城市。这些都是模式,它会暂时打断当前的内容,所以必须要谨慎使用。当用户从模式中回来,必须保持之前的内容,比如你在看视频的时候突然提示要去充值,当你费老半天劲充值完,回来最好还是要在刚才离开的页面,视频进度最好也要与之前一致。
在PC端常见的按住 Shift 键进入另外一种输入模式,输入栏里的自动填充,在 Xbox 中特定的手势和声音触发等。
微交互通过不停的循环让自己持续产生作用,常见的循环种类有:计数控制的(Count-Controlled Loop)、条件控制的(Condition-Controlled Loop)、采集控制的(Collection-Controlled Loop)和无限(Infinite Loop)。
循环可以利用数据和存储来动态调节,当用户使用越多越频繁(更少出错)时,下次循环出现就会有不同的表现,例如引导。

最后作者用三个例子来讲述如何把上面那些过程应用到实际的产品中,以及如何一步一步去优化一个微交互。
交互设计不是一个孤立的过程,每个微交互之间都要互相协调地运作,一个优秀的微交互是不需要让用户去记忆,并且让用户感到愉悦,说不定它就能成为你产品的一大特色呢。
最最后附录作者介绍了如何去测试一款产品,总结起来就是前期用高保真原型能节省成本,后期要尽量用大样本来收集用户反馈数据。作者还详细列举了收集数据时应该着重观察和记录什么,用户的何种反馈能看出什么问题,以及数据的类型。

越写越觉得(到了说再见的时候了)这本书里都是干货,不仅是理论上的,也是指导实践的干货,我只是列举了对我印象深刻的部分,九牛一毛。这里强烈推荐大家看看这本书。

最新文章

  1. 模板网站建设这么流行,为什么还要选择定制开发?
  2. 网站推广选择百度竞价有哪些好处
  3. 域名是什么,作用有哪些?
  4. 怎么才能做好网站营销工作?这几点不容忽视!
  5. 网站建设工作流程是什么,要注意哪些问题?
  6. 导致网站优化失败的原因有哪些
  7. 网站优化不同阶段的优化策略
  8. 北京网站建设有哪些要点需要注意?这些不容忽视!
  9. 网站建设一定要注意这五个方面,十分重要!
  10. 高端网站建设的注意事项有哪些?