March 2019 Release of Adobe XD: Editable Vectors in Illustrator, Better Font Management, Improved Exporting, and More

Our March update of Adobe XD brings with it tons of productivity enhancements for your workflow. This includes a much-improved way of working with XD and Illustrator: now, bringing elements into Illustrator for precision vector edits is as simple as copy and pasting them into the app (and copying and pasting them back into XD when you’re done). There are also new improvements to exporting that should save you time, including a new easy-to-access Mark for Import checkbox and the ability to do this for multiple selections on the design canvas at once.

We’ve also made it easier to work with fonts. Now, when you bring in a design that’s missing any fonts included in the Adobe font library, they’ll be automatically loaded in the background; no more scrambling to find missing fonts. We’ve also given you more control over UI elements on prototypes for more effective usability testing, Jira server integration, the ability to view drag gestures in the browser, and an improvement to the direct selection tool that allows you to select multiple elements from different groups of objects — a major time saver for those complex user interface projects. Read on for details on these features and more in Adobe XD.

New to XD: Copy and paste editable vectors right into Illustrator

Designers who work in both Adobe XD and Illustrator are getting new functionality this month to help them manage complex vector content like a series of icons or logo designs. You will now be able to copy vectors in XD and paste them into Illustrator as fully editable vector content.

This easy copy-and-paste process allows you to quickly tweak the fine details of design elements. For example, as you’ll see in the video below, completing tasks like changing the line weight of an icon can now be done with almost no friction; all you have to do is simply copy the icon, paste it into Illustrator, make your edits, and then copy and paste it back into XD. No export workflow required.

This copy-and-paste workflow is possible because we now include SVG (scalable vector graphics) on the clipboard. SVG is native to many modern web browsers and is resolution independent; when you export this content from Adobe XD for your developer, you’ll be able to save these icons in SVG format.

Improved in XD: Easier than ever to mark elements for export

Speaking of the development process, the Adobe XD team has now made it easier to hand off your work for production. While you’ve always been able to manually mark individual elements for export in the layers panel, XD will now automatically mark for export all elements you import from Photoshop and Illustrator.

Another improvement to this process is the number of ways you can mark items for export in the application. In addition to the layers panel, you can also mark objects for export by way of the right menu on the design canvas, a keyboard shortcut, or directly in the Properties inspector as you’ll see in the video below.

Of course, if you’d like to mark or un-mark items for export in bulk, you can simply Select All on the design canvas, and click Mark for Export once to set that option for all of your elements. Clicking a second time will do the opposite — all elements will be unmarked for export. When you’re ready to hand off your design to your developer, all you have to do is select File > Export to download all the elements and Share > Share for Development to allow your developer to control the final file format and resolution information.

Improved in XD: Missing fonts will now load automatically

We know it’s important to have a streamlined workflow when it comes to font management, so we’ve made a few improvements in this release of Adobe XD to how you use typefaces. It’s now easier to both load fonts from the Adobe Fonts library and manage non-Adobe fonts right in XD.

In older versions of XD, it was a bit tricky to manage fonts in designs if you removed those same fonts from your Creative Cloud account, or when another designer shared an XD document with you that had fonts you had not loaded onto your own computer.

Now, when you open a document that contains fonts you don’t currently have installed in Creative Cloud, XD will automatically activate Adobe Fonts in the background, all without you having to close your document.

In the video above, you’ll see that a new Missing Fonts area has also been added to XD. The Assets panel now includes a Missing Fonts section for you to easily identify those missing fonts and either install them on your system, or replace them with ones you already have loaded.

Improved in XD: Selecting objects across groups for easy editing

When you build a comprehensive user interface with lots of elements in XD, grouping those elements together is a must-do to keep your objects neatly organized. But, when it comes to editing individual objects in a group, the process can be cumbersome. That’s why we’ve enhanced the direct selection tool to make selecting (and editing) content across groups easier.

Now, when you want to make specific changes to multiple elements and those elements are part of different groups, you can simply direct select by pressing Shift + Ctrl on a PC or Shift + Cmd on a Mac, and then clicking the elements you want to alter. You can edit any common attributes of the selected set in the Properties Inspector, duplicate content, and more.

This may seem like a subtle enhancement, but as your designs become more complex with more and more elements in different groups, it will be a serious time saver. No longer will you have to ungroup objects just to make changes to a specific element.

New in XD: Hide navigation controls for improved usability testing

We’ve also added the ability to hide the UI elements you expose to users during usability studies in the Prototype web interface. This gives you a more authentic web experience for your users, so you can truly test their abilities to easily navigate and discover aspects of your interface.

As you’ll see in the video below, you can now uncheck Show Navigation Controls when sharing a prototype for review. This hides the previous/next controls and the total artboard count that are usually visible in web prototypes.

It’s not a new feature, but remember that you also have the ability to uncheck Show Hotspot Hints, which means your user won’t get any clues as to where to click. Your user will be forced to interact with the interface just as if it was a live application — true usability testing without any crutches.

Also new to XD: Jira Software Server and Data Center integration, drag gestures in the web browser

Adobe XD integration with Jira Software streamlines collaboration between designers and developers with instant access to shared XD prototypes and design specs right in your Jira issue. Last September, we launched XD for Jira with support for Jira Software Cloud and today we are excited to add support for Jira Software Server and Jira Software Data Center, bringing these benefits to enterprise customers that need a custom solution with special data governance requirements. Learn more on our Atlassian marketplace listing page. Here’s how your Jira Admins can enable it.

Another great boost when viewing prototypes in your web browser comes this month as well: the ability to drag between artboards with a drag gesture transition.

XD plugin ecosystem: Innovating with AI to enhance UX

Our growing developer community continues to innovate with new plugins. This month, we’re featuring two plugins that use AI, providing new ways for designers to enhance experiences. Vempathy for XD lets you export prototypes to a self-service portal so you can select the number and profile of users and tasks you want them to perform. Hit submit and you’ve just initiated an off-the-shelf user test that records video of your participant interacting with your XD prototype and determines sentiment through video and audio analytics. Your test results drop back into your portal in 24 hours. A second plugin integrates XD with the new “this person does not exist” service so you can bring AI-generated avatars into your designs.

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.

#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.