UX/UI and Design Terminology

When you enter the world of digital design and come across terms like UX, UI, persona, wireframe, but aren’t sure what they actually mean? You’re not alone. The boundaries between different design disciplines often seem unclear, and specific UX/UI terminology can be confusing for beginners.

In this text, we’ll explain some of the most common terms you may encounter. We’ll go through the basics, explain what UX is, what UI is, and what graphic design is, and provide you with a glossary of key terms that will help you communicate confidently 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 how the product looks, but how the user feels while using it.

Now imagine you’re building a house. The UX designer is the architect. They don’t choose the wall color; instead, they plan the layout of the rooms, make sure the hallways are wide enough, the doors are in the right place, and that moving through the house feels logical and effortless.

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 people with disabilities or any other limitation, whether permanent or temporary, use it?

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

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

What Is UI Design? The Art of the Visual 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 house-building example. If the UX designer is the architect, the UI designer is the interior designer. They choose the colors, furniture, materials, and decorations to make the space aesthetically appealing and functional.

The UI designer is responsible for everything the user sees and everything they interact with on or off the screen. Some elements a UI designer works with are:

• Buttons (Buttons): What they look like, where they are placed.

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

• Typography: Choosing fonts and their size for readability, their relationship and hierarchy.

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

• Layout of elements: Visual hierarchy that guides the user to the desired goal.

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

UX vs. 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 discussion topics. A product can have a beautiful UI, but if the UX is poor (e.g., complicated navigation), users will quickly abandon it. Conversely, a product with excellent UX but poor UI may seem unprofessional and off-putting.

The best products have the perfect synergy of 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 an 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 scope, including:

• Branding: Designing 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 may work on UI design elements (e.g., creating icons or illustrations), but their focus is on static visual communication, while the UI designer focuses on interactivity and functionality within the 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 the typical user of your product. It helps the team focus on the needs and goals of the real audience, rather than on 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. The journey map helps identify pain points and opportunities for improvement.

Wireframe

A wireframe is a basic, low-fidelity representation of the structure of a website or application. It focuses solely on the layout of elements, information hierarchy, and functionality, without colors, fonts, or images. It is like a draft 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, the user flow, and the basic functionality, without wasting time on colors, typography, or visual effects. The low-fi approach enables rapid iteration, easier team collaboration, and feedback in the earliest stage of development. Because of 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. In this phase, typography, colors, styles, spacing, animations, and the complete visual identity are defined, while the functionality and user flow look almost like those of a finished product. High-fi prototypes enable a realistic representation of the user experience, precise testing, and clear communication with stakeholders or developers. This level of fidelity is used when the concept has been validated and is ready for final refinements, 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 while they use your product in order to identify usability problems. Participants are given tasks, and designers monitor where issues, confusion, or frustration arise.

Essential UI Terms

Now, let’s look at UI terminology that defines the visual side of design.

Design System

A design system is a centralized collection of all components, rules, and standards used in creating a product. 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 is used strategically to evoke certain emotions and direct the user’s attention (e.g., using a bright color for primary calls to action).

White Space

The empty space between elements on the 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 in a different color so they attract attention before less important ones (e.g., body text).

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

These terms are not just jargon; they represent key concepts that guide the process of creating products users will love. The next time you hear the word "wireframe" or "persona," you’ll know exactly what it means.

Have an idea for an app or website, but aren’t sure where to start? Let me help you turn your vision into a functional and beautiful digital product. Contact me today for a free consultation!