UI vs UX: What is the Difference?

Share this article

Nonsensical UI vs UX explanation.

As a full-stack/generalist product designer, I’ve watched the industry’s obsession with titles for many years. Sure, we can keep being snarky about it, and continue throwing around funny tweets, but when did this help anyone?

Just like “Should designers code?”, the “UX vs UI” question has turned into an inside joke.

On one hand, this trend might help a more seasoned designer vent. In fact, there’s a Tumblr entirely dedicated to it.

However, there is a danger that it makes the industry look frustrating and inaccessible to a beginner. And that’s a shame because the barrier to entry for a new designer has never been so low (and I mean this in a completely positive way).


UI stands for User Interface. It’s what users interact with directly, everything they see, touch and hear within a piece of software or a website. It’s the outermost layer of an app – the controls.

In its current state – due to the types of devices we are using – UI design is mostly a visual discipline, although voice and written word are gaining more and more traction thanks to voice assistants and conversational interfaces.

UX stands for User eXperience. It’s a holistic term encapsulating each and every different kind of touchpoint a user has with a product.

In the context of a digital product, this includes not only the software’s front-end itself, but the whole technical stack, customer service, branding, public image of the company, availability, pricing, and communication, and that’s certainly not all.

UI is a subset of UX. Both terms have different meanings and, whenever possible, should not be used interchangeably. The title “UX/UI designer” makes little sense in terms of semantics. Every UI designer is a UX designer by definition, and being a UX designer without a more specific field of work is quite rare. Talking about “UX” without specifics can quickly render any conversation meaningless.

So, what’s the problem with “UI/UX designer”?

As I see it, there are three major issues:

  1. It’s misleading for everyone: designers, developers, recruiters, founders, etc. More and more junior designers put it in their titles – and I can’t blame them. Everyone is doing it and being honest about your skill-set can sometimes make you feel like you’re letting yourself fall behind the title trends.
  2. It introduces a false career path where being just a “UI designer” is not enough. If digital product design was like Pokemon, “UX/UI designer” wouldn’t be the cooler, ‘levelled-up’ version of ‘UI designer”.
  3. It greatly undermines and almost tokenizes the importance of “UX design”, which is actually the sum of everyone’s work.

UI is a part of UX

In a nutshell, a user interface is the layer where human-computer interaction happens. Although an important one, it’s just one layer of the whole user experience stack, which encapsulates multiple disciplines.

Let’s use a real-world example: watching TV.

The UX of watching TV includes the content quality, specifications of the TV set, location, furniture, your current state of mind and a lot more. On the other hand, the UI of watching TV is just a small part of that: the design and build quality of the remote and the on-screen menus.

About those images

UI vs UX analogies
UI vs UX analogies. Credit: http://digitalfractal.com/

Yes, those images. I don’t want to sound like an old man yelling at clouds, but most of the side-by-side pictures comparing UI and UX are just missing the point. Designer Sebastian de With expressed the same sentiment about a year ago with this tweet.

Many of the recurring images (like the one with the two ketchup bottles and the one with the shortcut through a grass lane) not only lack meaning but are often counter-productive. They pit UI and UX against each other, implying that UI designers’ work is useless because people already use the product in another way.

Let’s take the ketchup bottle example and fix it. We’ll only need one bottle because comparing two different designs and labeling that “UI vs UX” just doesn’t make sense:

UI vs UX analogies. Ketchup example
  • the UI layer is the bottle, including the cap and the label. This means ANY bottle – not just the upright version1.
  • the UX layer is a combination of the company’s branding and marketing efforts, the nutritional and sensory qualities of the ketchup itself, the act of discovering and buying it in a store or online, the company’s interactions with customers on social media and literally every other touch point between the company and its existing and potential customers.

Where did the term UX come from?

UI is a much older term than UX. It’s been used since the earliest days of computing, as it’s a generic science term. UX, on the other hand, got popular much later.

The term UX was popularized in the mid-’90s by Don Norman, one of the co-founders of the Nielsen Norman Group and author of best-selling book “The Design of Everyday Things”. From the very beginning, the meaning has been quite clear, Don Norman even has a whole video addressing the modern specifics of the problem.

UI is not just GUI: designing an API

When we think about interfaces, we’re normally referring to Graphical User Interfaces or GUIs. Almost all of the devices and systems we’re using today are interacted with within a visual set of paradigms: windows, icons, buttons, navigation bars, sliders, inputs, etc.

UI and GUI (graphical user interface) have become almost synonymous and for a good reason: most users don’t have to interact with a code-based tool in their day to day. Still, UI is not just GUI.

In my day-to-day work, I’m focused on front-end design systems, so designing the developer-facing interface layer of a design system is part of my job. In that sense, a component’s API surface is its interface layer for people who work in code. Designing and documenting an API’s surface area is among the hardest tasks I’ve tackled over the years.

Even if you don’t code, I can’t recommend spending some time on this sort of task, even as a personal challenge. Modern frameworks like React are doing a really great job suggesting and even enforcing the practice of designers and developers working together in a more meaningful way than sharing a Sketch file and calling it a day.

Saying no to false dichotomies

While being specific about titles and semantics in the design industry is generally a positive thing, taking the “UI vs UX” discussion too far may well be having adverse effects. It’s a heated topic, but I completely agree with Jared Spool: Everyone is a designer.

I can’t count the times I’ve been gifted fantastic UI ideas from developers or taken valuable user flow improvements from visual designers. Being aware of your title within an organization is important – but only to the point where it’s not stopping you from contributing in areas outside of it.

  1. Heinz continues to sell the upright glass bottles because of nostalgia and some people not trusting plastic packaging. 

Frequently Asked Questions (FAQs) about UI and UX Design

What are the key differences between UI and UX design?

UI (User Interface) and UX (User Experience) design are two distinct aspects of the design process, yet they are closely intertwined. UI design is about the visual elements of a product or a website, including colors, typography, buttons, images, and the overall layout. It focuses on the aesthetics and the look and feel of the product. On the other hand, UX design is about the overall experience a user has while interacting with a product. It involves user research, information architecture, usability testing, and much more. The goal of UX design is to create a seamless, simple, and enjoyable experience for the user.

Can one person handle both UI and UX design?

While it’s possible for one person to handle both UI and UX design, it’s not always ideal. Both fields require a different set of skills and a different mindset. UI design is more about graphic design and visual aesthetics, while UX design is more about understanding the user’s needs and creating a product that meets those needs. However, in smaller companies or startups, it’s common for one person to wear multiple hats.

How do UI and UX designers collaborate?

UI and UX designers often work closely together throughout the design process. The UX designer usually starts by conducting user research, creating user personas, and mapping out the user journey. They then create wireframes and prototypes, which the UI designer uses as a basis to create the visual design. Both designers need to communicate and collaborate effectively to ensure a cohesive and user-friendly product.

What tools do UI and UX designers use?

UI and UX designers use a variety of tools depending on the stage of the design process. For wireframing and prototyping, tools like Sketch, Adobe XD, and Figma are commonly used. For user research and testing, tools like UserTesting, Hotjar, and UsabilityHub can be helpful. For visual design and graphics, UI designers often use tools like Adobe Illustrator and Photoshop.

What is the role of user testing in UI and UX design?

User testing plays a crucial role in both UI and UX design. It involves getting feedback from users about the usability and functionality of a product. This feedback can then be used to make improvements and adjustments to the design. User testing can be conducted through various methods, including usability testing, interviews, surveys, and A/B testing.

How important is consistency in UI and UX design?

Consistency is key in both UI and UX design. In UI design, consistency in visual elements like colors, fonts, and buttons can make the interface easier to understand and use. In UX design, consistency in the user experience, such as the flow of actions or the placement of elements, can make the product more intuitive and user-friendly.

What is the impact of good UI and UX design on a business?

Good UI and UX design can have a significant impact on a business. It can lead to increased user satisfaction, higher engagement rates, and ultimately, more conversions and revenue. A well-designed product is also more likely to stand out in the market and attract more users.

How do UI and UX design contribute to accessibility?

Both UI and UX design play a crucial role in making a product accessible to all users, including those with disabilities. UI designers can ensure that visual elements are clear and easy to understand, while UX designers can ensure that the product is easy to navigate and use. This includes considerations like color contrast, font size, button placement, and more.

What is the future of UI and UX design?

The field of UI and UX design is constantly evolving, with new trends and technologies emerging all the time. Some potential future trends include the rise of voice UI, the integration of AI and machine learning, and the increased focus on accessibility and inclusive design. As technology continues to advance, the role of UI and UX designers will only become more important.

How can I get started in UI or UX design?

There are many ways to get started in UI or UX design. You could take online courses, attend a design bootcamp, or even learn on your own through books and tutorials. It’s also important to practice your skills by working on real projects, whether that’s through internships, freelance work, or personal projects.

Darin DimitroffDarin Dimitroff
View Author

Darin is a technical product designer focused on design systems. Currently working at spacefarm. When he's not designing and coding, he's probably mountain biking or running.

Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week
Loading form