When it comes to embedding InVision prototypes and screens into website or tools outside of InVision, you have a few options:
- Embed single screens into project management tools with our Live Embed feature. With Live Embed, you can only embed a single screen of a desktop prototype, as opposed to an entire prototype or a mobile prototype.
- Embed an entire mobile prototype in an external environment.
Embedding screens with Live Embed
With Live Embed, you can integrate your screens with all the project management tools you know and love. Bring live screens right into your existing conversations, designs, and workflows, so everyone can always be up to date.
Currently, you can only embed a single screen of a desktop prototype, as opposed to an entire prototype. With Live Embed, you cannot embed a full prototype of any kind, nor can you embed a screen from a mobile prototype.
You can leverage the Live Embed feature by selecting the </> icon on any given screen and selecting the desired channel where you want to embed the screen.
Embedding a full mobile prototype
You can embed an entire mobile prototype within an external environment. There is currently no way to embed a full desktop prototype in an external environment.
To embed a mobile prototype:
- Click the prototype you wish to embed.
- Click the ••• button (next to Assets under your prototype name).
- Click </> Embed Prototype at the top of the menu.
- Choose whether you’d like to embed via Embedly or an iframe embed code.
- You will be presented with the custom embed code for your mobile prototype.
- Click the green Copy Code button.
- Copy and insert wherever you would like in your external environment.
In many ways, you will be dependent on the settings, accesses, and setup of the external site. InVision Support can only help with the generation of the above embed code. If any issues are experienced actually embedding the prototype, we recommend contacting whomever manages the external site.