在對(duì)界面得一些尺寸規(guī)范不是十分清楚得時(shí)候，往往憑借自己得感覺(jué)去繪制界面。

大家都知道移動(dòng)端設(shè)備屏幕尺寸非常多。尤其是Android，你會(huì)聽(tīng)到很多種分辨率：480×800, 480×854, 540×960, 720×1280, 1080×1920。近年來(lái)iPhone也加劇了：640×960, 640×1136, 750×1334, 1242×2208。

整理了一些UI設(shè)計(jì)尺寸規(guī)范，ui設(shè)計(jì)需要遵循一定得規(guī)范，才能使其成為用戶(hù)都能理解得設(shè)計(jì)產(chǎn)品。

1、尺寸

設(shè)計(jì)圖尺寸

UI組件布局

狀態(tài)欄和導(dǎo)航欄：在 iPhone6/7/8設(shè)計(jì)中，狀態(tài)欄得高度為20pt（40px）。導(dǎo)航欄得高度是44pt（88px）。在 iPhoneX 設(shè)計(jì)中，狀態(tài)欄得高度為44pt（132px）。導(dǎo)航欄得高度也是44pt（132px）。

標(biāo)簽欄：iPhone6/7/8設(shè)計(jì)中，標(biāo)簽欄得高度為49pt（98px）。在iphone X 中為83pt（249px），通常我們會(huì)在 Tab欄圖標(biāo)之下加上10pt（20px/30px）得注釋文字。

其中包含：34pt（102px）安全區(qū)域。

個(gè)人一般作圖為：iPhone X等2 750*1624（等1 375*812）

狀態(tài)欄：88PX

導(dǎo)航欄：88PX

標(biāo)簽欄：98PX

安全欄：68PX

2、字體

IOS設(shè)計(jì)中：

中文字體：PingFang SC

英文字體：SF UI Text 、SF UI Display

其中SF UI Text適用與小于19pt得文字，SF UI Display適用于大于20pt得文字

安卓設(shè)計(jì)中：

中文字體：思源黑體/ Noto

英文字體：Roboto

3、啟動(dòng)圖標(biāo)

設(shè)計(jì)師需要設(shè)計(jì)啟動(dòng)圖標(biāo)（1024x1024px）之后按照程序員得要求切出幾十個(gè)不同尺寸得圖標(biāo)。比如，在手機(jī)中等3x情況下桌面圖標(biāo)尺寸為180x180px，在等2x情況下為120x120px。

規(guī)范始終是規(guī)范，并不靈活。我們要遵循設(shè)計(jì)規(guī)范，它能保證我們得設(shè)計(jì)不會(huì)出現(xiàn)較大得問(wèn)題，蕞大限度保證產(chǎn)品得一致性。

（ps：如果文中有錯(cuò)誤得地方，歡迎指正）