My designs already have a status bar included, how do I remove the iOS status bar?

When prototyping for iOS devices, Apple disables the ability to remove the native status bar (which shows the time and battery power etc) when you view the prototype on a mobile browser.


This can be a pain if you add the status bar in your designs as you'll see double bars in the prototype.

To get around this, Marvel has a feature to 'trim' the status bar from your designs by cropping the exact amount of pixels from the image so the status bar only appears once.

How to trim the status bar for mobile web browser:

  1. Go to your project settings 
  2. Click the General tab 
  3. Toggle Trim iOS status bar to on.

Note: This only works with prototypes that have been added to your home-screen. The trim status bar option also doesn't currently work with Android projects. 

Status Bar in the iOS app

The native status bar is hidden when you play your prototype in the Marvel iOS app. Only bars which you've designed in your screens will be visible. 

Download  the app for free by clicking here.


More questions? You can submit a request.