微交互在用户体验设计中并不是一个全新的概念，但它们越来越令人印象深刻，因为它们对互联网上的项目整体成功起到至关重要的作用。
微交互是那些将普通用户体验变成更加令人难忘的微小细节。让你惊喜的小事情，为你的应用或网站设计增加一层令人愉快的用户体验。
下面我们来看看设计师们在2023年是如何使用微交互的，通过例子，你可以了解这种设计技术是如何发展起来的，以及它独特的魅力。
功能设计（Design for Function）
动画+说明。
当你开始思考如何最好地设计微交互时，让“简单”这个短语反复出现在你的脑海中。每一个网站都应该做同样的思考。
动画是吸引用户进入元素的一个关键点。说明可以帮助他们理解按钮、拨动开关或图标的用途以及如何使用它们。
每个微交互以微秒的方式提供一系列信息：
· 触发：微交互何时开始或为什么开始
· 规则：是什么让动作/交互起作用，以及它如何起作用
· 反馈：你如何通过某种线索知道你对元素的操作是成功的
· 循环和模式：对于特定用户，在重置之前交互持续多长时间
去看看上面明暗模式切换的例子。滑动开关，一切完全按照你所期望的那样工作，没有太多麻烦和费解的地方。它有一个简单的动画，解释了如果你拨动开关会发生什么。这是一个固态的微相互作用。
增加趣味（Have Fun）
微互动应该是有趣的。它是吸引眼球的元素，可以帮助引导用户理解一些现代的，可能意想不到的设计。
Aurelia Durand的网站设计充满了令人惊喜的微小互动。指针是一只小手，用来点击适当的区域，悬停在菜单上，并获得一系列彩色圆点来鼓励操作，主要插图的变化和动画也是悬停状态微交互的一部分。
彰显个性（Show Personality）
你可能一直接触到的最被低估的微交互之一就是Facebook的反应功能栏（Facebook还不时在手机logo上添加一些漂亮的微互动）。
这就是为什么这个方法有效——当你点击或长按时，每个小表情符号似乎都有了生命，显示出一种真实的情感表达供你选择。这比快速点击经典的、竖起大拇指的蓝色图标更有个性、更真实。
这些小元素也有悬浮状态，告诉你每个表情符号/图标的含义。这一额外的信息使微交互更加有用，并为任何用户在选择他们对社交媒体上的帖子的感觉时做出正确的选择提供了工具。
如果添加了新的表情符号或图标，这一额外的信息层就会特别重要。
微交互动画是有效的（Subtle Animation Can Be Effective）
虽然一些微互动更具爆炸性，但许多是几乎不被注意到的微妙变化。
一个好的微交互应该是几乎看不见的。你不应该思考它，也不应该质疑它为什么在那里，或者如何与它互动。UX Magazine是这样描述它的：“确保微动画不会让人觉得尴尬或讨厌。普通而微小的行动需要温和的回应。偶尔的重大行动需要坚定的回应”。
一个很好的例子就是带有汉堡或弹出式菜单的微交互。
Lucid Reality Labs有一个双线图标（右上角），它会切换成单线，然后在菜单打开时显示“X”。当点击“x”关闭时，它会使另一个动画。它是如此简单，以至于你几乎看不到它。
屏幕中央的立方体也会发生二次交互。
设计需要与内容和谐（Design for Harmony with Content）
每个微互动都应该与相关内容和谐共处。
你并不是在幻想中进行设计，所以不要让你创造的理念或内容优先于布局和整体，设计需要同步。
《如何与白人孩子谈论种族主义》（How to Talk to White Kids About Racism）的微互动非常简单，并与其余设计完全整合在一起。它们包含了一定程度的细节，使读者在阅读这本书的电子版时感到愉快。
每个时间轴微交互都包括一个与之相关的页面上的内容相匹配的图标和内容的标题。它可以放大到一定大小，这样你就可以看到艺术品，简单的动作很吸引人。
该设计还包含了其他令人愉快的动画，例如翻页（单页和翻转），使整个设计成为你想要深入研究的东西。
使用触觉元素（Use Tactile Elements）
想想你每天使用的一些工具在你与它们交互时是如何运作的。
· 当你点击一个按钮时，你的苹果手表的触觉
· 你手机上的提示音
· 当你与Siri或其他设备交谈时的聆听点
· 在你散步或跑步时，轻微的嗡嗡声标记每一英里
· 耳机连接蓝牙时的声音
所有这些融合了数字和现实的元素都是为了加强更好的触觉体验，将空间结合在一起。微互动是一种很好的方式。
你可以使用：
· 感觉
· 声音
· 推移
· 弹跳
· 振动或嗡嗡声
有很多方法可以做到这一点。共同点是它们看起来和感觉起来都是真实的。它们不是屏幕的一部分，而是你的物理世界的一部分。
总结
2013年左右，Dan Saffer在他的书中首次提到了微相互作用。他当时概述的四个组件仍然是这些微型网站交互的关键部分——触发器、规则、反馈、循环和模式。
如果你仔细观察，你可以在几乎所有的微互动中看到这些常见元素。
我们也希望看到更多简洁的微交互的例子。
----图文来自：design shack