Panoramic App Store Screenshots: How to Design Connected Frames That Still Work Alone

What "panoramic" screenshots are

Panoramic (or connected) screenshots are designed as one wide artwork and then sliced into individual store screenshots. As the user swipes through the gallery, a background, illustration, or device continues seamlessly from one frame into the next.

Done well, the effect makes a listing feel premium and encourages people to keep swiping. Done badly, you get half a phone on frame 2, captions cut mid-word, and a first frame that makes no sense on its own.

This guide covers how to get the first outcome.

The rule that matters most: every frame must stand alone

Apple's asset best practices note that, depending on orientation, up to three screenshots can appear in search results. Many people decide from that search preview—or from just the first frame on the product page—without swiping at all.

So a panorama has two audiences:

1. Swipers, who see the continuity and enjoy it.
2. Glancers, who see one to three frames and must understand the app anyway.

Design for the glancers first. Every frame needs its own caption, its own clear UI, and its own reason to exist. Continuity is the bonus, not the message.

Canvas math

The canvas width is simply your frame width multiplied by the number of frames, at the same height.

Confirm current sizes with our screenshot size reference before you start—you don't want to rebuild a wide canvas because a target changed.

Gaps between frames

Store galleries show a small gap between screenshots. That means continuous elements will appear to "jump" slightly across the gap. Two ways to handle it:

• Accept it. For backgrounds, gradients, and abstract shapes, the gap is barely noticeable.
• Design around it. For lines or objects that must look perfectly continuous, avoid placing fine detail exactly at the slice line.

Don't add artificial gutters to your canvas to "compensate"—gap sizes differ by device and storefront layout, so you can't match them exactly.

Slicing without seams

1. Set up guides at every slice line (multiples of the single frame width).
2. Keep text and critical UI away from slice lines. Leave a safe margin of a few percent of the frame width on each side.
3. Let only non-critical elements cross lines: backgrounds, ribbons, light leaks, decorative shapes, sometimes a tilted device.
4. Export each slice at exact dimensions. Most design tools let you create one frame per slice and export them individually. Verify pixel sizes with the screenshot checker before upload.
5. Flatten everything. App Store Connect rejects images with transparency; export opaque PNG or JPEG.

Elements that work across frames

• Flowing gradients or color fields that shift hue as you swipe—simple and robust.
• A path or line (a route, a chart line, a thread) that connects feature to feature, implying a journey.
• A device that spans two frames, tilted or oversized. This is the classic panorama move; use it once, not on every frame.
• Illustrated characters or objects that "walk" from one frame into the next.

Elements that break panoramas

• A caption split across two frames. Never.
• The only device on frame 1 cut in half. The first frame must show complete, readable UI.
• Essential UI on a slice line. If a button or key number sits on the edge, someone will see half of it.
• Too many crossing elements. If every frame bleeds into the next, nothing stands alone.

A proven 5-frame structure

Notice that frame 1 has no crossing elements. That's deliberate: it is the most-seen frame and must be perfect on its own. For more on frame roles, see How to Make App Store Screenshots That Convert and our competitive teardown method for studying how other apps sequence frames.

Panoramas and localization

Panoramas are more expensive to localize because text placement interacts with crossing elements. Plan for it:

• Keep text on its own layer, well away from slice lines, so translators' longer strings don't collide with continuity art.
• Test the longest language first. German or French captions can need significantly more space than English.
• Localize UI captures too, not just captions. See the screenshot localization guide.

Panoramas and A/B testing

A panorama couples frames together, which makes testing harder: change one frame and the continuity may break. If you plan to run product page optimization tests or Google Play store listing experiments:

• Test panorama vs non-panorama as a whole set first.
• Then test frame 1 only, which is self-contained by design.
• Keep continuity elements simple so frames 2–5 can be swapped without redesigning everything.

Don't assume panoramas convert better. They look polished, but for some categories, straightforward individual frames with large, legible UI perform just as well or better. Let your own test data decide.

When not to use a panorama

• Utility apps where clarity beats polish. A calculator or scanner benefits more from large, clear UI than from a flowing background.
• Tight production timelines. A panorama takes longer to build, localize, and update.
• Frequent creative updates. If you refresh screenshots monthly, independent frames are much cheaper to maintain.
• Landscape games. Landscape screenshots already fill the width; connected art adds little.

Faster production

If you prefer independent frames, the AppShotMaker screenshot editor lets you compose captions over real UI with store presets and export a zip in the browser. Pair it with device mockups for frames that use devices—and read device mockup best practices for when to skip frames entirely.

Checklist

• Canvas width = frame width × number of frames
• Frame 1 fully self-contained, no crossing elements
• Every frame has its own caption and readable UI
• No text or key UI near slice lines
• Slices exported at exact sizes, opaque
• Longest localization tested
• Set still makes sense if only three frames are seen

Bottom line

Panoramic screenshots can make a listing feel crafted and encourage swiping—but only when each frame still works on its own. Design for glancers first, keep text off slice lines, use continuity sparingly, and test whether the extra polish actually moves your conversion rate.