iPhone又出新机了，UI设计师该用什么尺寸呢？

20190911补充

是的，今天凌晨，苹果按照惯例，发布了三款新手机，不关注功能，不关注价格，我们继续只关注分辨率。

iPhone 11：1792 x 828 像素分辨率，326 ppi
iPhone 11 Pro：2436 x 1125 像素分辨率，458 ppi
iPhone 11 Pro Max：2688 x 1242 像素分辨率，458 ppi

来看下去年的结论：
1.iOS 设备，尺寸保持750×1334，并逐步转换成 1242×2208
2.Android 设备，尺寸保持1080×1920

2019年1月更新结论：
截止2019年1月，随着iPhone X 、XS、XS Max的发布与市场深入，目前 iOS 平台上，1242×2208 的设备分辨率占比已经超过 750×1334 ，所以我们的设计师在做iOS的设计的时候，可以考虑用@3倍来做了，也就是 1242×2208 的尺寸。

对比可以看出，今年的分辨率是个新的尺寸比例，由于刚发布，占有率肯定不高，所以我们继续保持 1242×2208 的尺寸就好了。

概述

iPhone这次一下出了三款新机，iPhone Xs、iPhone XR、iPhone Xs Max，那么问题来了，这三款手机与之前的有什么不同，设计师的UI尺寸会发生什么变化，移动端页面的UI到底应该以多少为好？接下来我们将一一探讨。

看三款新机分辨率

Device	Portrait dimensions	计算
iPhone Xs Max	1242px × 2688px	1242 = 414*3
iPhone Xs	1125px × 2436px	1125 = 375*3
iPhone XR	828px × 1792px	828 = 414*2

上述分辨率好像似曾相识，是不是在哪里见过，看了计算栏是不是有点，哦。。。还是不太明白。。。

看前辈们的分辨率

Device	Portrait dimensions	计算
iPhone X	1125px × 2436px	1125 = 375*3
iPhone 8 Plus	1242px × 2208px	1242 = 414*3
iPhone 8	750px × 1334px	750 = 375*2
iPhone 7 Plus	1242px × 2208px	1242 = 414*3
iPhone 7	750px × 1334px	750 = 375*2
iPhone 6s Plus	1242px × 2208px	1242 = 414*3
iPhone 6s	750px × 1334px	750 = 375*2
iPhone SE	640px × 1136px	640 = 320*2
iPhone 5	640px × 1136px	640 = 320*2
iPhone 4	640px × 960px	640 = 320*2

以上数据来源iPhone开发者平台

从iPhone 4 至今，发布的部分手机设备分辨率如上，看到计算栏我们可以总结出：
iPhone 系列手机的分辨率大致分三类两种倍数：

横向分辨率	基数	倍数	代表机型
640	320	@2X	iPhone 4 4s 5 5s 5c SE
750	375	@2X	iPhone 6 6s 7 8
1125	375	@3X	iPhone X Xs
828	414	@2X	iPhone XR
1242	414	@3X	iPhone 6s 7 8 Plus，iPhone Xs Max

行业老兵应该回忆起来了，15年之前，大家做移动端UI设计，尺寸一般用的都是640，15年之后基本上用的是750，除此之外，大家可能用的比较多的还有1080，这个后面会解释。
设计师用什么尺寸，肯定是根据市场来的，所以谁也不能保证以后会用什么尺寸，这完全需要根据设备的市场占有率来做相应调整。

看分辨率市场数据

根据百度流量研究院统计，截止2018年7月，iOS设备机型排名和分辨率排名：

可以看到在IOS设备上分辨率前两名占据了>75%的份额，而且1242与750的占比很接近，随着这次iPhone Xs Max（1242×2688）的发布，必将逐步增加1242分辨率的占比，超过750分辨率也指日可待，所以接下来设计师的UI尺寸可能会变成1242*2208。

接下里我们来看Android，截止2018年7月，Android设备机型排名和分辨率排名：

可以看出，Android设备中分辨率占比最大的是1080，这也就解释了上面提到的有些设计师会用1080的尺寸，因为这个尺寸是目前Android市场上最通用的，我们可以看出，除了第一名，下面还有1080的横向分辨率，加起来>50%。

考虑到国内市场，Android占有率还是远大于iOS的，所以设计师选择用1080的尺寸也是毫无争议，当然大部分的设计师还是热衷于iOS尺寸，其中原因也不好细说，可能跟个人喜好有关。

还有一种可能是根据公司产品平台分布来选择，比如我们的某个产品只有Android的APP，那肯定就建议用1080的尺寸啦。
如果两个平台都有，同时运营又明确统计出了哪个系统或设备分辨率的用户占比，那肯定也是有理有据选择占比大的那波用户来服务啦。

得出结论

1.iOS 设备，尺寸保持750×1334，并逐步转换成 1242×2208
2.Android 设备，尺寸保持1080×1920

扯了半天，UI设计师该用什么尺寸呢？答案是，先看用户数据，如果没有，那就继续按目前的尺寸就行，跟没看过这篇文章一样，继续干活。

扩展

前面之所以把一个分辨率拆分成基数*倍数的书写形式，首先可以让大家清楚的知道iOS是如何在考虑设备的分辨率的，不是随便一个数据，其次是因为分辨率涉及到另外两个概念，像素密度（PPI）和设备像素比（DPR），上面提到的@2X、@3X和DPR是一个等同的概念，如果大家有兴趣，后面可以为大家详细讲解，也可以直接阅读我以前写的文章《移动Web开发基础-Viewport》。

进展更新

截止2019年1月，随着iPhone X 、XS、XS Max的发布与市场深入，目前 iOS 平台上，1242×2208 的设备分辨率占比已经超过 750×1334 ，所以我们的设计师在做iOS的设计的时候，可以考虑用@3倍来做了，也就是 1242×2208 的尺寸。