Skip to main content
mask207
mask207
Participant
July 24, 2019
Answered

Embedding an XD prototype in a live website

  • July 24, 2019
  • 1 reply
  • 22108 views

I want to create a clickable XD (mobile) prototype that the general public can access as a "product demo" on our live website.  All of the documentation I've read concerns internal prototypes to stakeholders and reviewers and I'm familiar with doing that - but now, I want to be able to share my prototype with anyone at my website.

Can anyone share a link with me so I can see what the user-experience is for this at a live website?  For example, if I place a "See the demo" button on my website, will the XD prototype open inside a new browser window or lightbox modal on top of that website page when someone clicks that button, if I embed the prototype  code?  Can the user still see hotspot hints and can I disable commenting?  Is this buggy on some browsers?  (looks like that may be the case, given this post   https://helpx.adobe.com/xd/kb/issue-view-web-prototypes.html)

My goal is to show customers how the product will work (via a clickable demo) and then once they're done with the demo, I will ask them to go to a surveymonkey page to get their feedback on product features.

Any suggestions for better ways to do this would be most welcomed.  Thank you!

    This topic has been closed for replies.
    Correct answer lisat80785225

    Just found out you can still embed them using the embed code - it is in the dropdown at the bottom of the share panel after you have created  public link. 

    1 reply

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity Expert
    Community Expert
    July 25, 2019

    mask207  wrote

    if I place a "See the demo" button on my website, will the XD prototype open inside a new browser window or lightbox modal when someone clicks that button?

    No.  Embedding an XD prototype into a web page is similar to embedding an <iframe> with a YoutTube video inside.   A modal window (if there is one)  would come directly from your site's code, not the code inside XD.   You would need to add the necessary  scripts to your site and a JS function to the trigger  button.   Methods vary depending on which  scripts you use and what kind of site you have (Wix, WordPress, Squarespace, other...).

    Nancy O'Shea— Product User & Community Expert
      L
      lisat80785225
      Participant
      February 16, 2020

      There no longer seems to be  an embed option in Adobe XD when you go to  share?

      I woudl also like to embed Adobe XD in an iframe in my live website to build prototypes right in the real live website.
      I already do with with just images but it would be great to embed a working prototyple in the context of my real produtct. 
      However when I attempt this (which I can do for most other websites) it tells me that Adobe.com have refused the connection. 

      Is there a way around this. 
      Does anyone have the old embed code for Adobe XD?

      L
      lisat80785225Correct answer
      Participant
      February 18, 2020

      Just found out you can still embed them using the embed code - it is in the dropdown at the bottom of the share panel after you have created  public link. 

        Terms & ConditionsAccessibility statement
        Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices