Panoramic App Store Screenshots: How to Design a Continuous Set

Panoramic App Store screenshots are a set designed as one wide image and sliced into separate screenshots, so that a background, shape or device appears to continue from one screenshot to the next as people swipe. They work when each slice still stands alone as a screenshot, because the App Store shows gaps between screenshots and often shows them one or a few at a time. The file setup is simple: one canvas exactly N screenshots wide, sliced at exact pixel widths.

This post covers how a continuous set actually appears in search results and on the product page, how to design across the seams, how to build and slice the file, and when a panorama isn't worth it.

How panoramic screenshots read in the App Store

The same set appears in three different contexts, and a panorama behaves differently in each.

Apple's product page guidance says the first one to three screenshots appear in search results when no app preview is available, depending on orientation. A landscape set shows only one screenshot in search, so a landscape panorama is never seen as a panorama in search at all. We covered the search result layout in more depth in what to put on your first App Store screenshot.

Designing across the seam

The seam is the edge where one screenshot ends and the next begins. On the product page there is a visible gap there, so anything that crosses a seam is shown with a slice missing out of the middle. Design for that gap rather than pretending it isn't there.

What can cross a seam

• Backgrounds and colour fields, like a gradient that shifts hue across the set or a horizon line.
• Simple shapes and lines: a ribbon, a wave, a path, a large circle. The eye fills in the gap easily.
• Secondary UI elements, such as a floating card or a chart line that leads into the next screenshot.
• A tilted device, but only if the part on each side still looks intentional. A phone cut neatly in half rarely does.

What should never cross a seam

• Captions. A sentence split across two screenshots is unreadable in full-screen view and in localized versions.
• Faces, logos and the key UI you want people to read.
• Anything within roughly the outer 5% of a slice that has to be seen. Keep a safe margin on both sides of every seam, since the corners are rounded and the gap hides the edge.

Make every slice stand alone

A good test: export the set, then look at each screenshot on its own, at full size. Each should have a caption, a clear piece of real app UI, and a composition that looks finished even with the continuous elements cut at the edges. Apple's guideline 2.3.3 still applies to every slice: screenshots "should show the app in use," so a slice that is only the continuation of a background graphic is both weak and a rejection risk. We list the other guidelines that catch screenshots in why Apple rejects App Store screenshots.

Pace the panorama

Continuous sets work best when the continuity is quiet and the content is loud. A pattern that tends to read well: screenshots 1 to 3 share one strong connecting element (a single colour sweep or one device spanning 1 and 2), and screenshots 4 onward keep the same background system with lighter connections. That way the strip in search looks deliberate, and later screenshots stay easy to swap.

File setup: one wide canvas, sliced into exact frames

1. Pick the export size and count

The canvas width is the screenshot width multiplied by the number of screenshots in the panorama. The height is the screenshot height. Pixel sizes must match an accepted size exactly; see our screenshot sizes reference and Apple's screenshot specifications.

iPhone, iPad and Google Play sets have different aspect ratios, so each needs its own panorama. Scaling one wide canvas to a different height shifts every seam.

2. Mark the seams before you design

Add guides at every multiple of the screenshot width (1290, 2580, 3870, 5160 for the first example) and a safe margin on each side. In Figma, the simplest version is a row of frames at the export size placed edge to edge with no gap, with the continuous artwork in a group that sits across them; each frame clips its part. Our post on making App Store screenshots in Figma covers frames and export settings.

3. Slice at exact widths

If you design on one wide canvas instead of separate frames, slice it into tiles of the exact screenshot size. With ImageMagick:

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

That produces shot-00.png, shot-01.png and so on, each exactly 1290 × 2796. If the canvas width isn't an exact multiple, the last tile comes out narrower and App Store Connect will reject it at upload, so check the canvas size first. Flatten the output (no transparency) before uploading; Apple doesn't accept images with alpha channels.

4. Preview with gaps

Before you ship, lay the exported files side by side with a gap between them and rounded corners, at roughly search-result size. This shows the panorama the way people will actually see it, which is often a surprise compared with the seamless canvas you designed on.

Common panoramic mistakes

• Designing on the seamless canvas only. The set looks great as one image in the design tool and broken in the store, because the gaps were never previewed.
• A device split down the middle. Half a phone on screenshot 2 and half on screenshot 3 reads as two cropping errors when either is opened alone.
• Captions that depend on each other. "Plan your week" followed by "...and stick to it" works only if both are seen together, which in full-screen view they aren't.
• Too much background, too little app. The continuous graphic takes so much room that the UI shrinks to a thumbnail inside a thumbnail.
• Forgetting the other sets. The iPhone panorama is finished, and the iPad and Google Play sets are hurried crops of it with seams in the wrong places.
• Off-by-a-few-pixels slices. A canvas of 6448 px instead of 6450 px leaves the last slice the wrong size, which App Store Connect rejects at upload.

When not to make a panoramic set

A continuous design isn't automatically better. Skip it, or limit it to the first three screenshots, when:

• You plan to test or reorder screenshots often. Moving screenshot 3 to position 1 for a Product Page Optimization test breaks a panorama. Self-contained screenshots are much easier to test.
• You run custom product pages. Each custom product page often uses a different screenshot order or subset, which a single panorama can't accommodate without redesign.
• You localize into many languages. Caption lengths change by language, and every continuous element has to be checked in every locale.
• Your set is landscape. Only one landscape screenshot appears in search, so the effect is only visible on the product page.
• Your first screenshot needs to work very hard on its own. If the panorama makes screenshot 1 weaker (smaller UI, a cut device, a caption pushed aside), the first impression pays for the effect.
• You lead with an app preview. The video takes the first position, so the strip in search starts with the preview rather than your designed panel.

The short version

• Treat screenshots 1 to 3 as the panel people see in search; everything else is a bonus
• Let only backgrounds, shapes and secondary elements cross seams
• Keep captions, faces and key UI inside each slice with a safe margin
• Check every slice alone at full size: caption, real UI, finished composition
• Canvas width = screenshot width × count, separate canvases per device and store
• Slice at exact pixel widths, flatten, and preview with gaps before uploading

For the full process from story to upload, see how to make App Store screenshots.