How to embed a live prototype into an iPhone device frame/skin for a website?

New Here ,
Mar 17, 2021 Mar 17, 2021

Copy link to clipboard

Copied

Hello!

 

I'm looking to embed a live XD prototype into my website, and have it fit inside an iPhone 11 frame. I feel like I've seen this done on many portfolios showcasing UX/UI works, but am unsure how to get the skin on there since XD doesn't have an option to export it with any kind of device frame... I'm using the Creator plan on Readymag that allows me to insert custom code if that's the route I need to take.

 

Has anybody here successfully uploaded a prototype this way, or have any advice on how best to achieve this? Any help/advice welcome, thank you!

 

TOPICS
Design, How to, Prototyping, Share or publish

Views

109

Likes

translate

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct Answer

Adobe Employee , Mar 23, 2021 Mar 23, 2021
Hi there,   We are sorry for the delay in response. I have found two community post related to your question which might help you. Please go through the links once and see if that helps. https://community.adobe.com/t5/adobe-xd/embedding-an-xd-prototype-in-a-live-website/m-p/10571518https://community.adobe.com/t5/adobe-xd/can-we-no-longer-embed-xd-prototypes-option-has-gone-from-share-functionality/m-p/10927558   Thanks, Harshika

Likes

translate

Translate

Translate
Adobe Employee ,
Mar 23, 2021 Mar 23, 2021

Copy link to clipboard

Copied

Hi there,

 

We are sorry for the delay in response. I have found two community post related to your question which might help you. Please go through the links once and see if that helps.

 

Thanks,

Harshika

Likes

translate

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines