Seitenverhältnisse und Sicherheitsbereiche.
iPhone-Seitenverhältnisse
Die tatsächlichen Seitenverhältnisse der modernen iPhone-Klassen:
- 6.9" (16 Pro Max):
1320 × 2868= 2.173 (≈ 19.5:9) - 6.7" (15 Pro Max, 15 Plus, 14 Plus, 13 Pro Max, 12 Pro Max):
1290 × 2796= 2.167 - 6.1" (16, 15, 14, 13, 12, 11):
1170 × 2532= 2.164 - 5.5" (8 Plus, 7 Plus, 6s Plus):
1242 × 2208= 1.778 (16:9)
Die 5.5"-Klasse ist der Ausreißer — ältere Geräte verwendeten 16:9. Wenn du für beide designst, verankere wichtige Inhalte im mittleren vertikalen Streifen, damit sie bei beiden Seitenverhältnissen sichtbar bleiben.
Sicherheitsbereiche
Der App Store stellt Screenshots mit abgerundeten Ecken dar (passend zum Geräterahmen) und kann in manchen Karussell-Positionen App-Metadaten überlagern. Aus der Praxis:
- Obere 80 px können durch Statusleisten-Overlays oder den Eckradius abgeschnitten werden.
- Rand 60 px auf jeder Seite ist der realistische sichere Außenabstand.
- Untere 100 px werden auf kleineren Telefonen manchmal von der „Weitere anzeigen“-Geste verdeckt.
Untertitel und CTAs sollten zwischen 80 und 600 px vom oberen Rand des Designs liegen — bei Thumbnail-Größe sichtbar, bei voller Größe nicht abgeschnitten.
Wo das Auge zuerst landet
Eye-Tracking-Studien zu App-Store-Karussells (übereinstimmend aus Analysen mehrerer ASO-Unternehmen, 2024–2026) zeigen die stärkste Aufmerksamkeit im oberen linken Quadranten jedes Panels. Wichtiger Untertiteltext liest sich am besten, wenn er das obere Viertel des Panels einnimmt und sich farblich kontrastreich vom Hintergrund abhebt. Gerätedarstellungen wirken besser, wenn sie leicht geneigt sind (8-15° um die Y-Achse), statt frontal ausgerichtet zu sein.
Praktisches Sicherheitsbereich-Overlay
Wenn du in Figma oder Photoshop designst, leg diese Hilfslinien auf deiner Arbeitsfläche ab (mit 6.9" als Basis, proportional für andere Klassen skalieren):
- Oberer Rand: 80 px
- Unterer Rand: 100 px
- Seitenränder: je 60 px
- Untertitel-Zone: 80–600 px vom oberen Rand
- Geräte-Zone: 600–2400 px vom oberen Rand