Adding interactive hotspots to InVision V7 mobile prototypes involves most the same steps as adding hotspots to desktop prototypes.
To add a hotspot to your mobile prototype:
- In InVision V7, open any screen that needs a hotspot.
- In the toolbar at the bottom, click the Build icon () or use the keyboard shortcut: B
- Click and drag a blue box around the area you want to be interactive.
The hotspot modal will open so you can complete steps 4 - 8.
- Click the Link To drop down and select the destination.
After you set the destination, the Trigger and Transition dropdowns will appear.
- Click the Trigger dropdown and select which trigger will prompt the hotspot.
- Click the Transition dropdown and select the type of animation you want to use.
- If wanted, select one or both of the settings checkboxes:
- Maintain scroll position after click: Check this box if you don't want the scroll position to reset after the hotspot is clicked; if you choose to maintain scroll position, the user will be taken to the same point on the destination screen.
- Include hotspot in template: Check this box if you want to duplicate hotspots across multiple screens. Learn more in the "Creating hotspot templates" section below.
- Click Save.
Select one of the following destinations for your mobile prototype hotspot:
- Another point on this screen
- Link Back / Close (last screen visited)
- Screen as Overlay
Get familiar with Using overlays for your hotspots.
- Previous Screen in Series
- Next Screen in Series
- External URL
- Prototype Screens (any screen in your prototype)
For a more immersive, realistic experience, InVision V7 mobile prototype hotspots get prompted by the triggers listed below, rather than by triggers such as click or hover.
Select one of these triggers for each hotspot you add:
- Double Tap
- Swipe Right
- Swipe Left
- Swipe Up
- Swipe Down
The transition types available for InVision V7 mobile prototype hotspots match the transitions available for desktop prototypes.
Select one of these transitions for each hotspot you add:
- Push Right
- Push Left
- Slide Right
- Slide Left
- Slide Up
- Slide Down
- Flip Right
- Flip Left
- Slide Dissolve