編者按:在進(jìn)行 UI 設(shè)計的時候,很多小技巧能夠恰到好處地提升界面的設(shè)計視覺效果、用戶體驗(yàn)。這篇來自Mark Andrew 的文章梳理了 6 個實(shí)用性很強(qiáng)的 UI 效果提升小技巧 。
在創(chuàng)建實(shí)用、可訪問性良好且視覺效果頗為出彩的 UI 界面的時候,我們大多只需要進(jìn)行有限度的微調(diào),即可達(dá)到頗為不錯的效果。
1、在涉及排版時,網(wǎng)格和規(guī)則可以適當(dāng)?shù)乇淮蚱?/p>
通常我們在設(shè)計 UI 的時候,使用網(wǎng)格系統(tǒng)和比例排布能夠很快達(dá)到不錯的排版效果,但是在很多實(shí)際情況下,文本排布完全依賴網(wǎng)格系統(tǒng),又會多少讓人覺得有點(diǎn)不夠舒服和自然。
這個時候要注意,規(guī)則不是死的。這個時候要適當(dāng)打破這些規(guī)則,使用雙眼來進(jìn)行光學(xué)對齊,而不是一味的遵照排版來做。
2、表單報錯信息一定要準(zhǔn)確且易于理解
在設(shè)計表單的時候,單純的告訴用戶這里出錯了,并不會幫助用戶更好地解決問題。通常需要告訴用戶為什么錯了,以及如何正確修正這些錯誤。比如當(dāng)用戶填寫郵件地址不正確的時候,要告知用戶是「格式不正確」還是「該地址已經(jīng)被注冊了」,這個時候改正就有明確的指向性了。
3、在加載過程中,提前展示界面布局
很多用戶界面布局通常是相對固定的,在加載界面的過程中,向用戶提前展示布局能夠幫助用戶構(gòu)建初始的預(yù)期,讓用戶知道界面正在加載中而不是出錯了。
系統(tǒng)狀態(tài)的可見性借此進(jìn)行呈現(xiàn),這也符合基本的設(shè)計原則。
4、告訴用戶某個操作可能帶來的結(jié)果
UI 中很多操作帶來的結(jié)果可能是致命性的,比如說刪除操作,這個時候需要將這個操作的結(jié)果在界面中呈現(xiàn)出來,告訴用戶某些結(jié)果可能在這個操作之后發(fā)生,幫助用戶了解操作的嚴(yán)重性。
這樣的優(yōu)化能讓用戶更加明白具體按鈕的功能和操作,確保產(chǎn)品的體驗(yàn)更好。
5、確保最重要的功能在標(biāo)簽欄中優(yōu)先級靠前
如今的產(chǎn)品功能越來越多,越來越臃腫,這個時候,標(biāo)簽欄中的內(nèi)容怎么排布就需要特別小心了。將標(biāo)簽欄中靠前的位置保留給最常用的功能模塊,并且將次重要或者使用頻次較低的功能模塊,藏到「更多」里面,這樣能讓界面用起來更加順手。
6、不要將重要的操作隱藏在下拉菜單中
我們?nèi)匀粫r不時會在某些網(wǎng)站首頁中,碰到登錄按鈕被隱藏起來的情況。用戶對于這類高頻度使用、優(yōu)先級非??壳安僮?,是有著極大的需求和依賴的,它們應(yīng)當(dāng)醒目地放置在用戶習(xí)慣(比如右上角)的位置,這是確保界面的可訪問性的重要細(xì)節(jié)。