020-29815005
预约专线时间:09:00-23:59

【UI设计培训】:微交互是什么?微交互都出现在哪里?

新闻来源:优漫动游 日期:2022-05-06
你会被什么样的交互产品所吸引呢?你又会觉得什么样的交互产品让你很惊喜?其实啊,优漫动游小编认为,用户被一个好的交互产品吸引,看重的一定是两点:功能,还有细节。功能是否能够满足用户需求是选择一个产品的开始,而细节则是让用户在使用的过程中感受到设计带来的愉…
  你会被什么样的交互产品所吸引呢?你又会觉得什么样的交互产品让你很惊喜?其实啊,优漫动游小编认为,用户被一个好的交互产品吸引,看重的一定是两点:功能,还有细节。功能是否能够满足用户需求是选择一个产品的开始,而细节则是让用户在使用的过程中感受到设计带来的愉悦感。这里所说的细节,就是现在越发被设计师注重的“微交互”,逐渐成为交互设计的新趋势。


【UI设计培训】:微交互是什么?微交互都出现在哪里?


  我们要搞清楚什么是微交互,就必须把它和交互设计放在一起来阐述。翻看小本本,之前我们有介绍过“交互设计就是围绕人与机器、系统和环境等交互行为的设计。”而微交互,关注于单个事件或者单个任务,是交互产品中单一使用场景的交互,它只体现一种功能,只完成一件事件。因为整个交互产品系统需要完成大大小小不计其数的任务,所以微交互在一个交互系统里无处不在。我们可以把微交互看作是产品中通过交互实现功能的细节,这些细节越发被注重,越容易给用户带来顺畅、愉悦的感受,所以注重用户体验的交互设计师们,还是在微交互上花费心思,以此创造吸引用户、提升体验质量的瞬间。


  单个任务的交互不等于单个交互。微交互注重的是某单个任务完成时刻的感受,并不特指单个交互或者单个动效,而是完成这一个任务、交互相关的所有的交互、动效和反馈。比如说,我们在绑定一张银行卡的时候,可以通过扫描银行卡来确定卡号。这个微交互包括的是点开“相机”按钮——用相机扫描银行卡——确认卡号等一系列单个交互动作组成,而不仅仅是点开“相机”按钮一个动作。

  微交互都出现在哪里?

  从某种程度上来说,微交互可以出现在任何单个任务完成的过程中。只要设计师有足够的创造力,任何一个细节都可以是微交互的呈现之处。说得这么笼统,是不是你并不能一下找到微交互的存在之处?为了帮助你快速理解微交互的应用,小编准备了许多例子,下面,我们开始一点点地找出微交互的蛛丝马迹吧。

  藏身之处1:展示系统/产品的状态:

  这种微交互的存在是为了告诉用户,系统现在发生了什么,用户的操作造成了什么结果,比如用户关闭或打开某项功能,更改设置,任务完成的进程,或者当前的设备连接了其他设备等等,动态微交互可以做出更加直观的视觉反馈,增加系统拟人化的情态,仿佛是在告诉用户:“嘿,哥们儿,我在努力为你完成任务哦。”

  我们常见的加载进度条就是属于这种作用的微交互。

  藏身之处2:页面导航的好帮手

  在tab导航切换时,我们经常看到如图所示的标签滚动,这就是页面切换的微交互。这种微交互提亮页面改变之处,强调了页面的变化。可以让用户清晰地知道自己的所在位置,同时也会提醒用户下一个内容会是什么。

  藏身之处3:引导用户与系统互动

  合理的微交互设计可以给用户导示作用,引导用户进行操作,主动进行交互。下图中是我们过年时候会遇到的拆红包交互,红包上抖动的“开”字,会引导用户主动点开红包。

  藏身之处4:信息输入可视化

  我们在打字输入各种信息的时候,交互系统会将正在输入中的信息用特定的方式展示给我们看,这就是我们此处提到的信息输入可视化微交互。这种微交互是功能性的,目的是帮助用户清晰准确地知道信息输入结果,而非增加趣味性。这种微交互在输入密码等个人信息时,尤为常见,它会显示用户是否正确输入了信息。

  藏身之处5:新手教程

  用户刚接触到一个新的交互产品时,系统往往会提供一个交互动画来作为新手指导,这种微交互使教学引导更加真实、有趣,让用户更加准确地记住使用方法。

  微交互的组成

  1.触发

  触发器就是用户点触操作的元件。一旦这个元件被点触,后续一系列的交互、反馈都会开始呈现。对于触发环节的要求就是,用户能够清晰判别出什么是可以进行操作的元件,让用户可以一下找到触发器。当然还有一种触发形式是系统触发——通常APP检测到满足某些条件会触发一定的微交互。

  “click me”就是一个触发器

  2.规则

  规则决定了触发之后会发生什么事情。限制约束了整个微交互的过程,包括什么条件下可以激活触发器、用户可以进行什么操作、整个微交互完成的时间,给予反馈的时间等等。一个清晰的规则可以帮助用户更好地理解这个微交互的目的,如果规则不清,反而会造成用户的困惑。举个例子,我们之前提到的页面切换导航,当向左滑动到边缘处,标签被选中的位置就会向右偏移一下,这样用户就会知道下一个选项是什么。如果没有这个规则,用户就不会知道下一个选项的内容是什么。

  反面案例——用户不能知道下一个选项卡是什么

  3.反馈

  反馈是交互系统与用户的信息沟通,可以清晰地让用户知道他们的操作产生了什么效果,想要完成的交互目标是否实现等等。我们常见的那些能够表示状态的动画,或者弹窗效果,都是一种反馈。

  4.循环与模式

  模式决定了什么状况下微交互会再次出现,条件变化的时候,微交互会怎么随之变化。

  循环则是设定微交互的时长以及周期,并且设计它是否重复、随着时间演变的过程。

  网页可以设定为间隔特定时间自动刷新

  什么是好的微交互?

  好的微交互的首要条件是被用户所接受。设计师设计微交互的动机绝不能是单纯地为了标新立异,展示华丽丽的交互效果,而是从用户对于微交互的认知程度出发来设计。首先,即使是刻画细节的微交互,也应当保持简洁直观的原则,注重交互的可用性,以帮助用户准确快速掌握操作技巧,完成交互任务为基本要求。

  其次,在保证了用户交互操作的流畅程度,微交互的细节刻画应当注重对用户情感的呵护。比如,可以有巧妙的动画效果帮用户保持新奇感,让用户感受到系统的反馈;或者用适当的幽默感增加用户内心的愉悦,让用户的使用过程更加轻松。好的微交互可以让交互的过程更加温暖。  

  以上就是优漫教育小编为大家介绍的“UI设计培训】:微交互是什么?微交互都出现在哪里?”相关内容,学习ui设计培训,可以参考优漫教育提供的ui学习路线,该学习路线内容包含ps软件入门、AI与品牌设计、视觉表达技法、web视觉设计、图标设计、产品交互、移动端设计等,根据优漫提供的ui学习路线图,可以让你对学好ui需要掌握的知识有个清晰的了解!