April 22, 2019 Adobe XD Making Strides

For many years in the history of design, the main tool of use for designers was Adobe Photoshop. In addition to it, Adobe Illustrator was also used for vector designs such as icons, logos and illustrations. Back then, getting the license for one of these programs was more than a thousand dollars and many applications were focusing on web design, with mobile applications raising up very fast.  In time, Adobe moved to the cloud subscription approach in 2013.

It was about 4 years ago when we saw the rise of Sketch, which was planned completely for user interfaces design. Sketch is very light when installed (45 MB vs 2.17 GB of Photoshop) and produces small source files as well. Besides that it has the ability to use symbols and override the instances, define font styles, and uses libraries to keep consistency across the projects. There is no need to mention the amount of plugins that are out there which make it very powerful and efficient. This made many people adopt it. The only minus that Sketch has is that is available for Mac users only. A Windows user would not be able to work on it, without finding a workaround (such as installing a Virtual Machine). The license for Sketch was only $99.

Don’t be worried! Starting 2017 we had a new kid in town: Adobe XD, which shows it didn’t take much time for the powerful Adobe to make something for the multitude of users switching from Photoshop to Sketch. XD is a vector program, just like Sketch, but it’s available for both Windows and Mac users. In the beginning, XD had a simple and minimalist interface but it lacked many features and that made working with it difficult. Not anymore! The Adobe team releases monthly updates that make XD a good competitor for Sketch. Not to mention that Adobe XD is free! We don’t know for how much time, but it’s definitely a great tool for designing user interfaces.

Here are the most important updates Adobe released this year:

In January 2019, Adobe launch the Auto-Animated feature for web browsers as well in addition to mobile, so micro-interactions could now be shared more easily with stakeholders or customers.

Did you know XD has voice interface for all the languages they support? English, French, Korean, Japanese, Spanish, Brazilian and Portuguese. Yes, your interface can be animated and text can be read now as well.

Considering that Adobe has so many products, the team worked on improving the workflow between Adobe XD, Adobe Photoshop, and Adobe Illustrator. This way, they added an option so when the user imports a file from AI or PS in XD, that file will be open in the current document, rather than a separate one. Even smart objects can be imported and they will show as expanded layers instead of flattened bitmaps, while adjustments layers will be kept as separate flattened effects over the original image. That means more control for adjustments in XD!

Audio explanations for your prototype

Sometimes as designers, we add notes to explain to customers our thoughts behind the design and how we updated the design from round 1. With XD’s new feature of Audio recording, this issue can be easily solved – just record your walkthrough and share the recording then.

Sketch is known for its powerful plugins, but now XD comes strong from behind. With more than 100 plugins, working in XD and automating tasks becomes more easy. Check here to see a list of the most important ones.

In March, the Adobe team made the “communication” between Illustrator and XD even more seamless: now you can design your icons or any other vector in AI and copy-paste in XD just as easy as designing vector items in XD and pasting them in AI.In addition to that, we know how important exporting assets is for the developers, so marking elements for export has become easier: besides layers panel, the designer can mark an element for export by selecting it directly and using right menu options or shortcut; Shit+CMD/Ctrl + E. In case you want to export multiple elements, you can just select them and use the right panel checkbox “Mark for Export”.

Missing fonts is no longer a problem. The hassle to search for a missing font, install it and then update the current one is pretty much gone! When a font is not found, XD will activate behind the scenes the Adobe Fonts without you having to re-open the document. For the fonts that are not found on Adobe Fonts, you have the option to highlight them in the artboard and replace them from the layers panel with another ones.

Selecting objects inside a group without having to ungroup them is always useful. XD has made that possible now by using the keys: Shift + Ctrl for PC or Shift + Cmd on a Mac.

Early this month, Adobe released the Language Switcher option which allows you to set up the language in which you want to use XD from the following: English, French, Korean, Japanese, Spanish, Brazilian and Portuguese, regardless of the language your operating system is in.

All in all, Adobe XD did a great job in improving their applications. Feel free to give it a try and if you have any questions, we can talk about it on our #gen_xd Slack channel.