Design ‘Appception.’ How Adobe’s Designers Are Using XD to Design XD
When it comes to creating apps iteratively, nothing beats being able to design new features, tweak existing ones, and be able to test them out right away, not to mention share those designs with stakeholders easily. That sums up the core tenets of Adobe XD, an all-in-one UX/UI tool.
For Adobe XD’s design team, switching between multiple tools to create the app was getting frustrating. The team decided to take the plunge, and they began using Adobe XD to design Adobe XD.
Early Days, Early Innovations and Challenges
As he was designing Adobe XD, Lead Product Designer Talin Wadsworth turned to his own app and quickly realized, even in its rudimentary phases, Adobe XD allowed him to quickly iterate and share design ideas with his team.
“We were trying to create an experience that felt real, that people could really get excited about. Rather than having to create static comps and then waiting for those to be prototyped by an engineer, we were able to have something that you can wrap your head around what the experience should be, sooner,” he said.
That also came with unique challenges, especially in the beginning. Simple features, like text tools and styling options that are so commonplace in Adobe’s software tools, simply weren’t there yet.
“All those things you take for granted were just missing in those early days. But even with the challenges of missing some of those basics, those first prototypes really showed how much value there was,” Wadsworth said. In Fall 2015, before the design team launched Adobe XD’s beta, Wadsworth began using his own tool to design it full-time. His team member followed suit, laying the tracks for the many iterations of the app that followed.
The Adobe XD Design Process
Wadsworth gradually introduced his team to a new workflow: use Adobe XD to iterate on Adobe XD’s current build. It was a natural transition for Senior Experience Designer Larz Hsu. He and the design team start almost every morning working with Adobe XD features from the latest master branch on Git.
When they’re building new features, XD’s designers take the elements they need from the master design file, which has all the super components and patterns, and begin iterating. The team has a dedicated Slack workspace for Adobe XD feedback.
“Because it feels effortless, we would often tweak our designs during design reviews based on the feedback we’re getting in real time. Because we use it every day, we know what works and what doesn’t,” he said.
For Adobe Principal Designer Khoi Vinh, watching the team easily collaborate on a daily basis, using the app’s features, has been incredible, and he feels, ultimately, users will benefit from their design process.
“There’s probably not more than a few dozen designers ever who got to work on the tool that they use every single day. That’s a special opportunity and also a big responsibility because in some ways it determines how many, many more designers will spend their workdays. The team took that incredibly seriously from the beginning — and they still do,” he said.
The Challenge of Working in Multiple Builds at Once
The one downside of using Adobe XD to design new features in Adobe XD is that many of the designers are working in multiple builds of the app at the same time. Talin Wadsworth has several Adobe XD icons sitting in the dock of his computer, and it’s not uncommon to see him running three or four builds of the app simultaneously, with different features and capabilities.
“Often times we’ll have Adobe XD open and we’ll have the file that has the UI for XD open that we’re working on for some new feature. Then we’ll be previewing the prototype of the UI of the design file of the app,” he said.
“It’s very inception-like. You start to wonder what’s the real toolbar, what’s the real UI.”
Wadsworth feels that confusion was a small price to pay for how easy the app has made iteration. He said it’s easy to “just keep going” with your designs, thanks to time saved with early testing and feedback-gathering.
Design Insights from The Adobe XD Process
Working this way allowed the Adobe XD team to mimic the experiences of their designer users, who are looking to work as quickly and efficiently as possible. Talin Wadsworth said two key points emerged from this process; principles that every app designer should keep in mind to create the best possible experiences for their users:
- Reduce overhead whenever possible. Designers simply want to get work done, producing the highest-quality work with the lowest amount of friction. The overhead of learning a new experience can be very daunting, so keeping solutions simple, easy-to-learn, and like Adobe XD, all in one app is very important to deliver an effective creative tool.
- Don’t focus on ‘how.’ Focus on the ‘why’. The Adobe XD team is showing no signs of slowing down. As XD’s feature list grows, so do the ways its designers can iterate and expand on the tool’s early success. “I always feel like the best designs come out on top. It’s only through hard work that you can get there. Adhering to your principles can give you that strength to get through those challenges,” said Wadsworth.
“Looking back on it, I feel very proud that we’ve been able to launch XD at Adobe, using the app itself, and I feel very proud of this team.”
Learn about Adobe XD, our all-in-one design and prototyping tool:
- Download Adobe XD
- Adobe XD Twitter account — also use #adobexd to talk to the team!
- Adobe XD UserVoice ideas database
- Adobe XD forum
Originally published at theblog.adobe.com on February 16, 2018.
