怎樣做符合用戶預(yù)期的設(shè)計(jì)
設(shè)計(jì)中說的最多的就是“用戶預(yù)期”這個(gè)詞,但是到底什么樣的設(shè)計(jì)是符合用戶預(yù)期的?怎樣做呢?
每一個(gè)設(shè)計(jì)都有它的一些特征,這些特征導(dǎo)致了它有一定的暗示作用,從而讓用戶覺得這個(gè)東西應(yīng)該是這樣使用的,但是當(dāng)我們的設(shè)計(jì)不是這樣支持的時(shí)候,那么用戶就會(huì)產(chǎn)生困惑和抱怨。
例子1.
在參與設(shè)計(jì)手機(jī)端地圖的時(shí)候,有這樣一個(gè)設(shè)計(jì):在地圖的頂部有一個(gè)搜索地點(diǎn)的搜索框,點(diǎn)擊它會(huì)引出右面的頁面。
明明就是個(gè)輸入框,但是為什么不能直接進(jìn)行輸入?轉(zhuǎn)到右頁面感覺就是進(jìn)入了另一間屋子,跳轉(zhuǎn)多數(shù)都不是一個(gè)好的選擇,因?yàn)樗袛嗔擞脩羰褂玫牧鲿掣?,也就是說用戶的思維需要進(jìn)行切換。改進(jìn)就應(yīng)該在地圖上面直接進(jìn)行輸入和顯示,這樣才有比較好的連貫性,更主要的是直接輸入是輸入框的基本屬性,滿足了這個(gè)屬性才是符合用戶預(yù)期的。
例子2.
在QQ輸入法的全鍵盤英文模式下,當(dāng)長按一個(gè)字母鍵時(shí),會(huì)在字母上方彈出一個(gè)框來顯示更多的符號(hào)或者字母,乍一看好像看不出什么來,但問題是當(dāng)你的手指離開了按住的字母想要很自然的去選擇上方彈出的其他內(nèi)容時(shí),就在手指抬離的瞬間彈出框已經(jīng)消失了,根本來不及選擇。
怎么才能進(jìn)行選擇呢?哦,要求手指不抬離直接進(jìn)行左右拖動(dòng)選擇—沒想到是這樣操作的! 所以問題就在于:它是一個(gè)彈出框,為什么不等著我的手指點(diǎn)擊到它就消失了呢?這樣一個(gè)彈窗讓使用觸摸屏的用戶習(xí)慣認(rèn)為它應(yīng)該是可以被點(diǎn)擊的。
例子3.
在QQ輸入法的選擇皮膚彈框出現(xiàn)的時(shí)候,
左軟鍵意外的不是“確定”,而是“皮膚下載”,這樣看似強(qiáng)化了皮膚下載功能,但是卻使得此頁面最主要的功能:皮膚的選擇變得弱化,甚至是不知道怎么進(jìn)行選擇皮膚。你會(huì)想到直接點(diǎn)擊就選擇了皮膚么?因?yàn)樵趶棾隹蜃钭匀坏挠米箧I確認(rèn)的方式被改變了。所以當(dāng)你改變一種已經(jīng)形成模式的設(shè)計(jì)時(shí),如果這種改變并不是自然直接的,那么就是違背了用戶的預(yù)期,從而變成了一種強(qiáng)烈的干擾。
這里引入一個(gè)設(shè)計(jì)原則即功能可見性(affordance)或者叫做預(yù)期。
什么是affordance:事物可被感知的,最真實(shí)的屬性直接決定它應(yīng)該被怎么使用。所以怎么做設(shè)計(jì)能符合用戶的預(yù)期呢?
1. 了解你的target user是什么樣的人?他們有什么樣的特征?他們有什么樣的背景?
用戶的心理預(yù)期與他的使用經(jīng)驗(yàn),知識(shí)有直接關(guān)系,也就是他建立起來的mental modal。只有當(dāng)設(shè)計(jì)符合他的mental modal,那么就是和他的預(yù)期是一致的,這樣的設(shè)計(jì)才是好的設(shè)計(jì),換句話說只有設(shè)計(jì)師的design mental modal更貼近用戶的mental modal才能設(shè)計(jì)出貼近用戶的產(chǎn)品。
2. 讓設(shè)計(jì)與外界信息相結(jié)合
比如說你設(shè)計(jì)的是觸摸手機(jī),那么就應(yīng)用觸摸屏的特性來進(jìn)行設(shè)計(jì)—–為什么android手機(jī)的長按一直被詬病著?為什么iphone的home key 可以雙擊,但是不容易被發(fā)現(xiàn)?因?yàn)橛脩魧?duì)這樣的操作沒有任何預(yù)期,長按之后會(huì)有什么操作,這個(gè)用戶不知道。Home key可以雙擊?在觸摸屏上,雙擊是很隱晦的操作,不符合用戶的使用習(xí)慣,而點(diǎn)擊是直接的,是觸摸屏的基本屬性,不需要思考的。
所以很多時(shí)候要考慮我們的設(shè)計(jì)是不是符合了它的基本屬性,是否按照它最自然的方式被使用。
3. 可以通過在當(dāng)前狀態(tài)下檢查用戶是否很順暢的完成任務(wù)
4. 他的目標(biāo)是什么,設(shè)計(jì)是否能幫助他完成目標(biāo)還是阻礙了他的目標(biāo)
5. 設(shè)計(jì)是否讓他去猜測(cè)了
做了這么多年的設(shè)計(jì),有的時(shí)候是憑直覺來感覺到這樣做有問題,但其實(shí)歸根結(jié)底要知道在每一個(gè)細(xì)節(jié)其內(nèi)在的基本屬性是什么,只有滿足了這些基本屬性才能做出最完美的符合用戶預(yù)期的設(shè)計(jì)。
本文地址:http://likemindfilms.com/tutorial/id1124.html
您可能還喜歡
- 關(guān)于第三方注冊(cè)和本地注冊(cè)的選擇
- 8大網(wǎng)頁前端界面必備jQuery插件
- 掌上指路標(biāo) —– APP架構(gòu)與導(dǎo)航設(shè)計(jì)
- 時(shí)尚電商網(wǎng)站交互分析
- 軟件推薦為移動(dòng)設(shè)計(jì)而生-Justinmind
- TGideas實(shí)例:加載,不只是少一點(diǎn)點(diǎn)
- 網(wǎng)頁設(shè)計(jì)中引人入勝的引導(dǎo)頁設(shè)計(jì)
- 體驗(yàn)新版Apple AppStore ——App設(shè)計(jì)從
- 確認(rèn)按鈕在左邊,取消按鈕在右邊?
- 交互設(shè)計(jì)從登錄開始
- 專訪:石墨文檔產(chǎn)品總監(jiān)羅穎
- UI設(shè)計(jì)不得不知的移動(dòng)端UI尺寸適
- 光音移動(dòng)設(shè)計(jì)規(guī)范 — 表單類
- 體驗(yàn)設(shè)計(jì)中的排序問題
- 網(wǎng)頁設(shè)計(jì)精粹 網(wǎng)頁中那些迷人的按
- aliued:響應(yīng)式設(shè)計(jì)的現(xiàn)狀與趨勢(shì)
- 10個(gè)智能對(duì)象處理的ps技巧
- 網(wǎng)頁UI - 原子設(shè)計(jì)理論(上)
- 如何通過設(shè)計(jì)提升banner點(diǎn)擊率?
- 晉小彥視覺設(shè)計(jì)系列文章(二):全屏