UI設(shè)計(jì)入門必學(xué)的五大知識(shí)點(diǎn)



UI設(shè)計(jì)入門必學(xué)的五大知識(shí)點(diǎn),現(xiàn)在很熱門的UI設(shè)計(jì)要學(xué)習(xí)的東西非常多,是一個(gè)復(fù)合型人才,并且他所需要掌握的東西還在逐步增加中,所以請(qǐng)大家一定奧時(shí)刻牢記學(xué)習(xí),不要妄想啃老本。下面小編給剛?cè)腴T的寶貝們準(zhǔn)備了一些入門干貨,請(qǐng)大家最好收藏之后多看看~

一、擬物化和扁平化

在UI設(shè)計(jì)領(lǐng)域里,設(shè)計(jì)風(fēng)格主要分為兩個(gè)“擬物化”和“扁平化“!皵M物化”也叫“擬真化”,其以iOS(6之前版本)和安卓陣營的錘子為代表。它的顯著優(yōu)點(diǎn)是,細(xì)節(jié)多、有光影、有質(zhì)感,很大程度上模擬了現(xiàn)實(shí)生活中的物品形狀、材質(zhì)、光影效果。扁平化則是以安卓5.0以及若干國產(chǎn)手機(jī)ROM為代表,它強(qiáng)調(diào)簡單、抽象、符號(hào)化,去掉了裝飾性設(shè)計(jì)元素,沒有明顯質(zhì)感,弱化光影,最核心的設(shè)計(jì)方法是幾何形狀和復(fù)色方案。Google在安卓5.0上使用了全新的Material Design設(shè)計(jì),讓安卓有了跟蘋果一樣鮮明的、系統(tǒng)化的設(shè)計(jì)語言。關(guān)于兩者的好壞,一直沒有定論,我認(rèn)為設(shè)計(jì)本身沒有好壞,只有是否合適。


二、原色,補(bǔ)色,復(fù)色

原色有三種,包括紅色,綠色,藍(lán)色,原色的RGB通道其中兩個(gè)為0。補(bǔ)色是由兩種等量原色組成的叫做補(bǔ)色,也叫做互補(bǔ)色,補(bǔ)色加上另一種原色會(huì)呈現(xiàn)白色。由三種原色組成的顏色叫做復(fù)色,一般而言復(fù)色相對(duì)于原色和補(bǔ)色的飽和度要低。復(fù)色的視覺感官上相對(duì)于前兩者沒有那么鮮艷,亮度相對(duì)高的復(fù)色更加討好人的眼球,我們看到的顏色大部分屬于復(fù)色。

UI 設(shè)計(jì)相對(duì)于平面設(shè)計(jì)而言,我們并不需要給用戶十分鮮艷搶眼的顏色,這樣可能會(huì)在長時(shí)間使用的過程中產(chǎn)生視覺疲勞,我們更需要的是,給用戶一個(gè)視覺上相對(duì)討人喜歡,并且能在長時(shí)間的使用過程中不會(huì)輕易產(chǎn)生視覺疲勞,或者延緩視覺疲勞的產(chǎn)生。復(fù)色的飽和度相對(duì)低,并且復(fù)色通過不同的顏色組合,千變?nèi)f化,給設(shè)計(jì)的發(fā)揮空間很大。復(fù)色方案也是扁平化設(shè)計(jì)的一個(gè)精髓。


三、名詞解釋和單位換算

幾乎每個(gè)UI設(shè)計(jì)師都被這類問題坑過,所以現(xiàn)在先給剛?cè)腴T的你們普及一下,一定要記好哦~

1.PPI:
Pixels per Inch,中文為“像素每英寸”,也有很多人直接叫“像素密度”,意思就是在設(shè)備的1英寸物理長度上可以顯示的獨(dú)立物理像素。但是需要注意的是,這個(gè)是一般情況下我們?cè)谑謾C(jī)廠商對(duì)手機(jī)參數(shù)標(biāo)注的單位。


2.PX:
Pixel,中文全稱”圖像元素“,簡稱”像素“,為顯示設(shè)備的顯示單位,也是我們圖像設(shè)計(jì)的基本單位。我們?cè)O(shè)計(jì)的圖像上的1個(gè)像素點(diǎn),在顯示設(shè)備上占用一個(gè)RGB顯示單元。


3.PT:
Point,中文翻譯應(yīng)該為”點(diǎn)“,這個(gè) pt 并非平面印刷的”磅“單位,而是和 dp、sp一樣,是一個(gè)相對(duì)單位,無關(guān)設(shè)備物理尺寸。

4.DP:
Device Independent Pixels,中文全稱”設(shè)備獨(dú)立像素“(也可譯為”設(shè)備無關(guān)像素“,單詞Independent有獨(dú)立自主或者不相關(guān)的意思),也簡稱 dip。正如其英文字面意思一樣,它是一個(gè)“無關(guān)設(shè)備物理尺寸的單位”。

5.SP:
Scaled Pixels,中文全稱“可放縮像素”,這個(gè)單位的換算方式完全跟 dp 一樣,這個(gè)單位跟 dp 最大的區(qū)別是,它一般用于文字的字號(hào)或者與文字相關(guān)的地方。


四、UI設(shè)計(jì)的幾大原則

UI設(shè)計(jì)有一些行內(nèi)默認(rèn)規(guī)則,比如我們下面會(huì)介紹到的KISS,UCD原則。

KISS原則是英文“Keep it simple , stupid!”的簡寫,也就是教你“一切從簡”。

KISS 的原則旨在用最簡單的設(shè)計(jì)去達(dá)到目的。沒有任何多余的裝飾,也沒有任何多余的步驟,用最簡單的方式和最短的操作路徑完成目標(biāo),這就是 KISSS 原則。

UCD原則是英文“User-centered Design”的縮寫,是想表達(dá)以用戶為中心來做設(shè)計(jì)。UI設(shè)計(jì)的最終目的一定是得到大多數(shù)用戶的認(rèn)可,為用戶提供最合理最好用的設(shè)計(jì),好用遠(yuǎn)比好看重要。好看只是錦上添花,好用才是最終目的。


五、設(shè)計(jì)的尺寸規(guī)范

我們手機(jī)顯示內(nèi)容的時(shí)候并非用像素為單位去顯示呈現(xiàn)內(nèi)容,所以我們?cè)O(shè)計(jì)的時(shí)候就應(yīng)該以 pt、dp 這樣的單位去設(shè)計(jì)。但是隨之而來的問題是,設(shè)計(jì)軟件里面的單位一般有 mm、inch、px 這類具體的單位,UI 設(shè)計(jì)顯然不會(huì)使用 mm 這類的單位,我們選用的是 px,所以在設(shè)計(jì)之前我們需要找一個(gè)方便pt、dp 與 px 進(jìn)行換算的尺寸。

不過其實(shí)我們?nèi)绻麑?duì)單位換算和規(guī)范足夠熟悉的話,我們使用什么尺寸去設(shè)計(jì)都是沒有問題的,如果你是使用 Sketch 的話,你可以輸出任意尺寸的資源。


最后敬業(yè)的小編還是想告訴大家,這是一個(gè)不斷更新的行業(yè),也是為什么調(diào)查顯示這個(gè)行業(yè)年輕人所占比例百分之八十以上。這是一個(gè)美好的職業(yè),希望各位好好珍惜,努力干點(diǎn)名堂出來。

 

北大青鳥網(wǎng)上報(bào)名
北大青鳥招生簡章