One of ProtoShare’s cool features is simulating interactions with most components simply by creating variations in their appearance modes.
For example, make a button look clickable, as you would in final development, by specifying its on-hover and on-click looks. Here’s how:
- Drag a button component to your canvas;
- Style the button as desired under the default “Normal” mode in the Inspector (e.g. background fill color);
- Choose the “Hover” mode to change the button’s appearance on hover (e.g. use a lighter fill color);
- Choose the “Click” mode to change the button’s click appearance (e.g. add inset shadow, darken fill color, etc.);
- Change the canvas to Test Mode to check out your changes – a clickable button by using a single component!
Note that when initially dragging a button component to your canvas, the button has inherent styles applied. Adding your own styles will override the default settings of the button.
Now if you actually want the button to take you somewhere, just add a page to the “Link to” field in the Inspector.
You can also view our detailed video on the subject: