譯文 | 微交互:設計優(yōu)秀app的秘密

好的產(chǎn)品往往做好了兩點:功能和細節(jié)設計。功能吸引用戶使用你的產(chǎn)品四苇,細節(jié)設計將你的用戶留下装处。優(yōu)秀的細節(jié)設計能夠使你的產(chǎn)品在眾多競品中脫穎而出,優(yōu)秀的微交互設計往往能夠讓用戶在初次使用產(chǎn)品時就能夠留下深刻的印象挣郭。作為一個交互設計師迄埃,在設計微交互方案的時候不僅要考慮視覺上的沖擊力,還要想辦法賦予其信息傳遞的功能兑障。

什么是微交互侄非?

微交互是產(chǎn)品中存在的某一個時刻,它完成了某一個小的任務流译。Dan Saffer在他的書中(Microinteractions)第一次描述了微交互的概念逞怨,這些小細節(jié)專注于服務這些必要的功能:

交流回饋或者動作的結果回饋

完成某個單獨的任務

增強直接操作的感覺

幫助用戶在視覺上展示操作的結果,以及避免錯誤

一些明顯的微交互例子包括:

當你將iPhone設置成靜音時伴隨出現(xiàn)的的震動提醒福澡、屏幕上的靜音icon


界面動畫提示是否能夠點擊(當鼠標移到按鈕上方時按鈕的顏色改變)


為什么使用微交互叠赦?

微交互是在對用戶一些自然的需求/欲望的認知和反饋。用戶從微交互提供的視覺革砸、觸覺等反饋中確認他們的行為被接受除秀。微交互還可以引導用戶正確的使用系統(tǒng)/產(chǎn)品窥翩。

定義微交互的使用情景

微交互的一個特點是它可以被放置在很多的場景下,輔助不同的動作行為鳞仙】芪茫總體來說,微交互的使用場景包括:

展示系統(tǒng)/產(chǎn)品的狀態(tài)

Jacob Nielsen在“可用性啟發(fā)原則”中指出:讓你的用戶時刻了解發(fā)生的事情棍好,用戶期望對自己的行為立即得到反饋仗岸。但是有些情況下,app需要時間來等待行為處理完成后才能向用戶發(fā)出反饋借笙。因此扒怖,產(chǎn)品界面需要向用戶指明此刻正在發(fā)生的事。


下載進度表

或者標明用戶所在的位置:


scrolling bar progress

Tips:不要讓你的用戶感到無助业稼,讓你的用戶了解實時的狀態(tài)并且向其展示進度(比如進度條能夠讓用戶了解進度盗痒,消除疑惑)

提示更新

我們有時需要向用戶推送通知來保證用戶了解到事態(tài)的更新。動畫可以做到這一點低散,動畫可以吸引用戶的注意力俯邓,避免用戶忽視掉重要的信息。


new incoming message


Tips:微交互里的動效應該遵循KISS原則(keep it simple, stupid),應該盡量簡單直接熔号。

關聯(lián)上下文

使用動效來將用戶的注意力平滑的在導航頁面間切換稽鞭,向用戶解釋頁面里元素之間的關系,以及頁面跳轉的來龍去脈引镊。這對于移動設備非常有用朦蕴,因為屏幕的尺寸限制,移動界面中每一頁的內(nèi)容都很緊湊弟头,使用動效來闡述內(nèi)容之間的聯(lián)系非常實用吩抓,(關聯(lián)閱讀:我在“如何合理的在移動應用中使用動效”一文中也有涉及)

Tips:盡量讓每個頁面的導航簡潔,這樣可以有效避免用戶在頁面跳轉中迷失赴恨。兩個狀態(tài)之間的卻換應該清晰疹娶、平滑、快捷嘱支。在視覺上統(tǒng)一所有的交互形式蚓胸,降低用戶的學習成本。

輸入可視化

數(shù)據(jù)輸入是應用中非常重要的環(huán)節(jié)除师,微交互可以使用現(xiàn)有的元素來展示數(shù)據(jù)輸入的反饋,從而將這步操作變得更加高效扔枫。


Tips:微交互能夠幫助用戶理解信息格式汛聚,來源,幫助用戶便捷輸入信息短荐。

引導互動

微交互可以鼓勵用戶倚舀、吸引用戶與產(chǎn)品交互叹哭。它可以在用戶體驗中產(chǎn)生同理心。但是需要謹慎使用微交互痕貌,保證其在感官上不會冒犯你的用戶风罩。時刻謹記-不要讓用戶感到厭煩,Keep it simple, stupid.


Tips:關注用戶的情感反饋舵稠,因為它在用戶體驗中起到很重要的作用超升。多做用戶研究和情景調研,設計能被用戶頻繁使用的微交互方案哺徊。

值得謹記的

微交互向用戶展示動作反饋室琢,通知以及信息框架結構

微交互應該通過轉移用戶的注意力、愉悅用戶等來達到加快/縮短信息數(shù)據(jù)的傳輸

了解你的用戶以及使用微交互的背景落追,能夠讓你的微交互方案更加的精準與高效

微交互必須能夠支持長時效的使用盈滴,在第一次使用時感到驚喜的方案,可能在第一百次使用時就變成了困擾轿钠。

微交互方案應該人性化一些巢钓,并且在視覺上保持和諧。用戶在使用的時候應該感到流暢疗垛,微交互的方案應該盡可能的從現(xiàn)實生活中獲得啟發(fā)竿报,比如使用擬物化等手段,從而降低學習成本继谚。

總結

用心設計烈菌,思考用戶使用產(chǎn)品的情景,再設計這些微交互時多運用一些生活中常見的操作模式花履、物體的運動軌跡芽世、常見的行為方式等。產(chǎn)品的易用性來源于對細節(jié)的打磨诡壁,偉大的設計不僅僅在功能上滿足用戶的需求济瓢,還要在微交互的設計上打動人心。

原文作者:Nick Babich

原文鏈接:https://uxplanet.org/microinteractions-the-secret-to-great-app-design-4cfe70fbaccf#.ex5uuxmg1

最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末妹卿,一起剝皮案震驚了整個濱河市旺矾,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌夺克,老刑警劉巖箕宙,帶你破解...
    沈念sama閱讀 211,194評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異铺纽,居然都是意外死亡柬帕,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,058評論 2 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來陷寝,“玉大人锅很,你說我怎么就攤上這事》锱埽” “怎么了爆安?”我有些...
    開封第一講書人閱讀 156,780評論 0 346
  • 文/不壞的土叔 我叫張陵,是天一觀的道長仔引。 經(jīng)常有香客問我扔仓,道長,這世上最難降的妖魔是什么肤寝? 我笑而不...
    開封第一講書人閱讀 56,388評論 1 283
  • 正文 為了忘掉前任当辐,我火速辦了婚禮,結果婚禮上鲤看,老公的妹妹穿的比我還像新娘缘揪。我一直安慰自己,他們只是感情好义桂,可當我...
    茶點故事閱讀 65,430評論 5 384
  • 文/花漫 我一把揭開白布找筝。 她就那樣靜靜地躺著,像睡著了一般慷吊。 火紅的嫁衣襯著肌膚如雪袖裕。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,764評論 1 290
  • 那天溉瓶,我揣著相機與錄音急鳄,去河邊找鬼。 笑死堰酿,一個胖子當著我的面吹牛疾宏,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播触创,決...
    沈念sama閱讀 38,907評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼坎藐,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了哼绑?” 一聲冷哼從身側響起岩馍,我...
    開封第一講書人閱讀 37,679評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎抖韩,沒想到半個月后蛀恩,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,122評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡帽蝶,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,459評論 2 325
  • 正文 我和宋清朗相戀三年赦肋,在試婚紗的時候發(fā)現(xiàn)自己被綠了块攒。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片励稳。...
    茶點故事閱讀 38,605評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡佃乘,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出驹尼,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 34,270評論 4 329
  • 正文 年R本政府宣布浸卦,位于F島的核電站该默,受9級特大地震影響,放射性物質發(fā)生泄漏地啰。R本人自食惡果不足惜愁拭,卻給世界環(huán)境...
    茶點故事閱讀 39,867評論 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望亏吝。 院中可真熱鬧岭埠,春花似錦、人聲如沸蔚鸥。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,734評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽止喷。三九已至馆类,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間弹谁,已是汗流浹背乾巧。 一陣腳步聲響...
    開封第一講書人閱讀 31,961評論 1 265
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留预愤,地道東北人沟于。 一個月前我還...
    沈念sama閱讀 46,297評論 2 360
  • 正文 我出身青樓,卻偏偏與公主長得像鳖粟,于是被迫代替她去往敵國和親社裆。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 43,472評論 2 348

推薦閱讀更多精彩內(nèi)容