Making the leap from UX designer to UX/UI designer

Today’s UX designers are facing a problem. More and more of them are finding that employers expect them to have not only UX expertise but also UI design skills.

It’s for this reason that InVision collaborated with us at CareerFoundry on a specialized UI for UX Designers course. The demand is there, and it’s growing every day.

Take one look at any of the recent UX designer job ads being posted in popular job sites such as LinkedIn, Monster, and Indeed. In a recent study, we found that 66% of those ads request UI skills.

Related: 5 ways to upgrade your UI design portfolio

And these aren’t just at small companies, either. Even many big-name institutions are starting to favor designers with both UX and UI under their belts. In fact, 20% of UX designer job ads put the “UI designer” part right in the title, specifically searching for that coveted “UI/UX designer” combo.

While the reasons for this rise in demand run many and varied, there’s one thing for sure: having a workable knowledge of both these design specializations gives designers an undeniable edge when it comes to landing a job.

Which is why, in this article, we’ll be looking at how you can change your mindset from that of a dedicated UX designer to a UX designer with skills in UI.

Where does UX end and UI begin?

As you (no doubt) already know, UX design involves identifying a pain point or user need, then drawing up and validating a prototype through user testing. Once both the value proposition and user needs have been validated, the product is built.

It isn’t until after all of this (usually) that the UI designer comes in.

A UI designer works with the initial prototypes set up by the UX designer to include visual elements that make the product beautiful and memorable.

According to designer Nick Babich:

“The best products do 2 things well: features and details. Features are what draw people to your product. Details are what keep them there.”

UX designer vs UI designer: Skills and responsibilities

While UX and UI designers have clearly distinct roles, they both need information from each other to accomplish their tasks. For example, the UI designer needs the customer research and prototypes from the UX designer. And, the UX designer needs to understand the design limitations from the UI designer before creating those prototypes.

Here’s a closer look at the key responsibilities for UX and UI designers:

UX designer key responsibilities:

• Customer and competitor analysis
• User research
• Information architect
• Prototyping and wireframing (using a tool like InVision Studio, for example)
• Testing and iterating
• Coordinating with developers and UI designers

UI designer key responsibilities:

• Branding
• Visual design
• Color, typography, and layouts
• Design research
• Interactivity and animation
• UI prototyping
• Implementation with developers

What kind of skills does each designer need? There are definitely some shared skills that both UX and UI designer need, including collaboration, user empathy, curiosity, communication skills, and visual communication skills.

And, of course, there are skills that are unique to each role. UX designers typically have experience with organizing and executing research, wireframing, prototyping, information architecture, interaction design, coding, and analytics.

UI designers usually have experience with responsive visual interface design, layouts and grid systems, visual hierarchy, typography, color theory, animation, accessibility, and A/B testing.

How can you become a UX/UI designer?

A great first step is to sign up for a course that’ll cover the basics of good UI design and give you a chance to train and hone your skills. A remote program with a flexible schedule is helpful, especially as you’ll likely be trying to fit this in amongst your full-time job or freelance work. You need time to really study the course materials and adjust yourself to any potentially new software.

But the most important piece?

A dedicated mentor. Sure, you could go about it yourself, but who’s going to tell you whether you’re on the right track? Who’s going to direct you to try out new trends, concepts, or ideas and train your eyes to pick out which ones work best? And who’s going to act as your personal cheerleader when you’re going through your third “I can’t look at another icon!” tantrum?

Students taking a course with a mentor are not only more likely to stick it out through their entire course, but achieve success when they’re done, to boot. CareerFoundry’s UI for UX Designers with InVision course comes with just this sort of mentor—someone who can help you not only apply the course materials to your own work, but ensure you truly excel at what you’re doing.

Of course some might be thinking, “are UX and UI really so different?” Perhaps they’re even thinking all they need to learn is how to make an icon and they’ll be golden. But there’s so much more to these 2 fields than a little bit of color theory.

Let’s take a look at where UX and UI differ so we can better understand their roles in the world of design.

UX: Makes interfaces useful
UI: Makes interfaces beautiful

A useful product meets a need that’s not already being met in the market. The research process of a UX designer involves doing a competitive analysis, developing personas, and then developing a minimum viable product—or more apropos, a minimum valuable product; a product that will be valuable to your targeted customer niche. This is validated through testing during the life-cycle of the product.

Once the user flows and wireframes are prototyped and tested, it’s the UI designer’s role to make them aesthetically pleasing. This includes choosing a color scheme and typography that will be both attractive and simple to use.

However, color choices, typography, and interactions aren’t based on the designer’s personal preference, but rather on clearly articulated reasons specific to the personas developed by the UX designers. With these, UI designers implement a visual hierarchy that will serve as a guide to users, letting them know what to do and when to do it in order to meet their objectives.

A well-designed hierarchy will highlight one main objective per page, making it clear to the user where they are on the site and what they can accomplish at any given moment. To achieve hierarchy, you can apply conventions or patterns that users are already familiar with. These patterns will act as clues to the user as to how to get to where they’re going.

UX: Helps users accomplish goals
UI: Makes emotional connections

People come to your site to do stuff, whether it’s researching the best kind of doggie companion for small apartment living or paying their taxes (ouch!). While the former may be more fun, in both cases, people come to your site with a goal in mind.

The UX side of things might look at people like dog lovers and try to figure out what’s important to them. What is it that they value or need when looking for assistance in choosing their next furry friend? They ask questions, they observe and interview people, they may even make prototypes and do a bit of guerrilla testing to see if they can validate their business and product value propositions.

Once you have the basic functions down pat, according to Aarron Walter, author of Designing for Emotion, it’s really the personality of your interface that will elicit loyalty in your users. People may be drawn to your site because of its striking design. They may stick around if it allows them to accomplish their goals.

…but once they make a personal connection, they’re hooked.

Does your interface make them laugh? Does it “get” them? Is it cheeky?

Walter says, “People will forgive your shortcomings, follow your lead, and sing your praises if you reward them with positive emotion.” That’s where the expertise of the UI designer comes in.

UX: Done first
UI: Done second… (sometimes)

Within the process of design, how do UX and UI designers work together?

Normally, UX design and research is the first step when deciding whether to build a product or application. UX designers handle much of the research that will validate or invalidate initial product ideas and guide the development of the product.

Once the prototype has gone through several iterations and is largely finalized (for now), the UI designer steps in and begins to work on the visual design and micro-interactions.

However, this may not always be a linear path. It depends on many factors. For example:

• Who handles the UX and UI?
• Is it the same person or a different person or team?

UX: Employed across products, interfaces, and services
UI: Only pertains to interfaces

User experience design is a broad field and it’s becoming more popular by the day. Now, many companies that develop products or provide services are catching on to the value of understanding their users and validating their hypotheses before they build—not just companies with a web presence.

User interface design is, well, only for user interfaces. This doesn’t mean, however, that it’s limited to the graphical user interfaces of computers, tablets, and mobile devices. We’re also seeing interfaces on many other products these days, everything from watches, washing machines, and car dashboards to vending machines, ticket kiosks, and more.

I recently read about an application on the iPhone that unlocks your car door. It turns out that this set of interactions takes many more steps than simply using your key to unlock the car door. Whether designing for interfaces or experiences, we should take care to (once again) keep our users at the heart of our design process.

Now that you know a few of the differences between UX and UI, you should have a better idea as to how you can specialize in both. If you’re a UX designer who wants to know more about UI, discover our UI for UX Designers specialization course in collaboration with InVision.

If you’re an aspiring UI or UX designer, don’t forget to check out CareerFoundry’s UX Design Course and UI Design Course.