← Writing

X comes before I

Dec 15, 2023 · 4 min read

X comes before I

UI or UX? Are they the same? Are they not?

UI and UX are more often than not referenced as the same thing — be it on professional mediums, job descriptions or during product development. But are they really same? Can they be used interchangeably? If not, what exactly do these abbreviations mean and how do they differ?

UI vs UX

First things first, they’re not the same!

UI stands for User Interface — it is the medium through which the user of a system interacts with the system. Think mobile apps, websites, forms, command line and so forth. This is the entry point of the user into the system.

UX stands for User Experience — it is the overall experience/perception of the user about the product.

It is a common assumption that a good UI leads to a good UX and to some extent that’s true. After all, UI is the first impression of the system for the user. That’s why they’re used interchangeably so often, even when they shouldn’t! But before we get into that, let’s take a few examples to understand these terminologies further.

Examples

If you’ve ever applied for an Indian passport online, you must have noticed that the application form is relatively simple with basic form fields, colours and fonts. The user interface of the system is just enough to capture whatever information it needs from the user.

When you go through the whole process from submitting the application form online to going for an in-person appointment and eventually receiving your passport, you experience that the whole process is astonishingly smooth, quick and every step is well-timed — like a nice relay race. The core of the system is in doing secure and quick verification of the application and sending the passport to the user, and that’s where it aces. The system even sends timely SMS and email messages to provide updates of the application progress which adds further to the feel-good factor for the user. With a minimal UI, the system still manages to deliver a fantastic UX.

Touchscreens are everywhere these days — our phones, laptops, watches, cars, household appliances, handheld games. Anything that has an interface that’s big enough to accommodate the human finger will probably have the interface touch enabled these days.

It wasn’t too long ago that car manufacturers started replacing the many physical buttons in the cars with dedicated functions with a single unit that interacts with the user via touch. As years went by, the unit (interface) became more sophisticated with connections to our phones, controlling the AC, windows; some cars even feature manufacturers’ own apps — everything controlled via touch.

While the touch enabled unit is an excellent interface on its own, most drivers prefer physical buttons instead (at least judging by online reviews of the cars and talking to people around). Yes, the interface looks “cool” and “modern”, but they’ve degraded the experience of driving a car safely. A driver (user) who knew exactly which physical button to use and when now has to navigate a menu (probably sub menus) before finding what they’re looking for — with pinpoint precision of their finger 🙈. Having a killer and sleek UI can still provide a worse UX.

While you may have a difference of opinion with the above examples, they’re discussed here merely to help separate the user interface from the user experience.

A common pattern

When building any system, it is natural to start the design with a UI. It is relatable, quickly verifiable component and is an important part of the system. But many times, in doing so, we end up focussing more and more on the UI than the rest of the system. UX is the invisible factor and hence is often sidelined.

The recipe for a killer product

It is important to put the UX before the UI while designing systems. The UX contributes to the success of a product more than the UI. And the way to do that is to put your user at the centre of everything. When you’re adding a new feature, assess how it will affect the user, is it going to enhance the overall experience, is it going to change the perception of the product, what is the user going to gain by adding the feature?

By putting the UX at the centre of everything, you constantly work towards enhancing that experience — which may involve working on the UI too. But putting the experience before the interface may help you realise that you have other components of the system that have larger impact to the experience than the one delivered by the interface.

Happy coding!