How to Make App Store Screenshots That Get Downloads
Open the App Store, search anything, and count how long you spend on each result. Two seconds? Less? You're not reading descriptions. You're looking at an icon, a name, and a strip of screenshots the width of your thumb, and you're deciding.
That's the thing about app store screenshot design: it's the asset most indie devs ship last, at midnight, straight out of a simulator — and it's the one doing the deciding. The listing's first screen on a phone is your icon, your title, and roughly the first two screenshots. Everything past that is for people already leaning yes.
So let's design those five frames properly, using a real example.
Your screenshots get judged at thumbnail size first
Here's the trap. You design at 1290 × 2796 on a 27-inch monitor, and it looks fantastic. Then someone searches "grocery list" and your listing appears in results with three screenshots crammed into a strip barely wider than a thumb. Your beautiful 48px caption is now unreadable mush.
I call it the thumbnail test, and it's brutal: shrink your frame to 1/3 size and look at it from arm's length. If you can't read the caption, it isn't a caption — it's texture.
Practically, on a 1290 × 2796 canvas that means caption text of 96–140px, bold, two lines max. That feels absurdly large in the editor. It's correct. Every screenshot set that works looks over-typed when you're zoomed in.
The screen capture itself doesn't need to survive the thumbnail. Nobody reads your UI labels in the strip. The screen is proof — it says "this is a real, well-built app" at a glance. The caption is what does the selling.
The caption sells the benefit; the screen proves it
Most bad screenshot sets caption the feature. "Smart Lists." "Voice Input." "Sync." Those are names of things, and a name never convinced anyone to install anything.
Split the job:
- Caption = the outcome the user wants, in their words. Short. Second person, or no person at all.
- Screen = evidence that the app does it.
"Voice Input" becomes "Add milk without unlocking your phone." "Sync" becomes "Two people, one list, zero duplicate milk." Same screenshot underneath. Wildly different conversion.
One idea per frame. If your caption needs an "and," you have two frames.
A worked example: five frames for a grocery app
The app is Bunch — a shared grocery list for couples and housemates. Here's the exact frame script I'd ship, in order:
| # | Caption (96–140px) | Screen shown | Job of this frame |
|---|---|---|---|
| 1 | Two people. One list. Zero duplicate milk. | Shared list with two avatars on items | The whole pitch in seven words |
| 2 | Say "oat milk." It's on her list too. | Voice-add mid-animation, item appearing | Kill the "is it annoying to add stuff?" objection |
| 3 | Sorted by aisle, not by chaos. | List grouped: Produce / Dairy / Freezer | The delight feature |
| 4 | Nothing forgotten at 6pm on a Tuesday. | Store-arrival reminder notification | Emotional payoff |
| 5 | Free. No account needed to start. | Empty state with a big "Start a list" button | Remove the last friction |
Notice frames 1 and 2 do the heavy lifting: what it is, and why it isn't a chore. If a user swipes no further, they've had the full argument. Frames 3–5 are for the person already leaning yes and looking for a reason to commit.
Notice too that frame 5 isn't a feature at all. It's an objection-killer. The most under-used screenshot slot in the App Store is the last one — it should either remove a fear ("free", "no account", "works offline") or show social proof ("4.8★, 12,000 lists shared this month").
Layout rules that hold across the set
- Caption on top, on a solid colored panel; device below, bleeding off the bottom edge. This is the dominant pattern for a reason — the eye reads top-down, and the cropped device implies "there's more app here."
- Never put the caption inside the phone screen. It reads as UI, and users skip UI.
- Same background and type on all five frames. Rotate the accent color if you want rhythm, but a set that changes fonts frame to frame reads as five unrelated apps. This is the same discipline as a brand kit — pick once, apply everywhere.
- Contrast: dark panel + white caption, or a saturated brand color + white. Light-grey caption on a white panel is the single most common failure I see, and it's the one that vanishes hardest at thumbnail size.
- Keep the caption inside a safe margin of about 8% each side. Store UI crops more aggressively than you expect.
Building the set in Ridvay Studio
You don't need five separate files or a Figma license. Studio will build the whole set as one multi-page design you then edit frame by frame.
Paste this in:
Create a 5-page app store screenshot set, 1290x2796, for "Bunch", a shared grocery list app for couples. Dark navy background, white bold captions at the top of each frame, a phone mockup below bleeding off the bottom edge. Captions in order: "Two people. One list. Zero duplicate milk." / "Say oat milk. It's on her list too." / "Sorted by aisle, not by chaos." / "Nothing forgotten at 6pm on a Tuesday." / "Free. No account needed to start."
What comes back isn't a flat image you have to re-roll when one word is wrong. It's five editable pages — the caption is a real text layer, the panel is a real shape, the accent is a real color value. Which is the whole point, because the next thirty minutes are edits, not regeneration:
- Click each caption and drag the size up until it's ~110px. Then zoom the canvas out to 33% and re-read it. That's the thumbnail test, done inside the editor.
- Drop your actual screen captures onto the mockup layer to replace the placeholder. The caption stays put; only the proof changes.
- Recolor the panel to your brand blue on all five pages, and leave the type alone — consistency across the set beats variety within it.
- Duplicate page 1 and rewrite just the caption to test a second angle ("Never text 'did you get milk?' again"). Two versions of frame 1 is the highest-leverage A/B test in the entire listing.
Then use one-click resize to push the same set to the 6.9" and iPad canvases instead of rebuilding them, and export each page as PNG.
Build the Bunch screenshot set in Studio →
Four mistakes that cost downloads
Leading with the login screen. Your first frame should never show a screen the user has to get past. Show the app doing its job with realistic data already in it.
Empty demo data. "Item 1, Item 2, Item 3" tells a user nobody uses your app. Fill it with plausible content — real product names, real prices, a list length a real person would have.
Portrait-only thinking on the last frame. If you have a genuine wow visual — a chart, a map, a full-bleed photo — that's a candidate for the frame that earns the swipe.
Screenshots that contradict the app. If your captions promise a feature that's two versions away, your one-star reviews will say so. Ship the frames for the app you have.
The general hierarchy-and-contrast rules behind all of this are worth internalizing too — I wrote them up in design principles for non-designers, and app screenshots are the highest-stakes place to apply them, because you get roughly two frames and one thumb-swipe to make your case.
Do the thumbnail test tonight. Shrink your current frame 1 to a third of its size, glance at it, and ask whether a stranger would know what your app does. If not, that's an evening of work standing between you and a materially better conversion rate.