What’s the Difference between UI and UX?

Great Products ConsultingDefine (Requirements), Develop (Build, Design)Leave a Comment

UI vs UX

This article is going to look at the topic of UI and UX. These two similar, but very different terms are often confused, and so I thought I'd take a moment to clarify.  At the heart of it, the difference lies in what each of them aims to accomplish. User interface (UI) is about aesthetics - making the system look good, while user experience (UX) is about a good (or great) customer journey through your platform or app.

User Interface (UI)

User interface is specific to what people see on the screen - colours, fonts, and styles. It also related to a persons interactions with objects on the screen, like buttons, links, tabs and scroll bars - the things that people click on or touch to use the system. 

User experience (UX)

User experience is all about how the user interacts with your platform or app. How do they complete tasks in a seamless and pleasant way.  It also extends to their whole experience when interacting with your business - from the time they find out about you, to when they buy and beyond. 

True user experience goes back to the customer's problems, need or goals. What are they trying to achieve and how does your platform help them to do that? Can your users solve their problems efficiently and effectively? How does your platform or app make it seem easy to solve their problem? At the end of the the day, it's how they feel about your product.

Great UI does not always mean great UX

Icons are a great example for showing the difference between UI and UX. Icons look great from a UI point of view. A little picture to represent a feature or object instead of text. However, they're not always that great from a UX perspective. 

Some icons are universally recognised - a garbage can for "trash" or "delete", or a magnifying glass for "search". However, if you start creating icons for new functions that people don't recognise, and they have to learn what that icon means before they know whether they want to use it or not - then you've created a bad UX. 

But there are overlaps too...

Let's take a button as an example. 

In UI, you look at the colour, shape and size of the button. You also determine the font, size and colour of the text,  as well as the location of the button on the screen relative to other elements. Sounds a little like UX doesn't it? The way the button looks will also make it easy (or difficult) to use. Imagine a button so small that your thumb or finger can't click on it, or one buried at the bottom of a page amongst some text where you can't see it. 

There are some UX pieces to this button as well. When your cursor clicks a button, it might change colour so that the user knows that the button has been clicked. Maybe there's a tool tip when you hover over it to tell you what clicking the button will do. These UX elements can make your platform or app more user-friendly. 

Hopefully, you're starting to see how people can get confused between UI and UX. 

Why you need to know the difference between UI and UX

As you look at how to get your product built, you need people with good UI skills as well as good UX skills. Some people have both skills, but some don't, so you want to understand a person's capabilities before hiring them. Even if you go through an agency, it's worth your time to find out how they deal with UI and UX. 

Bottom line - things may be visually appealing and perform the function intended (good UI), but the user shouldn't be frustrated because they can't figure out how to use the function (bad UX). It turns out the two need each other if you want to make a great product, so keep that in mind as you head out on your development journey.

Are you ready to turn your good idea into a great product?
My idea to launch checklist is your plain-English guide to getting there.

It’s available now for only $24.

Leave a Reply

Your email address will not be published. Required fields are marked *