In Mockplus, one page can contain different states. You can upload and merge them to create a page state carousel. You can add pages to that carousel, reorder the page states inside or separate any previously made page state carousels. Your page state carousel can also automatically play.
Rename Page States
Rename any of your page states by double clicking the name of those states on the left side of your page state carousel.
Upload State Pages
Currently, you can upload page states from Sketch, Adobe XD, and Photoshop by using our plugin.
When using the Photoshop or Sketch plugin:
- Select an artboard in Photoshop or Sketch and tick “Upload the selected artboard(s)”. Then, click the “Upload” button. Your first upload is now completed.
- Follow the same process to upload the artboard again, if it is modified or edited. You'll then be asked whether to cover (overwrite) the existing version.
- If you want to replace the previous version, select “Cover existing state” and click the version that you want to overwrite with.
- If you want to upload the page as a new page state, select “Add new state” and enter a name for it.
- Now you can open Mockplus on your browser and preview all uploaded page states in the Storyboard. (Repeat previous steps to upload more page states.)
When using Adobe XD plugin:
- Select an artboard in Adobe XD and click “Upload as state” to complete your first upload.
- Follow the same process to upload the artboard again, if it is modified or edited. You'll then be asked whether or not you want to cover the existing version.
- If you want to replace the previous version, select “Cover existing state” and click the version that you want to overwrite with.
- If you want to upload it as a new page state, select “Add new state” and enter a name for it.
- Now you can open Mockplus in your browser and preview all uploaded page states in the Storyboard. (Repeat previous steps to upload more page states.)
Check Page State Details
Once you select "Cover existing state" in the plugin, all previous state versions appear. Click the magnifier icon next to the state name to view their details.
State Carousel
To view state details on the web, click the name of those states on the left side and switch between them one by one. Or right click the state carousel to select "Play carousel". Then, the state carousel will automatically play.
You can also customize the carousel effects and time in the lower-left setting panel.
Merge and Separate State Pages
Click the state carousel that you've created. The names of all states shows= up instantly on the left side of the carousel. To merge more pages into this carousel, frame select more pages nearby and right click them to choose "Merge into state page".
Conversely, if you want to separate the carousel, drag the name of those states to move them out from the carousel.
