如下內容由Mockplus團隊翻譯整理,僅供學習交流,Mockplus是更快更簡單的原型設計工具。app
最好的產品擁有兩個很棒的特色:功能和細節。產品的功能可成功吸引到人們的注意力,而產品的細節則可留住你的用戶而且細節可以使你的產品在衆多應用程序中脫穎而出。框架
微交互是提供使人愉快反饋的最佳技術之一。工具
全部以人爲中心的設計方法,用戶是核心。微交互經常會被視爲輔助的和次要的,但它一旦被用戶認知便會傳遞出一種幸福感。最爲一名設計師,認識到微交互的隱形性與設計出它們同等重要。你得創造出一些人性化的東西並去完成它。學習
那麼到底什麼是微交互?動畫
在產品中,使用者參與單一任務的過程。翻譯
正如Dan Saffer’s在微交互的書中提到的這些微小的細節一般具有這些基本功能:設計
信息或反饋和操做後的結果圖片
完成一項獨立的任務get
加強直接操縱感原型
幫助用戶可視化其操做後的結果,避免錯誤
一些微交互的實例:
當您將iPhone切換爲靜音時,振動通知與靜音模式圖標一塊兒顯示。
界面動畫可點擊,當鼠標懸停的時候,按鈕可改變顏色。
圖片來源:Dribbble
爲何微交互有用?
微交互有用是由於它們迎合了用戶對承認的天然慾望。用戶可當即知道他們的操做被接受了並且可經過視覺上的感覺得到一種知足。
識別機會
微相互迷人之處就在於它能夠插入到各類場合中,包括任何潛在的動做。通常來講,他們每每會出如今如下幾個方面:
顯示系統狀態
Jakob Nielsen的第一個可用性啓發式原則指出:讓用戶瞭解發生了什麼。用戶但願當即得到迴應,但有一些應用須要一段時間才能完成操做。
因此界面的設計應該讓用戶對發生的事情有所瞭解。
進度欄上傳和下載
或者用戶在哪裏:
滾動條進度
突出顯示更改
有時咱們必須顯示通知以確保用戶能夠看到。動畫可幫助吸引用戶的注意力而且不會讓他們忽略一些重要的事情。
新收到的消息
注意:在許多狀況下,動畫效果用來吸引用戶對一些重要細節的關注。你應該使用KISS原理 - 微交互應該短小是而簡單的。
保持內容一致
利用流暢的操做來傳輸信息給用戶,解釋屏幕上元素排列的變化。這對於移動設備和智能手錶尤爲如此,由於在一個屏幕上徹底不可能裝上大量的信息。
不一樣頁面間應保持導航的簡潔以致於用戶能夠明白從哪裏出現了什麼。兩個視覺狀態之間的轉換應該是清晰,流暢和絕不費力的。統一主題-建立一個統一的主題,將全部交互結合在一塊兒。
可視化輸入
數據輸入是全部應用程序中最重要的元素之一。而微交互則將這一過程轉變爲了一件特別的事情。你可使用現有元素來提供反饋。
注:微交互有助於揭示信息,幫助用戶達成目標。
用戶行動的呼籲
微交互有一種鼓勵用戶進行實際交互的能力。他們能夠在用戶體驗爲用戶帶來一些共鳴。但請確保視覺感覺和動畫適合你的用戶,而且長期保持 - 在第100次使用中,微交互會變得煩人嗎,仍是廣泛簡潔而不引人注目?
注:重視用戶的情緒,由於他們在用戶交互中扮演着十分重要的做用。借鑑內容和用戶研究與設計進行重複使用。
你須要記住的事情:
微交互是互動、反饋、通知和指示的促進者。
微交互應該當即傳達出信息而且以一種不會讓用戶感到無聊及分散注意力的方式來節省時間。他們應該像狡黠的眼神同樣抓住用戶的注意力。
瞭解你的用戶和微交互背後的內容將使它們更加精確和有效。
微交互必須經受長期使用。第一次使用以後會以爲有趣,但100次使用以後可能會讓用戶感到厭煩。
將人性化設計添加到微交互中而且着眼於視覺上的統一,操做應如液體般靈活流暢才能顯得微交互更真實。
總結:
用心設計。考慮人們如何使用他們的設備,並在設計這些小東西時反映常見的思惟模式。注意每個細節都是令人機交互易於使用的關鍵。偉大的設計必須是一個完整的框架,從部分功能到微觀交互。
原文做者:Nick Babich
原文網址:https://uxplanet.org/microinteractions-the-secret-to-great-app-design-4cfe70fbaccf
學習工具,但不受限於某種工具。Mockplus作原型,更快更簡單,如今下載Mockplus,免費體驗暢快的原型設計之旅。