Tutorial > Mockplus Cloud > Interaction and Preview > Preview

Preview

Start from Homepage/Current Page

To start previewing the current project, click the Preview button in the upper right corner.

You can choose to either preview the project from the home page or the current page.

Navigation Bar

In Preview, the floating Navigation Bar offers the following options: "Show control panel" , "Home" , "Back" , "Forward" , "Zoom" and "Share preview link".

To preview the project on a mobile device, click "Share preview link", copy and paste the link into the browser of your mobile device.

Hide Control panel when previewing 

When previewing your project online, the Control panel will appear. This can sometimes obscure the interface, making it difficult to test out the details. If this happens, you can simply hide the Control panel by dragging it to the right where it will auto-snap to the side of the screen and become a small arrow icon, leaving your screen clear for previewing and testing. 

Share Preview Link

In Preview mode, to share the preview link, click "Share preview link" on the floating toolbar, and copy the link that appears to share later.

Or, you can directly copy the URL from your browser's address bar. (Note: People that receive the link need to first log in to access the project.)

Password Protect Preview Link

When sharing your project with a preview link, you can set a password to protect your project. Click "Share preview link" and tick "Set password" in the pop-out dialogue. (With this way to share a project, your partners or team members don’t need to log in to preview the project.)

Preview Settings

Click the setting iconon the bottom of the screen and you can change the following preview settings: “Show control panel”, “Show tool bar”, “Always show link area”, and “Show link area on mouse hover” and "Fit to screen".

You can also change the device frame in the same pop-up. Some commonly-used device frames are offered: iPhone X, iPhone, Android, Pad and more.

Search for Pages

When previewing a project, you can use the search bar on the left-hand Control panel to search for any page you want simply by entering a keyword or page name.