Hotspots are clickable layers which will bring more interactivity and life to your prototype. Thanks to hotspots, you can add an interaction on the top of any element you may think of. This is most useful when your design includes imported graphics, only parts of which you want clickable — for example, JPGs that include text or a logotype which should link to another page of your design. In this way, you don’t have to add interactions to specific elements. It’s a real time-saver!
You can find the hotspot element in UXPin’s side panel as well as by using shortcut “H” and drawing the shape on the canvas. As you can see below, it’s a transparent box which you can place anywhere on your design (e.g. on an image) and add interactions to it in seconds! Notice that you can resize and duplicate your hotspot as you would with the usual Box element.
One of the most common usages of Hotspot is linking to another screen of your design. Here’s how it works:
When you click on a hotspot, you’re automatically switched to interactions tab to save you some time!
We placed a hotspot on the top of the image to link to different page of our prototype. In addition to linking between pages in a prototype, you can also link to external URLs or trigger animations with just a few clicks. A huge time-saver, isn’t it?Make your static prototypes interactive with hotspots in your free trial account!