最好的產品通常會做好兩件事情：功能和細節。功能能夠吸引用戶關注這個產品，而細節則能夠讓關注的用戶留下來。

一、什么是微交互？

在用戶體驗設計中，微交互指的是以一種積極且令人愉快的與用戶互動的方式。它們是用戶體驗產品時進行交互要做的基本任務。如果設計得當，當用戶與網站交互時，它會提供一種積極的反饋，用戶也會覺得自己是網站轉換和移動的一部分，但是對這些交互的響應也必須自然而直觀。

二、為什么需要動效？

1. 增加體驗舒適度：流暢的微動效體驗，讓用戶的認知過程更加的自然，降低卡頓或等待的焦慮；
2. 吸引用戶，輔助理解：場景化動畫、動態圖標微交互設計；
3. 更清晰的表明層級關系：通過交互動畫、漸進式的信息呈現；
4. 提升產品視覺品質。

三、微交互的例子

響應式交互向用戶顯示了他們的操作有效或已被網站接受，而且大多數情況下，用戶不會注意到它們。網站對微交互的響應應該是界面的無縫方面。用戶可能沒有意識到它，但是微交互可以制造或破壞UX。

但是，微交互不僅與網站的設計有關。它們是任何一部具有響應式設計功能的設備一部分。微交互的一些示例包括將智能手機設置為靜音時會振動，或者當用戶“喜歡” Facebook上的東西時會發出聲音。

這樣的互動可能是巴甫洛夫式的，用戶覺得自己的互動受到了好評?！跋矚g”某人的身份，并有成就感；切換手機使其振動，手機就會以最安靜的方式告訴用戶，手機已經完成工作。

在為網站創建微交互時，希望用戶具有相同的積極體驗。這樣做，用戶將自動獲得更好的體驗，甚至都不知道為什么。

利用微交互功能獲得更好的用戶體驗。

現在，已經了解了為什么，現在考慮一下微交互可以在哪些方面產生最大的影響。這是八種微交互，可增強用戶體驗。

1. 調整首選項

如果用戶可以控制網站上的音量設置，亮度或其他偏好設置，請添加微交互功能。在用戶調整關卡時與用戶互動或移動的小徽標是與用戶互動的好方法。

2. 消息或評論

反饋或評論的區域本身就是微交互。用戶應該有一個可以訪問您的區域。如果不回應或不善回應，這可能適得其反。

考慮門票銷售公司TickPick。當它未能在其密歇根州地圖上包括上半島時，其居民很快就將該公司告知。TickPick在社交媒體上的回應并沒有贏得任何分數：“我們擁有密歇根州的重要組成部分，這還不夠嗎？” 然后，他們沒有道歉，而是說：“我們確定密歇根州上半島是一個宜居的地方，我向您保證，我們沒有故意將其遺忘在地圖上。但是說真的，那只是一堆森林?！?/p>

盡管所有者確實對社區進行了補償，但它并不便宜。他飛到該地區，并在一家高檔啤酒吧上為當地人蓋了標簽。這是所有企業都可以學習的課程–培訓您的社交媒體響應團隊并保持積極的態度。

3. 上傳或下載狀態欄

在決定上傳或下載某些內容后，沒有人會感到被遺忘。讓用戶知道上傳或下載時發生了什么，他們可能會堅持下去。如果他們不確定自己是否完成了任務，他們將不會對此感到滿意。

4. 通知

如果用戶從網站收到任何類型的通知，則涉及微交互。開發動畫通知會引起用戶的注意，并表明他們需要簽出一些重要的內容。

當通知有趣且引人入勝時，用戶會將這些感覺與業務聯系在一起。

5. 下拉菜單

當用戶在移動設備上查看您的網站時，需要分開分開的頁面。頁面上的下拉菜單使用戶可以在頁面之間快速來回移動而不會失去位置。沒有這種簡單的響應，用戶可能會對導航感到沮喪。

6. 載入頁面

網站可能包含比其他頁面加載時間更長的頁面。一個小的交互通知用戶頁面仍在加載中，從而使他們保持參與，并告訴他們何時完成加載。

這是對用戶的禮貌，并有助于保持較低的跳出率。當消費者知道頁面正在加載時，假設站點完全無響應，他們就不太可能拋棄該頁面。

7. 可視化輸入

在網站上輸入數據的用戶希望能夠查看它。如果他們正在填寫聯系頁面或輸入信用卡信息，則可視化顯示他們已經正確輸入了信息。這種微交互與娛樂性無關，而與清晰度和安全性有關。

視覺輸入建立了對用戶的信任，并給人以產品可信的感覺。

8. 響應性號召性用語

微交互正在吸引用戶，并可以誘使他們根據號召性用語（CTA）采取行動，這是擁有網站的關鍵原因。

使用視覺提示或動畫吸引用戶的注意力并鼓勵他們點擊。不希望這種交互過于麻煩或煩人，因為用戶不太愿意響應。

四、使微交互有效的四個關鍵步驟

1. 觸發：這是提示或可視化提示用戶繼續前進；
2. 規則：微交互的參數向用戶顯示了交互將執行的操作；
3. 意見反饋：當用戶單擊微交互時，他們應該收到響應；
4. 循環和模式：考慮使用微交互的頻率以及如何使新用戶和舊用戶都可以識別它們。循環是交互變得熟悉的地方。該模式是一個不同的反饋響應，向用戶顯示該交互與第一次不同。

當利用微交互功能獲得更好的用戶體驗時，無論如何，都在與Web設計的各個方面建立積極的聯系。在為網站創建微交互時，請考慮以上想法。

原文：https://speckyboy.com/eight-microinteractions-better-user-experience

作者：Paul Andrew

譯者：無尾熊，公眾號：冬熊設計，歡迎關注，一起成長！

本文由無尾熊翻譯發布于人人都是產品經理。未經許可，禁止轉載！

題圖來自Unsplash，基于CC0協議。