UI Design
5 minute read

Adobe XD vs. Sketch – Which UX Tool Is Right for You?

With a decade of experience in UI/UX, Sérgio has worked in a wide range of industries such as education, enterprise, and entertainment.
Read the Spanishes version of this article translated by Yesica Danderfer

A UX designer needs many tools to complete the many stages of the UX workflow from research to design to prototype and handoff. If you do your work on a PC, you are probably haunted by the constant mention of Sketch, a popular, streamlined vector graphics editor with countless useful plugins that is quickly becoming an industry standard—but only available on Mac OS. This means that, unless you have an Apple machine, you are left out. But now Adobe is actively working on a proper cross-platform Sketch competitor (and lookalike?), after years of absence: Adobe XD.

Adobe XD User Interface

The Adobe XD user interface

Sketch User Interface

The Sketch user interface, which is clearly the main inspiration to Adobe in XD, as it tries to appeal to the same type of user

What Is Adobe XD?

Adobe Experience Design CC, or Adobe XD, is a lightweight vector graphics editor and prototyping tool that was announced at Adobe MAX 2015 as Project Comet. The software launched in preview in March 2016 as part of the Creative Cloud, and nowadays it is in beta phase, receiving updates almost every month.

Before that, Adobe was working on adding features for UX designers on their established tools like Photoshop and Illustrator. Although they are both great pieces of software, they are neither lightweight nor streamlined for this type of job. Over the years—and especially after the 2013 deprecation of Adobe Fireworks (the classic web-oriented prototyping tool acquired from Macromedia)—more and more UX designers felt that the Creative Cloud did not match market expectations. So, they jumped to Sketch (if they had a Mac). While Adobe’s response for this mass exodus was a bit late (Bohemian Coding launched Sketch a full 6 years ago) it is worth the wait, especially if you have been limited to using less adequate tools on your PC. Let’s compare Adobe XD vs Sketch

User Interface and Exclusive Features

When you open Adobe XD, the first impression you’ll have is that the interface is very familiar, both for Sketch users and long time Adobe fans. Adobe departed from the expected Creative Cloud darker buttons and menus, and choose to offer the best of two worlds. Unlike Sketch, you’ll see a set of tools on the left side of the screen, but also the taller layers panel and dynamic properties on the right, as seen on Sketch. It’s a breeze to use, and easy to learn, no matter what tool you used previously.

Repeat Grid

Adobe XD also has a set of unique features like the Repeat Grid, a tool that lets you replicate a group of objects like a Material Design card with variable data and configurable spacing between the copies.

Repeat Grid feature in Adobe XD

Creating groups of similar objects with Repeat Grid feature in Adobe XD

Prototyping

In XD, you can create an interactive prototype without needing third-party plugins as you would in Sketch. The Adobe prototyping editor allows designers to visually connect interactive areas to other screens using wires and setting up transitions. With the interactive prototype ready, you can publish and share the prototype, which can be viewed on the web or with the Adobe XD mobile app. XD prototypes, however, don’t have support for gestures or fixed sections like headers yet, something that is possible on InVision and other prototype-only tools that connect with Sketch.

Prototype feature in Adobe XD

Wiring buttons to screens in the Prototype feature in Adobe XD

Assets Panel

In the August 2017 update, Adobe added the Assets panel, a clever way to bring together an interactive style guide with colors, character styles, and symbols. When you change something in the Assets panel, every use of the asset in your artwork follows. Sketch also has color variables, character styles, and symbols, but each one contained in their own panel.

Adobe XD Assets Panel

Changing the elements in Assets panel changes the entire project.

Adobe announced some of the next features to appear on XD on the product blog. One of them extends the Assets feature, allowing the designer to publish the project’s style guide with downloadable fonts, assets, and the colors hexadecimal codes, alongside the interactive prototype and an inspection feature for developer’s survey of elements inside the prototype. This is called the “handoff for developers” and is already possible in Sketch (and Photoshop) using plugins like Zeplin. Another future feature being teased is the real-time collaboration inside XD, something that resembles the collaboration feature present on Google Docs and already available on other UX design tools like Figma.

Subscribe to the Toptal design blog and receive our eBook

Sketch (and its plugins) vs Adobe XD

Features Adobe XD Sketch
Vector graphics Yes (and includes Adobe Illustrator in CC subscription) Yes
Advanced image editing No (but includes Adobe Photoshop in CC subscription) No
Lightweight Yes Yes
Prototyping Yes No (but available with third-party plugins)
Assets export Yes Yes
Handoff with online style guide and inspector No (announced as a future feature) No (but available with third-party plugins)
Symbols and styles Yes Yes
Repeat grid Yes No
Document grid Yes Yes (with columns and more options)
Plugins No Yes
Collaboration No (announced as a future feature) No (but available with third-party plugins)
MacOS version Yes Yes
Windows version Yes (Windows 10 or above) No
Price and licensing Beta version is free, it requires to have an Adobe ID. Final pricing will be announced. USD $99 for a year of updates, but you can keep using after that without updates

When you see the bigger picture, it becomes clear that Adobe intends to make XD do not only everything that Sketch does as a vector graphics tool but also its plugins, covering the entire UX design workflow. From design to prototyping to handoff, Adobe XD will probably be the definitive UX designer tool, but what about today?

Is It Time to Switch?

Adobe XD is first and foremost for Windows users (who can’t use the macOS-only Sketch) and current Adobe Creative Cloud subscribers (who wouldn’t need to pay more for XD in addition to Photoshop, Illustrator, etc.).

There are many UX designers already making the jump, either because they are Creative Cloud subscribers even on macOS, or because they believe XD will be the next standard and are satisfied with the current feature set. If you are an experienced Sketch user, you’ll enjoy an overall better interface, unique XD features, but will also have to deal with the current limitations and lack of plugin support. In any case, give it a try and share your impressions with us!

• • •

Further reading on the Toptal Design Blog: