互聯(lián)網(wǎng)產(chǎn)品設(shè)計(jì)之易用性

流年
4 評論 31278 瀏覽 125 收藏 32 分鐘
🔗 产品经理的职业发展路径主要有四个方向:专业线、管理线、项目线和自主创业。管理线是指转向管理岗位,带一个团队..

對于一個(gè)網(wǎng)站而言,加載時(shí)間、導(dǎo)航視圖、頁面布局,乃至按鈕的大小都屬于易用性范疇。除了網(wǎng)站設(shè)計(jì),易用性同樣適用于移動應(yīng)用和我們身邊其他產(chǎn)品和服務(wù)的設(shè)計(jì)。易用性是產(chǎn)品設(shè)計(jì)的一個(gè)重要原則,是產(chǎn)品競爭力的核心,更是現(xiàn)代企業(yè)不可忽視的商業(yè)準(zhǔn)則。

產(chǎn)品功能性

確保產(chǎn)品/系統(tǒng)可以工作

產(chǎn)品的功能性就是要確保該產(chǎn)品能夠正常的完成工作。如果一個(gè)事物連最基本的功能都無法正常使用,那么無論設(shè)計(jì)的多么美觀也都成了浮云。所以,從功能性開始進(jìn)行可用性的研究是最好的選擇。

就網(wǎng)站而言,用戶對網(wǎng)站的基本需求可以概括為三個(gè)功能:

  1. 按鈕和鏈接點(diǎn)中就有反應(yīng);
  2. 網(wǎng)站導(dǎo)航是靈敏的;
  3. 網(wǎng)站的處理速度是可以接受的。

在越來越注重用戶體驗(yàn)的今天,大多數(shù)網(wǎng)站這三個(gè)方面做的還是比較到位的,我們在建設(shè)網(wǎng)站時(shí)可以多參考目前主流的網(wǎng)站,比如,淘寶、百度、新浪、搜狐等等,這樣可以使我們降低錯(cuò)誤的幾率。

下面就網(wǎng)站中表單來說明一下功能性設(shè)計(jì)

我們創(chuàng)建表單時(shí),有幾個(gè)關(guān)鍵性的因素:

  1. 人們要能夠提供表單中所要求的信息;
  2. 固定的輸入格式會極大地增加表單錯(cuò)誤;
  3. 相互依賴的表單和登錄也會增加出錯(cuò)概率;
  4. 有歧義的使用說明會大大影響用戶的使用。

人們要能夠提供表單中所要求的信息

表單中所要求人們填寫的必要信息被定義為必填字段,已被設(shè)計(jì)界廣泛使用。通常,表單設(shè)計(jì)完成后,一些特定的字段會以某種方式進(jìn)行標(biāo)注,通常用星號(*)表示用戶必須輸入內(nèi)容才能完成表單,這就是必填字段。

這些必填的字段有可能是根據(jù)業(yè)務(wù)需求需要獲得的信息,我們在做設(shè)計(jì)的時(shí)候原則是減少可填寫表單的數(shù)量,盡量減少用戶的輸入操作。但是,有的時(shí)候由于業(yè)務(wù)需求,我們不得不需要用戶提供這些所謂的必填字段,這個(gè)時(shí)候我們要做的就是要最大限度的優(yōu)化操作體驗(yàn)。

無論如何,進(jìn)行表單測試時(shí),我們要確認(rèn)用戶可以不太費(fèi)力地提供表單所需的所有信息。這無疑是提高網(wǎng)站轉(zhuǎn)化的一個(gè)重要因素。

固定的輸入格式會極大地增加表單錯(cuò)誤

字段驗(yàn)證是為了確保計(jì)算機(jī)獲取到可以理解并能夠正確的歸檔到數(shù)據(jù)庫中的數(shù)據(jù)。字段的驗(yàn)證會進(jìn)行語法檢查,確認(rèn)信用卡好欄中輸入足夠長的數(shù)字,等等。用戶是看不到這些規(guī)則的,這就意味著錯(cuò)誤的概率是巨大的。

舉個(gè)例子,如果要獲取用戶的信用卡卡號,用戶在輸入的時(shí)候會直接輸入16位數(shù)字組成的字符,或者用戶會在每4位數(shù)之間插入空格,此時(shí)就會發(fā)生錯(cuò)誤,讓很多人無功而返。顯然,系統(tǒng)要獲得是16個(gè)數(shù)字,不包含空格。此時(shí)我們要做的就是,首先在文本框內(nèi)顯示默認(rèn)文字,如“請輸入信用卡號”,其次,在用戶輸入數(shù)字時(shí)自動用空格符分隔數(shù)字“1234 5678 5488”,最后,當(dāng)用戶輸入了非數(shù)字字符時(shí),在文本框失去焦點(diǎn)時(shí)提示用戶錯(cuò)誤即可。

相互依賴的表單和登錄也會增加出錯(cuò)概率

表單的依賴性指的是在填寫一個(gè)表單后需要提交時(shí),處罰下一個(gè)表單的填寫,也就是如果要提交表單1,前提是要完成表單2的提交。舉個(gè)例子,當(dāng)我們在一個(gè)在線購買電影票的網(wǎng)站挑選電影時(shí),選擇要看的電影后,完成了購買電影票的表單填寫時(shí),這時(shí)需要完成注冊表單的填寫,這時(shí)很讓人崩潰的,注冊完成后要把剛才的操作重新來過。

當(dāng)然,購物車中的連續(xù)頁面這類依賴性的表單并不那么讓人討厭。只有在網(wǎng)站打斷用戶當(dāng)前的操作并要求他去做其他任務(wù)時(shí),才會引發(fā)依賴性表單的問題。當(dāng)用戶按照一定路徑從一個(gè)交互進(jìn)入另一個(gè)交互時(shí),就會對這個(gè)網(wǎng)站的用戶體驗(yàn)產(chǎn)生看法,所以千萬不要打斷用戶的操作。

總之,如果設(shè)置了兩個(gè)或多個(gè)不同的表單,那就奧確保以合適的順序向用戶呈現(xiàn)。同時(shí),要給用戶預(yù)留足夠的時(shí)間來填寫這些表單,免得網(wǎng)頁超時(shí)逼迫用戶重新來過。

有歧義的使用說明會大大影響用戶的使用

有歧義的使用說明會使用戶犯錯(cuò)誤,并且讓用戶摸不著頭腦。在填寫表單時(shí),我們會看到對于不同字段的文字說明,這些說明文字會幫助我們高效的完成表單的驗(yàn)證過程。不過,也有一些例外。比如,在填寫日期的時(shí)候,位于文本框旁邊的提示文字是“請輸入日期,如yyyy/ww/tt”,當(dāng)用戶輸入1989/12/25時(shí),系統(tǒng)卻報(bào)了錯(cuò)誤,原因是計(jì)算機(jī)只接受19891225這種日期格式。

其實(shí),很容易做到讓數(shù)據(jù)庫忽略斜杠、破折號、空格以及其他的特殊符號。在網(wǎng)站中要求特定的輸入格式時(shí),相關(guān)的提示信息要確保準(zhǔn)確無誤,這樣才會保證用戶能順利完成表單的驗(yàn)證。

我們再從導(dǎo)航的靈敏度上看一下功能性

在前面說到的網(wǎng)站導(dǎo)航靈敏度,這個(gè)主要涉及到的是系統(tǒng)的速度和效率。在網(wǎng)站匯總,越來越多的證據(jù)顯示,網(wǎng)頁對于用戶請求反應(yīng)越快,轉(zhuǎn)換率就越高。Google和Amazon都證明了將反應(yīng)時(shí)間縮短半秒會大大提升轉(zhuǎn)換率。導(dǎo)航的靈敏度同樣適用于移動設(shè)備中,用戶們可沒有耐心在點(diǎn)擊了一個(gè)按鈕后,等待幾秒才會繼續(xù)使用。

無論是什么東西,如果你覺得它用起來慢,那我敢保證其他人會覺得它更慢。所以,我們要做些什么來改善這種情形??梢韵葟膲嚎s照片和圖片的文件大小開始,而且只要會用Photoshop之類的圖像處理工具的人,都可以進(jìn)行這樣的操作。經(jīng)驗(yàn)法則就是,任何東西的質(zhì)量如果只是勉強(qiáng)可以接受,那么其尺寸都可以進(jìn)一步壓縮。不要把兩張圖片并列放在一起比對查看,不然你肯定會把文件做得過大,應(yīng)選取針對網(wǎng)絡(luò)展示進(jìn)行優(yōu)化過的照片或圖片。

我們要確保我們設(shè)計(jì)的產(chǎn)品可以正常的工作。在設(shè)計(jì)的過程中我們要經(jīng)常不斷的問自己一些問題,例如:

  1. 你的產(chǎn)品要達(dá)到什么目標(biāo)?
  2. 用戶在使用你的產(chǎn)品時(shí),如果被打斷,他們是否可以恢復(fù)原來的任務(wù)?如果不能,你可以做出什么改動來讓操作變得簡單一些?
  3. 你可以想到一些邊界示例嗎?
  4. 你的表格是否可以容錯(cuò)?后端的業(yè)務(wù)規(guī)則是否要求了過于嚴(yán)格的輸入模式?
  5. 系統(tǒng)中是否有功能問題或者重新設(shè)計(jì)流程或服務(wù)的問題?
  6. 你的系統(tǒng)是否可以在所有的瀏覽器平臺工作?在不同的設(shè)備(智能手機(jī)、平板電腦、便攜電腦)上是否都運(yùn)轉(zhuǎn)良好?
  7. 用戶在操作之后需要等待的時(shí)間是不是會過長?是不是要記性優(yōu)化來減少用戶等待的時(shí)間?

產(chǎn)品響應(yīng)性

用戶知曉產(chǎn)品/系統(tǒng)正在運(yùn)行,并且了解其中的哪些功能正在運(yùn)行

我們在和別人交流的時(shí)候,總是一個(gè)人在說,另一個(gè)在聽。我們會在交談的過程中變換角色,并且重復(fù)這樣的方式知道談話的結(jié)束。在這個(gè)過程中我們需要對方的反饋,比如對方的回應(yīng),點(diǎn)頭、皺眉、微笑等,或者是聲音上的反饋。所有這些情況下,可感知的反饋都是有效溝通的關(guān)鍵部分,對良好的可用性來說也是如此。

如果響應(yīng)機(jī)制不合適,或者完全缺乏響應(yīng)機(jī)制,那么一定會出現(xiàn)可用性的問題。想象一下,你的手機(jī)在來電時(shí)不支持響鈴與振動功能。人們是非常依賴于這種反饋的。

響應(yīng)性的要素

響應(yīng)性可以劃分為三大類:

  • 邀請技巧:吸引眼球的動作,表明會有好事發(fā)生的信號。例如,標(biāo)題廣告、banner等等。
  • 轉(zhuǎn)換技術(shù):立即回應(yīng)用戶所做的事情。例如在瀏覽網(wǎng)頁時(shí),光標(biāo)在可點(diǎn)擊的鏈接上顯示手型,這在技術(shù)術(shù)語上叫做“鼠標(biāo)懸?!?。
  • 響應(yīng)機(jī)制:響應(yīng)機(jī)制指的是用戶完成一個(gè)主觀行動后,所發(fā)生的事情表明用戶操作后的狀態(tài)。比如,在線下載文件時(shí),alert提示正在下載或展示一個(gè)下載 進(jìn)度的提示框。

缺少反饋是一個(gè)比較普遍存在的問題。在現(xiàn)實(shí)世界中,我們希望服務(wù)場所的服務(wù)人員們都會熱情的對我們說“謝謝,希望您有美好的一天”之類熱情的話,對你視而不見是令人不愉快的。在我們?yōu)g覽網(wǎng)頁時(shí),有多少次點(diǎn)擊操作完成后,會經(jīng)歷一段漫長的時(shí)間等待,才會提交我們填寫的內(nèi)容。點(diǎn)擊的按鈕或者是其他什么控件,它需要與服務(wù)器有交互,那么這時(shí)等待是在所難免的,此時(shí)我們在設(shè)計(jì)反饋的時(shí)候就要慎重,不要讓用戶過久等待。一些好的做法:Twitter的點(diǎn)贊無論網(wǎng)絡(luò)強(qiáng)弱,都會顯示成功,其他的就交給系統(tǒng)吧;微信發(fā)布朋友圈,無論是否有網(wǎng)絡(luò)都會顯示成功發(fā)布,其他的也交給了系統(tǒng)處理;注冊/登錄時(shí)通過按鈕的不同狀態(tài)來反饋當(dāng)前狀態(tài)等等。

我們再舉一個(gè)切換提示的例子。

當(dāng)光標(biāo)移動到屏幕上的某個(gè)內(nèi)容時(shí),即光標(biāo)懸停時(shí),快速響應(yīng)是相當(dāng)重要的。通常,光標(biāo)會由箭頭變成伸出一個(gè)手指的小手形狀,你便可以點(diǎn)擊內(nèi)容了。切換提示一般也會伴隨著文字或圖標(biāo)樣式的變化,例如顏色等,當(dāng)鼠標(biāo)經(jīng)過它們時(shí)就會立即觸發(fā)這個(gè)樣式的變化,這樣才可以有效的提示用戶這是可以點(diǎn)擊的。

網(wǎng)絡(luò)環(huán)境中的響應(yīng)機(jī)制

這類反饋有很多,加載中圖標(biāo)、iOS的菊花轉(zhuǎn)、谷歌的旋轉(zhuǎn)圖標(biāo)、蘋果的旋轉(zhuǎn)沙漏光標(biāo)。蘋果的這個(gè)光標(biāo)因?yàn)楣δ茼憫?yīng)比較慢,獲得了很多不太友善的綽號。由此我們可以看出,提供反饋通常可以緩解問題,卻不能解決問題。所以,在處理長時(shí)間的操作時(shí),最好能使用可以顯示進(jìn)度的圖形。

除了基本的屏幕信息,比如“你的文件已經(jīng)成功下載”,以及各種各樣的動畫,我們還可以用各種各樣的設(shè)計(jì)模式來完成不同的任務(wù)。下面是一些比較常用的方式;

  • 亮度調(diào)節(jié):調(diào)亮特定的區(qū)域以表明其處于活動狀態(tài)。比如,微信在收付款時(shí),頁面被自動的調(diào)亮,這樣做既可以告知用戶正在進(jìn)行的操作,也可以避免由于屏幕過暗不方便掃描二維碼。
  • 聲音:不同的操作關(guān)聯(lián)不同的聲音,我們最熟悉的就是手機(jī)收到郵件或短信時(shí)所發(fā)出的不同提示音。淘寶2017版本已經(jīng)把聲音的提示加入了APP中,但是,有一個(gè)問題值得思考,就是當(dāng)用戶不知道當(dāng)前音量的大小時(shí)會被這個(gè)提示音嚇一跳,應(yīng)該考慮結(jié)合手機(jī)將音量控制在不高的范圍。

說起來目前有上千種處理響應(yīng)的技術(shù),有些好,有些壞。但是無論你決定采用哪種響應(yīng)機(jī)制,只要用戶可以看到、聽到或感受到,并且理解了這些響應(yīng)的意思,那就是良好的可用性。

我們要保證系統(tǒng)的響應(yīng)性,就要確保我們的系統(tǒng)/產(chǎn)品:1.點(diǎn)擊按鈕時(shí),要能看到按鈕的反應(yīng);2.指針懸停在一個(gè)鏈接或者其他可交互組件上時(shí),要改變形狀來表明可以點(diǎn)擊的內(nèi)容;3.一些簡單的任務(wù),如下載文件或點(diǎn)擊完成付款流程。在這個(gè)過程中網(wǎng)站要對操作有回應(yīng);4.所有需要很長時(shí)間處理的流程,像下載文件,要提供持續(xù)的反饋來顯示流程的進(jìn)度;5.得到的反饋要及時(shí)。

產(chǎn)品要符合人體工程學(xué)

用戶可以輕松地查看、點(diǎn)擊、彎曲或者翻轉(zhuǎn)

人體工程學(xué)是研究如何設(shè)計(jì)出符合人們生理和心理能力的設(shè)備的科學(xué)。我們對人體工程學(xué)的理解大都停留在辦公環(huán)境人體工程學(xué),比如辦公椅調(diào)整、桌子高度、電腦屏幕位置等等。但是人體工程學(xué)不僅適用于電腦屏幕外圍的各種情況,也適用于發(fā)生在屏幕上的各種事情,在移動端亦是如此。

這里先介紹一下12條基本的人體工程學(xué)原則:

  • 以正常的姿勢工作;
  • 減少過度的壓力;
  • 確保所有的東西都可以輕松獲得;
  • 在合適的高度工作;
  • 減少過度的動作;
  • 盡量減小疲勞和靜載荷;
  • 盡量減少壓力點(diǎn);
  • 提供間隙;
  • 移動、運(yùn)動和伸展;
  • 保持舒適的環(huán)境;
  • 提高清晰度,讓人理解;
  • 改善工作流程。

從可用性的角度來說,這些人體工程學(xué)原則之所以重要,是因?yàn)楸M管它們是根據(jù)實(shí)物世界中的作用效應(yīng)總結(jié)出來的,但對屏幕產(chǎn)品的設(shè)計(jì)也有深遠(yuǎn)的影響。例如:光標(biāo)可以充當(dāng)我們的電子手指,和真實(shí)的手指一樣,它也有能做和不能做的動作。此外,隨著觸摸屏的出現(xiàn),我們的手指通常就是光標(biāo),突然之間,我們發(fā)現(xiàn)自己得同時(shí)應(yīng)付線上的和線下的人體工程學(xué)問題。

說到人體工程學(xué)在屏幕設(shè)備上的應(yīng)用,不得不提到費(fèi)茨定律,定律的內(nèi)容就不多說了,費(fèi)茨定律在設(shè)計(jì)中的作用:

  1. 按鈕等可點(diǎn)擊對象需要合理的大小,例如iOS規(guī)范中的44*44px規(guī)則。
  2. 屏幕的邊和角的位置適合放菜單欄和按鈕這樣的元素。
  3. 出現(xiàn)在用戶正在操作的對象旁邊的控制菜單或工具欄可以被打開的更快,例如點(diǎn)擊鼠標(biāo)右鍵出現(xiàn)在旁邊的菜單。

大目標(biāo)比小目標(biāo)更容易捕捉和使

我們現(xiàn)在的網(wǎng)站出現(xiàn)了很多下拉菜單,它們都會觸發(fā)二級菜單,顯示在自己的側(cè)面。這種下拉菜單要注意的事情是:

確保點(diǎn)擊區(qū)域比鏈接中的文字區(qū)域大。因?yàn)楦?更容易點(diǎn)擊。

確保給用戶足夠的時(shí)間將光標(biāo)移動到相應(yīng)的位置。具體做法:1.光標(biāo)在鏈接上面懸停約0.5秒后,再觸發(fā)擴(kuò)展菜單。2.動畫菜單被觸發(fā)后,就應(yīng)該盡快顯示菜單項(xiàng),如果可能的話,顯示所用的時(shí)間應(yīng)少于0.1秒。3.用戶將光標(biāo)從菜單上移開后,要等待0.5秒再關(guān)閉菜單。這樣,用戶就不必嚴(yán)格地將光標(biāo)固定在菜單的活動區(qū)域中,而可以在操作時(shí)更隨意地移動光標(biāo),也可以選擇比較近的操作路徑。

過延遲下拉菜單/彈出菜單的收起時(shí)間,用戶可以將光標(biāo)直接移到對角線處的菜單項(xiàng)上,而不會觸發(fā)其他菜單項(xiàng)或者錯(cuò)過他們想要點(diǎn)擊的菜單項(xiàng)

屏幕人體工程學(xué)方面的一個(gè)重要發(fā)現(xiàn)就是,如何最好地創(chuàng)建長鏈接列表??捎眯詫<已鸥鞑肌つ釥柹↗akob Nielsen)提到過“F模式”。當(dāng)你觀察一幅眼睛跟蹤地圖時(shí),會發(fā)現(xiàn)有一種F形模式。眼睛跟蹤地圖通常叫做熱點(diǎn)圖,哪里被看得越多,哪里就會越紅。

這個(gè)熱點(diǎn)圖清晰地顯示了人們的眼睛是如何瀏覽鏈接頁面的。創(chuàng)建列表或標(biāo)題時(shí),要確保將最重要的詞匯放在前面

這就是說,在準(zhǔn)備列表的時(shí)候(尤其是鏈接列表),你要確保最重要的詞匯放在鏈接的開頭而不是后面。這也適用于具備機(jī)器可讀性的標(biāo)題,即那些會在搜索結(jié)果列表中呈現(xiàn)特定網(wǎng)頁名稱的標(biāo)題。所以,要認(rèn)真地看待那些沒有以最重要的詞匯開頭的列表、菜單或者鏈接等。

另外一個(gè)基本的人體工程學(xué)原則 就是提供間隙,它意味著,要確保兩輛購物車可以同時(shí)通過超市的過道,按鈕大得可以讓人舒服地點(diǎn)擊。

我們在創(chuàng)建網(wǎng)站或應(yīng)用的時(shí)候,需要給頁面中各個(gè)元素之間保留足夠的間隙,這樣才能保證用戶的使用不會有任何干擾。亞馬遜的網(wǎng)站中會存在一些彈出框,它們能夠正常的運(yùn)行,在下圖中,彈窗中的各個(gè)元素(文本、按鈕等)之間保持各自的間隙,層次清晰。

我們要確保產(chǎn)品/系統(tǒng)遵循人體工程學(xué)的原則,就要保證:

  1. 按鈕要足夠大,可以方便的通過鼠標(biāo)或者手指點(diǎn)擊;
  2. 網(wǎng)站中的下拉菜單等其他可交互控件要能被鼠標(biāo)輕易的捕獲(移動設(shè)備上這些控件要能被手指輕松的捕獲);
  3. 頁面中的所有元素之間要保持一定的間隙,不能相互影響;
  4. 我們的頁面要讓用戶輕松的知道要做什么;
  5. 產(chǎn)品/系統(tǒng)中不能存在不符合邏輯的任務(wù)或工作流程,我們的產(chǎn)品/系統(tǒng)要易用。

產(chǎn)品便捷性

所有的東西需要時(shí)都有

對于便捷性的定義,很簡單:1.讓人感到舒適自在。2.觸手可及。數(shù)字產(chǎn)品的便捷性提現(xiàn)在使用這個(gè)產(chǎn)品的過程中,讓用戶感到舒適自在,使用我們的產(chǎn)品能夠輕松的解決他們想問題。而且,應(yīng)該是觸手可及的,比如我們餓了,拿起手機(jī)找到美團(tuán)外賣或者百度外賣就能 解決我們的問題。

讓人感到舒適自在

在這里,我們來看一下計(jì)算機(jī)的多模式輸入和輸出,計(jì)算機(jī)的多模式輸入包括鍵盤、鼠標(biāo)和語音,多模式輸出包括聲音、視頻等。多模式的體驗(yàn)是指,在一個(gè)任務(wù)執(zhí)行過程中進(jìn)行接口的切換,可以分為三大類:

  1. 在同一個(gè)接口內(nèi)從一個(gè)任務(wù)切換到另一個(gè)任務(wù):表示我可以停留在同一個(gè)瀏覽器窗口,切換不同的任務(wù)。
  2. 在相關(guān)的接口進(jìn)行切換:表示任務(wù)可以從電腦屏幕移動到智能手機(jī)上,任務(wù)還將繼續(xù)。
  3. 在不相關(guān)的接口內(nèi)進(jìn)行切換:表示可以從電腦屏幕移動到打印機(jī)輸出。

這三種情況下的體驗(yàn)可以做到很好。不好的體驗(yàn)我們要避免,例如:一個(gè)網(wǎng)站有兩個(gè)相互依賴的表單,但必須要分別單獨(dú)填寫,這就會給用戶帶來很差的體驗(yàn)了。用戶更加期待的是無縫的體驗(yàn)。讓人們盡可能以最少的干擾、最快的途徑、最少的異常來完成他們的工作。

從可用性的角度看,便捷性問題與一個(gè)經(jīng)典的問題密切相關(guān):只有當(dāng)手機(jī)沒電的時(shí)候,你才會意識到公共場所的電源插座少得可憐;只有下雨的時(shí)候,你才會關(guān)注雨傘放在哪里。進(jìn)入不熟悉的地域時(shí),我們會自主的尋找舒適的區(qū)域。這是因?yàn)?,符合我們個(gè)人日常習(xí)慣的事物就可以提供這種舒適感。事物提供了舒適感,我們就認(rèn)為它們是便捷的。所以,我們的產(chǎn)品/系統(tǒng)要為用戶提供習(xí)慣性的舒適感,讓用戶在使用我們的產(chǎn)品時(shí)找到熟悉的舒適感,這會讓我們的產(chǎn)品加分不少。

觸手可及

在這個(gè)方面,我們講究的是“只需一次點(diǎn)擊即可完成”。如果你在修理汽車,最好把所有工具以及修理所需的任何配件都放在手邊。如果你在做飯,那么在開始之前你可能會買來所有的食材并把他們備好。如果你要在亞馬遜上瀏覽一個(gè)主題,那么你應(yīng)該收集所有需要的鏈接,并在十幾個(gè)瀏覽器窗口中打開它們?當(dāng)然不!

你期望亞馬遜去做這項(xiàng)艱難的工作,為你尋找并提供有效的鏈接。在亞馬遜的結(jié)賬頁面,所有鏈接和其他必要信息會放在同一個(gè)地方,所有的產(chǎn)品信息會在另一個(gè)地方。亞馬遜已經(jīng)為你安排好了一切。將不同的信息都做好了分組。

我們確保產(chǎn)品/系統(tǒng)的便捷性,就要保證:1.將相關(guān)內(nèi)容進(jìn)行分組,使其更容易查找。2.如果擁有多模式體驗(yàn),要確保不同的進(jìn)程不會互相干擾。3.要提供有用的內(nèi)容。4.消除強(qiáng)制用戶多次輸入相同信息的區(qū)域。5.為用戶提供方便。

產(chǎn)品的簡單易用性

幫助人們避免操作錯(cuò)誤或損壞產(chǎn)品

提示

指出人們可能不小心忘記了執(zhí)行什么操作,比如在關(guān)閉文檔之前保存文檔,或者在郵件中忘記粘貼附件。

文明的toast提示

我們一般會看到兩種類型的系統(tǒng)提示。一種是比較標(biāo)準(zhǔn)的提示信息“是否要對更改的內(nèi)容進(jìn)行保存?”這樣的提示信息一般是為了提醒用戶,這種提示信息用戶是不太會反感的。另一種系統(tǒng)提示卻會對用戶的操作造成一些影響并且強(qiáng)制用戶進(jìn)行許多選擇,如“你確定要?jiǎng)h除該文檔嗎?”“你是否確定?該操作不能恢復(fù)”(廢話,我自己選擇的刪除當(dāng)然是要?jiǎng)h除了!)。

我們使用提示信息不能打斷事件處理流程的流暢性,不能妨礙人們工作。在現(xiàn)實(shí)世界中,大量不恰當(dāng)?shù)南⒁矔ξ覀冊斐筛蓴_。一些語音郵箱系統(tǒng),總是會播放一段長長的廣告,才列出菜單項(xiàng),很讓人郁悶。簡而言之,如果幫助是不必要的,那就不要出現(xiàn)。

警告

在一些內(nèi)容上添加標(biāo)簽或標(biāo)記,來表示這些是用戶進(jìn)行下一步操作之前必須完成的內(nèi)容,比如輸入密碼或者勾選“我接受條款”復(fù)選框。

警告可以告訴人們有錯(cuò)誤存在(如密碼錯(cuò)誤),狀態(tài)發(fā)生改變(電量不足),或者其他一些需要你注意的內(nèi)容。但是,一些警告僅僅是讓用戶確認(rèn)電腦或者移動設(shè)備執(zhí)行了一些操作。比如,往智能手機(jī)里插入耳機(jī)后,或者是拔出耳機(jī)的時(shí)候,屏幕上總是出現(xiàn)這樣的信息:

“手機(jī)插孔中連入一個(gè)設(shè)備”,我當(dāng)然知道我查了耳機(jī),難道會有人趁我不注意偷偷插耳機(jī)在我的手機(jī)上?

想要避免人們犯錯(cuò)的出發(fā)點(diǎn)是很好的,但是不斷地陳述顯而易見的事實(shí),是會惹惱用戶的。通常在設(shè)計(jì)此類警示信息時(shí),非常重要的一點(diǎn)事不斷評價(jià)它們的相關(guān)性,確保它們能起到一些作用。警告通常是為了告知系統(tǒng)的錯(cuò)誤故障等用戶不可預(yù)知的情況,并非是用戶明確的狀態(tài)。

在移動設(shè)備中,對話框作為警告的一種表現(xiàn)形式,在iOS和Google的規(guī)范中都有規(guī)定,對話框這種中斷用戶流的形式適用于用戶執(zhí)行了將要引起嚴(yán)重錯(cuò)誤的交互行為(在軟件中則是此操作將要引起用戶狀態(tài)變化的情況)或者是系統(tǒng)自身的異常警告等。在用戶掌握范圍內(nèi)的情況,用提示更加妥當(dāng)。

用戶操作在app中的警告提示

強(qiáng)制

消除一些不可用的選項(xiàng),比如把一些不可用或者在某個(gè)特定時(shí)刻不適用的菜單項(xiàng)變灰色。

在數(shù)字世界中,實(shí)現(xiàn)強(qiáng)制操作的方式,是把那些因?yàn)槟承┰虿豢捎玫牟藛雾?xiàng)置灰。例如,如果已經(jīng)保存了文檔,沒有再對文檔修改,那“保存”按鈕就可以一直不可用。我們可以多考慮以點(diǎn),置灰的菜單項(xiàng)用戶是不知道原因的,為什么之前還能點(diǎn)擊呢?我們希望程序能提供一些解釋,說明為什么這時(shí)這個(gè)菜單項(xiàng)不可用。例如,鼠標(biāo)懸停在置灰的菜單項(xiàng)時(shí),會有一個(gè)小小的提示說明彈出框來解釋原因。當(dāng)然到目前為止,還沒有程序是這么做。

“下一步”按鈕置灰

我們要幫助人們做出更好的決策

屏幕信息有時(shí)候會需要我們做出選擇,甚至那些需要我們點(diǎn)擊“確定”的信息也會讓我考慮一下自己需要認(rèn)可的內(nèi)容。我們在設(shè)計(jì)這寫提示信息時(shí),需要問自己一些問題:

  1. 用戶知道為什么會出現(xiàn)這個(gè)信息嗎?
  2. 用戶是否足夠理解這個(gè)提示,并且做出正確的決定?
  3. 提示中信息是否有用,會不會讓用戶困惑?
  4. 用戶理解做完決策的后果嗎?

如果所有的答案都是否,那么就得修改提示信息或者考慮更改設(shè)計(jì),去掉這個(gè)提示信息。

我們要保證產(chǎn)品/系統(tǒng)的簡單易用,就要確保:

  1. 為用戶提供多種響應(yīng)方式,以防萬一。
  2. 提示信息要清晰簡潔,易于理解。
  3. 準(zhǔn)確區(qū)分提示和警告,不得混淆。
  4. 不要妨礙用戶去完成任務(wù)。
  5. 為用戶提供認(rèn)知線索,正確引導(dǎo)用戶使用產(chǎn)品。
  6. 確保用戶隨時(shí)隨地獲取所需要的信息。

 

作者:流年,互聯(lián)網(wǎng)產(chǎn)品設(shè)計(jì)師,4年互聯(lián)網(wǎng)產(chǎn)品設(shè)計(jì)經(jīng)驗(yàn)。

本文由 @流年 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自PEXELS,基于CC0協(xié)議

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 這是一本關(guān)于用戶體驗(yàn)的總結(jié),是國外的哪本書翻譯過來的?

    來自北京 回復(fù)
  2. mark

    來自廣東 回復(fù)
  3. 這篇文章干貨比較多,比雞湯文好多了

    回復(fù)
  4. mark

    回復(fù)
专题
16706人已学习12篇文章
本专题的文章分享了产品经理需要知晓的API接口知识。
专题
12348人已学习12篇文章
如今随着商业的发展,消费者与品牌建立起了更深的联系,商务活动也开始以消费者为中心,所以消费者的体验以及建议就非常重要。本专题的文章分享了消费者行为学。
专题
12963人已学习12篇文章
现如今,越来越多的企业开始重视私域,很多的企业都对私域的发展进行了布局。本专题的文章分享了如何搭建私域模型。
专题
37457人已学习17篇文章
如果你们有志于在运营路上深耕,并实现快速成长,你需要知道以下这些!
专题
21056人已学习15篇文章
AARRR模型是一个经典的增长漏斗模型。本专题的文章针对AARRR模型进行拆解解读。
专题
16811人已学习15篇文章
产品经理的许多工作都需要使用数据来进行辅助,如:利用用户使用数据为后续的产品迭代提供依据、如何向上级领导汇报产品成果、如何做精细化的运营活动等。本专题的文章分享了数据埋点方案的撰写。