Adobe XD (UI-UX Made Easy)

Adobe XD (UI/UX Made Easy)

UI/UX Tool History

In the past, majority of designers used photoshop to design user interfaces. A tool that has unneeded features and geared toward photography rather than design(inter word “photo” in Photoshop). In 2012 Bohemian Coding released a game changing app call Sketch.app, a lightweight rapid development UI/UX tool. The only downfall of Sketch is that it is not cross platform. For some agencies that use both Mac and Windows machines, this created a big issue. So where was Adobe when sketch was dominating this space?

Project Comet

Adobe announced XD at the Adobe MAX conference in 2015 under the code name project comet. It was not until December 2016 that Adobe release the XD beta and in October 2017 Adobe announced that XD was out of beta. It may have taken Adobe some time to release a UI/UX tool, but when they did it was a home run.

Interface

When you first open Adobe XD,the UI looks much like Sketch(minus dark mode, which I miss). Unlike Sketch, Adobe XD stays with the traditional left sided toolbar. This is the most minimal interface Adobe has ever designed. As a mater of fact I was not sure that Adobe would ever create UI that was not over loaded with needed features. But to my surprise they did an outstanding job with making the Adobe XD interface not only minimal but also intuitive.

Repeat Grid

Probably one of the most handy features of Adobe XD is the repeat grid feature. Repeat Grid is a tool that lets you replicate a group of objects like a Material Design card with variable data and configurable spacing between the copies.

Prototyping

With out a doubt my favorite feature of Adobe XD. 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. Which opens up collaborative opportunities.

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. For a web designer this is ultimately useful during the early stages of the design process.

Collaborative Features

According to Adobe “One of the core motivations for creating Adobe XD was to enable designers to design at the speed of thought”. Not only did they make it easy for teams to collaborate on a project, but they also made it easy to share design specs and style guides with stakeholders.

Final Take Aways

I think that Adobe XD today is the most powerful and feature rich UX/UI wire-framing, mockup and prototyping tool on the market. I also feel that in the future Adobe XD will be the UX standard and and also the UI standard. It’s core strengths plus the fact it is cross platform makes it a delicious choice for most digital agencies. Our agency, The Digital Laboratory was once an all Sketch firm. We have recently switched to Adobe XD, of course there is a learning curve but so far we do not regret the switch at all.