Skip to main content
Participant
Mar 17, 2021 11:00 PM UTC
Answered

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

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!

 

This topic is closed to new replies. Start a new post to keep the conversation going.
Harshika Verma
Harshika VermaCorrect answer
Community Manager
Mar 24, 2021 12:06 AM UTC

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

2 replies

Participant
Jun 22, 2021 1:37 AM UTC

Try out https://xdframes.com/ They have created custom XD files with device frame boarders for just this purpose.

Translate
Harshika Verma
Community Manager
Harshika VermaCommunity ManagerCorrect answer
Community Manager
Mar 24, 2021 12:06 AM UTC

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

Translate