一個(gè)好的用戶界面設(shè)計(jì)應(yīng)該注意的75個(gè)原則
11. 界面要對(duì)比鮮明讓人容易區(qū)分
把主要功能區(qū)從界面中突出顯示出來(lái)效果會(huì)好很多。使你的主要口號(hào)醒目有很多種方法。通過(guò)明暗色調(diào)的對(duì)比來(lái)突顯。通過(guò)為元素添加陰影、漸變等效果讓界面富有層次感來(lái)張顯主題。最后,你甚至可以在色相環(huán)上專門選擇互補(bǔ)色(比如黃色與紫色)來(lái)設(shè)計(jì)你的界面,以達(dá)到突出重心的目的。綜合所有這些,最后得到的界面會(huì)使你的主要意圖與界面其他元素有明顯的區(qū)分,得到完美的呈現(xiàn)。

12. 個(gè)性鮮明勝過(guò)普通
介紹你自己或產(chǎn)品時(shí)附帶上名稱、圖片或原產(chǎn)地可以讓與用戶的交流溝通更加的個(gè)人化,當(dāng)你在界面設(shè)計(jì)中實(shí)現(xiàn)這點(diǎn)時(shí),讓人覺得非常友好。同時(shí)指明區(qū)域也會(huì)隱形提高產(chǎn)品的聲譽(yù),好上加好。

13. 精簡(jiǎn)表單填寫內(nèi)容
人本性懶惰,沒人愿意填寫一大堆表單字段。表單中每個(gè)字段都會(huì)有失去用戶的風(fēng)險(xiǎn)。多想想是不是每個(gè)字段都是必須的。如果你確實(shí)需要一大堆信息讓用戶填寫,試著將它們分散在不同頁(yè)面,在表單提交后還可以繼續(xù)補(bǔ)充。

14. 暴露選項(xiàng)而不是隱藏
你使用的任何一個(gè)下拉框都會(huì)對(duì)用戶造成信息的隱藏,需要額外的操作才能顯示。如果這些信息是貫穿整個(gè)操作所必需的,那你最好把它展示出來(lái)做得更顯而易見一點(diǎn)。下拉框最好用在選擇日期,省份等約定俗成的地方。對(duì)于程序中重要的選項(xiàng)最好還是不要做成下拉形式。

15. 把界面做得環(huán)環(huán)相扣要好過(guò)直白的排版
一個(gè)平淡無(wú)奇行文無(wú)疑會(huì)讓用戶失去興趣而放棄繼續(xù)閱讀。單列滾動(dòng)的長(zhǎng)頁(yè)面是不錯(cuò)的,但是我們應(yīng)該適當(dāng)?shù)卦O(shè)置一些小節(jié),并且環(huán)環(huán)相扣,來(lái)提高用戶的興趣使其繼續(xù)閱讀。但需要注意的是節(jié)與節(jié)之間的留白不要太大。

16. 不要放太多鏈接分散用戶注意力
為了滿足各式用戶的需求,在頁(yè)面上放些鏈接鏈到這里、鏈到那里是常見的做法。如果你的主要目的是想讓用戶點(diǎn)擊頁(yè)面最后那個(gè)下載按扭什么的話,就需要三思了。因?yàn)橛脩艨赡茳c(diǎn)擊了其他鏈接離開頁(yè)面了。所以你需要注意頁(yè)面的鏈接數(shù)量,把導(dǎo)航和操作鏈接用樣式區(qū)分開,盡量移除頁(yè)面不需要的鏈接。

17. 將操作的狀態(tài)或者進(jìn)度呈現(xiàn)出來(lái)
現(xiàn)如今大多界面當(dāng)中已經(jīng)呈現(xiàn)了各色樣式的進(jìn)度條或者標(biāo)明狀態(tài)的圖標(biāo),比如郵件有已讀或未讀的狀態(tài),電子帳單有支付或未支付的狀態(tài)。而在界面上呈現(xiàn)這樣的狀態(tài)對(duì)于用戶來(lái)說(shuō)是很有必要的。這樣用戶就可以知道某些操作是否成功,接下來(lái)準(zhǔn)備進(jìn)行怎樣的操作。

18. 使用獲利按鈕(好處說(shuō)明)代替普通的按鈕
試想界面上有這樣兩個(gè)按鈕:一個(gè)是”幫你省錢”,另一個(gè)是”立即注冊(cè)”。我敢打賭大多數(shù)人會(huì)點(diǎn)擊第一個(gè),因?yàn)榈诙€(gè)按扭讓人感覺不到有利可圖,并且”注冊(cè)”讓人聯(lián)想到填不完的表單。也就是說(shuō)讓用戶感受到獲利的按鈕更有可能被點(diǎn)擊。這種讓用戶感到好處的文字信息也可放在按鈕旁邊,不一定要做為按鈕的標(biāo)題。當(dāng)然,正常的按鈕還是有用處的,一般用于重復(fù)性操作頻繁的地方。

19. 使用直觀的操作而不是缺乏上下文關(guān)聯(lián)的菜單
直接在元素身上進(jìn)行操作是更直觀明了的方式。比如在一個(gè)列表中,我們想讓用戶對(duì)每個(gè)條目進(jìn)行操作那么就把按鈕放到當(dāng)前條目上,而不要把放到列表之外。再比如就是直接點(diǎn)擊元素就進(jìn)入編輯狀態(tài)(比如頁(yè)面上的地址信息點(diǎn)擊后可以進(jìn)行編輯)。這種方式比傳統(tǒng)的選中再點(diǎn)擊相應(yīng)的按鈕進(jìn)行操作要簡(jiǎn)潔省事得多。當(dāng)然,對(duì)于一般性的操作本身就不需要有什么上下文的,就沒必要這么做了,比如頁(yè)面上的前進(jìn),后退按扭。

20. 盡量直接顯示表單而不要額外頁(yè)面
在一個(gè)足夠大的寬屏界面上最好還是直接給出表單,這比點(diǎn)擊按鈕再?gòu)棾霰韱我煤芏唷J紫葴p少了點(diǎn)擊操作,流程變得簡(jiǎn)潔也節(jié)省了時(shí)間。其次,直接呈現(xiàn)出表單可以讓用戶知道表單有多長(zhǎng),其實(shí)也是在告訴用戶注冊(cè)花不了多少時(shí)間。當(dāng)然,這條規(guī)則適合注冊(cè)表單非常簡(jiǎn)單的情況。

相關(guān)文章

全畫幅不是半畫幅的兩倍有什么區(qū)別? 聊聊相機(jī)的傳感器尺寸
說(shuō)到相機(jī)畫幅,估計(jì)平時(shí)聽到最多的可能就是全畫幅與半畫幅了,以至于不少人認(rèn)為中畫幅比全畫幅要小,為了避免這種常識(shí)性錯(cuò)誤,這篇文章就來(lái)和大家說(shuō)說(shuō)相機(jī)的不同畫幅,所謂2025-04-07
a5紙與a4紙?jiān)趺催x? a5紙與a4的區(qū)別介紹
4紙和A5紙因其尺寸適中,使用尤為廣泛,但你知道它們之間有何區(qū)別嗎?今天,就讓我們一起來(lái)探討這個(gè)話題2025-02-01
各類商務(wù)印刷品的尺寸怎么選? 印刷設(shè)計(jì)常用的尺寸紙張/克重都在這里了
日常經(jīng)常印刷各種東西,哪些尺寸,紙張更合適呢?本文為大家整理了常用印刷尺寸,方便圖文廣告店、印企在日常接單生產(chǎn)中能夠快速掌握客戶關(guān)鍵性信息,詳細(xì)請(qǐng)看下文介紹2024-02-10
常用照片尺寸有哪些 常見證件照尺寸對(duì)照表及用途介紹
現(xiàn)如今,證件照已成為我們生活中不可或缺的一部分,無(wú)論是求職應(yīng)聘,還是入學(xué)注冊(cè),亦或是辦理各種證件,都需要提交符合規(guī)定格式和要求的證件照,那么,這些證件照的尺寸和2024-02-10
平面設(shè)計(jì)是一個(gè)注重視覺效果的設(shè)計(jì),簡(jiǎn)單的排版方式有時(shí)候不能滿足視覺突出的效果,業(yè)務(wù)很難達(dá)到吸引用戶的眼球,下面我們就來(lái)看看8個(gè)平面設(shè)計(jì)技巧分享2023-10-08
如何選擇平面設(shè)計(jì)工具? 這10款軟件應(yīng)該收入囊中
每個(gè)設(shè)計(jì)師都有自己最喜歡的設(shè)計(jì)軟件,并把軟件作為自己的第二語(yǔ)言,今天我們來(lái)推薦10款UI設(shè)計(jì)不可或缺的工具,詳細(xì)請(qǐng)看下文介紹2023-10-08
夏日電影風(fēng)怎么調(diào)色調(diào)色? 適合夏季的柔和綠色調(diào)調(diào)色分享
夏日電影風(fēng)怎么調(diào)色調(diào)色?夏天快到了,想要調(diào)節(jié)夏季電影風(fēng)的畫面,該怎么操作呢?下面我們就來(lái)看看適合夏季的柔和綠色調(diào)調(diào)色分享2023-04-02
什么是真RAW 什么是偽RAW? 簡(jiǎn)單說(shuō)說(shuō)真 RAW 和 偽RAW
隨著索尼α7RV(ILCE-7RM5)正式發(fā)售,近期有不少網(wǎng)友跟我咨詢索尼相機(jī)“無(wú)損壓縮(M)”和“無(wú)損壓縮(S)”RAW的問(wèn)題,今天做一個(gè)統(tǒng)一答復(fù)2022-12-24
手機(jī)UI設(shè)計(jì)尺寸有哪些? 超全面的UI元素尺寸設(shè)置指南
手機(jī)UI設(shè)計(jì)尺寸有哪些?作為新手在設(shè)計(jì)手機(jī)ui的頁(yè)面的時(shí)候,發(fā)現(xiàn)自己設(shè)計(jì)的尺寸都很奇怪,如果能有元素尺寸介紹就好了,下面就來(lái)看看我們匯總的超全面的UI元素尺寸設(shè)置指南2021-08-06
常用照片尺寸有哪幾個(gè)? 照片標(biāo)準(zhǔn)尺寸/像素對(duì)照表匯總
常用照片尺寸有哪幾個(gè)?我們經(jīng)常說(shuō)一寸照片,二寸照片,這些照片的尺寸是怎么計(jì)算的?下面我們就來(lái)看看照片標(biāo)準(zhǔn)尺寸/像素對(duì)照表匯總2021-08-06









