Load a URL inside a container object (embed code)
The idea is to be able to leverage content already on the web via a URL, for prototyping purposes.
It could be as simple as the following:
- Add a new "Web container" type of object
- Double-click for a popup asking for the URL, press enter
The content could load right away. Xd could take a snapshot of it so that it doesn't slow things down in Design mode, but in Proto mode it would of course show live content.
There would also be more options, like enabling/disabling vertical and horizontal scrolling for the container.
A Plugin which allows you to "show a website" (Example: You enter the link in ... then it injects the website in live time and auto updates it when the website updates)
Yes, and also we could be able to set width/height of the container (or iframe). Is it possible in Sketch?
Yes, actually It would be great to embed html content.
It's useful with a header and footer, and the content is an embedded html!
Maybe, if it's easier for Adobe to develop this funcionallity, if we could insert html code (so we could use iframe html tag - that would solve that).
Harun Alikadić commented
What about embedding anything, not just Youtube videos (which I personally do not find useful to embed)? I would love to embed a Typeform or Google Forms. It is very quick to create interactive forms that actually work and to test them with users. Prototyping and interactive form simulation with XD takes ages, especially if you have dozens of questions in different UI type. With XD, I would create a header and embed the form in the center of the prototype page.
It would be great to be able to add actual iFrame content within a shape (like a rectangle). For example, often a design might have a popup with a video that is hosted on YouTube or Vimeo. Or in other cases, you might have a popup with external content, such as a website that offers booking appointments through a third party.
Billy Mitchell commented
Please allow the embedding of a code block within your design. That way you can integrate existing assets or 3erd party designs. This is particularly helpful for iframes to interactive experiences or components of animation.
Adobe XD Designer commented
The main utility of this would be to link to a survey form. If links to arbitrary URLs isn't desirable, perhaps it could develop a survey tool based on its other tools for this purpose.
hi Elaine, thanks.
but how does one move the site design from Design mode to Prototyping mode, or continue from Design mode to next mode to add interactivity/hyperlinks/payment buttons etc?
if one has to restart entire design from Design mode to Proto mode, then what is the point of having both modes, if they're separate apps?
so what is the difference/point of XD Design vs Prototype tabs?
is Design not to design a web site let's say? then after all that work in design, how does one move the site design to interactivity tab to add hyperlink & pay buttons etc?
Stripe (ePay) https://stripe.com compatibility / payment buttons. we do not need more PayPal, it's lazy & old-fashioned. we need modern ePay options like Stripe please!
does XD already allow for HTML/iFrames?
how can one add a payment option button in XD-created sites?
If you can load URL you can probably show video in there too so that takes care of it