UX/UI and design terminology

Are you entering the world of digital design and coming across terms like UX, UI, persona, wireframe, and you're not sure what they actually mean? You are not the only one. The boundaries between different design disciplines often seem blurred, and specific UX/UI terminology can seem confusing for beginners.

In this text, I explain some of the most common terms you might encounter. I go through the basics: what is UX, what is UI, and what is graphic design. Finally, I provide a glossary of key terms that will help you communicate more easily with designers, developers, and clients.

What is UX Design? Understanding User Experience

UX Design (User Experience Design), or user experience design, is the process of creating products that are useful, easy to use, and pleasant to interact with. The focus is not on what the product looks like, but how the user feels while using it.

Imagine you are building a house. The UX designer is the architect. They do not choose the color of the walls, but plan the layout of the rooms, ensure that the hallways are wide enough, that the doors are in the right place, and that you move through the house logically and effortlessly.

The goal of UX design is to answer the following questions:

• Is this product useful? Does it solve a real user problem?

• Is it usable? Can users easily achieve their goal?

• Is it accessible? Can it be used by people with disabilities or other limitations, permanent or temporary?

• Is it pleasant to use? Does using the product itself create a sense of satisfaction?

The UX process often includes research, analysis, and testing to ensure that the final product meets the needs of the target audience.

What is UI Design? The Visual Part of the Interface

UI Design (User Interface Design), or user interface design, deals with the visual appearance and interactive elements of a product. Let's go back to the example of building a house. If the UX designer is the architect, the UI designer is the interior designer. They choose colors, furniture, materials, and decoration to make the space aesthetically appealing and functional.

The UI designer is responsible for everything the user sees and interacts with in any form on the screen or off it. Some elements that a UI designer deals with are:

• Buttons: What they look like, where they are located.

• Icons: Clear, recognizable, and aligned with the brand identity.

• Typography: Font selection and size for readability, their relationship, and hierarchy.

• Color palette: Alignment with the brand and color psychology to achieve the best effect on users.

• Element layout: Visual hierarchy that guides the user to the desired goal.

In short, what is UI? It is the link that allows the user to interact with the product. A good UI is intuitive, consistent, and aesthetically pleasing.

UX and UI: Key Differences (and how they work together)

Although they are closely related, UX and UI are not the same thing. The difference between UX and UI is one of the most common topics of discussion. A product can have a beautiful UI, but if the UX is bad (e.g., complicated navigation), users will quickly abandon it. Conversely, a product with excellent UX but poor UI can look unprofessional and off-putting.

The best products have both.

And where does graphic design fit in?

Graphic design is a broad discipline that focuses on visual communication and presentation. Its primary goal is to convey a message to the audience using typography, images, colors, and shapes.

While UX/UI design primarily deals with interactive digital products (applications, websites), the term graphic design covers a much broader spectrum, including:

• Branding: Design of logos, business cards, letterheads, and other materials that make up a brand.

• Marketing materials: Brochures, flyers, billboards, advertisements.

• Packaging design.

• Social media graphics.

A graphic designer can work on UI design elements (e.g., creating icons or illustrations), but their focus is on static visual communication, while a UI designer is focused on interactivity and functionality within a digital environment.

Key UX Terminology You Need to Know

These are some of the basic UX terms you will often encounter.

Persona

A persona is a fictional character created based on research (in a process called UX research), representing a typical user of your product. It helps the team focus on the needs and goals of the real audience, rather than their own assumptions. A persona has a name, age, occupation, goals, and frustrations.

User journey map

This is a visual representation of all the steps and emotions a user goes through while using your product or service to achieve a specific goal. A journey map helps identify pain points and opportunities for improvement.

Wireframe

A wireframe is a basic, simplified (low-fidelity) representation of a website or application structure. It focuses solely on the layout of elements, information hierarchy, and functionality, without colors, fonts, and images. It is like a blueprint or skeleton of the design.

Low fidelity

Low-fidelity design represents an early and simplified version of a design. Its purpose is to quickly show the layout of elements, user flow, and basic functionality, without wasting time on colors, typography, or visual effects. This approach allows for rapid iteration, easier team collaboration, and feedback at the earliest stage of development. Due to its simplicity, it is ideal for testing ideas, solving problems, and defining direction before investing in the final design.

High fidelity

High-fidelity design represents a detailed and visually finalized version of a product or interface. At this stage, typography, colors, styles, spacing, animations, and the complete visual identity are defined, while the functionality and user flow look almost like a finished product. Such prototypes allow for a realistic representation of the user experience, precise testing, and clear communication with clients or developers. This level of fidelity is used when the concept is validated and ready for final adjustments, presentation, or development.

Prototype

A prototype is an interactive model of the final product used for testing before programming begins. It can be low-fidelity (a clickable wireframe) or high-fidelity, which looks and functions almost like the real product.

Usability testing

This is the process of observing real users as they use your product to identify usability issues. Participants are given tasks, and designers track where problems, confusion, or frustration arise.

Basic UI Terms

Below are UI terms that describe the visual part of the design.

Design system

A design system is a centralized collection of all components, rules, and standards used in product creation. It includes everything from colors and typography to specific buttons and forms. Its goal is to ensure consistency and speed up the design and development process.

Color palette

A set of colors used in interface design. A good palette is aligned with the brand and used strategically to evoke specific emotions and guide user attention (e.g., using a bright color for main calls to action).

White space

The empty space between elements on a screen. White space (which does not have to be white) is crucial for readability, organization, and reducing visual noise. It gives elements room to breathe.

Responsive design

An approach to design that allows a website or application to automatically adapt to different screen sizes, from desktop monitors to tablets and mobile phones. The goal is to provide an optimal experience on every device.

Hierarchy

Visual hierarchy is the principle of organizing elements to clearly show their importance. The most important elements (e.g., a heading) are larger, bolder, or a different color to attract attention before less important ones (e.g., body text).

What to Remember

Understanding basic UX/UI and design terminology is the first step toward creating better digital products. Now you know that UX design lays the foundation and ensures functionality, UI design provides the visual look and makes interaction pleasant, while graphic design serves the broader purpose of visual communication.

These terms are not just professional jargon. Behind them are concepts that guide the process of creating products that users will love. The next time you hear the word "wireframe" or "persona," you will know exactly what it means.

How this looks in a real project is shown by the eNovcanik mobile app design.

Do you have an idea for an app or website, but aren't sure where to start? I can help you turn it into a functional and beautiful digital product. Contact me for a free consultation.