Mobile Screen Sizes

1. 320 × 568
375 × 667
1125 × 2001
4.7″
5.5″
The device screen may
have lower pixel resolution
than the image rendered
in previous step.
Before the image can be
displayed, it must be
downsampled (resized) to
lower pixel resolution.
Physical Pixels
At the beginning,
coordinates of all
drawings are specified in
Points are abstract units,
they only make sense in
this mathematical
coordinate space.
Points
Point-based drawings are
rendered into pixels. This
process is known as
rasterization.
Point coordinates are
multiplied by scale factor
to get pixel coordinates.
Higher scale factors result
in higher level of detail.
Rendered Pixels
Finally, computed pixels
are displayed on the
physical screen.
The PPI number tells you
how many pixels fit into
one inch and thus how
large the pixels appear in
the real world.
Physical Device
750 × 1334
iPhone 6 iPhone 6 Plus
4.7″
5.5″
points.
render at 3×render at 2×
Display Zoom Display Zoom
(device pixels)
414 × 736
1242 × 2208
1080 × 1920
5.5″
show at 401 PPI
(pixels)
(points)
(device pixels)
iPhone 6 Plus
5.5″
render at 3×
375 × 667
750 × 1334
4.7″
iPhone 6
render at 2×
1080 × 1920
(device pixels)
320 × 568
640×1136
iPhone 5, 5s
render at 2×
4″
4″
320 × 480
640 × 960
3.5″
render at 2×
(pixels)
iPhone 4, 4s
3.5″
320 × 480
3.5″
render at 1×
(pixels)
iPhone 2G, 3G, 3GS
3.5″
(points)(points)
(points)(points)
(points)(points)
downsampling × 0.96 downsampling / 1.15
(pixels)
(pixels)
(pixels)
320 × 480
show at 401 PPIshow at 326 PPIshow at 326 PPIshow at 326 PPIshow at 326 PPIshow at 163 PPI
4.7″
640×1136
(pixels)
upsampling × 1.171875
a
iPhone 6 Plus
downsamples the
rendered image before
displaying it on screen.
Physical Pixels
The content is defined
mathematically using
point coordinates.
Points
Content is rendered to
pixels using scale factor.
This process is called
rasterization.
Rendered Pixels
Rasterized drawings are
displayed on the physical
devices.
Physical Device
render 2×
show on device show on device show on device
Original iPhone iPhone 6 iPhone 6 Plus
3.5″
4.7″
5.5″
render 3×render 1×
a a
downsampling / 1.15
PaintCode
Make your apps truly resolution-independent with PaintCodeApp.com