As a UX designer, you know that user experience is everything. Most users are not conscious of the behind-the-scenes framework that the UX designer has established for their users. In fact, if they do not notice it, you have done your job.
From our users’ perspective, our work is hidden beneath an attractive UI put together by our friends – the user interface (UI) designers. This is a good thing, because they have all the training and skills needed to make our grayscale wireframes, and prototypes sing with colour and style!
Knowing that their skills can make our lives as UX designers more exciting and enrich the work we do every day. So let us take a look at how learning some of the skills and techniques mastered by UI designers can make you a more successful UX designer.
Adding Style to Your Work
Many UX designers create sitemaps, wireframes, and prototypes every day. If you take the time to learn some standard UI design techniques, you can apply those to your deliverables as a UX designer.
This is especially true for wireframing and prototyping, where you can explore some of the following visual design principles to make your work stand out:
- Responsive layouts and grid systems: UI designers use grid systems to correctly align their design elements, and make it easy to rescale them in a responsive environment where users could be looking at their work on many differently-sized devices. As a UX designer, learning about these grid systems and incorporating them into your wireframes is a great way to create a more visually-appealing deliverable. Also, handing off your work to designers becomes much more seamless because you are already working in their grid environment.
- Visual hierarchy: As UX designers, we are used to establishing information hierarchy through content positioning on the page. UI designers can take their designs to the next level by using visual hierarchy‘s to help guide users to the right places at the right time. Rather than just using position on the page, these techniques include font choice, font sizing, colours that draw the eye, and animation to catch the right amount of attention. Spend some time learning these techniques and incorporate them into your wireframes and prototypes for a subtle but significant improvement to the journey your users take through your project.
- Typography: Typography is not something that is usually on the minds of UX designers, who often just use Arial or Helvetica for pretty much everything they make (we are not judging you!). UI designers learn to use dozens or even hundreds of fonts to tell the right stories and send the right message to their users. Try experimenting with fonts in your UX designs, and see if you can make your deliverables more visually appealing and more effective at communicating their message!
- Color theory: While colour usually does not have much of a place in UX deliverables, thinking about colour theory and the emotional effects colours can have on users is always valuable to UX designers. You know your users, their needs, and their emotional connection to your site or app, so with a little colour theory research, you will be in a great position to recommend (or design with) colours with the best chance of making your project a success.
- Animation: UI designers create the animation that looks great, but it also serves a purpose. Animation can be an excellent tool for drawing the user’s attention to important pieces of an interface. UX designers who know the ins and outs of animation techniques can include recommendations for animations that best meet the needs of users in their projects as well!
As you can see, there are tons of opportunities for improving the quality of your UX deliverables through UI design. Thankfully, that is not the only benefit of a good knowledge of UI design.
Next, let us talk about how you can improve your workflow!
Better Workflow and Collaboration
As you know, UX designers do not work in a silo. To understand your workflow and the project as a whole, it is super important to expose yourself to adjacent technology. In our case, that means learning about UI design and a little development as well.
Since this article is focused on the UI design part of that equation, let us go over some of the big reasons why you should invest your time in at least a working knowledge of UI design as a UX professional:
- Responsive layouts and grid systems: Sound familiar? It is worth mentioning again – learning the grid system allows you to work in the world of the UI designer, and it will speed the transition and handoff of deliverables when that time comes.
- Speaking the Same Language: Any time you can add to your professional vocabulary, you should take advantage of it. Just as we UX designers have tons of terms and phrases localised to our profession (personas, wireframes, etc.), UI designers have a similar language. To better collaborate, get a working knowledge of their craft and vocabulary, so you know what obstacles they face for their part of the project cycle. To be a real team player, you may even be able to foresee some of their difficulties and prevent them with smart UX design!
- Software Syncing: Sketch is quickly taking over the world of UI design as the premium software package, and you will be surprised to see how valuable it can be for UXers as well. In addition to a basic knowledge of Photoshop, strive to add Sketch to your toolkit. Not only will this allow you to hand off wireframes in the UI designer’s native app, but it will let you pursue work outside of your traditional UX deliverables. More on that next!
Expand Your Freelance Horizon
Many tech professionals work in the freelance space or at least dabble now and then with additional projects. This includes a ton of UX designers, and many UI designers as well. If you have ever looked for freelance work as a UX designer, you will quickly learn that many potential employees are looking for magical UX/UI unicorns that are masters of both fields.
There are many reasons for this:
Together, the work of a UX and UI designer completes all of the initial phases of a project (pre-development), and so freelance employers often want to wrap that into a single contact (because they can, as you will see).
Many UX designers come from a UI design background because UX is still a young field. Rather than look for rarer UX-only work, these freelancers choose to take the hybrid work they can get more easily.
Many freelance employers just do not understand the difference between UI and UX, and that they are two substantially different skillsets.
While some of this is unfortunate, it is essential to adapt to the marketplace if you want the best chance at succeeding as a freelancer. For this reason, a solid understanding of UI is vital for freelancing UXers.
To have a great chance at landing and completing UI/UX work, consider working on the following for your professional toolset:
- Responsive layouts and the grid system
- Research common UI design patterns
- Research modern UI trends
- Typography
- Color theory
- Imagery trends and theory
- Software (Photoshop and Sketch are the best places to start)
There are a ton of resources all over the web that will help you learn some of these fundamental concepts, including right here at CareerFoundry. So what is next?
Want to learn more?
If you’re interested in the intersection between UX and UI Design, then consider to take the online course UI Design Patterns for Successful Software and alternatively Design Thinking: The Beginner’s Guide. If, on the other hand, you want to brush up on the basics of UX and Usability, you might take the online course on User Experience (or another design topic). Good luck on your learning journey!
(Lead image: Depositphotos – affiliate link)
