Generate specs / measurements / style guide for developers
What definitely needed in the Design community is to ease the design-development delivery-review phase. To unload both of the sides.
A lot of different platforms, tools, plugins were meant to do that and none of them is fully unloading and simplifying that process.
PNG Express, Specking, Avocode, Markly, Zeplin, Craft, Marketch etc...
I believe there is a need in having some specifications delivery service, styleguide generating service.
Specs:
+ Measuring distance from text line height (because that's how developers do), not font size.
+ Ability to adjust the UI on the go with automatic sepcs changing
+ Ability to select and automatically calculate the parameter type (dp, px, pt, em, sp) with defining default
etc.
Styleguide:
+ Automatically generated colour palette. And when you change the colour in palette it changes everywhere in the UI.
+ Font styles
+ Generating assets
+ Generating SVGs
etc
We’re pleased to announce that our Design Specs feature is now available as a Beta in our November release. You can read more about it on our announcement blog post here: https://blogs.adobe.com/creativecloud/november-update-of-adobe-xd/
The Design Specs feature is just the first step for us in this space, and we’re looking for your feedback on the feature. In order to focus on the feedback, we’ve created a new feature area that you can target when you file new ideas: 09 Design Specs. Please remember that you should file one idea per submission, so that we can better aggregate your feedback.
-
Ales O. commented
Thank you for making Adobe XD! I love the simplicity. I am missing one automated step regarding the colour management. What would be really nice, if user could export all colours used in the project in RGB, HEX or other setting. It is my practice, after the project is created and confirmed, to create spreadsheet or image with all the important colours used and to be able to share it with rest of the team (developer, web...), so they have reference. Further more, if the project is edited in few months time, it is easy to refresh the memory and not wasting time with colour pick to find the RGB value for it for example...
It would be even greater, if the user could generate subclasses for mobile programming directly with one click.
Export > iOS > Objective-C
//------------------------
.h file:#import <UIKit/UIKit.h>
@interface UIColor (App Name)
+ (UIColor*)alkalineColor;
+ (UIColor*)acidicColor;
+ (UIColor*)lightAlkalineColor;
+ (UIColor*)darkGreenColor;
+ (UIColor*)darkGreenChartColor;
+ (UIColor*)blnzColor;@end
//------------------------------------
.m file:
#import "ProjectColors.h"@implementation UIColor (App Name)
+ (UIColor*)alkalineColor {
return [UIColor colorWithRed:194.0/255.0 green:60.0/255.0 blue:159.0/255.0 alpha:1];
}
+ (UIColor*)acidicColor {
return [UIColor colorWithRed:220.0/255.0 green:210.0/255.0 blue:75.0/255.0 alpha:1];
}
+ (UIColor*)lightAlkalineColor {
return [UIColor colorWithRed:228.0/255.0 green:43.0/255.0 blue:180.0/255.0 alpha:1];
}
+ (UIColor*)darkGreenColor {
return [UIColor colorWithRed:44.0/255.0 green:70.0/255.0 blue:2.0/255.0 alpha:1];
}
+ (UIColor*)darkGreenChartColor{
return [UIColor colorWithRed:25.0f/255.0f green:40.0f/255.0f blue:0.0f/255.0f alpha:1];
}
+ (UIColor*)blnzColor{
return [UIColor colorWithRed:91.0f/255.0f green:136.0f/255.0f blue:15.0f/255.0f alpha:1];
}@end
//------------------
It will be very easy to use the colours in project now as the subclass for all colours have been created. Simple drag and drop to project will speed up the whole process hugely.
//--------
When the XD project is open, the colour palette could have 2 modes - original + project. The project colour palette would display all the colours applied within the project and if the user will click on specific colour, and adjust it, it will automatically reflect on the canvas
-
Maria commented
Integration with Zeplin needed!
-
Matt Geller commented
Would love to see XD work with Zeplin or Sympli.
-
juan carlos commented
This would be a godsend.
-
jerz commented
Hope XD will support zeplin plugin
-
Rich commented
When will a plug in structure be in place to support zeplin?
-
It looks like you are interested in one of these things:
1. Hold down Alt to measure distance between objects: this is already possible in Adobe XD today.
2. Upload your design to a web service where developers can interactively extract measurements, styles, and other information (similar to the app Zeplin or the Creative Cloud "Extract" service).
3. Export a static (not interactive) design spec that developers can read, listing measurements and other styles. PDF is _one_ format this could be exported in.Based on the earlier request "Hope can be in web page preview prototype a new measurement model," I believe you are most interested in #2. There is already an existing suggestion matching this idea, so in a moment I will merge your suggestion into that one, to keep our feature list tidy.
If you are more interested in #3, please add your vote to this suggestion instead: https://adobexd.uservoice.com/forums/353007/suggestions/15061407-export-measurements-for-developers
Thanks for your feedback!
-
davidicus commented
might prefer sympli.io
-
Landon Register commented
An app I always used in PS is Specctr. If we could get similar support, or the support of Specctr, that could be great too.
-
Feng.Chang commented
Prototype measurement mode, add page preview, view the switch prototype, rather than a PDF form, please don't take my thoughts and PDF merge together, thank you very much!
-
Feng.Chang commented
Hope can support after the prototype, developers can directly measure based on web interface prototypes, it eliminates a lot of trouble, make the team more efficient, China has a "biaonimei" platform can be easily measured PSD files online, adobe xd as a lightweight software, I hope to make good use of the web platform.
希望可以支持原型后,开发人员可以直接测量基于web界面原型,它消除了很多麻烦,使团队更有效率,中国有“biaonimei”平台可以很容易地在线测量PSD文件,adobe xd作为一个轻量级的软件,我希望好好利用网络平台。 -
Anonymous commented
The one thing stopping us from moving to XD that you can't yet export screens to Zeplin, nor do you provide a way of easily sending specs to the engineers. Will you be introducing this feature or integrating with Zeplin soon?
-
Anonymous commented
As a project wraps, redlining is an essential part of our process for handing off to Development, right now, there isnt an intuitive way to do this, but I have seen PS plugins that make this process much more streamlined.
-
Nick commented
Great work on XD so far guys!
WRT this thread, "Measurements" is a step in the right direction.
One thing I'm hoping you guys consider is this:
Even if you get to feature parity with Zeplin inside of XD, there is still the problem that most Devs, especially in large organizations like the one I work in, don't yet have access to the Adobe suite, which will be a barrier to Design uptake in the near/medium term.
Even if Devs were granted access, diving into a set of raw XD files is probably not sufficiently optimized for their particular workflows.
Having a universally accessible web-based portal that devs can reference and navigate easily, with the ability to organize specs by product, project, sub-feature, current/outdated, etc. may be the best solution for all stakeholders.
Thanks!
-
Nick commented
Yes please!!!!!!
Either an export to Zeplin feature or better yet (for the Adobe ecosystem in particular) a way for devs to get the specifics they need natively.
We love XD. We've always been an Adobe shop, but we are increasingly a Sketch shop, and will be until this capability gets rolled out. Sketch + Zeplin just saves too much time.
Thanks!!
-
Anonymous commented
That's exactly what I need from XD!
The constantly improvements on the design area of the app are great, but, once I finish the project it's really hard to share all the information with my develop team... So, all the time I had saved on the design of the project is lost since I have to organize all the information my developer needs manually. -
Luis López commented
This is the major time saver and efficiency step that XD needs!
When it comes to a deadline in an agile environment this is key om the collaboration with the developers as efficient as possible to implement.
I wish It had more priority I believe this is much more important that other design features that have received more votes........ -
Luis López commented
For me this is the only reason why I still use Sketch above XD.
If XD can be used in combination with Zeplin then that will be the major step and I will fully migrate to XD due to its superiority in all fields.
I really hope that this integration is going to happen soon!!! -
Antonio commented
Actually a lot of tools live around there that support specification to be done in Photoshop or Sketch.
Either it would be great to try to onboard them with a plugin for adobe xd (markly, avocode ...) or already built-in such a capability.
You can also bypass by allowing to export to photoshop, since most of the named tools work with Photoshop.
-
Anonymous commented
Export to photoshop could be handy.