概要设计的作用_微交互，设计师的超能力

最新推荐文章于 2024-07-08 08:00:00 发布

weixin_39613291

最新推荐文章于 2024-07-08 08:00:00 发布

阅读量90

点赞数

文章标签：概要设计的作用

本文链接：https://blog.csdn.net/weixin_39613291/article/details/111337431

版权

保持学习，保持新鲜。

每日外文学习，获得行业最新动态，了解行业最新理念。包括视觉设计，动效设计，产品设计，用户体验，设计系统，设计原则等等知识。记录文章概要快速预览学习，有兴趣的可以文末查看原文了解更多或留言讨论。

文章概要：

微交互例子
什么是微交互
为什么使用微交互
微交互的制作工具

作者在教不怎么使用电子产品的爷爷体验Facebook时，发现爷爷被FB的”点赞”功能的表情微交互深深的吸引，说明了微交互对于产品或应用程序的强大作用。

微交互例子

点赞是最常见的微交互动画，此外，还有一些例子有：

滚动条：滚动鼠标时，出现的简单滚动条
左滑：iphone左滑清楚通知中心的消息
正在输入：能够看到对方正在打字
进度条：百分比的进度条告知用户当前状态
下拉刷新：重新加载页面内容
错误提示：如Chrome断网时的小恐龙游戏

什么是微交互

微交互和界面上的其他交互一样，为用户传达有意义的反馈，用户需要时刻知道当下发生什么以及会发生什么。（在之前的文章对微交互的定义是用户与界面进行交互的小瞬间。）

为什么使用微交互

作者直接列举了一些微交互成功的具体案例：

滑动手势：使用手势来隐藏一些功能节省界面的空间，展示更重要的信息，比如常见的左滑删除。
快速行动：苹果手机按住应用图标时触发的3D touch，展示一些应用的基础功能，缩短用户的操作流程，节省时间。
传递信息：通过微交互和视觉效果帮助用户清楚地认知和传达复杂的信息，苹果的信用卡功能使用一个循环互动的动画告知用户最低和最高的费用。
互动参与：有时，我们希望用户通过让他们惊喜的方式与界面进行交互，这种惊喜与行动相结合的效果非常有效。比如持续点赞按钮，用户可以一直点赞来提高自己某种排名。
提供反馈：动效可以有效地为系统提供反馈，比如输入框的正确状态或报错，输入密码的正确和错误反馈，iphone解锁密码错误时的抖动。
新手引导：当推出新产品或新功能时，微交互可以帮助用户更好的理解如何使用功能，会比文字说明更加直接和可观。
引导用户注意力：当界面被大量的信息填满时，一般很难突出一个特定的功能或状态引起用户的注意，微交互可以解决这样的问题。比如只有当用户输入了有效的信息后，按钮从置灰变为高亮。
增加趣味性：大多数加载页面都是无趣的，比如一个百分比的变化。微交互的动画可以让它们变得更加有趣。比如我们可以看到很多有趣的加载状态的设计。

最后，当设计总是设身处地为客户着想的时候，功能动画应该优先于视觉动画。