When designing a website or an app, the finished product needs to be functional, intuitive, and aesthetically pleasing. This is where UX and UI design come in.
UX and UI design are two technical terms that can often be confusing.
Many people may use these two terms interchangeably, incorrectly, or assume they are the same thing. But that is not the case, as they are two different fields.
In a nutshell, UX design focuses on how well the product works and how the user feels when using it, whereas UI design focuses on how that software product looks.
Both are equally important and play a vital role when creating and developing software.
Think of it like this: a pretty UI may attract visitors, but if the product is not functional, the visitors won't stick around. And if the product works properly but doesn't look good, users will feel frustrated and look elsewhere to satisfy their needs.
There needs to be a balance.
With that said, the definition above only scratches the surface.
In this article, you will learn about the differences between UX and UI design and understand what UX and UI designers do in their day-to-day work.
Here is what we will cover:
- What is UX design and why is it important?
- What does a UX designer actually do? The UX design process explained
- What is UI design?
- UX VS UI design - what's the difference?
UX design is short for user experience design.
The term was coined and popularized in the early 1990s by Donald Norman, an American researcher, professor, and author, during his time at Apple.
According to Norman:
User experience encompasses all aspects of the end-user’s interaction with the company, its services, and its products.
Note that the original definition of UX referred to physical and digital products. Nowadays, UX design mainly relates to digital products.
So, user experience design is a process that involves cultivating a good relationship between a company, the company's software products /services, and the company's clients/customers.
The relationship is based on how a user feels when using the company's products.
UX has to do with feelings, emotions, thoughts, behaviors, and human psychology.
Specifically, good UX depends on the following points:
- How does a person feel when using the product?
- How accessible is it for the person to navigate the product? Can everyone use it?
- How usable is the product? Does it work as intended?
- How easy is it for the person to navigate and find the necessary information?
- How well-planned and intuitive are the steps a user needs to take to accomplish a task?
- How logical is the sequence of actions a user needs to perform to accomplish their goal with ease?
- Does it make it easy for them to achieve their initial goal?
- How well structured is the content available? Does it follow a logical hierarchy?
- How useful is the product?
- How valuable is the product?
- Does it serve a purpose?
All of the above are part of what makes good UX design and contribute to the value the software offers.
UX is all about solving problems and always keeping the user in mind.
The end goal is to provide a pleasant and positive experience for the user, create digital products that a user feels comfortable using, and for the user to accomplish their task and have their needs met.
All in all, it focuses on anything and everything that affects the user's journey when trying to solve a problem they have.
Good user experience is vital for every business. If the user/customer is happy and not frustrated, they are more likely to remain loyal.
If users can't use the product with ease, this will result in them giving up on it and looking for an alternative product/service that meets their needs, resulting in a loss for the business. They are unlikely to return to a product after a bad experience.
The UX design process is comprised of many parts. It is a sequential process with the end user always in mind throughout all stages.
The role of a UX designer will vary from business to business and depends on the size of the team they are on.
On a small team, a UX designer will probably be responsible for the whole UX process from start to finish. On a larger team, they might be involved in only one part of the process, such as UX research.
That means a UX designer may not be part of all the stages outlined in the following sections.
Now, let's see the different phases in the UX design process in more detail.
The first step in the UX design process is understanding the brand and its users.
Specifically, it is about understanding how the project the UX designer is working on aligns with the brand's mission, vision, and goals.
And it is about understanding the brand's users/customers.
A UX designer can't make assumptions about what the users really want or what problems they are facing when using the product/service. They will only know once they ask the users directly.
The UX designer needs to understand, be in tune with, and empathize with the problems users are facing and their pain points. They need to understand their users' wants and needs.
The key word here is empathy! Empathy is the ability to understand the user's hopes, goals, frustrations, and needs.
Once the UX designer has gathered those insights and identified the goals of the brand and the problems the users are facing, they can figure out how to solve problems and provide solutions through their designs and how they can create products/services that solve those problems.
As mentioned in the section above, a UX designer can't assume, and if they do, they need to question those assumptions by conducting user research.
There are two main methods for conducting user research:
- Qualitative methods
- Quantitative methods
Qualitative research methods focus on observational and non-numerical findings, human behaviors, opinions, and emotions.
They include creating customer feedback surveys and asking open-ended questions to understand the key frustrations and pain points and what needs improving.
They also include reaching out to customers directly and conducting 1:1 face-to-face or online user interviews or focus groups of 3-5 target users for usability testing.
Quantitative methods focus on numbers, metrics, and measurable data points.
They include using web analytics tools and researching how the current design is performing. For example, they might find out how many visitors of an e-commerce site are clicking on a particular item and adding it to their cart, or what is the average time spent on the checkout page.
To learn more about user research, check out the following resources:
- Why you need a UX researcher on your product team
- Use User Research to Create the Perfect UI Design
- Qualitative VS Quantitative Definition – Research Methods and Data
After gathering user insights, the next phase in the UX design process is for the UX designer to analyze and make sense of all the information and define the problem they need to solve for the user.
They define what their focus should be and what would have the most impact on the users.
At this stage, it is crucial not to lose sight of the user's needs.
For this reason, the UX designer will create user personas based on the research they've gathered.
A user persona is a fictional character that will use the product/service.
It represents a typical target user and identifies their needs, frustrations, behaviors, and goals.
User personas allow UX designers to understand their users better and make wise design decisions.
At this stage, a UX designer might also create use cases.
A use case is a description of how different users might use and interact with the product or service.
Finally, a UX designer might also create journey maps.
A journey map is a visual and graphic representation of how the user will interact with the product/service from start to finish, and a map depicting the whole user journey until the user accomplishes their goal.
Journey maps are useful for understanding the different pain points a user faces when using the product and where those pain points occur, which leads to restructuring the product/service.
To learn more about user personas and use cases, check out the following resources:
The ideate phase is all about brainstorming and exploring out-of-the-box design ideas.
At this stage, the UX designer will come up with different creative options for how to solve the problem at hand.
They will brainstorm ideas and sketch them on paper before using any digital tools.
They will also create wireframes. Wireframes are rough prototypes and visual representations of what the UI and its various components will look like and which act as a guide and direction for the final design.
They will outline the steps and the complete path a user will take while using the product/service.
The end goal of this phase of the UX design process is to design low or high-fidelity versions of the structure and layout of the product (which may or may not be interactive) and of what the final design will look like. The first design is never the final design.
After continuously iterating the designs, adding new ideas and features, rigorous testing, and feedback, the UX designer will have a detailed and carefully crafted digital mockup.
The mockup will look almost identical to the final product, which they hand off to the engineering team. The engineering team will build and ship the real-world working product.
To learn more about creating wireframes, check out the following resources:
- What is a Wireframe? This UX Design Tutorial Will Show You.
- How to Design a Website Prototype from a Wireframe
After the product launches, the next phase of the UX design process is the reporting phase. This includes conducting usability testing, observing how users are using the end product, collecting feedback, and gaining additional insights.
This phase helps the UX designer and their teams understand if the end product solves the initial problem and if it meets the needs of their end users.
At this phase, here are some of the questions that a UX designer may ask:
- "What did we do right?"
- "What didn't we do right, and why?"
- "What did we learn?"
- "How can we improve in the future?"
- "How are users responding to the product/service? Did we solve their problems and pain points?"
With that said, the UX design process doesn't end here, since there are continuous iterations and improvements to be made.
So far, you have seen that UX design involves every aspect of a user’s experience when using a product. So what exactly is UI design, then?
Back in the 1970s, to use a computer, you had to use a command line interface (or CLI for short), and users needed to know a programming language to communicate with the machine.
At that time, you needed a lot of technical knowledge and skills to complete a simple task with a computer.
That changed in the 1980s with the introduction of Graphical User Interfaces (or GUIs for short) and personal computers.
A mouse, application icons, buttons, menus, checkboxes, and folders replaced the cryptic command line. Anyone could use a computer. Users could easily create, update, move, and delete files and send emails – no coding required.
The people that created these early graphical user interfaces were called User Interface (or UI for short) designers.
Nowadays, the term user interface involves every visual part of a digital product/service that a user interacts with. This includes mobile apps, websites, screens, touchscreens, keyboards, and wearable technology such as smartwatches, to name a few.
You can think of it as the bridge between the user and technology.
A UI designer is responsible for designing every step that allows a user to interact with the digital product/service. This includes layouts, structure, buttons, colors, and animations.
UI design is all about the look, feel, and aesthetics of a digital product. It involves every visual aspect and appearance of the product the user interacts with.
The end goal of a UI designer is to make something visually appealing to the user that's easy to interact with.
Good UI is vital for drawing attention to potential customers and attracting new users. Everyone appreciates a well-designed, clean, intuitive, and modern design.
But how does all this relate to UX design? You can think of UI design as a subset of UX design and a small part of the UX design process. But it is a separate discipline in its own right.
UI designers need to have visual design skills.
Specifically, they need to know the following concepts and disciplines:
- Color theory, creating color palettes and creating accessible contrast that ensures both usability and readability.
- Layout, spacing, structure, and effective placement of elements on a page.
- Graphics, icons, and illustration design.
- Interaction design principles, animation effects, and motion design.
- Branding – creating a consistent visual identity for a brand/product and communicating the brand's mission and message.
- Responsive design, and ensuring the UI looks good on all screen sizes and devices.
- Creating style guides.
- Creating design systems.
- Knowledge of industry tools such as Figma
- Wireframing and prototyping.
UX VS UI Design – What's the Difference? The Difference Between UX and UI Design Explained in Plain English
By this point, you hopefully understand what UX and UI design involves.
To summarize their differences:
UX design is how things work and how useful they are. UX design focuses on the whole experience and the journey a user takes when using a product from start to finish. It involves the overall experience a user has when trying to solve a problem.
UX requires knowledge of psychology, cognitive science, human behavior, identifying the user's pain points, and solving their problems.
UI design is how things look. UI design is a subset of UX design and is a more specialized field. It focuses only on the visual aspects that a user interacts with and creates inclusive, accessible, pleasant, and aesthetically pleasing digital interfaces.
UI design also focuses on creating a brand aesthetic that leads to an emotional connection with users/customers.
Both UX and UI design are equally important in creating useful, usable, and modern digital products and services and meeting the needs of their users.
This marks the end of the article – thank you so much for making it to the end!
Hopefully, this guide was helpful, and it gave you some insight into what UX and UI design are, what UX and UI designers do in their day-to-day work, and what the differences between those two terms are.
Thank you for reading!