Creative Connection

July 2018 Release of Adobe XD: Stroke Enhancements, Commenting on Design Specs, and More

The July release of Adobe XD is here – and so are a host of new features that help you build even more engaging experiences for your customers – and to bring your fellow designers, developers, and stakeholders along with you in that journey. With new stroke enhancements, you’ll be able to create dotted and dashed lines within XD and really shape what they look like, which is a useful design element for when you want your users to upload a file or drag and drop something. We’ve also rolled out new ways to label and organise your assets (which will make it easier to find what you’re looking for across hundreds of art boards), and we’ve brought collaboration tools to Design Specs to make it communicate with your development teams that much easier.

Keep reading to see our new features in action, and be sure to tune in to Adobe Live, July 16 and 17  (from 5 pm. to 1 am BST) to see top UX designers using these latest features in Adobe XD.

New to XD: Stroke enhancements

You can now control the fidelity of strokes to create dotted and dashed lines, specify end caps and rounded corners, or for even finer control, copy an even more complex stroke from Adobe Illustrator, then apply it to native XD objects. “My team often uses dashed or dotted lines in our designs,” said Cecilia Farooqi, Director of Digital Design for Equinox. “Enhanced stroke capabilities in XD eliminates the extra step of creating vector elements in a different application and pasting them in. For complex vectors, being able to adjust the dashes and gaps once pasted into XD is also a huge gain. The addition of these features continues to make XD our go-to design tool for digital work.” Check out the video below to see Adobe XD’s new stroke enhancements in action.

In the video, you’ll see how you can create and define fields, buttons, and more in Adobe XD with dotted and dashed lines of all varieties (especially with the help of Adobe Illustrator). This will help you create elements such as drag and drop fields, communicate to the user where they can upload files, or simply use the new feature to make aesthetic choices that suit your design.

New to XD: Label assets

It’s now much easier to access and keep your assets and design choices organised in Adobe XD, thanks to the new capabilities. You can now name colours, character styles, and symbols right in the assets panel. To easily access these named assets, you can filter by type or asset name, switch between list and grid views, and see tooltip rollovers to get quick info about each asset. “Our design files have many character styles, colours, and asset, so being able to correctly label and search for them saves us so much time in our workflow and keeps us organised as well,” said Marie West, Senior UX Design Manager at Poshmark. “We’ve been highly requesting this feature in XD, and we’re so excited to finally utilise it.” Check out the video below to see how you can now label your assets.

In this video, you’ll see the huge organisational benefit this small feature provides, allowing you to find what you’re looking for quickly, even when dealing with hundreds of artboards at a time.

New to XD: Third Party Workflow Integrations for Windows

The ability to bring your XD designs into popular prototyping and handoff tools has been one of the top requested features since XD began shipping last year. We delivered support for the Mac platform in January, and are excited to announce that XD now works with Zeplin, Avocode and Protopie on the Windows platform as well. Start your designs in XD, then bring them into your favourite tool to speed up developer handoffs and create advanced animations.

New to XD: Commenting on Design Specs

Design Specs now have the same great commenting feature as Prototypes. When developers comment on your designs, you’ll receive notifications by email and the Creative Cloud application, and any replies you make will be reflected when the developer refreshes his or her browser. If you’ve created Design Specs using earlier versions of Adobe XD you’ll want to republish using Adobe XD 10 or later to enable the commenting features. Watch the video below to see how commenting on Design Specs works.

In the video above, you’ll see the new commenting experience from both the designer and developer viewpoint. You can see how addressing questions and review comments is much speedier when you’re able to work within the design itself.

More new features: Paragraph spacing, image paste from clipboard, password masking, and simplified Chinese

There are even more productivity enhancements and improvements to Adobe XD this month, notably:

  • Paragraph spacing: You can now create visual distance between paragraphs by defining the space after each. Also, content created with paragraph spacing in Photoshop and Sketch will be preserved and fully editable in XD when opened.
  • Image paste from clipboard: In the past, adding images to native fill shapes in Adobe XD required multiple steps. Now you can simply complete the process by clicking the native fill object and selecting Edit > Paste Appearance. From there, you can resize and place the image within the shape by double-clicking on the image mask, a feature we delivered in the June release of Adobe XD.
  • Password masking: We now support the masking or unmasking of passwords as you create them. This gives you added security when controlling access to shared Prototypes, and now, Design Specs.
  • Simplified Chinese: Adobe XD now supports Simplified Chinese in addition to English, French, German, Japanese and Korean.

These productivity enhancements will help you work faster, smarter, and safer with Adobe XD. “Adobe consistently demonstrates its commitment to improving and refining the workflow of its programs,” said Sara Greene,  Art Director at Segal Savad. “In XD specifically, pasting an image directly into a shape from the clipboard is a perfect example of how users can increase their efficiency, especially when under tight deadlines.”

UX Community

We’d love to continue the dialogue! Help us shape the future of Adobe XD by submitting feature requests or file bugs at https://adobexd.uservoice.com. You can follow our handle @AdobeXD for updates or reach the team on Twitter using the #AdobeXD. You can also talk to us using Facebook, where we share videos and updates as well as answer questions during live sessions.Meet some UX designers who have used Adobe XD. Learn how they got started in UX design and their creative process; check out some of their work and listen to their favourite tunes.

#MadeWithAdobeXD

While sharing your prototypes on Behance, don’t forget to tag them with #MadeWithAdobeXD and select Adobe XD under “Tools Used” for the opportunity to be featured in the Adobe XD Newsletter.

UX/UI Design, Web Design

Join the discussion