Last Updated on July 7, 2020
UX and UI are interchangeably used so often that we think they mean the same thing. But there is a difference between these two terms: UX Design and UI Design. By understanding the difference between them, you will be able to build your product with the right design process. It is common for product managers, founders, CEOs, hiring managers to refer to design as ‘UX/UI design’ when these are 2 dissimilar work scope. This can be seen by the sheer amount of job posts looking for UX/UI designers.
Let’s start by looking at the definition of User Experience Design and User interface Design.
What Is User Experience Design?
User Experience Design: Process of building relationships between a business, its product and its customers.
User Experience (UX) Design is the process of researching, developing and improving all aspects of the users’ interaction with the product in order to satisfy its users. The main goal is to improve the users’ experience with the product, this is done through conducting usability tests, evaluating the results and refining the design – ultimately creating a product that is not only useful and valuable, but also easy and pleasing to use.
Fun fact: Did you know that Donald Norman helped coin the term User Experience? Norman’s time at Apple in the 90s as a User Experience Architect was the first-ever case of ‘User Experience’ to be used in a job title. During an interview with Adaptive Path in 2008, Norman said:
“I invented the term because I thought human interface and usability were too narrow. I wanted to cover all aspects of the person’s experience with the system including industrial design graphics, the interface, the physical interaction and the manual. Since then the term has spread widely, so much so that it is starting to lose it’s meaning.”
UX design is vital in contributing to a product that provides an effective and successful user experience, even accommodating to human error. It includes various disciplines such as interaction design, visual design, usability and more.
In a nutshell:
- User experience design is NOT about visuals or mockups, it focuses on the overall process/service flow, it’s usability and experience. UX designers craft these experiences, thinking about how the experience makes the user feel, and how easy it is for the user to complete their desired task.
- User experience design is the process of developing and improving the quality of interaction between the user and all facets of the company.
- The ultimate purpose of UX design is to create usable, efficient, relevant, easy and all-round pleasant experiences for the user.
What is User Interface Design?
User Interface Design: Process of making visual elements and appearance of the product.
User Interface (UI) Design determines the visual appearance of a product, with the aim of visually designing the product for effective user experience. A good UI design attracts users and aids in providing a pleasant experience.
The element of UI design include documents, images, videos, text, forms, buttons, checkboxes, drop-downs along with their respective interactions, the behaviour of what will happen when the user interacts through clicking, dragging or swiping. The main goal is to create a compelling and beautiful user interface that elicits an emotional response and balance with good usability
The purpose of UI design is to make sure the user interface of a product is as intuitive as possible, and that means treating each and every visual and interactive element with careful consideration.
In a nutshell:
- User interface design conveys the brand’s strengths and visual assets to a product’s interface, ensuring the design is consistent, coherent and aesthetically pleasing.
- User interface design considers all the visual and interactive elements of a product’s interface – including icons, spacing, buttons, colour schemes, typography and responsive design.
- The ultimate goal of UI design is to visually guide the user through the product’s interface, creating an intuitive experience that doesn’t require the user to think too much.
What Is the Difference?
UX design and UI design always overlap but there is a distinct difference.
“User Experience (UX) and User Interface (UI) are some of the most confused and misused terms in our field. A UI without UX is like a painter slapping paint onto canvas without thought; while UX without UI is like the frame of a sculpture with no paper match on it. A great product experience starts with UX followed by UI. Both are essential for the product’s success.” – Rahul Varshney, co-creator of Foster.fm
In terms of functionality, UX is how things work, UI is how things look. UX is a process, whereas UI is a deliverable.
It’s important to note that UX and UI go together hand-in-hand: you can’t have one without the other (at least you shouldn’t). A good way to understand the difference is to look into the different aspects of what UX designers and UI designers do:
A UX designer considers the user’s entire journey throughout the product to accomplish their task: what steps does the user take? What tasks do they need to complete? Is the experience straightforward?
Much of a UX designer’s work goes into investigating problems and pain-points that users come across and how to solve them. A UX designer, often working with a User Researcher, conducts extensive user research to first find out who the target users are, and what their needs are in relation to the product. After that, they will map out the user journey, adding in the information architecture – how the content is organized and labelled, and the various features the user needs. In the end, a wireframe is created, this is a blueprint or skeleton of the product.
With the blueprint, the UI designer steps in to bring it to life by considering all the visual aspects of the user journey. They consider all the individual screens and the respective touchpoints that the user may encounter – tapping a button, swiping through an image gallery or scrolling through a page. Asking questions like “How can different colour schemes and combinations be used to create sufficient contrast and enhance readability? or “How can we pair colours to cater to those who are colour blind?”.
UX design focuses on wireframing and prototyping, interaction design and user testing whereas UI design includes visual design and interaction design. It’s important to note that both UX design and UI design require interaction design, which guides the user’s feelings and behaviour.
UX Designer’s Skill and Responsibilities:
- Content and Strategy: Competitor Analysis, Customer Analysis, Product Structure & Strategy, Content Development, Design Research
- Prototyping and Wireframing: Testing & Iteration, Planning, Creating Prototypes & Wireframes, Development Planning
- Analytics and Execution: Coordinating with Developers and UI Designers, Analysis & Iteration, Tracking Goals and Integration
UI Designer’s Skills and Responsibilities:
- Look and Feel: Branding & Graphic Development, User Guides & Storyline
- Responsiveness and Interactivity: Adaptation to All Device Screen Sizes, Interactivity & Animation, Implementation with Developers, UI Prototyping
SUMMARY: UX Design and UI Design – What Is the Difference?
- UX design usually comes first in the product development process, followed by UI design.
- The UX designer maps out the bare bones of the user journey and the UI designer filled it in with visual and interactive elements.
- UX design is about identifying and solving user problems whereas UI design is about creating intuitive and aesthetically-pleasing interactive interfaces.