Update: Lesen Sie unseren neuen ultimativen Leitfaden für iPhone-Auflösungen!
Vor wenigen Tagen hat Apple das iPhone 6 Plus vorgestellt. Das neue iPhone verändert die Art und Weise, wie Grafiken auf dem Bildschirm gerendert werden, erheblich. Wir haben eine Infografik erstellt, um dies zu entmystifizieren.
320 × 480 375 × 667 414 × 736 320 × 480 750 × 1334 1242 × 2208 1080 × 1920 3,5″ 4,7″ 5,5″ Das iPhone 6 Plus verfügt über einen Bildschirm mit einer niedrigeren Pixelauflösung als das im vorherigen Schritt gerenderte Bild.Bevor das Bild auf dem Bildschirm angezeigt werden kann, muss es auf eine niedrigere Pixelauflösung heruntergerechnet werden (resized). Physikalische Pixel Zu Beginn werden die Koordinaten aller Zeichnungen in Punkten angegeben. Punkte sind abstrakte Einheiten, die nur in diesem mathematischen Koordinatenraum Sinn machen. Beim ursprünglichen iPhone entsprachen Punkte perfekt den tatsächlichen Pixeln auf dem Bildschirm, aber das ist nicht mehr der Fall. Punkte Punktbasierte Zeichnungen werden in Pixel umgewandelt. Punktkoordinaten werden mit einem Skalierungsfaktor multipliziert, um Pixelkoordinaten zu erhalten. Je höher der Skalierungsfaktor, desto höher die Detailgenauigkeit – typisch sind die Skalierungsfaktoren 1×, 2× und 3×. Gerenderte Pixel Der letzte Schritt besteht darin, die berechneten Pixel auf dem physischen Bildschirm darzustellen.Jeder Bildschirm hat die Eigenschaft Pixel pro Zoll (PPI). Diese Zahl gibt an, wie viele Pixel auf einen Zoll passen und wie groß die Pixel somit in der realen Welt erscheinen. Physikalisches Gerät rendern bei 1× Downsampling / 1,15 auf dem Gerät anzeigen auf dem Gerät anzeigen auf dem Gerät anzeigen (Pixel) (Pixel) (Pixel) (Punkte) (Gerätepixel) (Punkte) Original iPhone iPhone 6 iPhone 6 Plus 3,5″ 4,7″ 5,5″ 163 PPI 326 PPI 401 PPI Punkte. rendern bei 3× rendern bei 2× ein iPhone 6 Plus rechnet das gerenderte Bild herunter, bevor es auf dem Bildschirm angezeigt wird. Physische Pixel Der Inhalt wird mathematisch durch Punktkoordinaten definiert. Punkte Der Inhalt wird mithilfe eines Skalierungsfaktors in Pixel umgewandelt. Dieser Vorgang wird als Rasterung bezeichnet. Gerenderte Pixel Gerasterte Zeichnungen werden auf den physischen Geräten angezeigt. Physikalisches Gerät rendern 2× Downsampling / 1.15 auf dem Gerät anzeigen auf dem Gerät anzeigen auf dem Gerät anzeigen Original iPhone iPhone 6 iPhone 6 Plus 3.5″ 4.7″ 5.5″ rendern 3× rendern 1× a a
Linienrendering
Um das unterschiedliche Rendering von Pixeln auf verschiedenen Geräten zu demonstrieren, vergleichen wir, wie eine 1-Punkt breite Linie auf
- Original iPhone – ohne Retina-Display – gerendert wird. Skalierungsfaktor ist 1.
- iPhone 5 – mit Retina-Display, Skalierungsfaktor ist 2.
- iPhone 6 Plus – mit Retina-Display HD. Skalierungsfaktor ist 3 und das Bild wird anschließend von gerenderten 2208 × 1242 Pixeln auf 1920 × 1080 Pixel herunterskaliert.
Das Downscaling-Verhältnis ist 1920 / 2208 = 1080 / 1242 = 20 / 23. Das bedeutet, dass alle 23 Pixel des ursprünglichen Renderings auf 20 physische Pixel abgebildet werden müssen. Mit anderen Worten: Das Bild wird auf etwa 87 % seiner ursprünglichen Größe herunterskaliert.
23 Pixel 20 Pixel Original iPhone 3,5″ iPhone 5 4″ iPhone 6 Plus 5,5″ HypotheticalPerfect 3× Display ?