App Store + Play Store Listing Preview
See exactly how your icon, name, subtitle and screenshots render on App Store and Google Play before you submit
PNG ou JPG, carré, max 8 Mo
Sleep Coach
Daily habits, calmer nights
Sleep Coach
Daily habits, calmer nights
Wellness Labs
Note
4.7
1 248 notes
Âge
4+
Et plus
Catégorie
Santé et forme
Sleep Coach
Wellness Labs
Contient des pubs, achats intégrés
Track sleep, build healthy habits and beat insomnia with AI insights
Storefront rendering reference
| Surface | Icon size | Name typography | Sub line | CTA |
|---|---|---|---|---|
| App Store search row | 60x60 rounded-[14px] | Bold, 1 line, truncates with ellipsis | Subtitle, 1 line below name | GET button in #007AFF blue |
| App Store product page | 100x100 rounded-[22px] | Bold, 2 lines max | Subtitle in zinc gray, then category | GET button in blue, full width on mobile |
| Google Play search row | 80x80 rounded-2xl | Bold, 1 line | Developer name, then rating row | Install button in #01875F green |
| Google Play listing card | 64x64 rounded-2xl | Bold, 2 lines | Short Description shown directly | Install green, contains storefront badge |
Why previewing matters before submission
Most ASO mistakes are obvious in a preview but invisible in a spreadsheet. A subtitle that fits within 30 chars in your draft might still wrap awkwardly on iPhone search results because of the GET button width. An icon with thin lines can look great in Figma at 1024 pixels and turn to mush at 60 pixels in the search row. A preview surfaces those issues before App Review does
Treat the preview as a final QA gate. Open it next to your hero screenshot mockups and check that everything reads well together, not in isolation. The combined first impression is what converts a search impression into a tap on Get
How App Store search results render your name and subtitle
In iPhone search results, your app name appears in bold and truncates after about 22 visible characters depending on the system font size. The subtitle sits one line below in a lighter zinc gray and also truncates around the same width. The first 3 screenshots render to the right of the metadata in a horizontal strip
The GET button is fixed width and right-aligned, which means longer names get truncated faster on smaller screens. Test your name and subtitle together at search-row width: if either truncates before the keyword you want users to see, restructure the copy
Google Play visual hierarchy explained
Play Store puts the icon, app title, developer name and rating in a tight vertical stack. The Short Description sits directly below and is the first piece of marketing copy users read after the icon. Unlike App Store, Play Store does not show your subtitle, so the Short Description carries the full weight of the value proposition
The featured graphic, which is the large banner above the screenshot strip, dominates the visual real estate on Play Store listings. Most teams underinvest in the feature graphic because it does not exist on App Store, but it is the largest visual element on a Play Store listing
Conversion-killing mistakes spotted in previews
The most common kill-shot is a low-contrast icon. App Store and Play Store both render icons against a white or light gray background by default. An icon designed against a dark mockup loses all definition once shipped. The second is a name that uses creative casing or special characters Apple strips during review
The third is a screenshot strip where the first frame is a generic hero shot instead of a benefit-loaded scene. The first screenshot is the only one users see without a tap, so use it to communicate your strongest benefit, not to set the mood
Frequently asked questions
Why preview my listing before I submit?
Once your build is in App Review, fixing a metadata mistake means rejecting the build, editing strings and resubmitting, which costs 24 to 72 hours. A preview catches truncation issues, weird line breaks and odd icon contrast before any of that. Most teams discover their subtitle is too long only when the rejection email arrives.
Does the preview match the real App Store rendering pixel-perfectly?
It is a high-fidelity mockup, not a pixel-perfect screenshot. Apple updates fonts and spacing every iOS version, and rendering also varies by device size class. The preview matches typography, icon shape, button colors and key spacing rules accurate enough to spot truncation and visual hierarchy mistakes.
Where can I test how my icon looks small?
The search row mockup renders your icon at the smallest store-public size, around 60x60 on App Store and 80x80 on Play Store. Icons that look great at 1024x1024 often lose detail at this size. If you cannot read the symbol or wordmark in the preview, simplify the icon.
Can I save or share the preview with my team?
Yes, take a screenshot of the preview pane and drop it into Figma, Notion or Slack. The page also stores your latest inputs locally in your browser so you can reload without losing data. We do not upload anything to our servers.
How many screenshots should I include in the preview?
Upload your first 3 screenshots, those are the only ones visible in App Store search results without a tap. Optimize them for benefit framing and contrast. The remaining screenshots in your gallery should reinforce features and social proof, but the first 3 do most of the conversion work.
Related tools
Ship a listing that previews well and converts
ScreenMagic generates store-ready screenshots in 30 seconds. Pair them with a tight icon and metadata for a clean listing
Get started free