微交互如何增强网站设计的用户体验 - 素马设计 SUMAART

微交互如何增强网站设计的用户体验

By:limo- 2019-09-23 08:53:41

在一个拥有令人眼花缭乱的数字平台和海量内容的网站设计世界里,微互动变得越来越重要。虽然在数字设计的早期,微交互被认为是一个很酷的功能,但在当今竞争激烈的数字空间中,微交互已经成为用户整体体验的一个重要元素。


由于用户从微互动中感知到的价值感,它们不仅能提高参与度,还能激发用户对你的品牌的积极感受,并最终影响用户的行为。


本文将讨论微交互的基础知识,以及如何利用它们来增强用户体验设计。



Micro-Interactions是什么?


在数字设计中,在大多数用户与产品的约定中都可以发现微交互。当您将鼠标悬停在文本上并更改颜色以表示可以单击时,就会发生这种情况,当动画显示你上传的进度时。它甚至会弹出一条消息,让你知道你输入了错误的密码。


这些小的视觉线索和其他微妙的指示是微互动,虽然它们可能不容易被用户注意到,但实际上,通常是在它们被正确执行的时候。微交互,无论多么细微,都将总体设计方案结合在一起——提供允许用户浏览界面和执行基本功能的信息。


Micro-Interactions如何工作


微交互有四个基本元素:触发器、规则、反馈和循环/模式。这些元素有助于组织这些设计元素的操作周期:


触发器


这些是启动微交互过程的东西——例如,轻击按钮或单击鼠标。当满足某些条件时,系统也可以启动它,比如在接收消息时收到声音通知。


这些触发器与一组既定的操作规则一起工作,这些规则规定了什么可以做,什么不能做。


规则


这些基本上决定了一旦微交互被触发会发生什么,例如,当你在Tinder上刷屏时,规则会显示你“超级喜欢”某人。但规则也规定,除非他们也喜欢你,否则还是不能给他们发信息。


反馈


顾名思义,它让用户知道发生了什么。当微交互发生时,用户看到、听到甚至感觉到的任何东西都是反馈。例如,如果你把你的手机设置成振动,那么短的振动就是反馈。


循环/模式


这些基本定义了交互的本质——它是否闪烁一次,重复一次?随着时间的推移会发生什么?例如,循环可以是用户输入错误密码的次数,而模式是一个帐户在五个密码错误之后被暂时阻塞。


何时以及如何使用微交互


1、页面动画


当您谈到网站设计的页面动画时,它可以是页面之间的创造性转换,也可以只是一个很酷的滚动进度图标。这些类型的微交互可以让用户更好地了解以前和当前页面之间的关系。这也使得浏览的过程更加吸引人。


2、刷


类似地,您还可以通过在用户滑动时将平滑的转换整合到内容中,从而利用天生的滑动功能。通过这种方式,你可以为你的内容添加一些娱乐价值。


3、动画输入字段


你可能还没有遇到过喜欢填表格的人,但是动画至少可以让平凡的任务更吸引人,甚至更有帮助。


4、动画状态


同样,在这个注意力持续下降、按需娱乐日益减少的时代,没有人愿意等待。但是通过对下载/上传状态等使用动画,您可以显示用户的进度,同时为原本枯燥的功能添加更多的乐趣。


你甚至可以用它来增加你的品牌。


5、通知


说到通知,最好能给用户提供选项。例如,有些用户更喜欢不那么侵入性的通知。与此同时,另一些人则不介意Facebook Messenger的聊天泡沫在他们观看YouTube视频时突然冒出来。


Facebook和Instagram将这一功能提升到了另一个层次,每当有人喜欢他们的帖子时,用户就会分泌多巴胺。这会养成习惯,让用户期待收到通知。


6、下拉菜单


它已经成为智能手机操作系统的主要设计,因为它的用户界面非常友好。只需从屏幕顶部向下拉,就可以访问所有通知和基本设置。导航的易用性是微交互最重要的功能之一,而下拉菜单正是实现了这一点。


7、文字-动作按钮


你的cta存在是有原因的——那是因为你想让用户点击它们。在CTA按钮中添加动画可以帮助刺激用户的行为。至少,让他们对可能发生的事情感到好奇。


8、锚文本动画


动画锚文本是一个伟大的方式,将创意品牌融入简单的功能,如回到你的主页,甚至只是表明一些东西可以点击。


9、教程


微交互也是教育用户如何使用产品的好方法,简单的动画甚至图形都可以指出基本的功能,通过使您的产品易于使用,并揭示很酷的隐藏功能,可以大大提高用户体验。


带走


这些小细节都为用户的网站设计整体体验增加了价值,一个小功能,比如一个非侵入性的通知或一个很酷的状态动画,可以让用户感觉到公司很关心他们,并让他们对品牌产生好感。一旦这种关系建立起来,你就可以影响他们的行动,使之与你的目标一致。


随着一切数字化,想要从人群中脱颖而出变得越来越难,但这些微妙的微互动可以帮助你做到这一点。