ui設(shè)計的基礎(chǔ)知識

ui設(shè)計的基礎(chǔ)知識

ui設(shè)計的基礎(chǔ)知識：不管是UI還是交互都是屬于從國外傳進來的“進口商品”，在翻譯成中文的時候可能會出現(xiàn)一些詞不達意的錯誤。今天小編主要給大家分享ui設(shè)計的基礎(chǔ)知識，希望對你們有幫助!

像素與分辨率的關(guān)系

我認為許多設(shè)計師不理解分辨率和像素的原因是因為不理解英寸是什么。小時候家里的家里的電視機都說21寸大彩電、25寸大彩電、29寸大彩電等，包括手機，也說4.7英寸、5.0英寸等。但是顯示屏畢竟是一個面，你用英寸來代表一個面，所以很多人把英寸誤認為面積單位，也就是說，英寸代表平方英寸。

將英寸看成面積單位的設(shè)計師對分辨率會有完全不同的理解，事實上，這里的英寸指的是屏幕對角線的長度，而英寸實際上是長度的單位。

分辨率可分為兩種類型：ppi和dpi:

Ppi:每英寸(長度)所包含的像素點數(shù)目。

Dpi:每英寸(長度)包含點的數(shù)目。

對于dpi，了解就可以了，ppi才是比較重要的。從以上定義可以看出，dpi和ppi之間沒有太大區(qū)別，除了像素(px)是設(shè)計師的最小設(shè)計單位，點(pt)是iOS的最小開發(fā)單位。在日常生活中談?wù)摱�倍圖、三倍圖就是指屏幕上的一個點有兩個或三個像素。一個設(shè)備需要使用二倍圖還是三倍圖取決于ppi與dpi的比率。(plus 中ppi/dpi=2.6，約等于3)

分辨率換算

正如我之前所說，設(shè)計師對dpi只要了解即可，真正需要掌握的是ppi。ppi能給我們帶來什么樣的幫助?因為像素的物理大小不是絕對的，它會隨著屏幕ppii的不同而變化，掌握ppi將幫助我們避免犯錯誤。

例如，在iOS的設(shè)計規(guī)范中經(jīng)常會看到44、88這些數(shù)字，44是怎么來的?事實上，iOS推薦最小可點擊元素的大小為44*44像素。蘋果1就是一個例子，因為蘋果在設(shè)計規(guī)范提出時并不適應(yīng)retina屏，在蘋果4推出時才開始使用retina屏。當時，屏幕ppi是163px，用戶可以在屏幕上點擊的物理尺寸是7毫米-9毫米。讓我們用7毫米來計算，一英寸長度里有163像素，一英寸有25.4毫米，那么7毫米里應(yīng)該有多少像素?

簡單的數(shù)學(xué)換算可以得出44.92px，這就是我們通常所說的44px。所以這個44px只是一個相對長度，它會隨著屏幕ppi的變化而變化。如果不明白這一點，你可能會死抓著44px不變，在任何分辨率屏幕上使用44px，顯然是錯誤的。