UX Design Vocabulary

User-centred design (UCD)

places the end user front and centre throughout the product design and development process. It's based on a set of principles which prioritise the end user, such as involving users from the very beginning of the process (i.e. through user research), getting real user feedback along the way and designing iteratively to keep improving the user experience.

Qualitative user research

provides insight into your users' thoughts, motivations and behaviours. It gathers qualitative data—data which cannot be measured or counted but is extremely valuable nonetheless. An example of a qualitative user research method is a user interview, where your data comprises what the user said during the interview.

Affordances

refers to all the actions that are possible with a specific object or element, depending on the user's capabilities. For example, a cupboard has the potential to be opened but only if you can reach the handle. A car has the potential to be driven but only if you are able to open the car door, start the engine and so on. When designing digital products, the goal is to create elements whose affordances (i.e. possible actions) match the user's expectations. For example, if you design a button, the user will likely expect to be able to click it.

Below the fold

refers to content further down the page which the user would need to scroll in order to see

Above the fold

refers to content that is visible at the top of a website; the user doesn't need to scroll to see it

Typography

refers to how text is arranged and styled

Mental model

relate to how our users expect a particular product or experience to work, based on their experience with similar products. It's important to design with the user's mental models in mind so as not to throw the user.

UX design (user experience design)

relates to how a user feels whenever they use or interact with a product or service.

Design patterns

repeatable, reusable design components used to solve usability issues that users commonly experience. For example, the breadcrumb navigation system (number 13 in our UX glossary) is a --- used to show the user their pathway from the homepage to the page that they're currently viewing.

Quantitative user research

research to gather objective, measurable data about their users. An example of quantitative user data could be the number of people who visit a website in a given time frame or what percentage of users drop out of the checkout process at the last stage.

(UX) Audit

reviews an existing product (or an aspect of the product) to identify issues in the overall user experience. You can think of a --- as a user experience health check, providing you with useful data to inform future design decisions. --- are typically conducted for quality assurance purposes after the release of a new product or a major redesign, but companies may schedule them periodically just to keep a general pulse on the product.

Decision matrix

sometimes referred to as a prioritisation matrix - is a framework used to evaluate and prioritise ideas based on a set of predetermined criteria.

Paradox of specificity

states that when we design with a very specific user group in mind, we actually create products that appeal to a mass audience beyond that target group.

Cognitive load

the amount of mental effort required to complete a certain task.

UI elements

the building blocks used in the design of apps and websites. When you use a website or app, you encounter buttons, forms, menus, drop-down lists, image carousels and more. These are all examples of UI elements.

White space

the empty space around and between different elements in your design. White space helps to create elegant, clutter-free designs and to direct the user's attention to certain components. Note that white space doesn't have to be white; the name just refers to any blank space on the page.

Hick's law

the more options or choices a user has, the longer it will take them to make a decision or choose a course of action. In UX, the goal is to keep the number of options available to the user to a minimum, making it quicker and easier for them to navigate through the experience without feeling overwhelmed.

MVP (Minimum viable product)

the most minimal version of a product you can launch which has enough functionality for people to use, but will need further development. Launching an MVP allows you to see how the initial product idea is received before investing too much time and money.

Stakeholder interviews

the people within a company or organisation who are invested in the success of the product you're designing, and who can offer insights and input to inform the design process.

End user

the person you're designing for. It's the person who will use your product or service and it's the person whose pain-points you want to understand and solve.

Iterative design

the practice of continuously improving, refining and updating your product. An iteration of a design is essentially a new, updated version and designing iteratively enables you to keep improving the user experience on a regular and ongoing basis (rather than launching one version and never updating it again, regardless of how it's received by users).

Dark UX

the practice of deliberately designing in a way that tricks the user or subtly pushes them towards an action they probably don't want to take. A classic example of -- is making it confusing for users to cancel their subscription.

Animation design

the process of creating animated (or moving) graphics. In digital design, motion and animation are used to provide feedback to the user after a certain action—for example, an animation which conveys "loading" after a user clicks on a button. This clearly tells the user that their action has been registered.

User interface design

the process of designing user interfaces.

Onboarding (or user onboarding)

the process of getting new users familiar with your product

UX writing

the process of planning and writing all the text found on a digital product interface, with the goal of guiding the user through the experience. UX writing includes the creation of microcopy; things like error messages, welcome text and menu labels

Design deliverables

the tangible "things" or artefacts a UX designer produces throughout the design process. UX deliverables include things like personas, user journey maps, wireframes and prototypes.

Microcopy

the text which guides a user throughout a digital product.

Clickstream analysis

to gain a deeper understanding of user behaviour. --- records a user's trail of activity as they interact with an app or website—i.e. the sequence of clicks they make or the pages they visit.

Task analysis

to study and understand how users perform a series of tasks in order to complete their goal. The output of a task analysis is simply a list of all the steps a user will go through to complete their task. Task analysis typically takes place early on in the design process.

Visual design

to use text, images, colour and typography to enhance and aid the overall user experience. There is heavy overlap between visual design and UI design but one distinction commonly made is that visual designers consider the overall visual brand and identity rather than focusing on individual designs.

Affinity map (or affinity diagram)

used by UX designers to organise their findings from qualitative user research. This entails data that can't be counted or measured, and therefore requires thematic analysis. For example, if you interviewed five users, you might create an --- to cluster similar themes and topics together.

Fidelity

used to describe the quality of wireframes and prototypes—in other words, how closely the wireframe or prototype resembles what the live product will look like. Low-fidelity wireframes are bare-bones outlines, whereas high-fidelity prototypes include visuals and interactive properties, closely mimicking the look, feel and behaviour of a live website or app.

Beta testing

when you launch an unfinished product to a select group of users in order to see how it performs in the real world. This allows you to identify bugs, pain points and areas of improvement for your imperfect --- product before developing and releasing it fully.

User testing

when you test your product, new feature or prototype on real users in order to gain feedback and inform future iterations of the product. It sounds similar to usability testing but there's a difference: User testing is often used to determine if there's a need for your proposed solution among your user group, while usability testing specifically looks at how easy a design or product is to use.

Ethical design

"designing for good." Ultimately, it's about designing with the user's wellbeing in mind.

Interaction design (IxD)

a subset of UX, considers the interaction between users and products (whereas UX considers the entire user experience, not just the moment of interaction). There are five dimensions of interaction design: words, visual representations, physical objects or space, time and behaviour.

Design system

a universal source of truth for the design team—a collection of design assets, guidelines, constraints and best practices to adhere to when embarking on a new design project.

Contextual enquiry

a user research method which involves observing and interviewing users while they interact with your product in their "natural" environment. So, rather than asking them questions about their experience of the product after they've used it, you watch them in action and ask questions directly at the source to fill in any gaps.

Storyboard

a visual depiction of a user's experience with a product. It's a bit like a comic strip, allowing the designer to envision all the steps in the user's journey and to gain a deeper understanding of how the user will relate to and experience the product.

Mockup

a visual representation of what a product will look like once it's developed. While wireframes tend to capture the bare-bones layout and structure, a --- fills in detail such as colour and typography. It's important to note that, unlike interactive prototypes, --- are static.

Empathy map

a visualisation tool used by designers to depict and summarise what they know about a user (or group of users). It consists of four quadrants: "Says", "Thinks", "Does" and "Feels" which capture notes on what the user has said (for e.g. during an interview), what they think about a product or experience, the actions they take in a given context and how they feel during the process.

User journey map

a visualisation which depicts all the touchpoints between a user and a product across a given time period. It also contains information about the channels a person uses to interact with the product.

Figma

another popular UX design tool used for wireframing, building out design systems, collaborating, running workshops and more.

Pain-points

any issues, problems, frustrations or hiccups a user encounters during a given experience or interaction

Focus group

bring together a handful of users to discuss issues and concerns about the features of a product, moderated by the researcher, but for the participants, they feel unstructured and free-flowing

(UX) Documentation

captures all the steps you follow throughout a given design project. It allows you to keep track of the project and create a source of truth for all stakeholders to refer back to. Can include anything from the design problem and the project timeline to a summary of user research findings, early concepts and sketches, and results from usability tests.

Brand identity

captures and conveys the essence of what a company is all about. It's built on company values and how you want people to feel when they interact with your product or service.

Gestalt principles

come from the field of psychology, and they're essentially a set of laws that describe how our minds organise and interpret visual data. Can be used to inform design decisions and shape the user experience. For example, the law of proximity states that elements which are positioned close together appear to be more related than elements which are spaced further apart. If you were designing a website based on the law of proximity, you'd group related elements closer together.

Design thinking

comprises five phases: Empathise (with the user), Define (the problem), Ideate (potential solutions), Prototype, and Test.

Information architecture

considers how the information and content is organised within and across a product. If you're designing a website, you'll consider the positioning of each piece of content the user encounters, thinking about where it sits on the page and where it's located in terms of the overall structure of the website.

Accessibility

considers whether or not—and to what extent—a product or service can be used by everybody. Designing for --- means factoring in the needs of people with disabilities, as well as the various ways in which a person might interact with your product (for example, using assistive technology)

Wireframe

depicts the bare-bones layout of a website or app, showing how each screen will be structured and where different elements will sit on the page. Wireframes eventually evolve into prototypes, which are more life-like representations of how the product will look and behave.

Customer experience (CX)

encompasses the entire experience a customer has when they engage with a product, service or brand. UX and ---are two distinct areas but, as a UX designer, it's important to be aware of the concept and understand how UX contributes to the overall ---

Responsive design

ensures that your designs display accurately on different screen sizes. A website that's been designed responsively will look great whether it's viewed on a desktop computer, a tablet or a smartphone.

Grid system

essentially a series of rows and columns which gives you visibly marked-out areas (similar to a map) in which to place different elements. This makes it easier to design consistently across different pages.

Ideation

generating as many ideas and potential solutions as possible, without considering or judging their feasibility. In the ideation phase, the focus is on quantity of ideas rather than on quality.

Tree testing

a UX research method that provides insight into how easily people can find information on your website or app and where they get lost.

Diary study

a UX research method used to gain insight into how users behave in real-world situations and everyday contexts. When conducting a ---, you'll ask participants to keep a diary of their activities, thoughts and feelings over a set period of time in relation to a specific problem or scenario.

Card sorting

a UX research method which gives you insight into how users categorise information. In a --- session, participants are given notecards with different labels or topics written on them and asked to organise them in a way that feels logical. --- helps you to design the information architecture (IA) of a website or app in line with user expectations.

Sitemap

a bird's-eye view of the overall structure of a website. Very simply put, it's a diagram which shows how pages are prioritised, linked and labelled.

Modal (Modal Window)

a box that pops up outside of the main screen when the user clicks something on the current screen. Modals are used to draw the user's attention and to get them to focus on one specific thing. To close the modal, the user must complete a certain action or actively click to exit out of it. An example of a modal could be the window that pops up when you're reading a blog, asking you to subscribe to their newsletter.

User stories

a brief, simple statement which defines the purpose (or one of the purposes) of creating a product. Writing user stories allows you to consider and capture what the user wants to achieve when they interact with your product. User stories are based on the following structure: As a [type of user], I need/want to [action] in order to achieve [goal or outcome].

User flow

a chart or diagram which shows the path a user will take to complete a certain task. UX designers create user flows in order to understand how a user will move through the product and to design the product in a way that facilitates this movement.

Lean UX

a collaborative approach to the UX design process which focuses on getting feedback as early as possible in order to make quick design decisions. While traditional UX focuses more heavily on first setting out product requirements and then producing deliverables, lean UX seeks to deliver and improve the product in ongoing, iterative cycles.

User interview

a common UX research method, and it pretty much does what it says on the tin: you ask your user (or representative user) questions in order to gain insight into their thoughts, expectations, goals and pain-points in relation to a particular problem, product or experience. User interviews are a type of qualitative research

Whiteboard challenge

a common part of the UX interview process, requiring candidates to solve a design challenge in real-time, in front of the interview panel. When completing a whiteboard challenge, you'll be asked to sketch out your thought process on a whiteboard.

Heatmap

a data visualisation which literally maps out in different colours how and where users have spent time on your website. Red areas of the heatmap indicate popular sections of the website, while blue areas are those which received less attention.

Material Design

a design language for Android which was developed by Google in 2014. It's an adaptable system of guidelines, components, and tools which designers and developers can use to quickly and collaboratively build digital products.

Flat design

a design style or language which favours simple, 2D elements and bright colours.

Full-stack designer

a designer who has the skills and know-how to take on all the "stacks" (or layers) of the product design and development process. While most designers will specialise in just one area, such as UX design or UI design, full-stack designers can take on UX design, UI design, interaction design and frontend development.

Style guide

a document created by UX designers to set out the standards, conventions and guidelines which should be followed throughout the design process.

Persona

a fictional character which represents the goals, needs and characteristics of your target user(s), based on user research and referred back to them throughout the design process to ensure they're keeping the user in mind.

Inclusive design

a set of methodologies "to create products that understand and enable people of all backgrounds and abilities. It may address accessibility, age, economic situation, geographic location, language, race and more."

Prototype

a simulation or model of what the final product will (or could) look like

Problem statement

a statement which summarizes and defines the problem that needs to be solved.

Competitor analysis

looking at competing products within your niche or market space to see what they do well, where their weaknesses lie, and to get a feel for what your end-users will expect from a similar product

Product roadmap

maps out the vision and strategy for a particular product and sets goals and priorities for the development of the product.

Adobe XD

one of the most popular UX design tools. Part of the Adobe Creative Cloud suite, it's a vector-based design tool used for creating wireframes, prototypes, animations and UI designs.

Case study

outline the process you followed when working on a design project, showcasing the problem you set out to solve, the users you were solving it for, the methodology you used to reach the solution and the final design outcome.

Heuristics

a mental shortcut which enables people to solve problems and make decisions quickly, based on what they've learned from previous experiences. In UX, we use heuristic evaluation to assess the usability of a digital interface.

A/B testing

a method used to test two different versions of a design to see which variation performs best. When running ---, you only want to vary one element or aspect of the design—this allows you to pin-point exactly which feature influenced the result

Eye tracking

a method used to track users' eye movements as they look at a website.

Design sprint

Invented by Jake Knapp, the idea is to rapidly build and test a prototype in just five days, encouraging design teams to quickly move from problem to solution

InVision Studio

It includes features and functions for drawing, wireframing, prototyping and animating—pretty much everything you need to bring your designs to life.

Breadcrumb

a navigation system which shows where a user is currently situated within a website. For example, if you're browsing the ASOS clothing website, you might see a trail of links which shows where you are (and how you got there) as follows: Home > Men > Sportswear > Shoes

Agile UX

a practice that has evolved to integrate --- software development principles into the UX design process. --- is all about designers and developers working collaboratively and iteratively to build and ship versions of a product in short cycles—improving and updating the product along the way. This contrasts the traditional approach of first preparing and researching at length before building anything.

User interface (UI)

is the point of interaction between humans and computers. It contains all the features a user needs to interact with a digital product: input controls which enable a user to input information, navigational elements which allow the user to move from one point to the next, informational components which provide the user with valuable information and containers which group the content into meaningful sections. Designers are responsible for creating interfaces that are user-friendly and aesthetically pleasing.

Design debt (or UX debt)

is the result of taking shortcuts in the design process in order to quickly reach a solution or produce a deliverable. This can lead to problems down the line and can ultimately result in a negative user experience.

Intuitive design

it's design that the user can instantly understand and use without needing any kind of tutorial or instruction.