Create screenshots of your App for App Store / Play Store


#1

Hi all,

I looked around and could not find relevant info that would guide me. As a first-time developer using ionic and cordova, I do not exactly know how to take screenshots for different devices. For e.g., Play Store requires at least one screenshot for 7-inch and 10-inch tablets. The question is that how do you take screenshots for different devices with different resolutions? I do appreciate if you could guide me or give me some tips.


#2

The Google Play store doesn’t have strict requirements regarding screenshot sizes. For phone devices it needs at least one screenshot with the sides being at minimum 320 pixels, and maximum 3840px.

I usually use 529 × 883 for my Android screenshots, but you could use other sizes as well.

You can take these screenshot from an emulator (easiest). Alternatively you could take a screenshot from your browser and then overlaying some UI elements with Photoshop to mock it looking like it’s coming from a real device.

iTunes Connect does have strict sizes for every phone type. These are:

  • iPhone 4 / 4S: 640 × 960
  • iPhone 5 / 5S: 640 × 1136
  • iPhone 6: 750 × 1334
  • iPhone 6 Plus: 1080 × 1920

Hope this helps.


#3

Genymotion allows you to fire up a (fast!) VM to simulate a range of devices and easily take screenshots. It’s paid-for, so that may not be feasible, but if you’re spending a lot of time developing, it’ll save you a lot of time in any case.

If you simulate using ionic serve on Firefox, it has a responsive design mode in developers tools that allows you to very closely simulate the display as it would appear on various devices in various orientations. Use Skitch or something similar to capture the screenshot as you want:

http://evernote.com/skitch/?utm_source=interspire

There are probably dozens of utilities / browser plugins that let you do what Skitch does, but I use it with Evernote Premium, so it’s the one I’m used to.


#4

@mrsean2k Genymotion is free to use. Free version displays a message at the bottom but it’s below the viewport of your screenshot.


#5

I stand corrected, thanks! I think I paid for it almost instantly as it was so useful.

Incidentally if you want to test things out first, I found this post useful for setting up a closed test group in G+

http://pugetworks.com/blog/2013/06/beta-testing-android-apps-on-the-google-play-store/


#6

@coen_warmer and @mrsean2k These are very good tips. I would try them out. Yes, I plan to release to a group of testers before releasing to production in Play Store. Thanks again for all your help!


#7

Has anybody worked with phantomJS to generate screenshots ?
I’ve been working around with it, but I’m kinda stuck… What how be the best way to know when the view is completely loaded ?


#8

Once you take your screenshots on your Android device, you can easily create screenshots for Google Play on launchkit.io/screenshots