What Is UI/UX? Meaning, Differences, and Design Tips

kc@example.com (kc kim) — Sat, 31 Dec 2022 18:02:59 +0900

People who use the internet daily have probably thought, “This app is easy to use” or “This website is hard to use, and it is not easy to find the information I want.” The work of thinking about how to make users feel that an app or site is good, and then making it happen, is UI and UX. This is a topic that people in the web industry and design-related jobs think about often.

This article explains the basics of UI and UX.

What Is UI/UX?

UI/UX design is essential not only for websites and web apps but also for creating products and services. UI and UX are often spoken of as if they were one word, but they actually have different meanings. Each is explained below.

In short, both are terms related to products and services. UI(user interface) is the “point of contact with the user”, while UX(user experience) refers to all the “experiences a user obtains through a product or service.” Since the point of contact with the user is also part of what the user experiences, UI is a concept included within UX.

What Is UI?

UI is a term that refers to the point of contact between a product or service and the user. It points to the parts that users see and touch. People tend to think UI only means design, but everything users see or operate is included in UI.

What Is UX?

UX is a term that represents every experience a user gains through a website, app, product, or service. For example, when a user visits an EC site(Electronic Commerce Site), chooses a product, buys it, uses it, and later wants to buy again, that entire sequence is the user experience, or UX.

Difference Between UI and UX

Here, let’s explain the relationship between UI and UX. As mentioned above, UI can be considered one way to realize UX. The following concrete examples make this clearer.

Concrete example 1)
UX: Page movement is easy to understand, and users can quickly find the information they want.
↓ Means to realize it
UI: Menus and buttons are easy to find, and users can easily return to the top page from every page.

Concrete example 2)
UX: Application or membership registration can be completed easily.
↓ Means to realize it
UI: Link and button positions and colors are easy to understand, the number of input form fields is minimized, and input assistance is available.

Concrete example 3)
UX: Graphics that stimulate user interest.
↓ Means to realize it
UI: Text fonts and colors do not feel awkward.

UI is only one element for realizing UX. Therefore, even if the UI is excellent, it becomes wasteful if the overall user experience of the product or service is not considered. UX design must comprehensively design the entire user experience from a broader perspective than the UI area alone to increase user satisfaction.

In other words, to create a good product or service, you should first perform UX design that understands user needs, and then design UI that improves the UX based on that understanding.

Concrete Examples of UI/UX

In EC sites(shopping sites), the quality of UI and UX design directly affects sales. Therefore, operations teams constantly measure and analyze user flows and behavior, build hypotheses from the data, optimize web page movement, and work to improve user experience through UI updates and UX improvements. UI/UX designers play an important role here.
An EC site must design pages that are easy for everyone to understand and let users shop with confidence. To do this, it must consider whether product photos are easy to view, whether users can easily find the information they need, whether text colors and sizes are easy to read, and whether buttons and links are easy to press. Adding voice features and supporting multiple devices are also parts of UI design. UX design considers the user experience not only from ease of use, but also from whether the product selection and purchasing experience is comfortable, reassuring, and interesting.
For example, page loading speed and the speed from product order to delivery must also be considered as part of product and service quality. In addition, when many users abandon the purchase process midway, policies can be implemented through various methods such as improving customer support or adding notification features, not only improving the UI.

Purpose of UI/UX Design

Do Not Make Users Think

The goal is to predict user needs and behavior so that users can achieve their goals without thinking too much. Then users can use the product or service intuitively, smoothly, and comfortably without difficulty.

Remove Obstacles for Users

Even small things can become very large obstacles when users use the product or service repeatedly.

Tips for UI/UX Design

This section explains how to design good UI and UX based on the purpose of UI/UX design.

Think from the User’s Perspective

The most important thing in UI/UX design is to think from the user’s perspective. A common case is that developers narrow their view while developing and pursue their own expression, resulting in a design that is convenient for developers rather than users. Novel design or multifunctionality can create stress if it does not match user needs, so care is needed.
To think from the user’s perspective, first become familiar with the target product or service. Gather as much data as possible about it, and from that data derive improvements for making it easier to use and more pleasant to experience.

Set Goals

It is also effective to think about whom your product or service is for, what it is for, how much recognition you want it to achieve, what user segment you want it to be used by, and how much you want sales or user numbers to increase. Once this is decided, the direction of UI/UX design is naturally determined. Conversely, if the goals are unclear, the finished result may also become vague.

Clearly Define Personas

Earlier, we mentioned “what user segment you want it to be used by.” A Persona is a typical target user who uses a product or service. To design excellent UI/UX, it is important to think clearly about what kind of person uses the target product or service and for what purpose.
For example, teenagers and middle-aged people prefer different designs and features. Even within the same genre, beginners, intermediate users, and advanced users require different quality and quantity of information.
Age, gender, attributes, and other details should be assumed carefully so the UI/UX design does not deviate from what the user needs.
Personas may be set based on actual data, or they may be fictional characters representing the type of user you want to attract. The more concrete the target user is, the easier UX is to design.

Design a Structure That Lets Personas Achieve Their Goals Comfortably

For example, if a user wants to buy a product, think about what process they must go through before completing the purchase. At the product selection stage, features such as sorting products by price or rating, or adding product reviews, can help users find better products. This lets users evaluate products more carefully and improves UX.

Repeat Verification

There is no single clear answer or final goal for improving UI/UX. One way to understand user needs is user testing. Observing people actually using your product or service, or receiving reviews, makes it easier to find improvements. For web services, analytics tools such as Google Analytics can be used to measure effects. Using the data obtained and repeatedly applying PDCA in detail is the shortcut to UI/UX that meets user needs.

Jobs That Handle UI/UX Design

Web Designer

It goes without saying that Web designers are representative jobs that handle UI/UX design. Separately from Web designers, there is also a job called UI designer that specializes in UI. The difference is that the Web designer’s role is to improve appearance itself, while the UI designer pursues functional aspects such as user ease of use and operability.

Engineer

Depending on the company, engineers may also handle UI/UX design. In small companies, engineers often design apps or websites while thinking about UI/UX. Even in large companies, when engineers take charge of upstream development processes, UI/UX-aware design is required.

Summary

UI is the part related to appearance and operability that becomes the point of contact with users, while UX is the entire user experience that includes UI. To create good products and services, you must first perform UX design that understands user needs, and then design UI that allows users to understand intuitively and use smoothly without hesitation.
To do this, it is important to think from the user’s perspective, analyze data, set goals, and derive the best approach for them.

devkuma – UI