3D in XD

Image of laptop on table with XD screen

Using 3D in XD allows you to mimic depth and perspective by using object rotation along vertical and horizontal axes.

With the object selected, begin by enabling 3d effects on right. To move on the X or Y axis click and drag the gizmo  icon that appears at the center of the object. To move on the Z axis use center point of the gizmo icon. The anchor icon appears and you can move the selected object up and down.

The 3D Transforms icon only shows or hides the controls and the gizmo. 

When designing a group of cards, in perspective, each card rotates at the same angle, but with different depth. If you multi-select those cards and choose to resize them, they will resize as needed. However, the Z value changes for each card and results in content reordering.

When you change the Z depth value for any object, XD does not support layer ordering methods such as Bring to Front, Send to Back, and reordering from Layers pane.

Combine these 3D effects  with autoanimate for a cool look. 

Table of Contents:
00:33 – Select object
00:39 – Click 3D icon
00:50 – Different axis rotations
01:28 – Tips for multiple 3D objects
01:46 – Undoing 3D
02:14 – Prototyping