文章轉自:https://blog.csdn.net/iotjin/article/details/79470798
先來看看各種iPhone的尺寸和分辨率,這張圖寫的很清楚。
設備名稱 屏幕尺寸 PPI Asset 豎屏點(point)豎屏分辨率(px)
iPhone XR 6.1in? ?414X896??828px × 1792
iPhone XS Max 6.1in?414X896??1242 × 2688
iPhone XS 5.8in? ?375X812? ?1125px × 2436
iPhone X 5.8in 458@3x 375 x 812 1125 x 2436
iPhone 8+, 7+, 6s+, 6+5.5 in401@3x414 x 7361242 x 2208
iPhone 8, 7, 6s, 64.7 in326@2x375 x 667750 x 1334
iPhone SE, 5, 5S, 5C4.0 in326@2x320 x 568640 x 1136
iPhone 4, 4S3.5 in326@2x320 x 480640 x 960
iPhone 1, 3G, 3GS3.5 in163@1x320 x 480320 x 480
iPad Pro 12.912.9 in264@2x1024 x 13662048 x 2732
iPad Pro 10.510.5 in264@2x834 x 11121668 x 2224
iPad Pro, iPad Air 2, Retina iPad9.7 in264@2x768 x 10241536 x 2048
iPad Mini 4, iPad Mini 27.9 in326@2x768 x 10241536 x 2048
iPad 1, 29.7 in132@1x768 x 1024768 x 1024
最新設計指南推薦:
facebook出品的iOS 10 GUI (iPhone)源文件
雖然現在出來了Iphone X ,但是我們在工作中還是會按照750*1134來設計,虎哥總結一個精簡版的設計流程方法,按這個做法就可以展開工作。
新建750×1334 ?分辨率72,像素/英寸。
24px、26px、28px、30px、32px、34px,36px等等。記住是偶數的。最小字號20px。
中文用蘋方黑,英文用San Francisco,如果安不上也可以用Helvetica代替。
750×1334尺寸的換算關系 1pt=2px,也就是說程序員拿到我們的px單位的標注稿,自己除以2就是pt了。
24px、32px,48px等,記住4的倍數比較好。
注意圖標的尺寸要統一尺寸,以眼睛觀察為主調整尺寸看上去一樣。方形的比圓形的看著要大,需要調整下。
以偶數為單位,不清楚的可以截圖量大公司的APP界面作為參考。
750 x 1334?設計稿尺寸:
狀態(tài)欄高度:40 px
導航欄高度:88 px
標簽欄高度:98 px
做1024×1024尺寸,一般做方形無圓角。
最好是一個界面一個文件夾。文件夾里包括:界面效果圖,標注文件圖,切圖資源文件包。
值得注意的是引導頁切圖需要單獨設計多套(640×1136、750×1334、1125×2436、1242×2208)