Creating a preview of your design in Flexitive can be done quickly and easily using the Preview Panel in the Publish panel of the editor. The Publish panel is located on the right-hand side of the editor.
The Flexitive Preview page displays the most up-to-date version of your designs and can be viewed by anyone. If you save a change to your design in Flexitive, the change will be visible on the preview page after you refresh the change.
To create a Preview page using the preview panel, select the sizes you'd like to create a preview of, and then click 'Preview Design'.
A preview page is made up of any of 3 different types of previews. These Preview options are:
- Fixed Pixel Previews
- Fixed Aspect Ratio Previews
- Full Responsive Previews
You can navigate to different preview pages using the tabs in the top-left of the preview page. When viewing 'Fixed' sizes, you'll be able to navigate between 'IAB' sizes, 'Other' and 'Social' sizes in the same way as in the Flexitive Sizes panel.
When viewing 'Responsive' Sizes, you'll be able to preview 'In-Page' and 'Fullscreen' sizes. You can also view the 'All Active Breakpoints' option to view how the design behaves as a fully responsive design.
When you copy the URL for the preview page to send to a client, the URL will automatically open the tabs of the preview page you were viewing when copying the URL.
While loading the preview page, you may see a modal indicating that your assets are still being optimized. When we display the preview page for your design, the assets on the page will be compressed, cropped and re-sized in the same way as when your design is exporting. The optimization process takes time, and can sometimes cause a small wait while your designs load, but including the optimization process ensures the designs you see in the preview page exactly match what you can expect to see in your exported files.
You can check out an example of a Flexitive Preview Page here.