We offer several ways to preview your modifications when you are working on your app.
The previews allow you to see immediate modifications* made to your back office.
*​These changes will only be visible for your users once you've updated them in the menu Publish > Platform (PWA or iOS or Android) > Update. 

My GoodBarber app, to have a precise preview of the native iOS or Android version of the app
- The back office preview visible from the main column of your back office (based on the Progressive Web App (PWA) version)
- The preview mode accessible from the button "Preview" at the top right (based on the Progressive Web App (PWA) version)

picture

Select the type of preview from the top bar of the preview mode:
Phone preview, Tablet  preview, Laptop preview, or Browser preview.

picture

1

Phone preview

This is how your app will appear on a phone. However, keep in mind that the design of the app is automatically resized to fit any screen size, so the real app may appear slightly different depending on the size of the actual screen it is viewed on.
 

picture

2

Tablet preview

This is how your app will by displayed on tablets. 
The landscape mode is available on tablets. To change the position of the screen use the blue button at the top right of the preview.
 

picture

3

Laptop preview

The laptop preview, as stated, is the way your PWA will show on a laptop. It is narrower than a regular desktop preview. 
 

picture

4

Browser preview

The Browser preview is the broader size, it allows you to see and test the app as it appears on a browser.
Click the planet icon to open the browser preview in a new tab of your browser, it will open the same page than the one you were viewing on the back office preview.

Note: when in preview mode, a banner is displayed on the top part of the screen.

picture

More articles