广州APP开发公司-解读iPhone 6Plus的设计尺寸为什么

    作为一名APP设计师，我们必须了解iPhone 6 Plus为什么会有三个尺寸。因为其他的iphone手机只有一个尺寸。而且，目前我们要以1242*2208px作为iPhone 6 Plus的设计尺寸呢？

我想各位设计小白们心中，很多种疑问，十万个为什么都有了。

 

 

里面专门给大家整理了iPhone 6 Plus的三个尺寸。 如下图所示：

 

不用担心，这节课25学堂的小编为大家揭秘一下iPhone 6 Plus的设计尺寸为什么是1242*2208px。

 

让我们先来回顾一下iPhone 6 Plus的参数指标：

iPhone 6 Plus 尺寸参数   

5.5英寸Retina HD高清显示屏，1920×1080像素分辨率，401 ppi

机身三围(长×宽×高)：158.1毫米(6.22英寸) × 77.8毫米(3.06英寸) × 7.1毫米(0.28英寸)

重量：172克 (6.07盎司)

1920  *   1080px 是iPhone 6 Plus手机的物理尺寸，也就是物理分辨率。同时也是401ppi 的屏幕。

 

扩展阅读，我希望大家好好看下这个信息图。iphone 6演变成iphone 6 plus的几种方案分辨率对比图。

 

 

然后，我们举例来说说iPhone 6 Plus的呈现图像的方式。

 

假设一：iPhone 6 Plus继续采用iphone的@2x 倍的分辨率来显示图像。

比如说，我们在iPhone 6 Plus屏幕上继续使用 @2x 系数的 Retina，换句话说还是跟iphone6 iphone5 一样，放大一倍的关系来呈现图像。

那么同样的一张照片应该显示如下：

此时，1080px 对应的逻辑像素是 540 pt @2x。如上图右边的iPhone 6 Plus手机标注的一样。

当我们将上述的理论变成现实的时候，其调整回真机物理尺寸的时候，会发现 iPhone 6 Plus 上的图反而变小了。非常的惊讶。如下图所示：

看完上面这个对比图，是不是iPhone 6 Plus的采用@2x倍的分辨率显示的图像比iphone6 小。这样会导致一个非常尴尬的结果：用户拿着一个大屏手机，字却反而比小屏幕手机更小，更看不清楚。

因此，@2x 不合适iPhone 6 Plus。

 

假设二：我们 改用@3x倍率来显示图像如下：

得出的结论那就是 照片肯定显示得要大多了，看的很清楚了。同时也带来了一个问题。

但逻辑像素则成了 360pt @3x，比 iPhone 6 的 375pt @2x 还要少。另一个尴尬的局面产生：用户拿着一个大屏的 iphone，看到的内容反而比iphone6和5少了。非常不好。

根据上述的结论，@2x 和 @3x 在iPhone 6 Plus  都不太行得通。苹果公司也是经过很长的心理纠结。最终定下采用@3x。

真正合理的倍率应该是多少呢？   如果真的要等比例，应该是 @2.46x，但这个数字太坑了，无论是APP设计师还是ios开发人员都会疯掉。非常不利于我们开发和设计。

因为换算太难了。呵呵呵

看到这里，大家心理有疑问。那这个2.46到底是怎么算出来的呢？  25学堂把这个公式给大家列出来了。

我们以宽为例来计算。

iphone  6             宽的    @2x     像素密度：326ppi

iphone  6 plus    宽的    ？？     像素密度：401ppi

换算公式就是这样： @2x / 326ppi = ？？/401ppi     得出 结果就是  @2.46倍率。

 

真正合适的倍率@2.46     处于 @2x和@3x 之间。

于是，苹果公司给出了一个实在奇葩的方案（虽然想想也合理）：不是现有的屏幕物理分辨率明显超过了 @2x 但还达不到 @3x 的水平么？   那就采用 @3x 的屏幕总可以满足了。

最终结果，为了方便APP设计师和ios开发工程师的，最终决定采用1242*2208px来作为设计尺寸。

原因就是：使得设计和开发的过程大大简化，且最后的实际缩放系数 @2.62x 非常接近理想的 @2.46x，使得同样的素材在真机上看起来尺寸也非常合理。

在iphone的retina屏幕上，这些细微的细节，我们的肉眼已经无法判断了。401PPI已经超高。 所以我们无法感觉到图像已经缩小了。实际上在iPhone 6 Plus上展示出来的图像都是缩小的。比我们设计的原图要小13%左右。

iOS 拿到我们设计的 UI 绘制结果尺寸，实时地再缩小到实际的 1080 x 1920 分辨率。于是，用户在 iPhone 6 Plus 的屏幕上看到的永远是被缩小了的图像。如下图所示：

iPhone 6 Plus的设计尺寸选择是1242*2208px，真正的原因还是为了方便ios开发者和APP设计师。 给我们提供了方便。这就是苹果公司的用户体验设计奥秘。

第二个理由：

iPhone 6+除外，其他所有iPhone的DPI是一致的，都是326，用@2x的素材。

但是6+的实际DPI是401，理论上苹果应该用401/326 * @2x=@2.46x的素材。但是这个奇葩的比例对开发者而言很难切图。所以苹果为方便开发者用的是@3x的素材，然后再缩放到@2.46x上，实际上是缩放到2.46/3=83%。实际上苹果选取了一个接近比例的87%。
这样算下来，物理分辨率和虚拟分比率的比例是87%，也就是1920/0.87=2208，1080/0.87=1242
好处就是开发者更方便，比如准备素材时，字号可以直接调成3x的。

 

另外一些好奇的小伙伴也已经给出了答案：

首先iPhone6没有设计版，只有iPhone6 plus有。说简单点， plus屏幕有1080个像素点，但截屏后发现图像是1242像素，明白了吗？   就是在一个物理有1080个像素点的屏幕里塞了个1242像素的内容，你按照1242 *2208px 做就好了。

 

 

至于iPhone 6 Plus的设计尺寸为什么有三个尺寸，是因为针对的对象不一样。

iphone6 plus UI物理版： 就是iphone6 plus实际的屏幕像素。

iphone6 plus UI设计版： 就是我们截屏iphone6 plus的界面在ps中去量，发现的尺寸。

iphone6 plus UI放大版：就是iphone 6 的尺寸等比放大1.5倍得出的分辨率。