UI設(shè)計入門必學(xué)的五大知識點



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

一、擬物化和扁平化

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


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

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

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


三、名詞解釋和單位換算

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

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


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


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

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

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


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

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

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

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

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


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

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

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


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

 

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