ui設計的基礎知識

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

像素與分辨率的關系

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

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

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

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

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

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

分辨率換算

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

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

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