Export whole artboards (or entire project) as HTML
It would be great to Export Prototypes as pure HTML Projects. I am working a lot on Multiscreen apps, where I mostly use Serveal Webcontainers Running on several Screens, to develop those Applications.
-
Jeremy Hart commented
This app is for designing, used in the stage before it goes to the development team.
Please don't priorities this feature request at the expense of other basic features that are available in PS & AI.
BTW any non-dev commentators here, this is quite techo request.
We would need responsive placement/locations before this could be considered. -
Usman commented
Definitely need an export to HTML / CSS option. Why bother with proper element organisation and naming conventions if at the end you have to recreate the same thing with code.
-
Anonymous commented
This is a very limited useless app. They have killed Muse for no reason and give us this encrypted app depending 100% from adobe severs. Back to Muse.
-
Danny Hale commented
Why would this product not have export to html and css - seems like a huge waste of time without that.
-
Anonymous commented
Exporting to html/css is a must, please make this!
-
jeret commented
Adobe XD needs to do an upgrade. Exporting to html/css is a must have feature!
-
jamie commented
Word. if any export to html css available in near future, then it will be better for windows users, as Sketch does
-
arindam commented
if any export to html css available in near future, then it will be better for windows users. as sketch does that in mac.
-
André Taris commented
wurd
-
Anonymous commented
what's the use of having a design app that you can't upload directly to go live on a host server?????
-
Chris commented
I would wholly reiterate much of this, a basic export to html/css does seem essential (prerequsite?) from a prototyping tool from Adobe. There will be a lot of disheartened front-end designers turning away to the likes of weebly/wix if a solution isn't offered soon.
Even details of XD's roadmap would be a bonus
-
Anonymous commented
I will echo all the other comments. Whatever application I choose to replace Muse, I have to be able to export to HTML. My company is dependent on this functionality in Muse for vital projects. I am not happy that Adobe has provided a program with this functionality and is now ending it without announcing how it will be replaced. Adobe has placed me, my team, and vital projects of a Fortune 100 company in a tough position. If Adobe does not add HTML export functionality to Xd, or come up with another equivalent design to HTML solution, we will have to adopt a solution outside of the Adobe software suite. We need to find an answer, or know that one is coming from Adobe, very soon as we will need to convert all the muse files we are using and re-educate our artists in the new program as quickly as possible. Our timelines can be as much as two years out, so we basically need to start changing over now (or at least within the next six months at most).
-
Benjamin commented
Unfortunately, for me, I began learning how to use Muse far too late. I had only just become sufficient in the software when the news that Muse would no longer continue service had arrived. As a designer, I do not know how to code, and Muse was a beacon of hope--a shortcut on an otherwise lengthy and uncompromising road. I don't want to learn code; it's awful. In fact, learning to code is my worse nightmare. I recognize the incredible talent involved in that world, and I also recognize that some people love to code; however, I am not one of those people. I wish I was; I really do, but I am not, and judging by this thread, it looks like I am not alone. I have no idea what it takes to make features like exporting or converting the prototype of a website's design into a real, functioning website, but I do know Muse can do it. So I know it is possible. My question is this: How far away is a function like that from becoming reality? Should I begin to learn how to use Dreamweaver? Or will there be an update that allows for the exportation of XD files as html files somewhere in the near future? Thank you.
-
Anonymous commented
I think a great benchmark for Adobe, would be taking a look at Webflow. I would love to see this integration in XD. To be able to switch from design to code to edit css or html would be awesome! Combined with the powerful tools that already exist in XD this next step would be amazing to see.
-
Anonymous commented
At least provide a CSS code. What does FEATURE NEED MORE INFO means..read comment yhen yu get the INFO
-
Sheryl commented
Designing for prototyping is wonderful, but if you have what you need when done just allow us to take it to the next step of exporting to html and css. If you don’t allow us to go that route I see XD failing for this one reason. “We have now spent double the time on a job that we can’t justify billing it out to a client.”
I just started using XD to design layouts for APPs and websites love the added bonus testing function which you can’t do with Photoshop art boards. But as my boss said we can’t bill that time to the client. The client doesn’t understand why it can’t be used as it is because it works.
-
Anonymous commented
Hello there,
Tricky thing to achieve as we don't all code the same way for the same purpose... We could have instead something a bit more advanced than Zeplin but with the same spirit.
We could have:
- If possible, each XD element has an associated HTML, otherwise default is <div> (e.g. Text element = <p>)
NOTE: What about inputs? Select? Buttons? We might need special symbols- A group is considered as an element
- If modified by the user, the name of the XD element becomes a CSS class. In the styles, this class is added to its tag (e.g. p.myNewName or div.myGroup)
- By default, all the elements should be position: relative, then allow the user to use exceptions.
- Use flex as much as possible as it's the most efficient way to reproduce design layouts.
The FEATURE-NEEDS-MORE-INFO is quite confusing though xD what do you mean guys?
-
DHILIP KUMAR commented
I now use Adobe Reflow to create clickables to show them as .HTML files
# It Would be soo nice to Export Work As .HTML without needing to publish it on adobe
-
Vishnu commented
The time of designing and writing HTML+CSS is coming to an end. It is high time we are able to export designs to html+css(atleast) so that we can concentrate on better things.
- Front End Developer
-
Paul Mackinnon commented
another option I just thought of would be to facilitate exporting appropriate data, e.g. as JSON.
The rational is that you have expended effort on design, but now you want to flexibly reuse the information such as position of elements etc. It might be for web, but could be for another platform such as iOS autolayout constraints, etc. That data could be very useful to the production line
So why not include a JS API in XD (extendscript) and include all useful data in the API. From there it would be possible for developers to produce plug-ins that target specific uses (ANdroid, iOS, Windows, Web, whatever comes up)
Then, the most requested features i.e. Web, could easily be included by Adobe, or open to third party developers to sell
So, actually a few of suggestions:
JS API (extendscript)
HTML, CSS export
XML export
JSON exportFull Website export (for convenience)
Essentially most of the exports would be easily facilitated via a comprehensive JS interface in the XD application - to be clear that is JS that runs in the native XD app, and would also facilitate import, and other customisation of the XD environment
(in contrast JS that is intended for the prototype is a different feature, and may be relevant to other feature request such as custom widgets etc)