The Difference Between UX & UI Design - and Why Both are Important

28.07.21 12:07 AM By Gabriel

UX and UI design: while some of us won’t know what either is, some may have a vague idea of what they are and use the terms interchangeably. But there’s no need for confusion! In this blog post, we'll unravel the tangle and help you to clearly differentiate between the two. In the process of looking at the differences between UX and UI design, we’ll be looking at what each of these areas of expertise strives to achieve, and you’ll be able to see why both of them are important. Let’s get started!

What is UX Design?    

If you’re trying to think of words beginning with “X,” relax. UX stands for “User Experience.” Yes, it’s an awful non-acronym, but it does stand for something we should all consider when developing things like websites and products. UX is actually a very broad field. According to the person who coined the term, Don Norman of the Nielsen Norman Group Design Consultancy, it embraces all aspects of a user’s interaction with a company, its services, and its products. That’s quite a mouthful!

Despite the original intent with which the term was coined, however, UX is usually used to refer to user experience in the digital context. However, you wouldn’t be wrong if you referred to UX in just about any context, be it switching on the oven or driving a car. Confused? Let’s take a closer look at what UX design actually does.

In a nutshell, UX design is all about making things easy and pleasant for end-users. How do the actions they must perform in order to achieve a result make them feel? Was it pleasant? Frustrating? The UX designer’s job is to evaluate these actions and redesign them so that they’re straightforward and rewarding.

From a theoretical standpoint, UX is a cognitive science rather than a digital one. It’s about improving the experience of users in any context whatsoever, but generally speaking, the term is used in digital contexts. It’s not the type of design that’s there to create good looking results (that’s a graphic designer’s job), but it is about creating an experience that feels good.

What is UI Design?    

Let’s begin with that acronym. It stands for “User Interface” and just knowing that will already give you a clearer idea of the differences between UX and UI design. It’s certainly a fine distinction. So much so, that the two are often lumped together and are given overlapping definitions. But while User Experience covers an incredibly broad range of possibilities, and isn’t necessarily related to the digital world, User Interfaces are exclusively digital and refer to the ways in which we interact with a digital product. 

To clarify this a little further, you can use a UI and still have a rotten UX. Just because there’s an interface doesn’t mean that it’s easy to use or that a user will be a happy camper after using it. UI design strives to create a better UX through the design of interfaces that are simple and user-friendly. So, it could be said that UI design contributes to UX while not being UX design in itself. Even more simply put, UI design refers to the design of the controls that users interact with. UX is what comes as a result of using that control panel, touchscreen or navigation button.

Need an example? Let’s consider a vending machine. You choose a soft drink using the UI. The ease with which you’re able to perform this action is related to the UI design and contributes to the UX. Whether that vending machine then proceeds to deliver the soft drink you wanted, accepts your money and gives you the correct change, and whether your soft drink is cool enough for enjoyment, contributes to the UX but has nothing to do with the UI.

So while a UX designer must take all these factors into account, a UI designer will focus on the interface itself: its location, its iconography, the specific button you push, and even the look and feel of that control. Of course, this is a very simplistic explanation, and a UI designer would usually work on more complex things than a simple vending machine button!

UI designers work on ways to guide users through an interface or series of interfaces in order to reach a desired goal. Although the processes activated by controls can be incredibly complex, they shouldn’t seem that way to the user. The controls should be understandable at a glance and setting a process in motion should be a straightforward matter. In addition, UI designers must consider design elements that will reinforce a product's brand identity while it's being used.

Because “Related” Doesn’t Mean “The Same As”    

 Now that we’ve looked at an introduction to user experience designand have covered user interface design basics, we may take the next step and see that they are very closely related. After all, you can’t have a great user experience with a digital product if the user interface is difficult to use. 

At the same time, user interface design is very specialised and focuses primarily on the controls, while user experience takes a more holistic look at the overall results that come from using a product. That means it’s possible to be a UX designer without having a clue about UI and, though he or she might have a good understanding of how UI influences UX, a UI designer might not possess all the skills it takes to be a UX designer.

To clarify this still further, let's take a look at the development of a product using both UX and UI design.

A UX / UI Workflow    

The UX designer begins with a product that is intended to solve a pain point for the user. Before they go any further, they’ll research who those users might be and what their needs are. Now they create a map indicating the user’s journey from the moment they come into contact with the product. Where do users begin? Which information should be prioritised, and what’s the overall information architecture? What kind of features would they expect, need, or be hoping for? The result is a UX blueprint which outlines the user’s journey from problem recognition through interaction with the product and the resolution of the problem or pain point they were hoping to address. The entire blueprint is captured in a wireframe that details the easiest route from the beginning of the process to its end.

Now, it’s up to the UI designer to take things further. Since UI is purely digital, designers would typically be thinking about the screens a user would navigate in order to reach his or her goal and the controls they’d select in order to navigate from one step to the next. With the UX designer having identified the steps that must be taken in order to reach the goal, the UI designer decided how these steps will be presented to the user.

Accessibility and inclusivity are important too. For example, would a disabled person be able to use the interface? At the same time, it’s important to convey unspoken messages through the user interface. A good user experience achieved after using the interface should also reinforce the brand and promote both brand recognition and brand loyalty.

It’s Possible to Produce Good UX and Bad UI or Vise Versa - But You Wouldn’t Want To    

It’s possible that the confusion between UX and UI may have resulted in a plethora of products that do well in one field, but don’t do well in the other. Unfortunately, the result can be a great idea that falls absolutely flat.

Let’s take you through two scenarios that may resonate with you.

You discover an app or a website that seems to have just what you need! You enthusiastically get onto it, and sure enough, it looks fantastic! But when you follow the prompts you find yourself navigating a seemingly endless succession of pages and processes. In fact, it all gets so complex and irritating that you give up in despair. That’s good UI design coupled with bad UX design. The result is an epic fail.

Now, let’s look at the same scenario in a different way. You get onto that promising platform and you’re raring to go, but the buttons are tiny and too close together. The text is hard to read. You keep clicking the wrong thing and having to go back, and before long, you decide that the whole exercise isn’t worth the hassle. In this case, the UX design may have been good, but the UI design was so bad that you never got to experience the satisfaction that the UX designer had in mind.

The conclusion is easy to reach. To be effective, a product must have both good UX and good UI design or it simply won’t deliver what your users want. However, in both these scenarios, the UX designer must take the blame. Although the UI designer in our second scenario messed up, it was up to the UX designer to manage the two design processes and to test the results before the product was released.

Two Different Skill Sets: One Person. A Best-Case Scenario?    

In theory, a UX designer doesn’t have to be a UI designer. However, we feel that combining the two skill sets required to do each of these tasks effectively is the best case scenario. If you’re in charge of UX and develop a blueprint, you probably already have an idea of what the UI should look like and you know what’s possible and what isn’t.

If you’re able to do the necessary coding to realise your vision, you can be sure that it is what you intended it to be. You’ll also have the results of your research at the back of your mind during the UI design process. For example, if you found that your healthcare-related app was likely to enjoy popularity with seniors, you might opt for bigger buttons and easy-reading fonts.

The only drawback of combining UI and UX expertise is that you have to check your own UI work. But this can be overcome in a testing process involving people who weren’t involved in the design process.

The Most Common Uses for UX and UI Design in Business    

It’s possible that business owners are already implementing the principles of UX design in the way they run their enterprises. After all, dealing with every client on an ad hoc basis with no clearly defined system makes life difficult for everyone concerned. But with the comparatively new fields of UX and UI design coinciding with the digital revolution, the most commonly recognised business uses will be in website, app, and product development.

The appearance of simplicity is key to good UI and UX design, so very often, one won’t even notice all the work that goes into getting it right - unless it’s lacking. As a rule of thumb, if it works seamlessly and seems almost effortless to navigate, that’s the result of careful consideration and good design. While this is no doubt rewarding for UX and UI designers since it is what they work towards, they must be among the least-acknowledged behind-the scenes workers in today’s technological world.

So, next time something works really well and seems straightforward, remember to send out a mental thank you note to the folks who made it that way. It’s a sure sign of a job well done!

YES, YDMA Has UX and UI Designers on the Team    

There are times when our UX and UI designers achieve what seemed to be impossible. What’s more, they make it look easy. We know that it isn’t. So, if you’re thinking of developing an app that makes life easier for your clients, need help with product design principles, or want a website that does much more than simply exist online, you should talk to us.

  

We’re confident that we’re equal to any achievable challenge, so all it takes to get started is an idea. Turning it into a reality is our business. Talk to us about UX and UI design because making things easy for your customers could be all it takes to beat your competitors and take your business to the next level!

Learn more about our design services