iOS设计尺寸规范：iPhone和iPad全产品分辨率和UI设计尺寸

iPhone12在10月14日发布，我们可以来分析iPhone12系列对整个iOS系统的UI设计变化。iPhone12看起来有很多尺寸，那么如何来设计iPhone12系列机型呢？我们来分析和讨论一下。

少废话，先看东西

与上一代iPhone对比，新的iPhone扩充了两名成员。

基本属性

屏幕尺寸（英寸）

这个对于设计师和前端来说比较重要。在苹果的App Store审核中，App Store不会去描述你需要上传的屏幕快照是多少像素的，而是具体指出是多少英寸的iPhone。

分辨率

这个是iOS在设备上的渲染分辨率，可能与物理的分辨率不同。单位是px，也就是像素。我们使用手机截图等操作都是能看到设备的渲染分辨率。

屏幕比例

目前主流iPhone使用的是19.5:9，这个尺寸也是作为推荐视频创作者的满屏尺寸比例。设计师可以通过这个屏幕比例和百分比来做出更多适应性的全屏内容，而不拘泥于像素单位。

设计倍率

当前设计师大多使用@1x或者@2x进行设计。@1x设计的好处是适应所有界面，可以导出不同尺寸的图片。@2x设计的好处是。。。（一般使用@2x设计的可能是photoshop设计师）如果你是使用sketch设计或者其他矢量设计软件，建议使用@1x保证最强适配性，如果你是使用Photoshop等像素软件进行设计，建议使用@2x及以上或者智能对象等设计方法来保证清晰度。

设计尺寸

设计尺寸是开发的主要单位，单位为pt。在使用Xcode进行软件开发的时候数字单位基本都是1倍下的pt形式出现，也就是@1x下的设计尺寸。这又体现出使用@1x设计的优势，就是单位统一，不需要额外计算。

PPI

这个表现了屏幕的清晰度，PPI越高，单位面积的物理像素越多，屏幕越清晰。

设备适配

对于设计尺寸不同，设计倍率相同的设备

在手动标注的年代，设计师可以通过标注来适配各个尺寸的机型。但是目前大多采用自动标注的方式，所以设计师需要与前端工程师反复沟通。

在设计稿只有一个通用尺寸的情况下，通过固定宽度/固定高度/等比放大/屏幕百分比/最小尺寸/最大尺寸等多种方式进行每个组件的尺寸适配。

对于设计尺寸相同，设计倍率不同的设备

可以直接通过导出@2x、@3x来适应不同的设备。目前apple都开始采用oled屏幕，基本以后的屏幕都会以@3x的倍率出现。鉴于iPhone系列堪忧的续航，短时间内不会再出@4x等更高倍率（手机端），可以放心食用。

iPhone12系列的到来给UI设计稿带来的变化

目前主流的设计稿为375x812，最新的12系列只有12mini采用这种尺寸（部分传统公司在使用375x667）。iPhone12和12pro具备了相同的像素和设计尺寸，所以我们可以看到未来的下一代主流设计尺寸将使用390x844来进行设计。

使用一个设计稿，然后通过标注和沟通进行多端适配。

所有iOS设备详细参数

iOS设备具有各种屏幕尺寸，可以纵向或横向使用。在像iPhone X和iPad Pro这样的边缘到边缘设备中，显示屏的圆角与设备的整体尺寸紧密匹配。其他设备（例如iPhone SE和iPad Air）具有矩形显示屏。

如果你的应用在特定设备上运行，请确保该应用在该设备的所有屏幕尺寸上运行。换句话说，仅iPhone应用程序必须在每个iPhone屏幕尺寸上运行，而仅iPad应用程序必须在每个iPad屏幕尺寸上运行。