iPhoneUI设计分辨率最终梳理

在讲这期视频之前，再容许我介绍一下新像素。相信关注很久新像素的同学与毕业学员都不会陌生啦。这次我要重点给最新关注新像素的同学们讲一下，新像素成立于2015年，2016年从北京迁移到了郑州，2020年又新增了武汉校区，武汉校区和郑州校区都是一样的师资和管理模式，经常会在群里看到老学员们对比这两个校区的实力，其实没有谁强谁弱的区分，因为曾经都是在一个教研办公室的老师授课。新像素之所以在这两个城市开设的目的就是在这两个城市交通便利，全国的学员都能聚集来学习，同时也能够降低教学成本，减少同学们的学习费用。新像素的教研部师资力量在业内对比应该算比较的，蓝胖老师和我（草帽老师）只是教研部的普通一员，不过是在自媒体露面机会相对来说比其他老师多一些。新像素教研团队拿国内的设计奖项也拿到了手软，UI中国阿里蓝湖等专业平台和综合的平台都有拿到。目前教研团队还在不断更新课件，新像素的就业*也并没有因为市场环境的影响而减弱，鉴于教学质量的不断提升，可能下半年学习费用也会有相应的上调，同学们要抓紧时间扫描文章结尾的二维码预约名额啦。 好的，开始正文，先看视频，再看笔记。 前面我们把iPhone分辨率从头到尾给过了一遍，在这个中间我们也大概了解了它的分辨率是怎么一步一步越来越大的，那么今天我们主要解决两个问题，就是设计稿基准尺寸和状态栏到底该选择哪个？

首先，我们把每个阶段第一次发生变化的机型筛选出来，这样梳理完之后一下子就少了很多，其实这样看着还是有点乱，而且中间有很多分辨率宽度相同的机型是重复的，我们还需要进一步合并。

但是先别着急，合并之前我们先把状态栏加进来，这样也更方便大家理解。状态栏加进来之后，我们可以看出来老的375的状态栏用了很长一段时间，然后第一次变化就是iPhone X。其实仔细观察能发现，这些状态栏所有的变化都是基于先从工业设计上有变化，然后软件方面再去跟着变化。 只是这里我们要知道，重叠部分的两个状态栏高度是不一样的，一个是44，另外一个是47。之所以把他们放到一起是想告诉大家这两个我们用哪一个都可以，对于开发来说，状态栏和底部的Home键他是没权限改的，哪怕说你用错了开发也不会理你，也不会照着你的改，因为这两个地方是苹果ios系统级的控件，不让随便改，*多让你改个背景色，所以对我们来说区别确实不大，大家如果用的话可以选择最新的。

其实到这一步还是有点多，我们再把分辨率宽度相同的给合并一下，这样合并之后只有7个分辨率宽度，然后我们把状态栏再放进去。 首先老机型320宽度使用的肯定是375*20高度的状态栏，当然375跟414用的也是这个，那么宽375尺寸的机型是不是都是这个状态栏呢？这可不一定。因为iPhone 12 mini也是375，但是它用的就是带有刘海的，所以说375宽度下的状态栏除了高20的还可以用高44或者47的。 说到这儿，忽然想到前面有个同学说375宽度下的设计稿做样机包装的时候很丑，我一问，他说用的是高20的那个状态栏，到这里他应该就知道了也可以选择用这个新的刘海的状态栏，最后再找一个样机包装一下，也可以好看。

然后我们继续往下梳理，这一次我们加入时间线的先后顺序。比如说第*波的时候小的320，中间的375，大的414，按基准设计稿来说这是第*个时代，后面直到iPhone 12又出来两个新的尺寸，中间的型号是390了，原来的375被下放，然后大的变成428。 最后就是iPhone 14灵动岛出来之后尺寸又发生了一波变化，最小的是375，中间的是393，*大的尺寸是430，按照苹果的思路，这个应该最新的基准尺寸，然后上面还有个320的小屏，但是iPhone 12出来的时候，320被苹果正式的弃用了，最小的变成了375，所以现在基本上来说320已经消失了。

按照上面的方法梳理完之后，原来的这么多分辨率，我们到最后无非就是375、390和393该选择哪个作为基准设计稿。375我们肯定不用考虑，那390和393我个人的主观建议是选择390，因为390和393两个的区别不是很大。 再者就是这里大家不要怕用错，还是那句话，开发是没权限改的，这个地方苹果会自动适配，哪个机型会自动显示哪个机型的状态栏，所以说你用不用错关系不大，只要他们的高度大差不差就可以了，另外选择390还有一个地方能帮助我们去容错，那就是现在的UI设计工具自适应布局都已经做的很好了，错3个像素问题真的不大。