How to add app icons to your prototype

 

One of the most popular features of Marvel is the ability to launch your prototype directly from the homescreen using an app icon.

Once the app icon is installed to a homescreen, it can launch the prototype with one tap, just like an app.

This works great for user testing or sharing your prototyp with stakeholders and clients.

How to add your app icon

  1. Select any mobile or tablet project
  2. Click on the app icon thumbnail
  3. Add your app icon design

 

How to install your app icon to your homescreen

The first time a prototype is viewed on mobile or tablet devices they'll be prompted with instructions on how to install the prototype to the homescreen.

How to view your app icon on your Android device:

  1. Open your prototype URL on your Android device
  2. Tap the menu icon in Chrome
  3. Select Add to home screen

How to view your app icon on your iOS device:

  1. Open your prototype URL on your iOS device
  2. Tap the menu icon in Safari
  3. Select Add to home screen

 

Remove the 'add to home screen' prompt 

You can remove the 'Add to homescreen' pop-up message on mobile and tablet devices by adding ?iosapp=true at the end of the share URL.

For example:

https://marvelapp.com/123j56 would be https://marvelapp.com/123j56?iosapp=true

 

Correct sizes for app icons

Here are the most common sizes:

iOS

  • iPhone 6 Plus - 180x180px
  • iPhone 6 and 5 - 120x120px
  • iPad and iPad mini - 152x152px
  • iPad 2 and iPad mini 76x76px

Android

  • 192px (xxxhdpi)
  • 144px (xxhdpi)
  • 96px (xhdpi)
  • 72px (hdpi)
  • 48px (mdpi)
  • 36px (ldpi) 
Was this article helpful?
27 out of 41 found this helpful

Articles in this section

See more

    Still have a question?

    Submit a help request