Feature summary | Adobe XD | 2019 releases

The November 2019 release of XD has the following enhancements: 

• Realtime collaboration with Coediting (Beta)
• Add interactive elements with component states
• Manage design revisions with Document History
• Create high-fidelity prototypes using multiple interactions
  
• Access plugins from the redesigned Plugin Manager
  
• Share and collaborate with the redesigned Share experience
  
• Share assets with enhanced Creative Cloud Libraries integration 
  
• Convert Sketch libraries into linked assets
  

Coediting (Beta) lets you collaborate in realtime with other designers, speeding up your workflow and eliminating duplicate or conflicting work. You can see avatars of other users editing the same document, and edits are broadcast to all in realtime.

With Coediting, your design teams can work faster and maintain a single source of truth for an entire design project.

Beta features are new features available for XD users to try and provide feedback on while we make these features ready for use. Beta features might have some quality and performance issues.

For more information, see Collaborate and coedit designs.

You can now use Component states to design variations for different user interactions. For example, you can design a button component and then create different states such as hovering and pressing a button. 

No more creating and wiring multiple artboards to showcase complex interactions! 

When you have a component with states, you can now use Hover trigger in Prototype mode to specify a hover effect when you place a cursor over a particular design element.

Go ahead and bring new levels of interactivity to your prototypes!

You can now use Document History to browse through a history of saves as you worked on a cloud document. Sometimes, you may also want to revert to a previous version and restore last changes to your XD document. 

To revert to a previous version, open a version of the document from Document history, copy, and paste the content to your current version. 

Go ahead and work collaboratively with your designers and view the evolution of your documents over time!

For more information, see Manage design revisions.

Now, in Prototype mode, you can specify multiple interactions for a single design element or an object.

Go ahead and drag multiple wires from a single element and add interactions for different triggers, such as Tap or Drag without duplicating objects or artboards.

No more scattered interactions! 

For more information, see Create interactive prototypes | Overview.

The redesigned Plugin Manager lets you browse, discover, and install plugins for XD.  Browse through different categories and collections of plugins, search for specific plugins or terms, and view rich profile listings for each plugin, descriptions, language support and more!

For more information, see Plugins in XD.

The new Share mode consolidates different sharing capabilities into a centralized location and helps you share your designs and collaborate with fellow designers with ease. Combined with the built-in scenario based presets such as Design Review and Development, you have full control over shared links in how you manage or update them.

Read on to learn more about the benefits of new redesigned Share mode.

• Manage multiple published links: View all the published links from the URL picker. Go ahead and modify the links or even update your existing design links with ease!
• Presets to choose while publishing: Access handy scenario based presets, such as Design Review, Development, Presentation, User Testing, and Custom from the View Settings menu. You no longer have to select multiple options or check boxes to create your design links! XD does it all in one go!
  
• Retain the same URL for multiple presets and iterations:  Create a one-time URL and iterate or switch your presets many times! 
• Easy identification of artboards: Visually identify the highlighted artboards to be published from the design canvas. No more missing wires or screens in your published links!

For more information, see Share designs and prototypes.

You can now access and browse Creative Cloud Libraries, add assets such as components, graphics, colors, gradients, and character styles from XD to Creative Cloud Libraries and consume them directly from within XD – and use them directly in XD projects.

You can also add XD assets to CC Libraries and use them in other Creative Cloud apps.

Connect creative teams across your organization with shared assets such as brand colors, graphics, logos, and more!

For more information, see Creative Cloud Libraries for XD. 

When working on your design systems, you can now import and reuse any of your Sketch assets without recreating them.

Not only are your Sketch symbols and elements converted into XD components, you can also use them as linked assets.

For more information, see Convert Sketch libraries.

The October 2019 release of XD has the following enhancements: 

• Blend effects
  
• Nudge and nudge resize
• Select through overlapping layers

From XD 23.0, you can apply non-destructive blend effects to style your images or graphic assets.

Use blend effects to transform your designs by varying how the colors of objects blend with the colors of its underlying objects, and watch your designs come alive!

For more information on applying blend effects, see Apply blend effects.

From XD 23.0, you can combine these keyboard shortcuts with the arrow keys to precisely control the position and size of the UI elements in grid size increments.

• Shift + Arrows: moves the selection in 10px increments.
• Cmd + Arrows: resizes selection in 1px increments (element is pinned in upper-left corner).
• Cmd + Shift + Arrows (Mac) and Alt +Shift +Arrows (Win): resizes selection in 10px increments (element is pinned in upper-left corner).

When a square grid is enabled:

• Shift + Arrows: moves the selection to snap to the grid first and then moves it in grid size increments.
  
• Cmd + Shift + Arrows (Mac) and Alt +Shift +Arrows (Win): resizes the selection to snap to the grid and then resizes the selection in grid size increments (element is pinned in upper-left corner).

Design mode

XD 23.0 extends the behavior of the keyboard shortcut Cmd+Click or Ctrl+Click to drill down into the Z-order of objects on design canvas as well as design specs. Having reached the desired layer, you can use the keyboard to nudge it, or right-click to bring up the corresponding contextual menu.

If there are several layers stacked above each other, Cmd+Click or Ctrl+Click selects the next object below the selected layer. On reaching the last layer below, use the same keyboard shortcut to traverse back to the topmost layer. 

Design specs

To view and inspect layers hidden below an overlapping layer in design specs, hover and right-click over the specific area on the artboard. This displays the list of layers and its contextual details at that pixel point. You can also use Cmd+click to sequentially drill down and view the layer properties.

For more information on accessing overlapping layers, see Resize and rotate objects.

The August 2019 release of XD has the following enhancements: 

• Edit in Photoshop
• Improved plugins panel
• CSS snippets in design specs
• Improvements in component bounds 
• Reduction of fractional pixels
• Toggle between grid view and flow view

XD enhances its integration with Adobe Photoshop by allowing you to open and edit XD images directly in Photoshop and update them in real time. As you edit and save the images in Photoshop, XD saves the flattened file, and places the bitmap in XD instead of the edited file. 

For more information, see Working with external assets

The latest release of XD lets you launch and interact with XD plugins from right within XD user experience, alongside the design canvas. Like the Layers and Assets panel, the new Plugins panel provides easy access to view and modify plugins from within XD. This helps you to maintain the creative flow while working on your XD designs. 

For more information, see View and install plugins.

To aid translating designs into a functional website, you can copy the CSS code snippets from design specs and paste it into your code.

The CSS code is automatically generated when you select Web as an output destination in the Share for Development window when publishing design specs. When you publish your design specs, XD automatically shows the CSS code snippet for the selected layer. 

For more information, see Inspect design specs in XD.

Components support a variety of overrides, and resize seamlessly for various screen sizes, but can be difficult to use when applying effects or reorganizing objects. In previous XD versions, the content was clipped if you added an object outside the bounds of their original master component.

To fix issues with component bounds, select the master component, right-click to select Fit Bounds to Content. The component bounds are adjusted to show all the clipped objects in the master components as well as the instances.

If you create new components:

• Shadows and blurs are rendered outside the component bounding box, and
  
• Bound area fits all the content within the component.

When designing for HiDPI screens, fractional pixels cause distorted content. From XD 22.0, to eliminate design friction and image distortion, XD rounds the pixel values when resizing groups of objects, components, and image masks. However, XD preserves the fractional values of content created before XD 22.0.  

To get a holistic view of your design flow with artboard layout information, click the name of the prototype or design specs at the top-left corner of your screen. From the default Grid view, you can also choose to toggle between Grid and Flow views to display the following:

• The Grid view displays all the artboards laid out in a grid format that you can inspect or navigate through to an artboard.
• The Flow view lays out the artboard to represent the design and layout hierarchy.

For more information, see Navigate design specs in XD.