微交互怎么玩？一份简单实用的微交互设计指南

在功能相似的情况下，如何让用户一见钟情？微交互是决定用户印象的关键之一。今天，这篇好文章列出了使用微交互的注意事项，以及五个最常见的使用场景，都是干货，收集！

好的产品通常有两点：功能和细节设计。

该功能吸引用户使用您的产品，细节设计留下您的用户。优秀的细节设计可以使您的产品在许多竞争产品中脱颖而出，优秀的微交互设计通常可以让用户在第一次使用产品时留下深刻的印象。作为一名交互式设计师，在设计微交互方案时，我们不仅要考虑视觉影响，还要找到赋予其信息传输功能的方法。

什么是微交互？

微交互是产品中存在的一个时刻，它完成了一个小任务。Dan Saffer在他的书中（Microinteractions）这些小细节首次描述了微交互的概念，专注于服务于这些必要的功能：

交流反馈或动作结果反馈

完成单独的任务

增强直接操作的感觉

帮助用户在视觉上展示操作结果，避免错误

一些明显的微交互例子包括：

当您将iPhone设置为静音时，屏幕上的振动提醒和静音icon。

是否可以点击界面动画提示(当鼠标移动到按钮上方时，按钮的颜色会发生变化)。

为何使用微交互？

微交互是对用户自然需求/欲望的认知和反馈。用户从微交互提供的视觉和触觉反馈中确认他们的行为被接受。微交互还可以引导用户正确使用系统/产品。

定义微交互的使用场景

微交互的一个特点是，它可以放置在许多场景中来辅助不同的动作。一般来说，微交互的使用场景包括：

展示系统/产品状态

Jacob Nielsen在“可用性启发原则”中指出：让用户始终了解发生了什么，用户希望立即反馈他们的行为。但在某些情况下，应用程序需要时间等待行为处理完成后才能反馈给用户。因此，产品界面需要向用户指示此刻正在发生的事情。

▲ 下载进度表

或标明用户的位置：

Tips：不要让用户感到无助，让用户了解实时状态并显示进度（例如，进度条可以让用户了解进度，消除疑虑）

提示更新

有时我们需要向用户发送通知，以确保用户理解情况的更新。动画可以做到这一点，动画可以吸引用户的注意，避免用户忽略重要信息。

Tips：微交互中的动效应遵循KISS原则（keep it simple, stupid）,尽量简单直接。

关联上下文

使用动态效果在导航页面之间平稳切换用户的注意力，向用户解释页面中元素之间的关系，以及页面跳转的来龙去脉。这对移动设备非常有用。由于屏幕尺寸的限制，移动界面中每一页的内容都非常紧凑。使用动态效果来解释内容之间的联系是非常实用的。

Tips：尽量简化每个页面的导航，有效避免用户在页面跳转中丢失。两种状态之间的变化应清晰、光滑、快速。视觉上统一所有交互形式，降低用户的学习成本。

输入可视化

数据输入是应用中一个非常重要的环节。微交互可以利用现有元素来显示数据输入的反馈，从而使此操作更加高效。

Tips：微交互可以帮助用户理解信息格式、来源，帮助用户轻松输入信息。

引导互动

微交互可以鼓励用户和吸引用户与产品交互。它可以在用户体验中产生同理心。但是，你需要小心使用微交互，以确保它不会在感官上冒犯你的用户。

时刻记住：不要让用户感到无聊，Keep it simple, stupid.

Tips：关注用户的情感反馈，因为它在用户体验中起着非常重要的作用。做更多的用户研究和场景研究，设计用户经常使用的微交互方案。

值得谨记的

微交互向用户显示动作反馈、通知和信息框架结构

微交互应通过转移用户的注意力和愉悦用户来加速/缩短信息数据的传输

了解您的用户和使用微交互的背景可以使您的微交互方案更加准确和高效

微交互必须能够支持长期使用。第一次使用时令人惊讶的方案可能会成为第一百次使用时的麻烦。

微交互方案要人性化，视觉上要和谐。用户在使用时要感觉流畅，微交互方案要尽量从现实生活中得到启发，比如使用拟物化等手段，从而降低学习成本。

总结

仔细设计，思考用户使用产品的场景，然后在设计这些微交互时，使用生活中常见的操作模式、物体的运动轨迹、常见的行为模式等。产品的易用性来自于细节的抛光。伟大的设计不仅能满足用户的功能需求，而且能给微交互设计留下深刻印象。