Retina support for Web projects

With retina support you can easily create web prototypes for retina displays. If you upload retina images without adding the proper modifier (@2x) you may experience the following issues: 

(1) Your screen images appear twice as big as you expected.
(2) You experience reduced quality of your screen images when viewed on a retina display.

By simply adding the high-resolution modifier @2x to your screen name (Ex. login@2x.png), screen images will display at 50% and as crisp as can be! You can either prep your screens and upload them ready for retina or modify an already existing screen and make it retina ready.

Add new retina screens

1. Add @2x to the file name for your screen image.
   For example: home.png　→　 home@2x.png
   

   

2. Upload your screen to any Prott web project.
3. Screen images will display at 50% in the preview and presentation modes.

Modify uploaded screens

1. Replace your current screen with one that includes the @2x modifier by hitting "Replace" in screen settings or drag-and-drop the new file on top of the current one.
2. Edit your screen name by double clicking it and add the @2x modifier.
   For example: Login Screen　→　Login Screen@2x
   

   

3. Screen images will display at 50% in the preview and presentation modes.

Important note

Retina support is available for the Comment, Preview, and Presentation modes. You may experience slower project loading and previewing with projects that include retina screens.