whatsapp icon

The Difference Between UI And UX

UX is a buzzword that is bandied about and often used interchangeably with UI. In fact, UX design and UI design require very different skill sets, despite describing essentially the same thing.

Confused? You’re not the only one – these phrases are little understood by the designers who advertise their UX and UI skills, as well as by those who employ them. To help you tell your user experience design (UX) from your user interface design (UI), we’ve put together a handy guide.

Let’s start with a couple of simple definitions, before going into the core differences and some good examples of UX and UI design.


What is UI?

In the early days of computing, user interface, or UI, simply didn’t exist. You couldn’t buy a computer with fancy graphics, buttons, or even a mouse. Everything was pretty dull and you had to input commands in plain text.

Then came Xerox Star – the first computer to come with a graphical user interface, or GUI. This meant icons, drop down boxes, windows, and a rudimentary interface that serves as the basis of the systems we use today.

Users of computers could now open, move and delete files without tiring out their fingers typing. The interface doesn’t look like much to modern eyes, but at the time it sparked a revolution that brought computing to the masses.

The people at Apple continued to expand on the concept of the graphical user interface, and the Macintosh was released in 1984. This was the first commercially successful computer to employ a mouse and a drag and drop system.

With the birth of graphical user interface, a new job and a new skill set was born. Enter the user interface designer, whose mission is to design a digital product’s interface with the user’s happiness, and loyalty, in mind.

Of course, user interface has become a lot more complicated in the ensuing decades, and it is now an inevitable part of the design process for everything online.


What is UX?

So, if UI describes the way a user interacts with a digital product, and a UI designer is someone who designs this interface, what is UX? The concept of user experience has its origins in the early 90s. The term was created by a cognitive scientist named Dom Norman, who defined it as something that ‘encompasses all aspects of the user’s interaction with the company, its services, and its products’.

Dom Norman felt that the previous ways of understanding interface were too narrow, when in reality designing an interface covered a lot more bases than were implied by user interface design.

Providing a seamless user experience requires the engagement of a variety of disciplines, from interface design, to marketing and engineering.

UX designers are responsible for ensuring that the customer is able to achieve their desired objective through the product, and does so in a way that meets their expectations. This means understanding how the consumer thinks, what they want, and it means incorporating a more macro view into the design process.


Points of difference between UI and UX

Obviously designing every step of the entire consumer experience and designing a specific digital interface involve different skills, thus UI and UX are different. But at the same time, there’s no difference at all.

Asking what the difference between UI and UX is, is a bit like asking the difference between red paint and the molecules that make up red paint, or the difference between a teabag and the material that makes up the tea bag.

The difference isn’t “real”, it is a question of perception and labelling. UI is a part of UX, but that doesn’t mean that user interface design is simply one small component of user experience design.

They are both big jobs that have different concerns, objectives, and require different skills and mindsets. It’s confusing, so it makes sense to spell out a few points of difference between UI and UX, just to hammer home the point.


Accomplishing goals and making emotional connections

User experience design asks the big questions first. Why are people coming to your site? What do they want to do and how are you going to help them to do it?

UI-design-example
UI Design Case Study by Anton Morozov, under art-direction by Ernest Asanov

Once interaction design is established, user interface designers figure out how to make that emotional connection with a user, through creating a seamless and fun to use interface.

At the same time, UX is focused on the internal dynamics of a user. Research is a big part of the job of the user experience designer, and they’ll want to figure out what makes the consumer tick, so as to map out the easiest set of interactions.


UX makes it useful, UI makes it beautiful

In the same way, user experience designers have utility in mind and want to make a valuable, viable product that takes into account market dynamics and your customer niche.

This whole process should be tested throughout the life-cycle of the product. Once the wireframes are prototyped and tested and the user flows are established, then the user interface designer can get to work making these bare bones aesthetically attractive.

This means pretty colours and typefaces, but these details aren’t chosen on the basis of what the designer thinks is beautiful. Colour and font choice will be formulated according to the implementation of a visual hierarchy handed down by the UX designers.

This hierarchy will be all about letting the interface serve as a guide to users, giving them hints as to where to click, and where to go to meet their objectives.


UX comes first

If you think of UX as design on the macro level, and UI as design on the micro level, then it makes sense that the UX designers do their job first. The UX designers handle the research that deal with the basic product ideas, testing the development of the product.

The UX designer will handle user flows, for example deciding the broad outlines of the process that will lead a customer to sign up to your newsletter. With this in place, the outlines will go to the UI designer, who will refine those interactions, still with the user experience firmly in mind of course.


UX is a broader ball game

When we refer to UI designing we are only concerning ourselves with the interface, but that is not necessarily the case when it comes to UX design.

Of course, interfaces aren’t limited to the graphical user interfaces of computers, we’re talking watches, washing machines, and numerous mobile devices. But UX designers in these cases will play a much more prominent role than UI designers in figuring out the bigger picture of how a user interacts with their product.


It’s tricky to be an expert in UX and UI

Many people nowadays claim to specialise in both UX and UI design, but truly being an expert in both disciplines is a rarity.

Saying that you’re an expert in ‘everything’ is a clear signal to those in the know that you are an expert in nothing. A good UX designer has solid research and strategy skills, and an understanding of information architecture and interaction design.

Their work is scenario based and their main brief is human grounded design with the user’s needs in mind. Although a good UI designer also has skills in interaction design, their focus is on branding, information and motion design.

Their thinking is creative and convergent rather than critical, their process is based around the client’s needs, and their design skills are primarily visual.


Some good UI examples

UX and UI work often speaks for itself, so with that in mind, here are a few prime examples of UX and UI to help you tell the difference between the two.

Mailchimp is an excellent example of good UI design. Newsletter management is not the most exciting task in the world, but Mailchimp’s beautiful design makes it a pleasure.

mailchimp-example

There is plenty of white space on the interface and lots of clear calls to action, guided by a subtly animated pointer.

The most obvious and recognizable example of good UI is the google homepage. It couldn’t be simpler, nor could it be more successful.


Some good UX examples

When it comes to praising good UX design, the website Graze is a good example. The biggest pitfall of poor UX is making it unclear what a website is for.

graze-example

There is no such problem with Graze, and the consumer knows exactly what the point of the site is. The process of choosing your product is also a joy, with an easy step-by-step process making the consumer experience seamless.

To continue with the Google example, a great aspect of Google’s UX design is the instant search feature. Imagine if it took fifteen seconds for your results to load – you could have the same exact interface, but the user experience would be totally different.

Want to see your content here?

It’s the right time to go global! List your agency among the leaders of the industry, promote your works, create original content and find your new team members!

SUBMIT CONTENT

BLOG | Digital Marketing

How To Raise Brand Awareness In 5 Easy Steps

You’ve thought up some quality product branding and you have a ...

BLOG | SEO & SEM

What Is Guest Posting And How Is It Used For SEO?

If you’re a blogger and you’re not completely happy with the ...

BLOG | Virtual Reality & Augmented Reality

What Is Virtual Reality And How Is It Going To Change Our Future?

You’ve definitely heard of Virtual Reality or ‘VR’ – but you ...

This website uses cookies. Continued use of this website indicates that you have read and agree to our Terms & Conditions and Privacy Policy.

ACCEPT