超周全!如何做好應(yīng)用程序中的反饋設(shè)計(jì)?
Echo :反饋是用戶做了某項(xiàng)操作之后,應(yīng)用體系給用戶的一個(gè)相應(yīng)。這個(gè)相應(yīng)根據(jù)場(chǎng)景的不同會(huì)有不同的相應(yīng)情勢(shì)和不同作用。
為什么反饋設(shè)計(jì)是用戶體驗(yàn)緊張的一環(huán)?
在人機(jī)交互的過(guò)程中,用戶盼望看到每一步都清晰,及時(shí)的表現(xiàn),用戶盼望了解每一步的后果以及用戶最關(guān)心的題目是什么。一方面,PC端和移動(dòng)端產(chǎn)品必要保證產(chǎn)品有積極,及時(shí)的反饋相應(yīng)以確保用戶知道本身所處的狀況,否則會(huì)讓用戶覺(jué)得反應(yīng)遲鈍;另一方面,我們也要避免過(guò)度的信息反饋,尤其細(xì)致不要反饋錯(cuò)誤信息,錯(cuò)誤的信息對(duì)用戶造成的影響是偉大的。
產(chǎn)品的反饋直觀的體現(xiàn)為界面的轉(zhuǎn)變(少數(shù)為聲音和震蕩),通過(guò)這種轉(zhuǎn)變使的用戶能夠更加友愛(ài)高效地與產(chǎn)品進(jìn)行交互,更加埋頭地投入到義務(wù)流程當(dāng)中去。
舉個(gè)栗子:當(dāng)用戶實(shí)行完一步操作后,體系沒(méi)有及時(shí)甚至沒(méi)有給出響應(yīng)的反饋提醒,就會(huì)給用戶帶來(lái)迷惑(實(shí)現(xiàn)模型與生理模型沖突),讓用戶不能確定本身的操作是否被實(shí)行、實(shí)行是否成功、實(shí)行團(tuán)體進(jìn)度、或者是實(shí)行后會(huì)產(chǎn)生怎么樣的影響、能在哪里查詢到效果以及實(shí)行后是否可以被撤銷等等。而這其中的任何一個(gè)環(huán)節(jié)都有可能影響到用戶對(duì)當(dāng)前義務(wù)的理解以是否實(shí)行下一步操作,從而影響到產(chǎn)品的用戶體驗(yàn)。
反饋的設(shè)計(jì)應(yīng)該知足以下四個(gè)原則:
- 反饋通過(guò)直觀的表現(xiàn),可以幫助用戶理解微交互的規(guī)則,最大可能地降低用戶的學(xué)習(xí)成本。
- 別讓反饋給用戶造成壓力,通過(guò)最少的反饋傳達(dá)同樣的信息。
- 反饋應(yīng)該由需求驅(qū)動(dòng),然后在恰當(dāng)?shù)膱?chǎng)景下和時(shí)間下讓用戶知道他必要知道的事情。
- 反饋的速度盡可能的快,反饋過(guò)慢會(huì)給用戶感覺(jué)產(chǎn)品的性能差。
對(duì)于用戶而言,反饋設(shè)計(jì)的目的重要告訴用戶以下幾點(diǎn):
- 告訴用戶發(fā)什么了什么?
- 用戶剛剛做了什么事?
- 哪些過(guò)程已經(jīng)開始了?
- 哪些過(guò)程已經(jīng)結(jié)束了?
- 哪些過(guò)程正在進(jìn)行中?
- 用戶不能做什么?
- 用戶剛剛操作的效果是什么?
在設(shè)計(jì)過(guò)程中,涉及到反饋的情況一樣平常分為五種類型:
1.效果反饋
告知用戶的操作效果。例如操作成功或者操作失敗、對(duì)操作后的一種確認(rèn)。
a.以toast情勢(shì)給用戶反饋。例如:微信轉(zhuǎn)發(fā)他人信息,出現(xiàn)toast,提醒用戶已經(jīng)發(fā)送成功。
b.以浮層動(dòng)畫的情勢(shì)給用戶反饋。例如微信輸入語(yǔ)音時(shí),出現(xiàn)浮層動(dòng)畫提醒用戶的語(yǔ)音輸入是有用的。
2.狀況反饋
操作前后展示結(jié)果不一樣。
當(dāng)用戶操作后,界面操作前的狀況和操作后的狀況不同等。通過(guò)這個(gè)不同等,給用戶反饋我的操作得到了提交。
3.過(guò)渡反饋
有些時(shí)候程序確實(shí)不夠快,緩慢的加載速度和耽誤題目,這時(shí)候通過(guò)常見(jiàn)的過(guò)渡組件給用戶反饋,過(guò)渡反饋的目的在于通過(guò)向用戶反饋當(dāng)前的相應(yīng)進(jìn)度和合理的時(shí)間消費(fèi)來(lái)讓用戶在等待過(guò)程中放松下來(lái)。
a.以進(jìn)度指示器給用戶反饋當(dāng)前狀況。例如欣賞器在點(diǎn)擊搜索后,網(wǎng)頁(yè)加載的進(jìn)程反饋。
b.以體系/自定義的循環(huán)動(dòng)畫,例如iOS的菊花Loading 和安卓的圓形Loading 。
例如:微博問(wèn)答,點(diǎn)擊立即付出然后出現(xiàn)的過(guò)渡動(dòng)畫。
例如:YouTube網(wǎng)頁(yè)加載過(guò)渡的圓形Loading 。
4.操作反饋
對(duì)下一步操作的指引,用戶點(diǎn)擊一個(gè)操作就出現(xiàn)新的操作組件以此給用戶的反饋。
當(dāng)用戶進(jìn)行一個(gè)操作后,出現(xiàn)反饋,這個(gè)反饋通常是通過(guò)浮層彈框、調(diào)起鍵盤、進(jìn)入下一個(gè)界面等等情勢(shì)體現(xiàn)。
例如:iOS原生郵件,點(diǎn)擊回復(fù)/轉(zhuǎn)發(fā)出現(xiàn)底部浮層。
5.聲音和震蕩的反饋
聲音和震蕩也是反饋的一種的體現(xiàn)情勢(shì),通過(guò)用戶的操作加以聲音和震蕩的指導(dǎo),給用戶很強(qiáng)的生理暗示。
例如QQ郵箱,發(fā)送過(guò)程和成功后都有聲音提醒。這是一個(gè)很典型的通過(guò)聲音反饋的例子。
如何判斷你的反饋設(shè)計(jì)是有用的,非過(guò)度的反饋
上面介紹的反饋的各種類型。但是許多情況設(shè)計(jì)師們過(guò)度使用反饋。常見(jiàn)的情況是過(guò)度使用Toast。
例如貓眼:點(diǎn)擊已想看愛(ài)心變灰,同時(shí)出現(xiàn)Toast提醒。如許就存在過(guò)度的反饋。反觀Instagram點(diǎn)擊取消點(diǎn)贊,就沒(méi)有出現(xiàn)Toast提醒。
為什么我說(shuō)貓眼的反饋過(guò)度呢?由于用戶點(diǎn)擊操作時(shí),愛(ài)心狀況已經(jīng)變了,那么這個(gè)元素的轉(zhuǎn)變已經(jīng)暗示用戶,該App進(jìn)行了反饋,沒(méi)需要在出現(xiàn)Toast提醒。
如何判斷你的涉及反饋是否過(guò)度?
在設(shè)計(jì)反饋時(shí),假如已經(jīng)有一組元素的轉(zhuǎn)變足以暗示用戶當(dāng)前狀況得到了反饋,那么沒(méi)需要再增長(zhǎng)多余的元素進(jìn)行反饋提醒(除非有分外的目的)。如許會(huì)使得用戶的生理負(fù)擔(dān)變重,一個(gè)反饋可能不足以影響用戶體驗(yàn),假如整個(gè)App都出現(xiàn)這種情況,那將是一場(chǎng)災(zāi)禍。
迎接關(guān)注作者的微信公眾號(hào):「UEDC」
本文地址:http://pkvc.cn/tutorial/di3920.html
您可能還喜歡
- Macaron 馬卡龍系色譜 ;附HC(16進(jìn)制碼
- 7個(gè)手機(jī)版網(wǎng)頁(yè)設(shè)計(jì)的原則
- 折紙多邊形網(wǎng)頁(yè)背景效果制作教程
- 龐門正道:好好玩耍的點(diǎn)線面(上)
- 網(wǎng)頁(yè)設(shè)計(jì)中的常見(jiàn)頁(yè)面布局方式
- WAP APP的柵格設(shè)計(jì)
- 八種很漂亮的排版方法和技巧分享
- 網(wǎng)頁(yè)設(shè)計(jì)的首屏標(biāo)準(zhǔn)你了解多少?
- 字體大寶庫(kù):40款為網(wǎng)頁(yè)設(shè)計(jì)師準(zhǔn)備的時(shí)
- 視覺(jué)設(shè)計(jì)分享—專題頁(yè)面設(shè)計(jì)篇
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問(wèn)題
- 網(wǎng)頁(yè)設(shè)計(jì)精粹 網(wǎng)頁(yè)中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁(yè)UI - 原子設(shè)計(jì)理論(上)
- 如何通過(guò)設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺(jué)設(shè)計(jì)系列文章(二):全屏