UI/UX is a trending domain nowadays, many people want to be UI or UX, or Product Designers. But most people are not aware of some very important terminologies which are often used in the field or by the designer themselves. Also, in the last 5 years, the demand for UI/UX designers has increased thus creating an increase in job openings. Every year, there are more than thousands of job postings for UI/UX designers. There are more than 50 UI/UX terms designers use in their daily life, here we have mentioned some of the most common and top UI/UX terms designers come across.
To have a good fundamental understanding of the field, knowing those terminologies is very important. In this article, we’ll explore those terminologies with examples and their general usages.
Top UI/UX Design Terminologies That Every Designer Must Know
1. Customer Experience (CX)
Stands for Customer Experience. But aren’t UX and CX the same thing? NO, absolutely NO. The simplest difference is that “CX is a bigger umbrella under which UX falls”. CX or customer experience is the term we use to describe a customer’s complete journey. Including all the touchpoints encountered by a user within a brand through its various goods and channels. CX can tell how the consumer feels about each interaction made with multiple channels of a Brand. Trust in brands is significantly impacted by customer experience, therefore. It can also be referred to as service design.
For example, Geeksforneveropen is a “Brand”, and XYZ is a user that interacts with different touchpoints or interactions such as “Blogs”, “Video tutorials”, “Coding platforms” and “Job Portals”.
2. Adaptiveness
This refers to functionality where the design is adaptive as per specific screens. It is a group of screen layouts, created especially for various devices that make up an “adaptable interface”. So basically such designs recognize the type of device being used and then as per the layout show the interface created for it. Users get to see a particular version of the website or mobile app that has been made tailored for that mobile, desktop, or tablet. But the only drawback of adaptive design is that code changes made for one design will only reflect that design only. That means development efforts will be much higher if multiple screens are targeted.
3. Responsiveness
This refers to functionality where the design adapts to the screen type it is being displayed. Whereas adaptiveness is when we design a tailored interface as per particular screens. Responsiveness is not to be confused with adaptiveness, both are very different in nature. Responsive designs are the single designs/interfaces that fit in the screen by adjusting, rearranging, shrinking, or stretching. There is only one design that exists, therefore devs don’t have to code interfaces for each different screen size or dimension. Responsiveness is more popular but in design, everything depends on the context you are solving for.
4. Site Map
A sitemap is a diagram that represents a website/app’s overall structure. Sitemap and IA(Information Architecture) are generally mixed together but they are different concepts. A sitemap gives the Information Architecture of the digital product. It basically shows the interconnectivity, and content hierarchy of different segments. A sitemap will only include map pages.
For example: Let’s take any e-commerce app, so the sitemap here would be the Home page, Men’s section, and Women’s section.
5. Information Architecture(IA)
Generally confused with Sitemap but is very different. IA is a combination of organizing content, labeling, and navigation schemes. A good IA always helps users navigate smoothly back and forth without getting lost. It is an organized set of labels given on the website.
For example: Under the primary navigation label “Doctors” the secondary navigation a user would be expecting are “Find a doctor”, and “Request an appointment”.
6. MVP
It’s the “Minimum Viable Product”, capturing some core set of characteristics that it must have within a product in order to be launched. This can be the most effective set of functionalities that you’re targeting. MVP is created for the means of testing. Once the core functionalities are built and tested then going ahead we’ll build more components or elements upon the base variant. MVP helps in frequent releases and captures useful customer inputs.
7. A/B Testing
The process of contrasting 2 or more design variants, in order to know the best variant out of them. Generally done to check which variant is more close to the user’s mental model. Variants in a/b testing can be exactly the same design with a difference of a few elements(called traditional a/b testing) or can be completed in 2 different designs. (called multivariate a/b testing).
For example: When the team is not sure about the CTA style and color is not engaging, try to put both in front of users as a/b test variants. Whichever variant gets more votes or conversion rate, can be picked up as a winner.
8. Mockup
This term is very popular among product managers and designers. Mockups are the static representation of visual design and screen interfaces. These can be only viewed but can’t be interacted with or tested. Mockups are the final screen renders that show how the end product would look like.
9. Mental Model
A mental model represents what a user perceives to be true about a product’s functioning. The mental model helps users to better utilize a product if their mental model matches the functionality of a product which is called the “Conceptual model” to a greater extent. It is seen in many kinds of research that about 80% of usability issues arise due to a clash between the mental model and the conceptual model. So it is very important for a designer to match and align the conceptual model of an app or website with the user’s mental model.
10. Key Performance Indicators (KPI)
Called the Key Performance Indicators, these are quantifiable metrics that enable us to track & comprehend a product’s performance i.e is it fulfilling the user’s need, etc? Designers & product managers decide these and often work to track success rates, conversion rates, and other ROIs.
11. ROI
ROI(Return on Investment) is the financial statistics that are used to assess the size of overall investments and improvements a design would make. ROI measures help to determine achievable design goals from product and business aspects. ROI measurements include points such as conversion rate, decrease in the drop-off, increase in usage, etc.
For example, the conversion rate for an e-comm app/website is measured by # the count of visitors, buying the product. Completing the whole funnel from start to end without dropping off in the middle.
12. Heat Maps
A heat map is a graphical representation of different areas where “Most” of the people gazed at or viewed at. Heap maps are generated using coulometers (the eye tracking tool). The color varies from Green(cool) to Red(warm), indicating the frequency of views and also giving track of how users are scanning the app/website. The red spots in the heat map represent the areas that visitors engage with the most on the website. Whereas green spots show the least engagement of visitors. Heat maps when used to test early designs can help find out the most and least engaging elements on the page.
13. Grid Systems
It’s the design tool used by visual designers that helps to properly organize different elements on the screens. Consists of rows, columns, gutters, and margins.
For example: When designing websites we generally use 12 columns grids and for mobile, it is 4 columns.
14. Affordance
The visual cues tell users what an element can afford to do. While designing user interfaces, affordance helps to properly indicate what a user can and can not do on a screen.
For example, A door’s handle that communicates a push or pulls to the user is called affordance.
15. Accessibility
The process of designing a product such that any individual with disabilities or impairments whether it is permanent or temporary can engage with it is known as accessibility. Interfaces that follow accessibility are called accessible designs. Creating designs while having accessibility in mind is good for all, among others, and accessible to those who have color, cognitive, or motor impairments.
For example: Designing with grayscale colors for complex data charts or graphs is good for all and also for people with color blindness impairment.
16. Card Sorting
It is an effective tool in providing user vocabulary of labels. The design team gives users different cards and labels for a card-sorting exercise. As per the user’s understanding, they arrange those themes on the cards in a way that makes sense. This exercise aids in our comprehension and site information architecture design.
17. Empathy Map
It is a collaboration that enables users to see user behavior, attitudes, and feelings. While creating personas, is it good to create empathy maps to empathize with the user a little more? Empathy maps are divided into four equal quadrants, each of which shows data about the user’s actions, thoughts, motivations, and feelings. Placed along with the user persona in the center. Later while data gathering, each quadrant is filled.
18. Task Analysis
A set of techniques for decomposing actions a user takes to accomplish any given objective from their point of view. It is usually carried out in the early phases of product development, during research to assist in identifying and communicating user experience issues. Helps to evaluate and refine the task flow. So basically as a designer, you have to list down all the tasks and goals associated with that task and then provide steps involved to accomplish that task.
19. User Scenarios
These are short stories about a specific user with some specific task to be accomplished. Generally used in the early phases of product development, as they provide us with information on the user’s identity, motivations for using your product, and goals. Scenarios are critical for both developers and designers while doing usability testing. Scenarios revolve around the user(in terms of what the user wants, and what they’ll be able to do) but NOT around design or screens.
20. Persona
Persona is generally referred to how a user profile looks to get an idea of the audience’s interest. When a designer designs UI on the basis of a specific audience demand instead of a generic one. It generally represents a typical user of an app or website. The simple steps to be followed are: the designer has to collect information from users and on the basis of behavioral patterns, create a persona.
Conclusion
So these are a few important terminologies that a beginner in the field should know. Knowing these terms helps make a good field foundation and also while working as a designer. Next time you hear people talking and they mention KPI, and ROI you don’t feel left out in the conversation as a junior designer. Use these most common UI/UX terms and get hands-on experience with them.
FAQs
Q1. What is UX terminology?
Ans. User Experience refers to the user’s response to a product or system. It is about how a customer feels while interacting with an app or a website. A good UX makes a product usable, desirable, accessible, and credible. UX terminology refers to some of the most frequently used terms.
Q2. Which are the common terms used by UX designers?
Ans. Some of the most common terms used by UX designers are:
- User Research
- UI Elements
- Architecture
- Persona
- Customer
Q3. What are the 3 most important skills for a UI UX Designer?
Ans. The three most important skills needed for a UI/UX designer:
- Communication
- Collaboration
- Interactive Design
Related Articles:
- User Interface (UI) and User Experience or UX Design
- UI & UX Developer – Education, Skills, Salary, and Career