Tag Archives: status bar

Two developers I follow on Twitter have asked pretty much the same question in recent memory: “Should I leave the status bar in iOS App Store screenshots or crop them out?” (link, link).

Crop out the status bar.

I replied to both on Twitter, but thought I’d write up a short post on it. A few people replied to the above tweets saying you should leave the status bar in the screenshots but take out the carrier. Someone even said they’d want to know what colour the status bar is for an app. Not sure customers would decide to buy an app based on the colour the the status bar to be honest.

The first screenshot you upload in iTunes Connect is used as the main screenshot. It is visible on your app product page on both the desktop App Store and the device App Store. For best results, do not include the iPhone or iPad status bar in your screenshots, and follow the requirements given below. Those dimensions allow you to remove the iOS status bar from screenshots so that you can showcase only the active app area, without distractions.

You can refer to Table 7-3 for screenshot dimensions for the various devices, both with and without the status bar.

But again: Crop out the status bar.

Use of status bar styles

On a related note, I strongly suggest going with a black status bar unless a status bar matching the colour of your navigation bar really enhances the UI.

The Keypad view in the Phone app shows a nice use of the default status bar where the top view seamlessly blends into the status bar. I also find that the status bar looks best when matched with the default navigation bar (blue). Other colours often don’t look right.

You can also mix and match throughout your app. The built in Clock app is a great example of this. The status bar compliments the navigation bar and background on the first two tabs, but the last two views are mainly black, so the status bar is black for these two tabs as well.