Built-in Library of Wireframe Elements, for generic web / mobile design
To be able to use XD as a useful tool for content architecting/wireframing (before design, before prototype) - a library of generic common web and mobile web elements would be very useful (in an easily accessible panel - NOT by copying and pasting from a template file).
- Image/Logo (resizable) placeholder
- Horizontal and Vertical Nav placeholder
- Icon library (like hamburger, search, map point, etc)
- Text block (resizable) placeholder
- Scrollbar (horizontal, vertical) placeholder
Think Balsamiq, or OmniGraffle wireframe tools for example.
While we haven’t created UI to bring this into the app, we have worked to create a wireframe UI kit that we released recently (for free!). Check out Wires: https://www.behance.net/gallery/55462459/Wires-free-wireframe-kits-for-Adobe-XD
San Nguyen commented
It would be great if XD has a bar to search and drag icons right in the design interface. something similar to this one:
Steven Ellis commented
If there was a way to have a drag and drop stencil library as simple and easy as https://moqups.com then this app would be so much more powerful for early-stage lo-fidelity wireframes (made by UX Designers) rather than the medium / hi-fidelity ones (more for UI designers) currently in the free Wires Kit
This would make my life so much easier.
Steffen Müller commented
+1000 for this feature.
also I would like to add/import my an existing *.xd file as a library
Stefan Freimark commented
In addition to a built-in library, I would like to be able to create stencil libraries myself. :-)
I also need this feature, it would be great and something more powerful in xd, I think this addition is a key to bring more users to this software (3x1)
Jaison Justus commented
Until the time Adobe includes a wireframing kit/symbol set, you can use this one: https://medium.com/@jaisonjustus/wireframing-kit-for-adobe-xd-b8da95a82553
This would be really helpful. Especially for design sprints when we're prototyping rapidly
Rene Rodriguez commented
another addendum - it would be nice to toggle from wireframe theme to a styled theme... sometimes you want to test just the flow... This way the design team can decide what is the primary focus of the prototype and what needs to be tested at any given step of the design process
Francesco Kirchhoff commented
Key to this is to allow a drag-and-drop flow like OmniGraffle. Anything more convoluted kills the productivity potential of something like this, imho.
Jessica Moon commented
To add more fidelity to this request – it would be awesome to at the very least be able to create a simple "X"ed box in one click. Some wireframe programs put too much fidelity here, but as opposed to "fake images" which a user can easily solve for with XD (just use a generic grayscale library of images and populate boxes with them), if you could toggle between rectangle and rectangle with an X (where the X was defined by the rectangle's border color + size), then that would be so helpful in IA and early interaction design phases!
Tim Black commented
Great idea. This may be a no-brainer, but I think this would definitely need to have a hand drawn look similar to Balsamiq's sketch skin mode to be effective. Today's designs can be so clean and simple that wireframes often look too much like a final design. As a result clients end up wasting time critiquing design details on wireframes that were only meant to convey a general idea. This may also work well as an all together separate mode. A user could work in "sketch" mode, jump to prototype mode and prototype the rough sketch, or move onto design mode which could include the toggleable sketch layer as a guide. Another option would be to have these sketches function as a completely separate file type which could greatly simplify the UI for this. It could then be exported, saved as, or converted to a design file which would create a new design file with all the art boards in place and the sketch layer underneath as a guide layer.
Yes! Yes! Yes! This!
Jay Fortner commented
It would be nice to have some stencils to work with in the toolbar that would allow me to draw common user interface elements. Such as HTML elements (links, fields, etc), graphs and charts, interface templates (desktop, mobile, browser, etc).
Colors and text could be editable.
See examples of stencils at http://www.moqups.com/
This feature would allow users to quickly demonstrate an idea for a client or other project using Adobe XD. When the project moves forward the user could swap the stencils with the actual artwork from other Adobe design applications.
Charles Plath commented
Exactly. While I love how snappy XD is, most of what we are seeing are prototyping full designs and we'd love the ability to start testing with wireframes and go through all of those interactions first. Then we could always come back and design right over the top of those later.
Russell Mixon II commented
Great idea. I think we take it a step further possibly, and integrate it into a general assets panel where you do that and theres certain categories that are generic, or you could even customize. So, there would be a folder for wireframes, maybe one for navigation, one for forms, one for mobile stuff, etc. Then, if you created assets and want to save them for later use, or utilize downloaded ones, or ones already given through the software, its all there, without having to mess with your files section from the creative cloud.