帮你梳理微交互的五个基本要素

微交互应该火热了相当一段时间了。它成为话题中心很大程度是因为微交互所带来的令人动容的体验。如果说要界定微交互,那么它应该是围绕着用户完成单个任务前后而存在的微妙的交互和效果。小贴士:奖励机制是驱动用户的核心,奖励越强,产生的习惯效果也就越明显。小贴士:动效应当具有足够持久的生命力,所以设计的时候,应当思考它是否会在看过100次之后让人觉得厌烦?它是否清晰可见,或者完全无法引人注意?小贴士:用充满情感和人的姿态来同用户交流,这是让你的UI和交互变得更加温暖的最快的方式。小贴士:应当在你的设计中保持KISS原则(KISS 原则是用户体验的高层境界,简单地理解这句话,就是要把一个产品做得连白痴都会用,因而也被称为“懒人原则”),不要让那个你的微交互成为一个宏交互。


微交互应该火热了相当一段时间了。它成为话题中心很大程度是因为微交互所带来的令人动容的体验。如果说要界定微交互,那么它应该是围绕着用户完成单个任务前后而存在的微妙的交互和效果。

帮你梳理微交互的五个基本要素

微交互可以存在于APP和网页的各个环节,举几个常见的例子:

  • 确认已经添加到购物车的项目
  • 使用下拉刷新更新内容
  • 确认某个操作的界面动效

这些微妙的动效和交互给用户带来微妙的瞬间,它们出现在APP和网页的各个角落。这些微小的瞬间虽然不明显,但是用户可以轻松地感知到,这些为交互一点一滴地让整个APP的用户体验得到了极大的提升。

今天的文章中,我们将探讨5种常见的微交互技术,并且提供相应的实战案例。

1、培养用户习惯

微交互能够鼓励用户进行更多的交互,这也使得它们能够有效地培养用户习惯,构成习惯循环。培养用户习惯通常需要三个步骤:

  • 提示:触发用户操作的提示
  • 执行:响应提示,执行相应的操作
  • 奖励:完成操作给予用户以好处

帮你梳理微交互的五个基本要素

Facebook 培养用户习惯的方式就是一个很好的案例:当白色的图标上出现红色的标识的时候(提示),用户会知道有新 消息了,用户就可以点击图标(执行)的时候,就可以同好友进行聊天了(奖励)。当用户在看到红色的标识之时,随后会主动点击并查看。

帮你梳理微交互的五个基本要素

虽然这个案例看起来很简单,但是基本所有的微交互都遵循这个规则。

小贴士:奖励机制是驱动用户的核心,奖励越强,产生的习惯效果也就越明显。

2、结合主题

微交互应当是你的设计的自然组成部分,换句话来说,你应当创建一个统一的主题,宏观上的交互和微交互应当在设计上保持一致。结合主题的微交互应当结合两个简单的原则:

帮你梳理微交互的五个基本要素

  • 连续性:动效和UI控件不同状态之间的转变应该是平滑自然的,而非不连续的。
  • 可预测性:良好的微交互应当给用户以一定的预期,帮助用户理解界面的含义,获取正确的信息。

帮你梳理微交互的五个基本要素帮你梳理微交互的五个基本要素

3、用动效给予反馈

如果正确地将动效和微交互结合起来,它能够极大的提升用户体验。但是并非所有动效都能达成好的效果,只有同时具备良好的功能性,还能够令人产生愉悦感的动效才适合在微交互中给用户以反馈:

功能性良好的动效能够降低用户的认知符合,防止用户在使用过程中产生迷惑,便于用户在使用过程中同界面产生正向的联系。

帮你梳理微交互的五个基本要素

令人愉悦的动效让微交互更加有趣,并且能够吸引用户的注意力,让界面更加富有生命力。

帮你梳理微交互的五个基本要素

小贴士:动效应当具有足够持久的生命力,所以设计的时候,应当思考它是否会在看过100次之后让人觉得厌烦?它是否清晰可见,或者完全无法引人注意?

4、保持幽默

无论是哪种程度的幽默,融入到交互中,都能给用户带来充满情绪、富有感情的用户体验。比如著名的电子邮件服务 MailChimp 就会在用户加入之后,使用各种意想不到的幽默和积极的情绪来引导用户使用产品,协助他们发出他们的第一封电子邮件。用户在使用的过程中,会不断地收获小而令人愉悦的惊喜,MailChimp 让发送邮件的过程令人难忘。

帮你梳理微交互的五个基本要素

MailChimp 用幽默的交互缓解了紧张的局面和氛围。

小贴士:用充满情感和人的姿态来同用户交流,这是让你的UI和交互变得更加温暖的最快的方式。

5、规避不必要的交互

微交互最大的特色是恰到好处,所以正确的的微交互应当为用户提供合适的视觉线索和动效。复杂的交互和繁复的UI是最常见的错误。实际上你在Dribbble 上能够看到许多实验性的UI、交互和动效设计,其中不少看起来极为漂亮,但是在实际的交互中缺乏可用性,难于使用,或者完全不具备实现的价值。

帮你梳理微交互的五个基本要素

以这个动效为例,用户每翻一下页面,小球都会来回乱飞,用几次谁都受不了。

在微交互中,少即是多。将无用的功能和UI控件移除,能够让一个UI更加清晰直观,在进行微交互的设计过程中,应当关注它的实际功能,确保它能为用户提供实际的功能。

小贴士:应当在你的设计中保持KISS原则(KISS 原则是用户体验的高层境界,简单地理解这句话,就是要把一个产品做得连白痴都会用,因而也被称为“懒人原则”),不要让那个你的微交互成为一个宏交互。

结语

在用户体验设计过程中,最重要的应该是处理好用户使用产品时候的感受,即使是最细微的细节都值得密切关注,因为每一个细节都和你的产品成功与否密切相关。

 

原文作者:Nick Babich

原文地址:Medium

译者:@陈子木

译文地址:http://www.uisdc.com/best-practices-for-microinteractions

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/26335/

(0)
CatherineCatherine
上一篇 2017-05-14 02:31
下一篇 2017-05-14 04:31

相关推荐

  • 以手机淘宝为例,看原型图易缺失的交互场景

    Echo :以iOS版手机淘宝历史搜索为例,本文作者希望通过展示的原型图来讨论易遗漏的交互场景,让读者得到收获,并总结出以后如何避免遗漏交互细节与定义。

    2017-09-29
  • 产品需求沟通出问题怎么办?

    产品制作的流程中,发现需求并定义需求是首要环节,假如产品需求沟通出现问题了怎么办?你需要解决三个问题,避免含糊性,定义需求和功能,明确功能和属性。  一:如何避免含混性出现 含混性,指的是不清晰的程度。…

    2014-11-14
  • Axure RP 8 入门手册 – 第6章(二)

    第5节检视功能-元件命名千语:楼叔,我才问一个问题,你就给我讲了这么多!好感动哦!小楼:嘿嘿,因为这个群里你最大嘛!千语:切!反正你也有空,顺便把元件的设置也给我讲讲吧!我看不管是元件的样式还是属性,都很复杂呢。小楼:您好!因为网络原因,您发送的消息是乱码。千语:还想等你给我讲完,发张我昨天泡温泉的照片给你呢!小楼:你看,其实这个元件设置也非常简单,你看在点中一个元件后,检视面板中就会呈现与该元件相关的设置……从上至下,首先看到的是元件...

    2018-04-22
  • 产品原型设计(2):母板的创建和使用

    Axure母板:可以将一些页面中的共同之处,比如导航、背景部分等,提取出来,制作为母板。将母板应用于某个页面,则该页 面相当于将模板的内容复制过来。如果有很多页面具有相同的内容,这些页面如果需要修改这些相同的内容时,仅需要在模板中即可完成所有页面的修改。方式一:直接创建母板步骤一:创建Axure母板:在“母板”区直接创建母板里创建了一个名称为“Axure学习平台”的模板步骤二:使用母板选中“Axure学习平台”母板,邮件选择“添加到页面...

    2018-04-08
  • 成为设计师不是不可能!

      前言:本文译自国外高质量问答社区Quora,原文作者Karen X. Cheng,原是微软Excel的项目经理,后通过自学转型成为设计师。她讲述的自学过程详实细致且条理有序,读完会发现与想象中的大不一样,对于想自学设…

    2015-04-01
  • 交互设计:如何避免业务需求的遗漏

    笔者在春节期间在被七大姑八大姨问的比较多的一个问题有:你现在是做什么工作的啊?看着眼前的火锅实在不知道怎么解释,就问了他们一个问题“你觉得我们在春节期间怎么能吃上火锅?”他们的回答大概可以归类为:买材料 —— 火锅底料烧开 ——-放吃的 —— 完成而我的回答是:“如果今天的客人不敢吃辣,而你准备的是辣锅呢?”“如果你买的火锅料大家不是大家想要吃的呢?”“如果客人太多,而锅太小呢?”我目前的工作就是这个,让客人在各种状况下都能享受到这顿火...

    2018-03-06
  • 交互基本功:如何设计一个好用的搜索框?

    搜索框一种常见的交互控件,用于精准提取海量的信息中的准确内容。本文作者分享了设计一个搜索框的几个要点,希望大家从中可以有所收获。

    2017-05-04
  • 全面掌握算法交互设计,你的设计你做主

    在OF COURSE学习最纯粹的创意编程Processing生成艺术进阶课程全面掌握算法交互设计12周成为顶尖设计师👇△课程介绍《Processing&OF算法交互线上课程》你将要学习的第一部分:培养算法创造能力,学习运用高级算法模拟真实环境中的自然变化。第二部分:理解并掌握算法交互的原理。第三部分:培养软硬件结合能力,学习使用手部识别设备Leap motion、体感识别摄像头Kinect和算法的交互。第四部分:运用openCV计算机图...

    2018-04-08
  • 交互设计师的60日计划第十六天

    周五综合症:不想做事...今天把昨天的需求做完善,与产品经理讨论其中的一个问题,然后将细节标注清楚,但是产品最终还没有确认。除此之外,一直在帮要晋级的一个视觉同事想文案,最后得出结论,还是得多读书,书到…

    交互专题 2015-08-20
  • 交互设计四策略在音乐播放条上的运用

    追求简单易用是人类的本性,《简约至上》中提出了合理删除、分层组织、适时隐藏和巧妙转移这四个达成简约的终极策略。对于功能性单一的产品做到简洁化比较容易,但对于功能性较强的产品如要做到简洁就是一个复杂的课题。

    2017-05-23