The Ultimate Glossary of UI-UX Terms for Designers

Software design and development is an expansive trade comprising professionals from varied fields of study. While we best learn concepts on the job, what also helps is to have a resource that congregates important concepts and definitions to help us clarify any ambiguities with ease. This ultimate list of 88 important UI UX terms simplify technical jargon and help you navigate through conversations and documentation with confidence.

88 Important UI UX Technical Jargons

1. Accessibility

Accessibility or accessible design helps differently-enabled users to interact with a product. It involves designing for people who are color blind, blind, deaf, and people with cognitive disabilities, among others.

We made use of the principles of accessible design to create a product that simplified application to Medicaid for senior citizens.

2. Adaptive

An adaptive interface is a set of layouts designed specifically for different devices. It is designed to detect the device type being used and display the appropriate layout for it. Different versions of the same site are created, these versions are optimized to be viewed on mobiles, desktops, or tablets.

3. Affinity map

Affinity mapping is a method used to interpret and group insights from a user research exercise. It can be used to categorize large volumes of data into designated categories based on themes or relationships.

4. Affordance

Affordances are clues that tell us what an element can do to us. Affordances are properties of objects denoting the actions the users can take. From the context of the user interface, they help in communicating to users what can and cannot be done on a screen. Users should be able to perceive affordances without having to consider how to use the items. For instance, buttons on interfaces, for example, afford being pressed to trigger an action.

5. Agile

Agile is a process by which a team can manage a project by breaking it up into several stages and involving constant collaboration with stakeholders and continuous improvement and iteration at every stage. Instead of building the entire product at once, Agile breaks it down into smaller bits of user functionality and assigns them to two week cycles called iterations.

Know more about what designers can learn from the Agile methodology in this blog.

6. API

Application Programming Interfaces, or APIs, are pieces of software that help different applications communicate with each other. Products develop APIs to let you access and read the information on their dedicated server easily.

7. Artificial Intelligence (AI)

Artificial intelligence (AI) refers to the simulation of human intelligence in machines that are programmed to think like humans and mimic their actions. Artificial intelligence systems include predictive systems, audio processing, speech to text, and natural language processing.

Understand the role played by AI in enterprise UX design in this blog.

8. Back and Front-End Development

Back end development refers to the server-side of an application and everything that communicates between the database and the browser.

The front-end is what users see. Think buttons, text, beautiful colors, and the layer seen on screen when interacting with a product.

9. Backlog

A queue of work that needs doing on a product. A backlog is a list of tasks required to support a larger strategic plan. In a product development context, it contains a prioritized list of items that the team has agreed to work on next. Typical items on a product backlog include user stories, changes to existing functionality, and bug fixes.

10. Breadcrumb

Breadcrumb navigation systems help users understand their location in a website or app. They’ll show a sequence of steps users have to take to get where they are.

11. Bug

Bugs are mistakes in software that can cause a product to malfunction, behave in unintended ways, or even crash.

12. Call-To-Action (CTA)

A call to action button is a visual or interface element that invites a specific action from the user. In apps and websites, CTAs often take the form of a short snippet of text, followed by a button.

13. Card Sorting

An exercise where participants are asked to sort a batch of cards into different categories based on their interpretation. It’s a way of understanding how people intuitively associate different items with one another. This can then be used as a basis for navigation structure or other decisions around information architecture.

14. Chatbot

Chatbots are a chat interface that allow the user to ask questions to the system and receive answers and/or guidance. They are a popular customer service tool made to mimic the experience of texting a friend.

15. Checkbox

A checkbox is a UI element that allows the user to make a binary (yes/no, cancel/confirm) choice for a specific option.

16. Clickstream

Clickstream refers to the path of clicks taken by the user to accomplish a goal.

17. Customer Experience (CX)

Customer experience or CX, is the customers’ holistic perception of their experience with a business or brand. It covers every interaction the customer has with a business, from navigating the website to talking to customer service and receiving the product/service they bought. CX tends to be broader in scope than user experience (UX). UX is focused on a person’s interaction with an app or website, while CX is more about that person’s overall experience of a brand, including advertising, product quality, and customer support.

18. Customer Journey Map

This concept is also borrowed from service design. It is a document that shows how a customer moves through an entire service, and the different touchpoints they encounter. (See also user journey.)

Learn more about the importance of touchpoints on the overall customer experience in this case study.

19. Customer Relationship Management (CRM)

Customer Relationship Management software systems help manage business processes, like sales, data, and customer interactions, including inbound support tickets, and sometimes email marketing as well.

Go through these easy tips to improve CRM design in this blog.

20. Design debt

Design debt is the natural decay that accrues as a project matures—new features are added, old features grow stale, and the codebase starts to get unwieldy.

Learn more about how design debt weighs down businesses in the long run in this short video.

21. Design Sprint

A collaborative methodology for rapidly identifying and solving a design problem. The five stages of a sprint are: define the challenge, diverge (ideate possible solutions), converge (choose the strongest concepts to develop), prototype, and test.

When can you use design sprints in your team? This short video tells you all about it.

22. Design System

A library of user interface elements, components, and guidelines that are used as the basis for any new and updated features in a product. The purposes of a design system include: maintaining consistency across a product when new features are added; making it easier to update components across an entire product; and reducing the amount of development time involved in any project.

23. Design Thinking

Design thinking is a 5-stage method for creative problem solving. The 5 stages are:

1. Empathize: Understand the challenge
2. Define: Define the problem
3. Ideate: Brainstorm potential solutions
4. Prototype: Build your solutions
5. Test: Test your solutions

24. Diary Study

A diary study is a research method used to collect qualitative data about user behaviors, activities, and experiences over time. In a diary study, data is self-reported by participants longitudinally — that is, over an extended period of time that can range from a few days to even a month or longer.

25. Empathy Map

Empathy maps are collaborative tools that help visualize user behavior, attitudes and feelings. They are split into 4 equal quadrants containing information about what the user is saying, thinking, doing and feeling. The user persona is placed at the center. Then, each quadrant is filled with information collected through user research.

26. End User

An end user is any user of an app or website. Do not mistake end users to be customers always. In the B2B context, the end user would be the employees using the product.

27. Eye Tracking

An advanced method for assessing the visual hierarchy of information on a screen. Eye trackers record where the user is looking on a screen and for how long. Results are often displayed in the format of a “heat map”; this information can then be used to optimize a design.

28. Fidelity

A concept in both wireframing and prototyping. Low-fidelity wireframes and prototypes aim to cover basic layout and links between screens, while high-fidelity prototypes and wireframes aim to be very close to final visuals and functionality.

29. Flat Design

Flat design is a user interface design style that uses simple, two-dimensional elements and bright colors. It is often contrasted to the skeuomorphic style that gives the illusion of three dimensions through copying real-life properties.

30. Flowchart

Flowcharts illustrate the steps a user can take to complete a task on a product.

31. Floating Action Button

A user interface (UI) element that sits on top of a screen design, often in the bottom-right-hand corner, and doesn’t move when the user scrolls. An example of a FAB is the floating “plus” button in Gmail’s interface.

32. Form

A UI element that gathers information from the user. Forms range from extremely short to extremely long. An example of a very short form is an email signup, which may have only an email address field and a submit button. An online loan application, however, might have a series of long forms in the flow.

33. Full Stack

Typically heard in the context of “full-stack developer”. The term refers to a person or role, and means that the person has both front-end and back-end development skills. It’s becoming increasingly common to hear the term “full-stack designer”—this typically means that the person has a mix of UX, visual/UI, and graphic design/illustration skills

34. Gestalt Principles

A set of visual principles of grouping, underpinned by the idea that elements sharing proximity or features in common tend to be understood as related to one another.

Here’s a blog explaining the use of Gestalt principles to communicate visual hierarchy.

35. Graphical User Interface (GUI)

A GUI (graphical user interface) is a system of interactive visual components for computer software. A GUI displays objects that convey information, and represent actions that can be taken by the user.

36. Graphics Interchange Format (GIF)

A legacy web graphics format that has frame-by-frame animation. It’s now used almost exclusively for animation.

37. Grid

A layout constraint that determines the positioning of user interface elements on a screen or page. Grids are fundamental to effective design systems.

38. Hack

In software development, a hack is a quick solution to a specific problem or bug, but which probably won’t be a long-term solution.

39. Heat Map

A heat map is a graphical representation of the areas on your product that receive the most user attention. They use a warm-to-cool color spectrum to show you where exactly your users are going. The red areas in the heat map below, for example, are the areas users interact with the most on the website.

40. Hamburger Button

A visual pattern of three (or sometimes two or four) horizontal lines that typically indicates a hidden menu. Tapping or clicking it reveals the menu.

41. HyperText Markup Language (HTML)

A markup standard used for coding web pages. HTML has gone through many iterations, the latest of which is HTML5.

42. Human-Computer Interaction

HCI is a field of study concerned with the design and use of computer technology. It studies how we interact with interfaces and computers today.

43. Hybrid App

Hybrid mobile apps combine both native and web technologies. They’ll often use a combination of technologies like HTML, CSS, and JavaScript and will live inside a native container that lets it access device capabilities.

44. Information Architecture (IA)

The structure and organization of information in a website or app. In UX design, it tends to refer to the process of organizing content and creating a navigation structure that makes sense to the user and allows them to find what they need in a logical way.

45. Interaction Design

Interaction Design, or IxD, is the practice of designing interactive digital products and considering the way in which users will interact with them.

Read about the important dos and don’ts of interaction design in this blog.

46. Iteration

The process of repeatedly gathering feedback on a design solution, and acting on that feedback to make targeted improvements and move towards a final design.

47. Javascript

We’ve looked at HTML and CSS, two of the 3 cornerstone technologies in web development. Javascript, the 3rd cornerstone, defines how both the HTML and CSS should behave. Think of it as the language that helps us make elements on a page interactive. Converting PSD to HTML is vital for making designs both visually appealing and functional.

48. KPI

KPIs, or Key Performance Indicators, are measurable values that help us understand and track how well a product is doing. As a UX designer, you’ll often work with KPIs like task success rate, user error rate, and time on task.

49. Lean UX

Remember Agile? Lean UX, based on Agile, is a collaborative user-centric approach that prioritizes “learning loops” (building, learning, and measuring through iterations) over design documentation.

50. Material Design

Material Design, often called just Material, is a design language developed by Google used in Android devices.

51. Mental Model

A mental model represents what the user believes to be true about a product’s functionality. The more a user’s mental model aligns with a product’s functionality, the easier it will be for them to use it.

52. Microcopy

Microcopy refers to the tiny tidbits of copy found on websites, applications, and products. These short sentences tell a user what to do, address user concerns, provide context to a situation

53. Minimum Viable Product (MVP)

An MVP is a basic version of a product that is designed specifically for early release, to test marketability and whether further resources should be invested in developing a fully-featured product.

Read all you need to know about the MVP process in this blog.

54. Mobile Web

The mobile web refers to browser-based World Wide Web services accessed from handheld mobile devices, such as smartphones or feature phones, through a mobile or other wireless network.

Mobile UX for enterprise applications is a different ball game altogether. Read this blog to know more about designing mobile versions of enterprise applications.

55. Mockup

A term that gets thrown around often in work environments, mockups are static representations of a product. You can’t click through them or interact with them. They are essentially a picture of what the product will look like.

56. Modal

Also known as a modal window, modal dialog, or modal pop-up. A kind of in-window or in-app dialog box that either displays a message to be dismissed, or invites some kind of action from the user. Modals are often seen when people first land on a website, for example to offer a voucher code or encourage the user to sign up. They’re also often used to convey important information, like advance notice of a service outage.

57. Navigation

An element of user interface (UI) design that manages how users move between sections and features in an app or website.

58. Near Field Communication (NFC)

A technology that allows two physical devices that are in close proximity to share information. This is the technology that allows you to use your smartphone handset to pay at checkouts.

59. Onboarding

This refers to the steps that a user goes through when they first open up an app or join a service. Onboarding is an extremely important part of the overall user experience. Even if you have a user-friendly product, people are likely to abandon it during onboarding if they are not brought up to speed effectively.

60. Paper Prototyping

The creation of a product prototype using roughly sketched interfaces on pieces of paper. Paper prototyping is often used in design sprints and any other setting where rapid prototyping is needed.

61. Persona

A persona is a document that takes findings from multiple user research data points (such as interviews and questionnaires), and synthesizes them into an archetype. Although the “person” in a persona doesn’t exist as a real individual, each persona comes to represent an idealized end user of a product.

Read about developing personas for enterprise products in this blog.

62. Pixel

Pixels are literally tiny squares used to construct the images seen on device displays. They aren’t a specific color, but rather, change to be able to show different images and graphics.

63. Picker

A picker is a UI element that allows the user to choose, for example, a date, time, or color. Pickers tend to be used where there is a very high number of options, or the input is highly conceptual.

64. Progressive Enhancement

The practice of adding functionality or visual finish as technical constraints are removed. For example, a browser that supports cutting-edge web standards might allow extra touches when it comes to interaction and 2d animation.

65. Prototype

A prototype is a simulation or sample version of a final product, which is used for testing prior to launch. Its goal is to test products (and product ideas) before sinking lots of time and money into the final product. Examples of digital prototypes include interactive mockup of an app, website, or device.

Here’s a blog that will help you figure out the right prototyping method for your product.

66. Responsive Design

Not be confused with adaptive, responsive websites adapt to fit the device they are being displayed on. They are a single layout that shrinks and stretches and rearranges the content on it to be easily viewed on each device type.

67. SaaS

Software as a Service, or SaaS, is a software distribution model in which software is licensed on a subscription basis and hosted on external servers. Subscribing users are able to access it through the web. The practice of delivering software via online subscription, rather than as a standalone product that is purchased one-off. An Office 365 subscription is SaaS; Office 97 on a CD-ROM is delivered as a one-off license.

68. Scalable Vector Graphics (SVG)

This is a graphics file format that has been around for a long time, but is now supported by mainstream web browsers, so is being used more often online. The advantage it has over pixel-based graphics formats like PNG and JPG is that an SVG can be resized infinitely without losing quality. This is because the file is saved as a set of mathematical data about curves and points, not as an array of color values for individual pixels.

69. Scrum

A set of project management practices emphasizing daily communication, flexible planning, and short, focused phases of work.

70. Switch or Toggle

A UI element that allows the user to turn a setting on or off.

71. Storyboard

Storyboards are a visual representation of a user’s experience with a product or problem space. They are a film technique we’ve adopted and look a lot like comic strips.

72. Task Analysis

Task analysis is the process of listing tasks or the steps a user takes to complete any given goal from the user’s perspective. It is typically done during early stages of product development to help us identify and communicate problems in the user experience.

73. Technical Debt

Technical debt is similar to design debt but instead of taking a toll on the design system, it takes it on the code.
Products accrue technical debt whenever an easy but messy development solution is favored over a better yet more time-consuming alternative. Eventually, the messy solution will need to be cleaned up, generating work. This is what we call technical debt

74. Unit Testing

The process of testing parts of an application to ensure they’re working properly. It can be done manually or can be an automated process.

75. Usability Testing

Usability testing is a research method that lets us evaluate how easy a product is to use by testing it on a group of representative users.

76. User-Centered Design

Like the term suggests, user-centered design, or UCD, is an iterative design framework in which users and their needs are always kept at the center of every decision.

77. User Experience (UX)

The user experience refers to a user’s emotions, attitude, and perceptions about a product, system, or service. In other words, it is how you feel while interacting with an app or website. Good UX makes a product useful, usable, desirable, findable, accessible, and credible.

78. User Interface (UI)

User interface is the front-end of an app or website that the user directly interacts with through an input device.

79. UI Element

User interface (UI) elements are all the different parts found on an interface we need to trigger specific actions or get around an app or website. Think the buttons, input fields, toggles, and radio buttons.

80. UI Pattern

UI patterns are reusable solutions to common usability problems in products or on the web expressed as a collection of UI elements. Think about a login screen. A common login UI pattern is made up of two input fields, one for a username and one for a password, and a button to submit these. We call this collection of elements a login pattern.

81. User Flow

A user flow describes the intended series of steps a user needs to take to complete a goal on a product. They often include a name, steps and a description of what happens during each step.

82. User Journey

A user journey is a description of the steps a user will go through when using a product. This usually takes the form of some kind of diagram, but formats vary widely. Journey mapping is also a concept in service design.

Learn more about the application of journey mapping while designing complex enterprise solutions in this blog.

83. User Research

User research is the methodic study of target users—including their needs and pain points. It focuses on understanding user behaviors, needs, and motivations through observation techniques, task analysis, and other feedback methodologies.

Here are some useful tips to get your stakeholders on board with user research.

84. User Scenario

A story-like description of a specific situation or chain of events in which a user might interact with a product. User scenarios help designers and developers understand the context in which a product is realistically going to be used and to grasp any special constraints or opportunities that the situation presents.

85. User Stories

User Stories share actions different kinds of users can take in a product. The formula for user stories is simple:

“As a <insert kind of user>, I want <insert feature or action>, to be able to <insert desired outcome>.”

86. Waterfall

In software waterfall development, each phase must be completed before the next phase can begin. So, all the designs would have to be completed before developers could begin any work.

87. White space

White or negative space refers to the unoccupied or blank space on a page. In the shot below, white or negative space is used cleverly to shape a cursor.

88. Wireframe

A wireframe is a rough version of a screen design that allows the designer to rapidly explore different options for layout and visual hierarchy and gather feedback through testing. Typically, a wireframe does not include any decision-making around color or typography, although wireframes can range from low- to high-fidelity.