- Photoshop CC 移動UI設計案例教程(全彩慕課版)
- 胡金黎 朱海燕
- 594字
- 2020-06-12 16:11:31
2.1.1 iOS設計尺寸

iOS系統設計規范
1. 相關單位
PPI:像素密度(Pixels Per Inch),是屏幕分辨率單位,表示每英寸所擁有的像素數量,如圖2-1所示。像素密度越大,畫面越細膩。因此,iPhone 4與iPhone 3GS的屏幕尺寸雖然相同,但實際像素大了一倍,清晰度自然更高。

圖2-1 PPI的計算公式(X、Y分別為橫向、縱向的像素數)
Asset:比例因子。標準分辨率顯示器具有1∶1的像素密度,用@1x表示,其中一個像素等于一個點。高分辨率顯示器具有更高的像素密度,比例因子為2.0或3.0,分別用@2x和@3x表示,如圖2-2所示。因此,高分辨率顯示器需要具有更多像素的圖像。

圖2-2 一個10px×10px的標準分辨率(@1x)圖像,該圖像的@2x版本為20px×20px,@3x版本為30px×30px
邏輯像素和物理像素:邏輯像素(Logic Point)的單位為“點”(points,pt),是根據內容尺寸計算的單位。iOS開發工程師和使用Sketch軟件設計界面的UI設計師使用的單位都是pt。物理像素(Physical Pixel)的單位為“像素”(pixels,px),是按照像素格計算的單位,也就是移動設備的實際像素。使用Photoshop軟件設計界面的UI設計師使用的單位都是px。
例如,iPhone X/XS的邏輯像素是375pt×812pt,由于視網膜屏像素密度的增加,即1pt=3px,因此iPhone X/XS的物理像素是1125px×2436px,如圖2-3所示。

圖2-3 邏輯像素與物理像素的轉換
2. 設計尺寸
iOS常見的設備尺寸如圖2-4和圖2-5所示。在進行界面設計時,為了一稿適配多種尺寸,都是以iPhone 6/6s/7/8為基準的。如果使用Photoshop,就創建750px×1334px尺寸的畫布;如果使用Sketch,就創建375pt×667pt尺寸的畫布。

圖2-4 iOS常見設備的尺寸

圖2-5 iOS設計標準尺寸
- 性能測試從零開始
- UG NX 9.0中文版 基礎教程 (UG工程師成才之路)
- AIGC輔助數據分析與挖掘:基于ChatGPT的方法與實踐
- PowerPoint 2019從入門到精通(移動學習版)
- Ogre 3D 1.7 Beginner's Guide
- Elasticsearch實戰與原理解析
- BlackBerry Enterprise Server 5 Implementation Guide
- Premiere CC視頻編輯入門與應用
- Excel公式、函數與圖表案例實戰從入門到精通(視頻自學版)
- Premiere Pro CC 2018基礎教程(第3版)
- Flash CC動畫制作與應用(第3版)
- 構筑敏捷的開發團隊:微軟Visual Studio 2010實戰兵法
- CAD/CAE技術應用
- Creo 5.0從入門到精通(第2版)
- Jasmine JavaScript Testing