Brady Hale

Jul 29, 2020

3 min read

Improving XD Skills

Focusing on Function over Form

Having been thrust into the Ui/Ux program at my University after an unsavory experience with attempting to be an Animation and Game Design major, I knew almost nothing about Adobe XD. I can draw, I’ve done logo design, overlays for Live Streaming, Podcast production, and Video and Audio editing. I’ve worked countless hours with Adobe Photoshop and Illustrator and was now diving into Sketch. XD, however, was completely new to me.

This had been my real first experience with prototyping and to be honest, it went… ok.

We were tasked with the opportunity to work on designing a website for someone and me, selfishly, chose my podcast that my friend and I ran (at the time). We were focusing more on Function and making it work well, instead of making it the most beautiful website in the world, I needed to learn how to do this prototyping stuff.

What went wrong?

I’m a realist at heart. I hope for the best but often plan and expect the worst. So I like to start with the things that went wrong, first. Sue me.

Designing in Adobe XD

I did all of the art, design, layering, and text in Adobe XD exclusively. What an idiot I am. You think, having worked with Photoshop and Illustrator I would have realized sooner that this whole thing could have been avoided if I would have just designed the whole thing in Photoshop first and then move it over to XT and all the prototyping there. Just imagine using XT to layer everything perfectly and then having to move one thing a few pixels to the right… I spent more time trying to fix my mistakes than actually designing the site. Just imagine, layering everything together and not really being able to lock things into place. It was a nightmare.

Prototyping is Easy

What I ended up focusing on was not designing a full-fledged website, but making sure that I understood to link different artboards and understand the fundamentals. Turns out it was not the hardest part of getting everything organized. Adobe XD is super simple and straightforward. I still think that I like Invision more overall. It has some more functions that are a little more useful like being able to snap to a part on the page. There are some cool features that they are working with that could really bring XD a lot more interesting options for prototyping.

About 3/4th’s into the class when my professor asked me one day how my project was going, I told him the problem I had been having. He stared at me blankly. “Why don’t you just design it in Photoshop and move it over?” He said. I proceeded to redo everything. How did I not realize that was a possibility?

Brady Hale is a student in the Digital Media program at Utah Valley
University, Orem Utah, studying Interaction & Design. The following article relates to (Validation and Design Guide) in the (DGM 2250 Course) and representative of the skills learned.