Course Glossary

Estimated reading time: 15 minutes

Welcome! This alphabetized glossary contains many terms used in this course. Understanding these terms is essential when working in the industry, participating in user groups, and completing other certificate programs.

Download the Course Glossary document to access key terms and definitions covered in this course.

Note: If the glossary doesn't download, right-click and open the link in a new tab.

Term Definition Role in UX/UI
12-column layout A common responsive grid structure that divides the screen into 12 equal parts. Offers flexibility in design, allowing content to be arranged and adjusted according to screen size.
A/B testing A method of comparing two versions of a design to measure performance differences. Allows data-backed decisions on design choices like layout, CTAs, and labels.
Accessibility (a11y) An inclusive design approach that supports users with disabilities through features like screen readers and proper contrast. Guides the creation of interfaces that accommodate all users and comply with accessibility standards.
Actions A set of steps taken by users during their interaction with a product. Guides the mapping of key user events and triggers in the journey.
Adaptive design A method where multiple fixed layouts are created for specific screen widths or devices. Customizes the interface for different devices or screen sizes, ensuring optimal layout and performance.
Affordance A visual clue that suggests how an element should be used (for example, a button looks clickable). Guides users toward intended interactions and minimizes confusion.
Alignment The positioning of elements along a common edge or axis within the grid. Ensures visual order, consistency, and a balanced layout.
Alt text A descriptive phrase for images that screen readers can interpret. Allows users with visual impairments to understand image content and supports SEO.
Analytics A toolset that collects behavioral data like clicks, time on page, and drop-offs. Allows developers to measure user behavior and detect design flaws.
Animation Duration (Timing) Ideal range: 200–500 ms for most UX animations. Ensures animations are helpful, not frustratingly slow or imperceptibly fast.
Auto-playing media A video or audio element that starts without user input. Often precludes user control and may disrupt the experience if not handled appropriately.
Awareness stage A user journey phase where the user first discovers the product. Guides marketing design and onboarding UX strategies.
Behavioral grouping A process of clustering users based on similar habits, goals, or frustrations. Allows segmentation for targeted design solutions and personalized experiences.
Body font (paragraph font) A simpler, more readable font used for longer text blocks. Ensures readability in extended content; enhances user experience by providing legibility.
Bounce rate A metric showing the percentage of users who leave after viewing only one page. Indicates poor engagement and guides areas for usability improvements.
Breakpoints Predefined screen widths (e.g., 600px, 768px, 1024px) used to trigger layout adjustments. Determines how layout changes at specific screen sizes; crucial for responsive design.
Call to action (CTA) A visual prompt (for example, "Buy Now") that encourages user engagement. Guides users toward important actions and improves conversion when clear.
Card layout A responsive layout where each piece of content is enclosed in a consistent card format. Organizes content in a digestible, visually consistent manner.
Card sorting An activity where users group information into categories that make sense to them. Guides intuitive navigation design based on user expectations.
Clarity and simplicity A design principle that promotes minimal, clean, and easily understood interfaces. Allows users to complete tasks faster and reduces confusion.
Cognitive load A mental effort required to understand or use a product interface. Guides simplification of UI elements to improve user comfort and performance.
Collapsible sidebar A sidebar that hides or minimizes on smaller screens. Provides a cleaner, more focused interface on smaller screens, improving accessibility and reducing clutter.
Color accessibility The practice of ensuring color choices are perceivable by all users, including those with color blindness. Enhances usability and inclusivity, ensuring that information is accessible to all users, regardless of color perception.
Color consistency Maintaining the same use of color for similar meanings or functions across the interface. Promotes predictability, reduces cognitive load, and ensures clarity throughout the interface.
Color contrast A difference between foreground and background elements for readability. Allows better visibility and supports accessibility for all users.
Color for function Using color to convey meaning or system feedback (for example, green for success, red for error). Helps users interpret information quickly without relying on text; crucial for guiding user actions and system feedback.
Color palette A defined group of primary, secondary, and neutral colors used throughout a product. Creates a unified visual experience; helps users quickly identify key elements of the interface.
Columns Vertical divisions of space within a row. Defines the structure of the grid, enabling flexible and organized content placement.
Consideration stage A phase where users evaluate whether the product meets their needs. Guides content strategy and interface clarity for effective decision-making.
Container The outermost wrapper that holds the grid layout together. Holds and organizes the content within the grid, ensuring proper alignment and spacing.
Content reflow When elements reposition themselves as the viewport size changes. Ensures that content adapts and remains legible on various screen sizes and orientations.
Conversion rate A percentage of users who complete a desired action, like a purchase or signup. Indicates product effectiveness and guides interface improvements to increase success.
Customer interviews A method of talking directly with users to understand their behaviors and challenges. Allows deep exploration of user context and informs early design choices.
Decision stage The moment when a user commits to an action, like purchasing. Guides frictionless interface design that enables successful conversions.
Design consistency A practice of using uniform elements like typography, icons, and layout patterns. Allows users to learn faster and feel more confident navigating.
Design language A system of cohesive visual elements, tone, and interaction patterns. Guides brand consistency and maintains a unified experience across screens.
Design-Development Handoff Sharing a finalized prototype with developers, often with specs and interactions. Aligns expectations and reduces rework or misinterpretation in implementation.
Device detection Technique used in adaptive design to detect a device's screen type and load a corresponding layout. Improves user experience by delivering a layout optimized for the specific device or screen size.
Diary studies A long-term user research method where participants log interactions and thoughts. Allows discovery of long-term engagement patterns and emotional reactions.
Double tap Two quick taps to trigger a shortcut (e.g., like, zoom). Adds efficiency for frequent tasks but must be intuitive or taught.
Drag & drop Move objects by dragging them to new positions. Ideal for dashboards or reorderable lists-requires clear affordance.
Easing curves Motion timing functions like ease-in or ease-out used in animations. Makes transitions feel natural and smooth instead of robotic or abrupt.
Edge swipe Swiping from the screen's edge to reveal hidden UI like menus. Saves space and creates fluid navigation, but needs backup controls.
Effectiveness A measure of how successfully users can achieve their goals. Allows validation of whether the interface supports key user tasks
Efficiency A measure of how quickly and easily users can complete their tasks. Allows streamlined task flows and minimizes frustration or abandonment.
Emotion mapping A visualization of users' emotional states during their journey. Guides design focus on high-frustration or delight moments.
Emotional design A design approach that adds personality through visuals, animations, and tone. Guides emotional connection with the user and improves satisfaction
Empathy An ability to understand and share the feelings of users. Guides user-centered design and creates intuitive, human-focused experiences.
Error prevention A method of designing to reduce user mistakes. Allows smoother task completion and improves user confidence.
Error recovery A feature that helps users fix mistakes (for example, "Undo Send"). Allows flexibility, reduces anxiety, and prevents user loss.
Feature prioritization A process of aligning product features with user goals and frustrations. Guides development efforts to what matters most to users.
Feedback A response given after user actions (for example, success message). Allows users to stay informed and confident about their interactions.
Feedback animations Visual responses indicating task completion, errors, or confirmations. Improves transparency and builds user confidence in system response.
Field studies (contextual inquiry) A research method of observing users in their natural environment. Allows real-world context to shape product decisions.
Flexible media Images and videos that scale with their containers using properties such as max-width: 100%. Ensures that media content adapts to various screen sizes without breaking the layout.
Font A specific typeface with style and weight (for example, Roboto Bold, Georgia Italic). Establishes the visual identity of the interface and communicates tone and style.
Font pairing The combination of two complementary fonts (usually for headings and body text). Enhances visual appeal and readability by pairing complementary font styles.
Font personality The emotional tone or brand feel a font conveys (for example, playful, serious). Conveys the brand's character or mood, helping users understand the interface's emotional context.
Font weight Thickness of characters (for example, Light, Regular, Bold). Helps establish hierarchy and draws attention to key information.
Form simplification A process of reducing unnecessary form fields or steps. Allows faster completion rates and lowers drop-offs.
Friction Any element that slows down or complicates the user's flow. Indicates barriers to conversion and guides interface simplification.
Gesture-based interaction Interactions performed through touch-based motions like swiping, pinching, dragging, etc. Enhances mobile UX by making interactions feel natural, fast, and immersive.
Google fonts A library of free, open-source fonts optimized for the web. Provides a wide selection of fonts optimized for web use, enabling aesthetic customization while maintaining performance.
Grid system A framework of horizontal and vertical lines used to organize and align content in a layout. Provides a structured, organized approach to layout design, ensuring consistency and clarity.
Gutters The spacing between columns in a grid. Provides visual separation between elements, ensuring a clean and organized design.
Hamburger icon A three-line icon used to reveal hidden menus. Allows compact navigation but may hide important features if overused.
Hamburger menu A collapsible navigation icon commonly used in mobile layouts. Maximizes screen space by hiding navigation options under a minimalistic icon, ideal for mobile design.
Heading font (display font) Typically bold or decorative font used for titles or headers. Draws attention to important sections or key information, enhancing readability.
Heatmaps A tool that visualizes where users click or scroll. Guides interface improvements by showing where user attention is strongest or weakest.
Heuristic evaluation An expert analysis based on usability principles like Nielsen's heuristics. Allows fast identification of obvious UI issues before user testing.
Hierarchy Visual prioritization of elements based on importance, size, or placement. Helps users quickly identify key elements, guiding their interaction and ensuring a smooth experience.
Interaction triggers Events that initiate actions, such as "on click," "on hover," or "on swipe." Replicates real-world gestures and responses for realistic testing.
Interactive prototype A clickable, navigable model of an app or website that simulates user experience. Allows teams to validate functionality and design before coding, reducing costly changes later.
Iteration The process of improving a prototype based on feedback and observations. Central to refining design and achieving a user-validated experience before development.
Layout fluidity The smooth scaling and repositioning of elements without breakpoints. Creates an adaptive layout that fluidly responds to changes in screen size, optimizing for various devices.
Letter spacing (tracking) Horizontal spacing between characters. Improves legibility and visual balance, especially in headers or large text blocks.
Line spacing (leading) Vertical space between lines of text. Ensures that text is easily readable and avoids overcrowding of characters.
Load time / performance A speed at which a page or action completes. Guides interface and code optimization to maintain engagement.
Loading animations Visual indicators during content loading or data fetching. Keeps users engaged and manages expectations during delays.
Long press Press-and-hold to reveal extra options or enable actions. Useful for rearranging items or exposing contextual menus.
Memorability A user's ability to return and use a product without relearning. Allows easier repeat usage and promotes long-term retention.
Microinteractions Small, functional animations triggered by user actions (e.g., tapping a button). Reinforces the effect of user input and adds personality to interactions.
Mobile optimization A process of designing for smooth functionality on phones and tablets. Allows better usability and search performance on mobile devices.
Mobile usability A measure of how well a product performs on mobile. Guides design of responsive, touch-friendly interfaces that meet mobile users' needs.
Mobile-first design A design strategy that begins with mobile layouts before scaling up. Guides prioritization of essential content and performance for mobile users.
Navigation & transition animations Smooth visual flows between screens or elements (e.g., page slide-ins). Helps users form a spatial map of the interface and reduces disorientation.
Navigation design A structure that organizes content and lets users move through the product. Guides users to find features quickly and reduces drop-off rates.
Nielsen's heuristics A list of 10 usability rules like error prevention, visibility, and user control. Guides designers in evaluating interfaces based on established best practices.
Onboarding animations Motion graphics used to guide new users through key features. Enhances user learning, boosts retention, and reduces drop-off.
Open-ended questions Prompts used in interviews to gather rich, detailed insights. Allows discovery of unexpected insights and deeper understanding.
Opportunities A set of insights on how to improve a user experience. Guides ideation of new features or UX enhancements.
Overlays Layered pop-ups or modals triggered by interactions. Simulate real-time feedback like confirmations or alerts within the prototype.
Pain points The specific moments of user frustration, confusion, or drop-off. Guides UX fixes and highlights where improvements are needed most.
Participant activities A record of what users are doing at each journey step. Allows designers to contextualize interactions and support user goals.
Performance and loading speed A measure of how fast a product responds. Guides optimization efforts that maintain trust and user attention.
Persona A fictional, research-based profile representing a key user type. Guides design decisions by grounding them in real user needs.
Persona maintenance A regular process of updating personas based on new research. Allows personas to stay relevant as users evolve.
Persona profile elements The key parts of a persona, such as name, goals, frustrations, and device usage. Allows cross-team clarity and effective empathy during design.
Persona quote A fictional or real statement summarizing a user sentiment. Guides emotional connection and design justification with stakeholders.
Pinch/Spread Gesture to zoom in or out, often used on maps or images. Provides spatial control and visual freedom without cluttering UI.
Pop-ups/modals The UI elements that interrupt the user flow to display information. Often precludes smooth user flow if overused or poorly timed.
Position Placement of elements in a top-to-bottom or left-to-right reading order. Guides users through the interface by structuring elements in a logical, intuitive flow.
Primary color The dominant brand or interface color used across the UI. Establishes a cohesive brand identity and visual consistency across the interface.
Prototype mode A setting in tools like Figma, Adobe XD, or InVision where you can link elements to simulate interactivity. Enables click-based flows, transitions, and interactions without code.
Prototype testing The act of manually going through flows to ensure everything works as intended. Identifies usability gaps and broken flows before sharing with stakeholders or developers.
Readability How easily users can recognize and process text. Ensures that content is easy to understand and engage with, improving the user experience.
Real-time validation A feature that gives immediate feedback on user input. Allows prevention of errors and improves form clarity.
Real-world testing example (such as Instagram) Using prototypes internally before launch to simulate features like Reels. Demonstrates how major platforms rely on prototyping to ensure seamless rollouts.
Responsive design A layout strategy that adapts across screen sizes and devices. Guides creation of seamless user experiences on all platforms.
Responsive layout A layout technique using flexible grids and queries. Allows consistent experiences regardless of screen dimensions.
Responsive typography Font sizing and layout that adjusts for different screen sizes. Ensures text remains legible and appropriately sized across various screen resolutions.
Rows Horizontal groupings of content within a container. Defines the structure of content, ensuring it is displayed logically and consistently.
Sample persona An example profile used to represent a user segment. Guides realistic design scenarios and stakeholder alignment.
Satisfaction A user's emotional reaction to using a product. Allows measurement of loyalty and repeat usage likelihood.
Scan-ability The ease with which users can visually navigate and absorb content. Enhances content discovery and allows users to quickly identify key information.
Scroll behavior A method of navigating content vertically or horizontally. Guides UX choices that align with user expectations and ease of use.
Shareable link A link generated by prototyping tools that allows external users to interact with and comment on the prototype. Streamlines collaboration and allows for asynchronous feedback gathering.
Signifiers A visual cue indicating an action (for example, underlined link). Guides user understanding of interface functionality.
Size Larger elements catch the eye first; smaller elements are read later. Creates a visual hierarchy, ensuring that key elements stand out and users can easily navigate the interface.
Speak-aloud protocol A usability method where users verbalize thoughts during tasks. Allows understanding of user mental models and friction points.
Stages of user journey The defined phases users move through during a product experience. Guides end-to-end optimization of user flows.
Support tickets/Feedback logs The logged user complaints or issues submitted via customer service. Guides detection of repeated usability problems needing resolution.
Surveys and questionnaires A structured method to collect large-scale feedback. Allows validation of design assumptions and discovery of user trends.
Swipe A directional gesture used to navigate or trigger actions. Common in carousels, cards, and navigation between screens.
Tap A quick touch used for selection or activation. Common for buttons, toggles, and links—must be responsive and visible.
Technology habits A record of devices and apps users regularly use. Guides cross-platform design and prioritization for developers.
Thoughts What users are thinking during each stage of their journey. Guides messaging and tooltip design to align with user mindset.
Transitions Animated effects between screens (e.g., slide, fade). Makes navigation smooth and visually engaging for users testing the prototype.
User Interface (UI) Design The visual design layer of the product including colors, icons, fonts, and branding. Gives realism and polish to prototypes, making them feel like actual products.
Usability A measure of how easily users can interact with a product. Guides all aspects of UX strategy and affects satisfaction and retention.
Usability feedback Insights from users, stakeholders, or team members about how intuitive and effective the prototype feels. Drives design decisions by pinpointing confusion, delays, or unmet expectations.
User interviews A method involving direct user conversations to uncover needs. Allows in-depth understanding of goals, pain points, and behaviors.
User journey map A diagram that shows steps users take to accomplish a goal. Guides insight into pain points, opportunities, and key interactions.
User Persona A fictional profile based on user research. Guides team alignment on user motivations and design priorities.
User research A process of gathering qualitative and quantitative data to understand users. Guides all UX decisions with evidence from real users.
User scenarios/Testing use cases A narrative used to simulate how a persona uses a feature. Guides realistic testing and design validation.
User-centered design A design approach based on actual user needs and feedback. Guides decisions that prioritize empathy and real-world usefulness.
User-centric design A design philosophy where decisions are based on user needs, behavior, and feedback. Ensures the product is intuitive, accessible, and functional for real users.
UX animation Movement or transitions applied to UI elements to improve the user experience. Provides feedback, direction, emotion, and clarity in user interactions.
UX heuristics A set of usability principles like consistency and user control. Guides expert reviews and ensures intuitive interface behavior.
Visual cues Design hints such as icons, arrows, or animations that suggest where to look or what to do next. Directs users' attention and guides interaction by highlighting important actions or areas.
Visual feedback A UI response after user interaction (for example, loading spinner). Allows users to understand system status and reinforces trust.
Visual hierarchy A structure that arranges elements by importance using size, color, or placement. Guides user attention to key areas and supports effective navigation.
Visual hierarchy in journey maps A way to visually organize user data (for example, swimlanes). Guides stakeholder understanding and highlights key experience phases.
Web-safe fonts Fonts that are widely supported across all browsers and devices. Ensures consistent rendering of text across different platforms, improving reliability.
Whitespace (negative space) Empty areas between grid elements and around content. Enhances readability, reduces clutter, and gives the design breathing room, improving user focus.
Wireframe A low-fidelity layout of each screen that outlines structure and key components. Establishes the skeleton of the design and serves as a foundation for interactivity.