Panorama-Screenshots im App Store: ein durchgehendes Set gestalten

Panorama-Screenshots im App Store sind ein Set, das als ein breites Bild gestaltet und dann in einzelne Screenshots geschnitten wird. Beim Wischen sieht es so aus, als würden ein Hintergrund, eine Form oder ein Gerät von einem Screenshot in den nächsten weiterlaufen. Das funktioniert, wenn jeder Ausschnitt auch allein als Screenshot taugt, denn der App Store zeigt Lücken zwischen den Screenshots und oft nur einen oder wenige auf einmal. Das Datei-Setup ist simpel: eine Arbeitsfläche, die genau N Screenshots breit ist, geschnitten auf exakte Pixelbreiten.

In diesem Beitrag geht es darum, wie ein durchgehendes Set in den Suchergebnissen und auf der Produktseite tatsächlich aussieht, wie du über die Nahtstellen hinweg gestaltest, wie du die Datei aufbaust und schneidest – und wann sich ein Panorama nicht lohnt.

Wie Panorama-Screenshots im App Store wirken

Dasselbe Set taucht in drei verschiedenen Kontexten auf, und ein Panorama verhält sich in jedem anders.

Laut Apples Hinweisen zur Produktseite erscheinen in den Suchergebnissen je nach Ausrichtung die ersten ein bis drei Screenshots, wenn keine App-Vorschau vorhanden ist. Ein Querformat-Set zeigt in der Suche nur einen Screenshot, ein Panorama im Querformat ist dort also nie als Panorama zu sehen. Das Layout der Suchergebnisse haben wir ausführlicher in was auf deinen ersten App-Store-Screenshot gehört beschrieben.

Gestalten über die Naht hinweg

Die Naht ist die Kante, an der ein Screenshot endet und der nächste beginnt. Auf der Produktseite gibt es dort eine sichtbare Lücke, alles, was über eine Naht läuft, wird also mit einem fehlenden Stück in der Mitte angezeigt. Gestalte für diese Lücke, statt so zu tun, als gäbe es sie nicht.

Was über eine Naht laufen darf

• Hintergründe und Farbflächen, etwa ein Verlauf, der über das Set den Farbton wechselt, oder eine Horizontlinie.
• Einfache Formen und Linien: ein Band, eine Welle, ein Pfad, ein großer Kreis. Das Auge ergänzt die Lücke mühelos.
• Sekundäre UI-Elemente, zum Beispiel eine schwebende Karte oder eine Diagrammlinie, die in den nächsten Screenshot führt.
• Ein gekipptes Gerät, aber nur, wenn der Teil auf beiden Seiten noch gewollt aussieht. Ein sauber halbiertes Handy tut das selten.

Was nie über eine Naht laufen sollte

• Beschriftungen. Ein Satz, der über zwei Screenshots verteilt ist, ist in der Vollbildansicht und in lokalisierten Versionen unlesbar.
• Gesichter, Logos und die zentrale UI, die gelesen werden soll.
• Alles, was gesehen werden muss und in den äußeren etwa 5 % eines Ausschnitts liegt. Lass auf beiden Seiten jeder Naht einen Sicherheitsabstand, denn die Ecken sind abgerundet und die Lücke verdeckt den Rand.

Jeder Ausschnitt muss für sich stehen

Ein guter Test: Exportier das Set und schau dir jeden Screenshot einzeln in voller Größe an. Jeder sollte eine Beschriftung haben, ein klares Stück echter App-UI und eine Komposition, die fertig wirkt, auch wenn die durchgehenden Elemente an den Rändern abgeschnitten sind. Apples Richtlinie 2.3.3 gilt weiterhin für jeden Ausschnitt: Screenshots sollen „die App in Benutzung zeigen“. Ein Ausschnitt, der nur die Fortsetzung einer Hintergrundgrafik ist, ist also schwach und ein Ablehnungsrisiko. Die anderen Richtlinien, an denen Screenshots hängen bleiben, haben wir in warum Apple App-Store-Screenshots ablehnt gesammelt.

Gib dem Panorama einen Rhythmus

Durchgehende Sets funktionieren am besten, wenn die Verbindung leise ist und der Inhalt laut. Ein Muster, das meist gut wirkt: Screenshot 1 bis 3 teilen sich ein starkes verbindendes Element (einen einzigen Farbschwung oder ein Gerät, das über 1 und 2 reicht), und ab Screenshot 4 läuft dasselbe Hintergrundsystem mit leichteren Verbindungen weiter. So wirkt der Streifen in der Suche bewusst gestaltet, und spätere Screenshots lassen sich leicht austauschen.

Datei-Setup: eine breite Arbeitsfläche, in exakte Frames geschnitten

1. Exportgröße und Anzahl festlegen

Die Breite der Arbeitsfläche ist die Screenshot-Breite mal die Anzahl der Screenshots im Panorama. Die Höhe ist die Screenshot-Höhe. Die Pixelgrößen müssen exakt einer zulässigen Größe entsprechen; schau dazu in unsere Übersicht der Screenshot-Größen und in Apples Screenshot-Spezifikationen.

iPhone-, iPad- und Google-Play-Sets haben unterschiedliche Seitenverhältnisse, jedes braucht also ein eigenes Panorama. Wenn du eine breite Arbeitsfläche auf eine andere Höhe skalierst, verschiebt sich jede Naht.

2. Nähte markieren, bevor du gestaltest

Setz Hilfslinien bei jedem Vielfachen der Screenshot-Breite (1290, 2580, 3870, 5160 im ersten Beispiel) und einen Sicherheitsabstand auf beiden Seiten. In Figma ist die einfachste Variante eine Reihe von Frames in Exportgröße, lückenlos nebeneinander, mit der durchgehenden Grafik in einer Gruppe, die über allen liegt; jeder Frame schneidet seinen Teil zu. Frames und Exporteinstellungen erklären wir im Beitrag zu App-Store-Screenshots in Figma.

3. Auf exakte Breiten schneiden

Wenn du auf einer breiten Arbeitsfläche statt in einzelnen Frames gestaltest, schneide sie in Kacheln mit exakt der Screenshot-Größe. Mit ImageMagick:

magick panorama.png -crop 1290x2796 +repage +adjoin shot-%02d.png

Das ergibt shot-00.png, shot-01.png und so weiter, jeweils exakt 1290 × 2796. Ist die Breite der Arbeitsfläche kein exaktes Vielfaches, wird die letzte Kachel schmaler und App Store Connect lehnt sie beim Upload ab – prüf also zuerst die Größe der Arbeitsfläche. Reduzier die Ausgabe auf eine Ebene (keine Transparenz), bevor du hochlädst; Apple akzeptiert keine Bilder mit Alphakanal.

4. Mit Lücken in der Vorschau ansehen

Bevor du veröffentlichst, leg die exportierten Dateien mit einer Lücke und abgerundeten Ecken nebeneinander, ungefähr in der Größe eines Suchergebnisses. So siehst du das Panorama so, wie es die Leute tatsächlich sehen werden – und das ist im Vergleich zur nahtlosen Arbeitsfläche, auf der du gestaltet hast, oft eine Überraschung.

Typische Fehler bei Panorama-Sets

• Nur auf der nahtlosen Arbeitsfläche gestalten. Im Design-Tool sieht das Set als ein Bild großartig aus, im Store wirkt es kaputt, weil die Lücken nie geprüft wurden.
• Ein Gerät, das in der Mitte geteilt ist. Ein halbes Handy auf Screenshot 2 und eine Hälfte auf Screenshot 3 wirken wie zwei Zuschnittfehler, sobald man einen davon allein öffnet.
• Beschriftungen, die aufeinander angewiesen sind. „Plan deine Woche“ gefolgt von „…und zieh sie durch“ funktioniert nur, wenn man beide zusammen sieht – und in der Vollbildansicht tut man das nicht.
• Zu viel Hintergrund, zu wenig App. Die durchgehende Grafik nimmt so viel Platz ein, dass die UI zum Vorschaubild in einem Vorschaubild schrumpft.
• Die anderen Sets vergessen. Das iPhone-Panorama ist fertig, und die iPad- und Google-Play-Sets sind hastige Zuschnitte davon, mit Nähten an den falschen Stellen.
• Ausschnitte, die um ein paar Pixel daneben liegen. Eine Arbeitsfläche mit 6448 px statt 6450 px macht den letzten Ausschnitt zu klein, und App Store Connect lehnt ihn beim Upload ab.

Wann du besser kein Panorama-Set machst

Ein durchgehendes Design ist nicht automatisch besser. Lass es weg oder beschränk es auf die ersten drei Screenshots, wenn:

• du Screenshots oft testen oder umsortieren willst. Wenn du Screenshot 3 für einen Test der Produktseitenoptimierung an Position 1 schiebst, ist das Panorama kaputt. Eigenständige Screenshots lassen sich viel leichter testen.
• du Produktseiten-Varianten nutzt. Jede eigene Produktseite verwendet oft eine andere Reihenfolge oder Auswahl von Screenshots, und das bekommt ein einzelnes Panorama ohne Umbau nicht hin.
• du in viele Sprachen lokalisierst. Die Länge der Beschriftungen ändert sich je nach Sprache, und jedes durchgehende Element muss in jeder Sprache geprüft werden.
• dein Set im Querformat ist. In der Suche erscheint nur ein Screenshot im Querformat, der Effekt ist also nur auf der Produktseite zu sehen.
• dein erster Screenshot allein sehr viel leisten muss. Wenn das Panorama Screenshot 1 schwächer macht (kleinere UI, ein abgeschnittenes Gerät, eine an den Rand gedrängte Beschriftung), bezahlt der erste Eindruck für den Effekt.
• du mit einer App-Vorschau startest. Das Video nimmt die erste Position ein, der Streifen in der Suche beginnt also mit der Vorschau statt mit deinem gestalteten Panel.

Kurz gesagt

• Behandle Screenshot 1 bis 3 als das Panel, das man in der Suche sieht; alles andere ist ein Bonus
• Lass nur Hintergründe, Formen und sekundäre Elemente über Nähte laufen
• Halte Beschriftungen, Gesichter und zentrale UI mit Sicherheitsabstand innerhalb jedes Ausschnitts
• Prüf jeden Ausschnitt allein in voller Größe: Beschriftung, echte UI, fertige Komposition
• Breite der Arbeitsfläche = Screenshot-Breite × Anzahl, getrennte Arbeitsflächen pro Gerät und Store
• Auf exakte Pixelbreiten schneiden, auf eine Ebene reduzieren und vor dem Upload mit Lücken prüfen

Den ganzen Ablauf von der Story bis zum Upload findest du in so erstellst du App-Store-Screenshots.