: IPhone 5s, 6, 6 Plus design confusions around dimensions, resolutions and densities I have to design an iOS app in iPhone 5S, 6 and 6 Plus in Adobe Illustrator. Can anyone help me with the

@Kristi927

Design in points, then scale up.

A point what was once a single pixel on non-retina devices. In the world of @2x retina devices, a point is now 2x2 pixels (4 pixels make up a single point), and in the world of @3x retina (6 Plus), a point is now 3x3 pixels (9 pixels make up a single point). The iPhone 6 Plus also does down-scaling automatically (from 1242x2208, to 1080x1920), but you should forget about that fact when designing. The down-sampling is out of your control. It does mean non- pixel-perfect GUI, but the PPI on 6 Plus is so high, it still looks sharper.

The point sizes, for each device you should design in, are:

For 4S: 320x480

For 5/5S: 320x568

For 6: 375x667

For 6 Plus: 414x736

In Illustrator, do your designs in points (I do these sizes in pixels), then after initial design, scale them up.

For iPhone 5/5S, scale by 200%, this will give you your @2x design.

For iPhone 6, also scale by 200%, this will give you your @2x design.

For iPhone 6 Plus, scale by 300%, this will give you your @3x design.

After the scaling, you can then fine-tune your pixel art, if you want to take advantage of single pixels on a @2x or @3x device for example.

Here is also a great article that will help you visualize this information: www.paintcodeapp.com/news/iphone-6-screens-demystified
I hope this helps!

Vote Up Vote Down

@Samaraweera207

Create your application as per 5S dimension. This fine you need given assest to developer as below.
Retina display for iPhone4S,5,5S and 6 use @2x and only for 6pluse give @3x assest.

For more refrence of assest size and guideline refer below link. iosdesign.ivomynttinen.com/

Vote Up Vote Down