App Store Screenshots 📱 – Guide and Tools âś…

Team Moburst

App store screenshots are epic marketing assets. They illustrate compelling stories, showcasing the app’s primary function and purpose. Essentially, app store screenshots are crucial marketing messages designed to grab the user’s attention.

When users reach the app store page, app screenshots should be captivating and spellbinding. If they’re mediocre, chances are users will download a different app with a similar purpose and better-looking page.

Visuals speak louder than words and if that’s the case, app store screenshots are invaluable to app store optimization.

In order to help raise your ranking, increase the number of downloads and boost your conversions generated by the mobile advertising agency, we decided to write a complete guide on how to optimize iOSs screenshots and Google Play screenshots.

We’ll also chip in a complete list of screenshot generation tools for app developers and marketers.

Why are app store screenshots important?

Your app marketing strategy is paying off and thousands of people see your app. However, all of your efforts and budget will go to waste unless you convince your visitors to download your app.

Not optimizing your screenshots and ignoring to work on both the visuals and the copy will not only hinder your growth but increase your costs and lower your revenue.

App screenshots allow your app to show its features and functionalities to users that visit the product page. People gain more information out of your icons, videos, and screenshots than they do from your name and app description.

We could easily say that in ASO, pictures are worth a thousand words.

Titan Bet app store screenshots

Of course, Android or iOS screenshots do not affect the app’s store ranking in any way, as they lack any metadata or relevant information used in search engine optimization.

Yet, considering that a good first impression will raise conversion rates by up to 35% and that the number of app downloads is a direct ranking factor in ASO, you need to start working on your app’s presentation images.

 

How to optimize your app store screenshots?

Optimizing your app store screenshots is more art than rocket science. Your images need to deliver the right message and show your app’s features. People need to understand how they’ll be able to use your app before installing it (in order to avoid increased churn rates).

If you wish to deliver high-quality screenshots, make sure to read below and respect these 5 simple, yet crucial steps:

  1. Use the right sizes and dimensions for your app store screenshot.
  2. Deliver the right message through your images.
  3. If you go global, localize your apps!
  4. A/B test and test again.

Use the right sizes, dimensions, and orientation for your app store screenshot.

There are over 20 iPhone models, almost 20 iPad models and hundreds of phone types that support Android.

Meaning that your app store screenshots need to cater to all the various phone and tablet sizes that your users could have.

While the Google Play store gives us a helping hand providing a minimum and maximum size for its screenshots, Apple makes the game a little more complicated. Right now, Apple needs a different image and screenshot resolution depending on the device.

Extra tip: Take into consideration that different OS versions will show the app store differently. The main example is how iOS 10 shows 2 screenshots per row and iOS 11 shows 3 screenshots per row.

IOS 10 vs IOS 11 app Store Screenshots - Source Appradar
iOS 10 vs iOS 11 app Store Screenshots – Source Appradar

Screenshot sizes for Apple App Store /App Store Connect /iTunes Connect

The Apple App store requires only 1 screenshot per app and localization while also allowing a maximum of 10 screenshots.

In order for the app screenshots to be accepted, your files need to have a 72 dpi resolution without transparency and saved as either flattened JPEG or PNG.

We’ve also summarized below all of the screenshot sizes an app can use on the Apple App Store, App Store Connect and iTunes Connect.

iPhone screenshot sizes:

  • iPhone 3 (3.5 Inch): 920 x 640 px
  • iPhone 4 + 5 (4 Inch): 1136 x 640 px
  • iPhone 6 + 7 +8 (4.7 Inch): 1334 x 750 px
  • iPhone 6 Plus + 7 Plus + 8 Plus (5.5 Inch): 1242 x 2208 px
  • iPhone X (5.8 Inch): 1125 x 2436 – This isn’t required; Mind that the difference is that the screenshot in iPhone X will be shown with rounded corners

iPad screenshot sizes:

  • iPad (12.9 Inch): 2048 x 1536 px
  • iPad Air and Mini Retina (10.5 Inch): 1536 x 2048 px
  • iPad Pro (12.9 Inch): 2048 x 2732 px

While they do not fall into the general devices you would optimize your app for, sometimes, an app can be used for bigger devices as well (take Netflix as an example).

Because of this, we took the liberty of providing you the screenshot sizes for macs, TVs, and watches as well.

Other devices:

  • Mac:
    • 1280 x 800 px
    • 1440 x 900 px
    • 2560 x 1600 px
    • 2880 x 1880 px
  • Apple TV
    • 1920 x 1080 px
    • 3840 x 2160 px
  • Apple Watch Series 3: 312 x 390 px
  • Apple Watch Series 4: 368 x 448 px

Screenshot sizes for Google Play Store

Google allows only 8 screenshots for each device they have:

  • Phones
  • Tablets
  • TVs
  • Wearables running Wear OS

You will need to add the screenshots in different tabs for each device type.

The Google Play Store requires a minimum of 2 screenshots that respect the following rules:

  • JPEG or 24-bit PNG (no alpha)
  • Minimum dimension: 320px
  • Maximum dimension: 3840px
  • Aspect ratio can’t be more than 2:1 or 1:2 (with a recommended ratios of 16:9)

If you are working on optimizing your mobile game, please take into consideration that a minimum of 3 landscape screenshots are recommended in order to be featured in the “Recommended games” section.

As you can already see, Google does not require exact sizes for each device, as it crops or resizes the images in order to properly present them. Make sure you center the information you want to present and make the images as big as possible.

For wearables, take into consideration that most devices have round screens, meaning your screenshot will be cropped to a round circle.

How to orient your app store screenshots? 🔄

After you’ve settled on the right app store sizes, you also need to decide how you’ll present your images.

Portrait or landscape?

We do recommend that you stick to the portrait orientation in 90% of the cases. Mainly because it’s easier for users to look over the screenshots and extract the information they are looking for.

Of course, there are exceptions, mainly in the mobile gaming industry. Gamers are used to using the phone in landscape mode in order to play their favorite games. Hardcore gamers even more.

Yet, we recommend A/B testing this if you have doubts, as landscape screenshots do not work for all games.

Rovio, the app developers behind Angry Birds did a series of A/B testing for their game, including a test on the orientation. They discovered that their users are more likely to install their app if the screenshots are in portrait mode, resulting in an increase of 13% according to Splitmetrics.

Angry Birds A-B app store screenshots

Deliver the right message through your images.

Showcasing your app’s features, presenting a story through your screenshots and delivering the right message should be one of the main points of your app store presence.

When you design screenshots, you should make sure that people can get information from your images – either of how the app works or how the app can be useful to the user.

We’ve analyzed a couple of the most successful apps on the market and talked a little about how each of them decided to deliver their messages.

Netflix Screenshot Approach

The average user takes between 3 to 6 seconds to decide whether or not they want to download an app. The combination of great storytelling and eye-catching visuals will make the app more appealing to users and, in turn, will push them to take action and download the product.

Netflix misses the point with its screenshots. Rather than utilizing its space to talk about the app, what it does, and how it can benefit users, it only shows its platform. Screenshots can, and should, be used to tell a story.

They should be used to hook potential users with an exciting image or strong call-to-action. Netflix’s screenshots don’t show any story. In fact, they don’t show anything other than that it’s an app that has content.

There is also an issue with Netflix’s screenshot sections’ look. Screenshot #3 is in landscape mode, while the rest are in portrait mode. Why is this a problem? Because users will have to flip their phones to see the image. This action causes a break in the continuity of Netflix’s “screenshot story” and therefore creates a huge drop in conversion rate from our previous A/B test experience for similar products.

Netflix app store screenshots
Netflix screenshots were taken from the iTunes store

 

Amazon Screenshot Approach

As we said, screenshots should tell a story, highlight selling features, and convince users to download. For this, Amazon gets points.

Though they’re not the ultimate screenshots, they’re ok. Why just ok? Because although they’re lacking as far as looks, Amazon does at least utilize copy. Their screenshots are boring, with zero creativity or excitement. The images show Amazon in a practical way – it’s an app that you can shop with.

It shows iPhones with screens and text above them, instead of presenting users with a great big “world of shopping”, a “shopping like never before” experience. Its screenshots should be screaming, “we can offer you anything you want to buy, easily and effortlessly”.

What Amazon’s images lack is the dream that it can bring the world’s best products to your doorstep in less than a day. Amazon’s promise isn’t reflected within its screenshot images.

Where we give credit to Amazon is with the copy it uses within its screenshots. Its use of explanatory copy means it’s trying to tell a story, it’s showing users the app’s benefits. When thinking of the power of texts, it’s a no-brainer to put thought into screenshot copy.

Amazon gets that, but it can do much more with its texts by making them inspiring. They should leave visitors needing to download the app that second.

Explanations can add a lot of value to screenshots. With that said, the text to image ratio should be balanced. The image should look clean and not cramped with words, while still offering enough information to satisfy users.

Amazon screenshots were taken from the iTunes store
Amazon screenshots were taken from the iTunes store

Clash of Clans Screenshot Approach

When it comes to gaming apps, screenshots take on a whole new level of importance. Games need descriptive screenshots that outline the game and its features. They also need screenshots that impress users and show how exciting the game is.

Clash of Clans successfully shows off its high-quality design and its fantastic gameplay. Its screenshots have a good flow and show an exciting medieval world where users can escape. All screenshots are in landscape mode, which leads to higher conversions than portrait mode since iOS11.

Benefits of the app are clearly displayed at the top and center of each image to show the user different reasons why to download the app right away. Clash of Clans takes it one step further by having a preview video as its first screenshot.

Videos as a first screenshot are so powerful because they auto-play (on mute) when users scroll through the results of any search query within the app store. The video grabs user’s attention much more effectively than regular screenshots.

Clash of Clans is one of the best mobile games. Between its descriptive images, compelling display of benefits, and high-definition video, it’s hard for users not to download.

Clash of Clans’ screenshots were taken from the iTunes store
Clash of Clans’ screenshots were taken from the iTunes store

If you go global, localize your apps!

Localizing your app is one of the best ways of ranking better and increasing the number of installs. Both app stores allow you to integrate new screenshots for each language.

You should take advantage of this feature and work on making sure that you fully understand the target market and plan the images accordingly.

If you are targeting countries with a different alphabet, that alphabet should also be present in the images and screenshots.

Also, take into consideration a cultural approach, as you may need to change the way the art or images look for your app store screenshots.

Uber did an amazing job while localizing their app for the Japanese Market. Not only did they change the text, but actually added maps from Japan in order to make the app more appealing to its user base.

Uber Localize Screenshots

A/B test and test again.

A/B testing is the leading way to maximize your creatives’ performance by comparing app store screenshots to one another, seeing which yields better conversion rates.

You’ll learn which style speaks to your target demographic, what design makes users take action, what background color works best and what layouts reel in the most downloads.

To further understand the impact screenshots can have on users, take a look at one of our clients, Mailwise. Mailwise is a mobile email solution app that organizes content to improve a user’s workflow. We recreated their app store screenshots for stellar optimization.

Below is a comparison of Mailwise’s app store screenshots. The first row was designed by Mailwise as original screenshots, and the second row illustrates the ones we designed. And the results? Our app store screenshots increased the conversion rate from 14% to 28%.

A-B Testing Screenshots for Mailwise
A-B Testing Screenshots for Mailwise

As you know by now, with ASO, the sky’s the limit. Even if you think your app is performing to its max potential, there’s always room for growth. So after bringing in great results with our new app store screenshots for Mailwise, we pushed the envelope even further.

We designed a new set of screenshots and the app performed even better! Take a look at them below. Also, note that Mailwise’s app store screenshots align with their content and creative language.

Latest Mailwise app store Screenshots
Latest Mailwise app store Screenshots

App Store Screenshot builder and optimization tools!

Creating the right app store screenshots and images for your app can be hard sometimes, especially when you need to make sure that everything fits the right size and you localize for all the languages.

We do recommend that you either hire a professional or use special templates for your screenshots.

Of course, if you are having problems doing your own screenshots, feel free to contact us for help.

If you do want to create everything in house, we’ve created a list of aso tools or resources that will help you out.

Prebuilt templates

One of the easiest ways to create screenshots for your app is to purchase a Prebuilt template from a website similar to Envato. You can search for “Screenshot template for Appstore” and you’ll find tons of templates you can download, open in Adobe Illustrator or Photoshop and finish your work in a matter of hours.

For example, Hoangpts offers tens of templates on his Envato account, the image below being one of them.

Prebuilt ScreenShot Templates
Prebuilt ScreenShot Templates

App Screenshot Builder by Applaunchpad

Applaunchpad has created a powerful and easy to use app screenshot builder. The tool allows you to add information inside a template by changing or adding:

  • A tittle
  • Background image or color
  • Screenshot image

The free version allows 3 standard templates and 5 different devices and frames.

The premium version allows 14 different templates, 12 different devices and frames. You can also save your screenshots for later editing.

One big minus to the ASO tool for screenshots created by Applaunchpad is that it only allows 5 screenshots (you can upload more in the app stores) and you have no option to easily localize the images.

The premium plan is $29 per month or $180 per year.

App Launch Pad app store screenshots editor
App LaunchPad app store screenshots editor

 

App Screenshot Maker by AppInstitute

The App Screenshot maker is an ASO screenshot tool created by the AppInstitute. It’s a completely free tool that you can use to quickly replicate screenshots for multiple apps or for localization.

The tool is quite rudimentary and it doesn’t allow too many personalization options. (8 basic layouts and 4 different styles)

The tool also lacks the latest devices or resolutions.

Price: Free

App Screenshot Maker
App Screenshot Maker

App Store Screenshot tool

With a really straightforward name, the App Store Screenshot tool is really great. Completely free and without the need to sign up, it allows you to create great screenshots for all the needed devices.

The tool includes multiple device frames, background colors, and gradients for your app screenshots. Custom fonts and many other customization options.

It does lack the option of having unique designs for each screenshot. With this tool, all of the screenshots will have the same design and layout.

App Store Screenshot tool
App Store Screenshot tool

Final words

All in all, if you continue to excel with your other ASO efforts and neglect to optimize your screenshots, you’re essentially damaging the success of your app’s conversion rate and its opportunity for growth.

Remember that visual communication is a staple for universal success, so make your app store screenshots as enthralling as possible.

If you need help, have questions or would like Moburst to take care of your app store screenshots, creation, and A/B testing, feel free to contact us.

Comments

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.