The June 2018 Adobe XD update improves the tool’s prototyping capabilities by adding fixed-position elements and overlay support, among other enhancements.
Just last month, Adobe put their UX design and prototyping tool—Adobe XD—on a promising path of improvement while simultaneously making the tool free to use for everyone.
This month’s update—available as of June 19—fulfills a bit of that promise with a handful of improvements, large and small.
Two long-awaited features
The June Adobe XD update brings two features that move the tool’s prototyping capabilities closer to those of its advanced peers.
These features are: overlays and fixed elements.
[Adobe video on Fixed Element and Overlay features on Youtube]
Fixed elements
This feature allows you to mark elements that should remain fixed to their position on the artboard, regardless of scrolling.
This means that you can now have a fixed header, bottom navigation, etc. that acts properly in prototype mode for your scrollable screens.
Unless, of course, you also wanted those elements to animate on scroll. XD still can’t do that.
Overlay support
With overlay support, artboards can now be displayed on top of other artboards.
This is most straightforwardly useful for pieces of UI that temporarily appear “on top” of other content on a screen. For example: you can configure your prototype such that when the user taps a button, a small modal dialog appears in the middle of the screen.
XD designers could also, for example, display a mobile keyboard over the current screen of an interactive prototype, without having to fake the effect by transitioning from one copy of the screen to another copy of the same screen with a mobile keyboard pasted on it. In addition, as an overlay the mobile keyboard can now be more realistically animated in the prototype—it could slide up from the bottom of the screen, for example—because the underlying screen doesn’t move in the transition.
In addition, support for overlays allows for more flexibility in your prototype and more economy of artboards in your project file. For example, an XD project could include a single drop-down menu artboard that can be used by any number of other screens. Before overlay support, a designer would have to make a dedicated copy of any and every screen she wants to support displaying the drop-down menu.
Other improvements in the latest Adobe XD update
Private sharing (BETA)
About private sharing, Dani Beaumont of Adobe writes:
You are now able to create a new private link for your prototypes and invite someone to view it by email. You can include a message, and once they’ve received your email, they will be able to view and comment on your design.
Adobe provides a video of private sharing in action.
Ability to adjust an image after dropping it into a shape
Adobe refers to this as “improved crop and place image fills.” You can now resize and reposition a masked image you dropped into a shape. (Video link)
This beats the previous process of dropping an image into a shape, not liking the result, cropping/scaling the image in an external application, and then trying again.
Improved Photoshop and Sketch image fill support
Related to the previously mentioned improvement, adjustments to image-filled shapes from Photoshop and Sketch are now preserved when importing files into Adobe XD.
Also:
- Support for Typekit fonts on mobile
- Math calculations in property fields
About the math calculations, the update announcement on the Adobe blog provides some examples: “For math calculations in property fields, you can reduce grouped objects by 80 percent, quickly dividing an artboard area for tile design, or moving an object in an X or Y location by a specific number of pixels.”
Learn about how BetaTesting can help your company launch better products with our beta testing platform and huge community of global testers.
BetaTesting Blog 