UI設(shè)計(jì)有哪些必知的注意事項(xiàng)呢?
◆色彩不是決定性的因素
色彩很容易受到環(huán)境的影響,設(shè)計(jì)的時(shí)候不要將色彩視為決定性因素,色彩可以醒目,作為引導(dǎo),但不應(yīng)該是做區(qū)別的唯一元素。在長(zhǎng)篇閱讀的情況下,除了要強(qiáng)調(diào)的內(nèi)容,應(yīng)采用相對(duì)暗淡或柔和的背景色。當(dāng)然,視讀者而定,也可采用明亮的背景色。
◆循序展現(xiàn)
每個(gè)屏幕只展現(xiàn)必需的內(nèi)容,如果用戶需要作出決定,則展現(xiàn)足夠的信息供其選擇,他們會(huì)到在下一屏找到所需細(xì)節(jié),避兔過(guò)度闡釋或把所有一次展現(xiàn),如果可能將選擇放在下屏有步驟地展示信息,這會(huì)使你的界面交互更加清晰。
◆考慮屏幕全局光源
作為設(shè)計(jì)師,你應(yīng)該早就了解每個(gè)平臺(tái),都有其不可改變的屏幕全局光源,所有高光和陰影效果都應(yīng)該和平臺(tái)的光源相協(xié)調(diào)。
◆明確導(dǎo)航和組織控件設(shè)計(jì)
向你的開(kāi)發(fā)者明確展示你的設(shè)計(jì)中包含的標(biāo)簽、下拉菜單或者其它閉合機(jī)制。在進(jìn)行這種控件設(shè)計(jì)時(shí),要尊重平臺(tái)的設(shè)計(jì)慣例。開(kāi)發(fā)者在進(jìn)行開(kāi)發(fā)時(shí)需要明確了解信息層次,因此你要確保你的設(shè)計(jì)清晰地展示你的意圖,圖層復(fù)合在這種情況下非常有用。
◆導(dǎo)出圖形時(shí)不進(jìn)行壓縮
在導(dǎo)出時(shí)以 PNG alpha通道格式保存,除非被明確告知其它保存方式,除非被明確要求否則不要使用JPEG格式,不要考慮圖像文件大小,因?yàn)殚_(kāi)發(fā)者或他們的開(kāi)發(fā)環(huán)境會(huì)對(duì)圖像進(jìn)行最優(yōu)化,以透明背景導(dǎo)出每個(gè)元素,而不是純色,即便你設(shè)計(jì)中的一部分背景確實(shí)是純色的。
◆詢問(wèn)陰影的處理
和你的開(kāi)發(fā)者溝通是否要將陰影效果包含在導(dǎo)出圖中,通常情況下,開(kāi)發(fā)者會(huì)用CSS或?qū)懘a來(lái)應(yīng)用陰影,這樣做事實(shí)上會(huì)比直接使用預(yù)先保存的陰影位圖更方便容易,不要假定陰影效果應(yīng)該包含在圖像中,雖然在設(shè)計(jì)原型時(shí)用圖層展示陰影效果。
◆盡量使用單列而不是多列布局
單列布局能夠讓對(duì)全局有更好的掌控,同時(shí)用戶也可以一目了然內(nèi)容,而多列而已則會(huì)有分散用戶注意力的風(fēng)險(xiǎn),使你的主旨無(wú)法很好表達(dá),最好的做法是用一個(gè)有邏輯的敘述,來(lái)引導(dǎo)用戶并且在文末給出你的操作按鈕。
◆合并重復(fù)的功能使界面簡(jiǎn)潔
在整個(gè)產(chǎn)品開(kāi)發(fā)期間我們會(huì)有意無(wú)意地創(chuàng)建很多模塊,版面或者元素,而它們的功能都是相近,此種情況已經(jīng)表明過(guò)度設(shè)計(jì)了,時(shí)刻警惕這些冗余的功能模塊,界面上模塊越多,用戶的學(xué)習(xí)成本就越大,所以請(qǐng)考慮重構(gòu)你的界面使它足夠精簡(jiǎn)。
◆將選項(xiàng)與按鈕區(qū)分開(kāi)來(lái)
諸如顏色、層次及模塊間的對(duì)比,這些視覺(jué)上的設(shè)計(jì)可以很好地幫助用戶使用產(chǎn)品,他時(shí)刻知道當(dāng)前所處的頁(yè)面以及可以轉(zhuǎn)到哪些頁(yè)面,要傳達(dá)這樣一個(gè)好的界面,你就需要將可點(diǎn)擊的元素、可選擇的元素以及普通的文字明顯區(qū)分開(kāi)來(lái)。但千萬(wàn)不要把這三種元素設(shè)計(jì)得混亂不堪。
◆界面要有鮮明對(duì)比讓人容易區(qū)分
把主要功能區(qū)從界面中突出顯示出來(lái)效果會(huì)好很多,通過(guò)明暗色調(diào)的對(duì)比來(lái)突顯,通過(guò)為元素添加陰影漸變等效果,讓界面富有層次感來(lái)張顯主要功能,你甚至可以在色相環(huán)上專門選擇互補(bǔ)色,來(lái)設(shè)計(jì)你的界面以達(dá)到突出“重心”的目的。
◆精簡(jiǎn)表單內(nèi)容
表單中每個(gè)字段都會(huì)有失去用戶的風(fēng)險(xiǎn),不是每個(gè)人打字都很快速的,并且在移動(dòng)設(shè)備上進(jìn)行輸入更是相當(dāng)麻煩的事情。
如果你確實(shí)需要一大堆信息讓用戶填寫,試著將它們分散在不同頁(yè)面,在表單提交后還可以繼續(xù)補(bǔ)充,過(guò)多字段很容易讓整個(gè)表單顯示臃腫,當(dāng)然想簡(jiǎn)潔也很容易,只放少數(shù)字段。
◆將操作的狀態(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)行怎樣的操作。
◆過(guò)多邊框會(huì)讓界面四分五裂
邊框確實(shí)在劃分區(qū)域進(jìn)行版塊設(shè)置時(shí)有很大的作用,但同時(shí)其明顯的線條也會(huì)吸引走用戶的注意力。為了達(dá)到劃分版塊又不轉(zhuǎn)移用戶注意力的目的,在排版時(shí)可以將界面上不同區(qū)域的元素通過(guò)空白進(jìn)行分組,用上不同的背景色,將文字對(duì)齊方式進(jìn)行統(tǒng)一,還有就是為不同區(qū)域設(shè)置不同的樣式。
◆界面設(shè)計(jì)得一致
在設(shè)計(jì)中保持一致性時(shí)就可以減少用戶的學(xué)習(xí)成本。用戶不需要學(xué)習(xí)新的操作。當(dāng)我們點(diǎn)擊按鈕或者進(jìn)行拖拽操作,我們期望這樣的操作在整個(gè)程序的各個(gè)界面都是一致的,會(huì)得到相似的結(jié)果出來(lái)。可以在很多方面下功夫,來(lái)實(shí)現(xiàn)一個(gè)一致的界面包括:顏色、方向、元素的表現(xiàn)形式、位置、大小、形狀等。
◆將有關(guān)聯(lián)的功能分組
將各個(gè)功能項(xiàng)分組合并起來(lái),可以提高程序的可用性。有點(diǎn)常識(shí)的人都知道刀子和叉子或者打開(kāi)文件和關(guān)閉文件是放在一起的。將功能相近的元素放在一起也符合邏輯,符合我們平時(shí)的認(rèn)知。