Verifying that your designs flow and function the way you’d like them to is key when creating interactive wireframes. ProtoShare offers a variety of options for Editors to test interactivity in a way that best suits their workflow:
Test button found above the canvas
Test Mode
Test Mode is available from within the editor view and allows you to test on click events as well as hover, right click and double click events. This feature goes hand-in-hand with the different appearance settings available to you in the Inspector and also allows you to test the fly-out interactivity that is built into navigation related components. You can also use Test Mode to interact with controls like radio buttons, form fields and even the file upload component.
Run button found near the Share menu
Run Mode
Run Mode is also found within the editor view and includes all of the functionality of Test Mode with the added functionality of following links. The Run button is found to the left of the Share menu above the canvas. Run Mode opens your designs up in a new browser window and the chrome or ProtoShare UI is removed. In Run Mode, you can follow custom links as well as test the functionality the links built into navigation components.
Share Menu showing the Open in Review option
Review Mode
Review Mode is separate from the Editor and is very similar to Run Mode. Functions available in Run are included in the functionality of Review with additional collaborative features. You are encouraged to create discussion topics and leave comments for other users while in Review but you can also test out your interactions as needed. Another feature that separates Review from Run is that you have access to the ProtoShare UI inside Review but you can hide it at will. You can use the Pages menu to manually select different pages or you can navigate by clicking on topics which will load the design the topic is pinned on.
Export
Creating an HTML Export allows you to test the functionality of designs while offline or share your designs with someone who is outside of ProtoShare. You can trigger states, follow links and interact with form type components from an HTML Export. Export options are found in the Page menu of the Pages Tab or by right clicking a page from the Pages Tab. To create an Export to Web, be sure to check the Publish To Web Option from the Export options menu. Keep in mind that any feedback will need to be collected outside the tool as the Review UI is not included in a Publish to Web export.
Export Menu showing Export to Web option
Best Practices
All in all, you have many options and workflows available to you while testing interactions and navigation functionality in ProtoShare. A best practice workflow may include using Test to interact with components within the Editor, using Run to test links, then moving on to Review Mode to share your designs with others. Creating an Export to HTML will be handy for any time you’d like to test features while offline or if you’d like to share your designs with a stakeholder who isn’t a ProtoShare user.