UX vs UI: What’s the Difference and Why Does It Matter?

The debate of UX vs UI is a tale older than time. Many companies use these technical terms interchangeably, but the truth is that they are actually quite different. While they do work together to influence the useability of web design, UX and UI both refer to different concepts having to do with the user.

When you visit a website, you do so with the reasonable expectation that it’s going to be easy to navigate and find the information you need. You shouldn’t have to click half a dozen navigation links, pinch and scroll your way through an interface that isn’t mobile-friendly, or deal with annoying graphics and animations reminiscent of your old Geocities page from 1997. And if you do, chances are you’re going to lose your patience quickly and find a site that is less of a hassle to deal with. And there’s absolutely nothing wrong with that.

It’s hard to imagine now, but there was a time in the early days of personal computing when you had to be able to present instructions in code or “computer language” if you wanted your device to do anything. It wasn’t until 1984 with Apple’s revolutionary Macintosh rollout before newbies could direct a computer what to do by simply “pointing and clicking”. And just like that, personal computing became accessible to the masses. Suddenly, programs needed to be intuitive and accessible enough for even novice computer users. Style had to complement functionality. They needed to perform as expected and look good while doing it. And with this innovative and seismic shift in the way the world viewed personal computing, the concepts of UX and UI were born.

Great, so what is the difference between UX vs UI?

We’re glad you asked.

Are UX and UI the same thing?

Well, no. Not exactly. Although this is a popular misconception that we’ve heard a time or two before. UX and UI do go hand in hand, and if you’re building a website you’ll want to be sure that your UX and UI designer(s) (sometimes one person, sometimes more) are up to the task.

What is UI?

UI (user interface) refers to the visual app or website features with which users interact (buttons, icons, etc.). A website with top-notch UI should be easily navigable and desired actions such as “buy now” or “subscribe to our newsletter” should be easy to spot and perform as they are intended.

As we mentioned, the graphical interface is a relatively new concept. Of course with technological advancements and evolving preferences, personal computing nowadays is as simple as pointing, dragging, clicking and tapping until you’ve reached an end goal. Today, if you want to “save” you click “save”. If you want to “buy now” you click “buy now”. Simple, right? And it’s up to your UI designer to make this process as intuitive as possible.

What is UX?

First and foremost, unlike UI, UX (or user experience) is not strictly limited to digital avenues like custom website designs. Technically, any time you interact with a product, you are having a user experience. If you go to a restaurant and the waiter is rude, non-attentive, and spills a tray of drinks on you, he’s contributing to a poor user experience.

That same mindset applies when you visit a website. When you type in a URL, click on a link, or tap an app on your phone, you are doing so with the expectation that you’ll get something of value out of it. If a site is unorganized, distracting, or takes too long to load, you’re certainly likely to close out and see if any more appealing websites can deliver what you need. This is all part of the user experience or UX. UX basically encompasses the entire experience a user has while interacting with your site. Exceptional UX is about bridging the functionality gap between the site and the user to ensure their experience is valuable and pleasing.

For this reason, UX designers need to understand and appreciate their clients’ ideal “customer journey”. Before embarking on a new website project, UX designers need to understand who the target audience is and what action they want their audience to take. They then need to translate this to the overall design of the site.

The Difference Between UX and UI Design

UI is about what the user sees and UX is about what they experience to put it more succinctly. UX design is about identifying a user’s end goal and developing the best way(s) to get them there efficiently. It involves defining problems and coming up with the right tasks and user flows to help the user find what they need. UI design takes these concepts and translates them into aesthetically pleasing designs by selecting and implementing the right layouts, colors, fonts, and iconography.

How do UX and UI work together?

Imagine you’re designing your dream home from the ground up. The “UX” is going to be what goes into the house before you start moving in: pouring the foundation, framing, wiring, plumbing, roofing, etc. The “UI” in this example would be the aspects that make it your own: the paint, the flooring, the furniture, the bathroom fixtures—anything that gives your home character and brings it to life. Without expert UI, your perfectly serviceable home will be dull and uninteresting. Without expert UX, your picturesque and chic living space will look great on Instagram, but you might want to have a fire extinguisher handy and a handyman on speed dial just in case.

The same goes for your website. You need it to function correctly and be as easy to use as possible for your site visitors (that’s UX). And you need it to look great and be a true digital extension of your brand and all it represents (that’s UI). A website lacking in either is going to irritate visitors, bounce traffic, and hurt your bottom line. Accomplished UX designers and UI designers work hard to stay in tune with web design trends and best practices as both are changing constantly.

When you do decide to build a new website, it’s always best to have a reliable and in-house web design agency in your corner. And if you’re ready to take the next step with your own site, let’s chat. Ten years ago, UX and look nothing like it does today (and if your site is still reflective of a ten-year-old design, your customers are definitely taking notice). For this reason, when you embark on a new website build, it is important to know exactly what is going into the design and how the difference between UX vs UI will impact your target users.