你是否有過這樣的經(jīng)歷:設(shè)計(jì)美觀、高效和可用的UI界面需要花費(fèi)很長的時(shí)間,還需要來回多次的設(shè)計(jì)修改。很多小伙伴在初學(xué)UI設(shè)計(jì)時(shí),都會(huì)存在許多困惑,顯得特別迷茫。其實(shí)做UI設(shè)計(jì)是有章可循的,小編總結(jié)了一些實(shí)用的小技巧,這些技巧是新手小白進(jìn)階資深UI設(shè)計(jì)師必備的技能!
1. 用圖像引導(dǎo)用戶
美麗的圖像能夠在視覺上增強(qiáng)界面,但也可用于將注意力引導(dǎo)到頁面或屏幕中的特定位置。如果圖像上包含一個(gè)人,那用戶會(huì)下意識地跟隨那個(gè)人的視線。這為UI設(shè)計(jì)師提供一個(gè)機(jī)會(huì),可以利用這個(gè)特點(diǎn)將用戶注意力巧妙地引導(dǎo)到號召性用語或有用的信息上。
2. 巧妙地使用留白空間
UI設(shè)計(jì)人員希望在每個(gè)界面中塞入盡可能多的信息是一個(gè)常見的錯(cuò)誤。這可能會(huì)導(dǎo)致用戶視覺過載,并最終讓那些注意力被吸引到頁面或屏幕上太多不同區(qū)域的用戶不知所措。頁面上的元素需要一些空間來呼吸。如果你在一個(gè)小空間里塞滿了很多設(shè)計(jì)元素,那么它們就會(huì)相互抵消,沒有一個(gè)元素會(huì)脫穎而出。
3. 使用網(wǎng)格
很多UI設(shè)計(jì)師在剛開始做設(shè)計(jì)的時(shí)候,不知道要把每一個(gè)元素放在頁面的哪個(gè)位置,才能讓它看起來好看。建議你可以使用網(wǎng)格來快速提高你的設(shè)計(jì)質(zhì)量。通過使用網(wǎng)格,你可以確保不同元素之間的間距相同,因此它們都可以一起創(chuàng)建一個(gè)有凝聚力的構(gòu)圖。
當(dāng)然,也有無網(wǎng)格設(shè)計(jì)。但就像在生活中一樣,你首先需要了解規(guī)則才能成功打破它們。因此,首先掌握網(wǎng)格系統(tǒng),然后再進(jìn)行打破網(wǎng)格的設(shè)計(jì)是一名UI設(shè)計(jì)師必經(jīng)的過程。
4. 巧用配色
掌握色彩理論及其在實(shí)際設(shè)計(jì)中的應(yīng)用需要大量的努力和多年的實(shí)踐。但對于剛?cè)腴T的UI設(shè)計(jì)師來說,我們必須多加練習(xí)。所以,一開始在你的設(shè)計(jì)中只使用最少量的顏色。嘗試混合和搭配不同的顏色,會(huì)使你的設(shè)計(jì)看起來很漂亮。建議以70–30–10的比例使用顏色。這里70%的顏色將是你的背景顏色,例如白色。30%的顏色將是你的輔助顏色,例如黑色。10%的顏色將是你用來突出顯示設(shè)計(jì)中的按鈕和其他號召性用語元素的顏色。
你也可以嘗試僅使用2種顏色的組合。就像字體一樣,同樣的原則也適用于顏色的使用。首先掌握使用1或2種顏色,然后慢慢增加設(shè)計(jì)中的顏色數(shù)量。
5. 保持一致的視覺樣式
在進(jìn)行UI設(shè)計(jì)時(shí),要保持一致的視覺樣式。例如,同一個(gè)產(chǎn)品設(shè)計(jì)中的圖標(biāo),要確保它們具有相同的輪廓、填充、比重等。圖標(biāo)通過視覺手段為用戶提供必要的信息,所以務(wù)必要保證功能相同的圖標(biāo)元素一致,外觀視覺一致。
在團(tuán)隊(duì)中,保持團(tuán)隊(duì)項(xiàng)目的UI視覺一致性同樣非常重要。UI設(shè)計(jì)師不是獨(dú)立個(gè)體,更是團(tuán)隊(duì)中的一員。因此,建議使用具有團(tuán)隊(duì)組件資源庫的設(shè)計(jì)工具來開展你的產(chǎn)品設(shè)計(jì)。
相關(guān)文章
關(guān)注千鋒學(xué)習(xí)站小程序
隨時(shí)隨地免費(fèi)學(xué)習(xí)課程
掃一掃快速進(jìn)入
千鋒移動(dòng)端頁面
掃碼匿名提建議
直達(dá)CEO信箱