Difference Between User Interface and User Experience Design

User interface design (UI) and user experience design (UX) are two design terms an average person starting out in the tech industry misinterprets for one thing with different names. Even experienced uiux designers themselves tend to use them interchangeably or incorrectly. There is an underlying confusion in the meaning of both terms. I am sure even you reading this right now must have wondered at some point or even confused right now, ‘‘what the difference between UI and UX design is?’’

In this article, we will define the terms and point out their individual differences.

User Experience (UX)

User experience is the total experience people have and how they feel about a product or service (either positive, negative or neutral). It is the experience users get as they interact with a product or service. For example, how you feel as you interact with this article you are reading now is an experience - the feelings this article evokes in you is an experience that can be designed by me the writer.

The interactions you have with this medium website you are reading on right now will trigger a feeling and an experience which can be good, bad or just there for you.

User experience (UX) was coined by Don Norman in the early 1990’s when he worked at Apple. Don Norman defines UX as “User Experience encompasses all aspects of the end-user’s interaction with the company, its services and its products”.

Moving forward, user experience design is the process of creating a simple, smooth and effortless experience for users into a product to help the users achieve whatever they want to achieve. User experience design is focused on the effect of the functionality of a product.

In designing user experience, questions like, “What is the essence of this shape or icon to the user?”, “How does this feature solve a problem for the user?”, “Can users easily navigate through the product without much thinking?”, “What is the effect of positioning the product or feature in a certain way?”

Questions like these above when answered, helps to build into a product that seamless experience for the purpose of helping the users achieve their goals easily.

User experience (UX) designers determine the functionality, structure, and how the user interface operates. They carry out user research, create user persona, empathy map, Information Architecture (IA), site maps, wireframes and usability testing etc for the purpose of designing a great user experience into the product.

User Interface (UI)

User interface is the visual appearance of a product - the layout, how it looks, how it functions, the interactions and anything that can be seen that the user directly faces and uses. It includes buttons, texts, text fields, sliders, typography, colour, images, animations, responsive design, transitions, screens, keyboard sounds and all forms of interactions.

UI designers are like graphic designers. They’re concerned with how great the product looks. They ensure the interface of a product is visually appealing and structured accordingly in line with the product's brand and goals while at the same time helping the user to also achieve their goals.

Difference Between UX and UI Design

The major reason why UI and UX are used interchangeably or misinterpreted is because they are skills that relates so closely with each other and need each other to build a great product - UI cannot do without UX, UX cannot do without UI.

There are however specific differences you need to know about them.

Finally, a simple way to look at UI and UX is to see UI as the flesh of a body and UX as the bone of the body. The flesh is what we all see, the bone is what we don't see. The bone is the one that holds the flesh together, if there is no bone, the flesh won't be held together.

It is important to note that although the terms are different, they do go hand-in-hand. That is, you cannot have one without the other. When building a product, UX comes first. The UX seeks to understand the needs and pain points of the users and how the products or services can satisfy such needs. To better understand users, they conduct extensive user research in order to find out who the target users are and what their need are in relation to a certain product after which they map out the users’ journey map, Information Architecture (IA), important features and lastly to wireframes (the skeleton or blueprints for the product).

The UI designer then steps in to bring the wireframes to life. They add colors, images, spacing, layout, real content, elements, positioning, interactions such as tapping a button, page swiping or scrolling and more advanced UI to make the product usable for the users.

In the next article, I would share with you another design phrase people use interchangeably or incorrectly like UI design and UX design - product design and UIUX design, what's their difference?

Written By: Adisa Rebecca

(Perxels’ Mentee)

Perxels is a design school that provides training and mentorship to UIUX designers to grow and thrive in the industry