The Ultimate all-in one UX / UI Design Tool

2. What is Adobe XD?
Adobe XD is the ultimate all-in-one UX/UI design tool that allows you to build
prototypes for web and app design or even quick, fancy still wireframes. You can start
working with existing UI Kits or create your own from scratch and choose from
different screen sizes like desktop, tablet or mobile.
Forget Photoshop, here is the tool that gives you everything you need to design and
share your prototype among your partners and clients.

3. With a combination of Photoshop and Illustrator, Adobe XD recognizes all shapes as
vectors, giving you the ability to edit and even design shapes without having to run
Illustrator. You can work with masks, gradients and pretty much everything you would do
in Photoshop and Illustrator (except editing images).
Measuring, aligning, scaling according to Responsive Resize is so much easier with
Adobe XD. With add-ons, you can quickly browse and insert icons and photographs from
popular free-licensed photo libraries and that is really a time savior.
Whoa!

4. FEATURES
A big plus of Adobe XD is the
Repeat Grid feature, where you
design a pattern and then
repeat it as many times you
want.
You can repeat any
combination of texts, images
and elements and then edit
them separately.
Web-safe Character styles and
colors are all kept listed in
Assets so once you make a
change, for example when you
modify a color value it will be
updated in real time across all
instances in the document. This
is a great way to manage color
changes across multiple
artboards. Same thing happens
with the Character Styles.
Another great feature are the
Components. Once you define a
combination of the above or a
single thing as a Component, it
will keep updating in the whole
design each time you make a
change to the original
Component keeping all the
Artboards up to date.
Repeat Grid AssetsComponents
02 0301

5. The Grid
The Grid helps your design to be more controlled and correct.
You can set the number of columns, gutter widths and
margins. These are really useful when you’re aligning design
content or designing for different device sizes. You can easily
and quickly adjust them based on your needs.

6. Prototype
Mode
In the Prototype Mode you can create nice and smooth transitions
among artboards, realistic image and button hovers, dropdown
menus, pop ups, bringing your design even closer to final. By
selecting the way of the Trigger [Tap, Drag, Keys & Gamepad and
Voice], the type of Action [Transition, Auto-Animate, Overlay Scroll
to etc.] and the Destination you get various ways to browse through
Prototype.

7. You can export all assets in PNG, SVG, PDF or JPG
format and choose among Design, Web, iOS or
Android Format. Another feature is the selection of
the scale factor when talking about Web, iOS or
Android: You can export everything in 1x, 2x or 3x
resolution.
All of the above and many more features like “Fix
Position when scrolling” with which you create
“sticky” elements, helps everyone to understand the
feeling of your design and bring to life what you
have in mind.

8. Last but very important the
Share Section gives you
the possibilities below. You
can choose any one of the
five presets to create a
public or private link for an
XD document.

9. Design Review: This is for getting feedback on your
design and prototype, among your team or even clients.
They can leave comments and view hotspot hints and
navigation controls.
Development: This is for sharing your design specs
with developers so they can have information for
anything placed in the artboards like sizes, colors,
character styles etc. Comments, hotspot hints and
navigation controls are allowed.
Presentation: Optimize for presenting your design to
stakeholders in full screen mode. No comments allowed
here.
Sharing Options
User Testing: Invite your users to test
your design. No comments, no hotspot
hints and no navigation controls allowed
here.
Custom: Customize the viewing
experience of your design plus a Full
Screen Mode feature.

10. Thank you for
your time!