The humble device mockup — that iPhone or Android frame surrounding your app screenshot — plays a surprisingly important role in user perception and conversion. But the rules around device mockups have shifted considerably. Here is what the data tells us about how to use them effectively in 2026.
To Frame or Not to Frame?
Let us start with the most common question: should you even use device frames? The answer depends on your app category and visual style:
Use frames when: Your app UI might be confused with the store interface itself, when showing multiple screens side by side, or when your app has a distinctive interface that benefits from being framed as a "product."
Skip frames when: You want maximum visual impact from your UI, when your screenshots use full-bleed backgrounds, or when your app is content-focused (news, social media, video).
Data from A/B tests across thousands of apps shows that frameless screenshots outperform framed ones by 5-8% on average. However, this is heavily category-dependent. Productivity apps see better results with frames, while games and creative apps benefit from going frameless.
Choosing the Right Device
Stay Current
Using an outdated device frame is a subtle but real trust signal. Users unconsciously associate old device designs with abandoned apps. Always use the latest device models — as of 2026, that means iPhone 17-series frames for iOS and Galaxy S26 or Pixel 10 for Android.
Match Your Audience
If your analytics show that 70% of your users are on iPhones, lead with iPhone mockups. If you are targeting emerging markets where Android dominates, Samsung or Pixel frames may resonate better.
Flat vs. Angled
Flat, front-facing device mockups are the safest choice — they are clean, easy to read, and universally understood. Angled or perspective views can add visual interest but make UI details harder to read. Use angles sparingly, perhaps for one screenshot that shows your app alongside complementary features.
Creating Professional Mockups
Resolution and Quality
Your device frame must be pixel-perfect. Blurry or low-resolution frames immediately cheapen the entire screenshot. Use vector-based frames (SVG) when possible, and always export at the maximum resolution required by the store.
Realistic Shadows and Reflections
A subtle drop shadow beneath the device adds depth and makes the screenshot feel more polished. Avoid overly dramatic shadows or reflections — they distract from the app content. A 10-15% opacity shadow with a slight vertical offset looks natural and professional.
Screen Content Fit
The most common mockup mistake is incorrect scaling. Your app screenshot must fit the device screen precisely — no visible gaps, no cropping of UI elements, and the status bar should match the device type. If you are showing an iPhone, the status bar should show the iOS notch design, not Android's status bar.
Layout Strategies
Single Device, Centered
The classic approach: one device in the center of the screenshot with a headline above or below. This works well for the first screenshot where you want maximum focus on a single feature.
Overlapping Devices
Showing 2-3 screens overlapping creates a sense of depth and lets you showcase multiple features in one screenshot. Keep the primary screen fully visible and let secondary screens peek out at the edges. This technique is especially effective for showing a workflow or progression.
Device Plus Context
Place the device alongside contextual elements — icons, illustrations, or abstract shapes that reinforce your message. A fitness app might show a device alongside workout icons; a finance app might include chart elements around the device frame.
Platform-Specific Considerations
Apple App Store: Apple is particular about how their devices are depicted. Review Apple's marketing guidelines to ensure your mockups comply. Using non-standard colors or modified device designs can lead to rejection.
Google Play: More permissive with device representation, but consistency matters. If you use a specific device in your first screenshot, maintain that choice throughout the set.
Quick Checklist
Device model is current (2025-2026 models)
Frame resolution matches export size
Screen content fits perfectly with no gaps
Status bar matches device platform
Shadows are subtle and consistent across all screenshots
Angles, if used, still allow UI readability
Device color does not clash with background
The device mockup is a supporting actor, not the star. Its job is to present your app's interface in the best possible light without drawing attention to itself. Get it right and users will focus entirely on your app. Get it wrong and it becomes a distraction that undermines your entire screenshot set.
Originally published on Shotlingo — an AI-powered tool for localizing App Store screenshots to 40+ languages. Free tier available at shotlingo.com.
Top comments (0)