Glossary

A

A/B testing		A/B testing, also known as split testing, involves comparing two versions of a webpage, app, or digital product to find the one that performs better in terms of user engagement, conversion rates, and relevant metrics. It aims to...
Accessibility		Accessibility in design encompasses a broad set of principles and practices aimed at creating products, environments, and experiences that can be used by individuals with diverse abilities and disabilities. This inclusivity...
Accordion		An accordion is a type of menu that stacks items vertically and lets the user expand and collapse the content. The accordion typically consists of headers or tabs for each section, and users can interact with these headers to...
Alignment		Alignment refers to the arrangement or positioning of elements within a design to create a visually cohesive and balanced composition. It involves ensuring that various design elements, such as text, images, and shapes, are...
Alt Text		ALT text, or alternative text, is a brief and descriptive attribute that can be added to HTML code to provide text-based information about an image on a web page. The primary purpose of ALT text is to convey the content and...
Architecture Diagram		An Architecture Diagram is a visual representation of a system’s structure, showcasing how its components are interconnected, how they communicate, and how data flows through the system. It is a fundamental tool used by...

Back to top

B

Bootstrap CSS		Bootstrap CSS is a popular front-end framework that simplifies the process of creating responsive websites. It provides a collection of pre-designed CSS classes and components for building user interfaces (UI). Here are some key...
Breadcrumb		A breadcrumb is a navigation element that indicates the current page's location within a navigational hierarchy that automatically adds separators. One primary use of breadcrumbs is to enhance the user experience by providing a...

Back to top

C

Card Sorting		Card sorting is a user experience (UX) research technique used to understand how users categorize information or content. It involves presenting participants with a set of cards, each containing a piece of information, such as a...
Carousel		A carousel is a rotating or sliding display component that showcases a series of images, text, videos, or other types of content. Often used on websites and applications, carousels allow users to view a collection of items by...
Crop		The term "Crop" may refer to the design practice of cropping or trimming visual elements within a user interface. This can be done to enhance the user experience, improve aesthetics, or optimize the presentation of...
CSS		Cascading Style Sheets (CSS) is a style sheet language used in web development to control the presentation and formatting of HTML (Hypertext Markup Language) documents. CSS enables designers and developers to define the visual...
CTA		A Call to Action (CTA) is a strategically placed element within a user interface, typically in the form of a button, link, or other interactive component, designed to prompt users to take a specific action. The purpose of a CTA...
Customer Journey		The Customer Journey refers to the end-to-end experience of a user as they interact with a product, service, or brand. It encompasses all touchpoints, from initial awareness through the various stages of engagement, ultimately...

Back to top

D

Dashboard		What is a Dashboard? A dashboard is a central, visual display of key information and data, typically presented in a manner that allows users to quickly understand and interact with critical metrics, insights, or tasks....
Design Consistency		In UI design, design consistency refers to the practice of maintaining uniform elements, behaviors, and styles across an entire interface. Consistency is the foundation of a cohesive user experience (UX), ensuring that users can...
Design System		A Design System is a comprehensive set of interconnected design elements, guidelines, and documentation that provides a framework for creating and maintaining consistent, cohesive, and visually aligned user interfaces. It...
Design Thinking		Design Thinking is a human-centric problem-solving approach that places empathy, creativity, and iteration at its core. It involves understanding and empathizing with users, defining the problem, ideating potential solutions,...

Back to top

F

Fidelity		Fidelity refers to the level of detail and accuracy present in a UI design representation, whether it's a wireframe, prototype, or final product. Fidelity is often categorized into two main types: Low-Fidelity: Low-fidelity...
Flow Charts		A flowchart is a graphical representation of a process or system, depicting the steps, decisions, and sequences of actions through various shapes and connecting lines. Flowcharts are commonly used in various fields, including...
Font		Font refers to a set of characters, letters, numbers, and symbols that share a consistent style, size, and weight. Fonts are a critical element in graphic and UI design, influencing the visual identity and readability of text...
Footer		What is a Footer? In user interface (UI) design, the footer is the section located at the bottom of a web page, app, or software interface. It serves as a consistent space across all pages where important links, contact...
Functional Layout		A functional layout is a design approach that focuses on the practical organization and arrangement of elements to optimize the user experience and efficiency. Rather than prioritizing aesthetics, a functional layout is driven...

Back to top

G

Gradient

A gradient is a visual effect where one color smoothly transitions into another color or a series of colors. It's a way to create a gradual color shift, making sense of depth, dimension, and visual interest in various design...

Back to top

H

Hamburger menu		A "hamburger menu" is a graphical user interface (GUI) element often used in website and mobile app design. It typically consists of three horizontal lines stacked on top of each other, resembling a hamburger, hence the name....
Header		What is a Header in UI Design? A header is the top section of a webpage, app, or software interface. It serves as a prominent, fixed element that appears consistently across different pages or screens, providing users with key...
Heat Map		A heat map is a visual representation of data showing the areas of a web page or a UI design where users most frequently interact or engage. Designers and researchers gain valuable insights into user behavior by analyzing how...
Hero Image		A hero image is a prominent and visually impactful image or graphic displayed prominently on a webpage, usually at the top, to capture the audience's attention and set the tone for the content that follows. It serves as a key...
HEX Value		A Hex Value, short for hexadecimal value, is a numerical representation of a color in web design. It is expressed as a combination of six alphanumeric characters, where the first two characters represent the red component, the...
Hierarchy		Hierarchy in UI/UX design refers to the strategic organization of visual elements within an interface to establish a clear and intentional structure. It involves arranging information in a way that communicates varying levels of...

Back to top

I

Iteration

Iteration, in the context of design, development, and problem-solving, refers to repeating a series of steps or actions to make improvements, refine solutions, and achieve desired outcomes. Iteration involves revisiting and...

Back to top

L

Layout		What is a Layout? In UI design, a layout refers to the arrangement and organization of visual elements on a screen or webpage. The layout is the structural framework that defines how content, navigation menus, images, and other...
Lorem Ipsum		Lorem Ipsum, derived from Latin, has been the standard placeholder text in the design industry since the 1500s. Originally extracted from "De Finibus Bonorum et Malorum," a work by Cicero, it has served as a nonsensical filler...

Back to top

M

Material Design		Material Design is a design language developed by Google, introduced in 2014, aimed at creating consistent and visually appealing user experiences across various digital platforms. It encompasses principles, guidelines, and...
MockFlow		MockFlow is an all-encompassing online wireframing and product design tool designed to bring software ideas to life visually. It distinguishes itself by providing a comprehensive product design solution that integrates a diverse...
Mockup		A mockup is a visual representation or prototype of a product or project. It is a static, high-fidelity model that showcases the overall design, layout, and visual elements of a UI design, website, or physical product. Mockups...
Modal		A modal in UI design is a type of user interface element that appears on top of the main content and temporarily blocks interaction with the rest of the interface until a specific action is taken or dismissed. It is often used...
Mood Board		A mood board is a visual collage or collection of images, colors, textures, and other design elements assembled to convey the desired visual and emotional aspects of a project. It serves as an inspirational tool, helping...

Back to top

N

Navigation Bar

A navigation bar, often referred to as a "navbar," is a user interface element that allows users to navigate through different sections or pages of a website or application. Typically positioned at the top or side of the...

Back to top

O

Opacity		Opacity controls how transparent or solid an object appears in design and graphics. It affects how much light passes through an element and how visible it is against the background or other objects. By adjusting opacity,...
Orientation		Orientation in the context of design and user interfaces encompasses the meticulous arrangement and positioning of elements within a designated space. This process involves judiciously determining the direction or alignment of...

Back to top

P

Padding		In UI design, padding refers to the internal space between the content of an element and its outer boundary (border). It creates a buffer zone within the element, ensuring that text, images, or other content inside it does not...
Placeholder		A placeholder is a temporary visual representation of content that will be added later. In UI/UX design, it serves as a guide for users, indicating where specific information or elements will be displayed in a user interface....
Product Design		Product design in software refers to the process of designing and developing a digital product that meets the needs and expectations of its users. This typically involves a multi-disciplinary approach that combines elements of...
Prototypes		A prototype in design is an interactive representation of a product, varying in fidelity from low to high, created during development to simulate functionality and design. Its main purpose is to allow stakeholders to visualize,...

Back to top

R

Responsive design

Responsive design is an approach to web and user interface design that aims to create a seamless and optimal user experience across different devices and screen sizes. It involves designing and developing user interfaces that...

Back to top

S

Sidebar		What is a Sidebar? A sidebar is a vertical or horizontal panel that runs along the side of a webpage, application, or software interface. It typically serves as a navigation bar or an additional space to display secondary...
Skeuomorphism		Skeuomorphism is a design concept that involves incorporating visual elements or physical characteristics from the real world into the design of a digital interface or product. This approach makes the digital representation...
Style Guide		A style guide is a comprehensive document that outlines the visual and functional elements, design principles, and branding guidelines to maintain consistency across all aspects of a project, be it a website, application, or any...
SVG		Scalable Vector Graphics (SVG) is an XML-based vector image format designed to describe two-dimensional vector graphics. Unlike raster image formats (such as JPEG or PNG), which use a grid of pixels to represent images, SVG uses...

Back to top

T

Tailwind CSS		Tailwind CSS is a utility-first CSS framework designed to accelerate the development of modern websites. Unlike traditional frameworks that offer pre-built components, Tailwind provides a comprehensive collection of low-level...
Thumb reachability		Thumb reachability is a concept in mobile interface design that refers to the ease with which a user can interact with elements on a touchscreen using their thumb, without having to adjust their grip or use their other hand. The...
Typeface		A typeface, also known as a font family, is a set of designed characters that share common design characteristics, such as size, weight, and style. The characters in a typeface can include letters, numbers, symbols, and...
Typography		Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. It involves the use of fonts, sizes, colors, spacing, and layout to create a visually pleasing and...

Back to top

U

UI builder		A UI builder, or User Interface builder, is a tool or software component that assists developers in designing and creating graphical user interfaces (UIs) for applications. These tools are particularly helpful in the development...
UI elements		User Interface (UI) elements are the interactive building blocks of digital interfaces. They allow users to navigate, input information, and interact with software applications, websites, and systems. Each element serves a...
UI Kit		A UI kit, or User Interface kit, is a collection of pre-designed user interface (UI) components that can be used to rapidly build website and application interfaces. These kits typically include a variety of graphical elements,...
User Flow		User flow refers to the path that a user follows through a website, application, or any digital product to complete a specific task or achieve a goal. It is a visual representation of the series of steps a user takes from the...
User Interface		User Interface (UI) refers to the visual and interactive components of a digital system, software, or application that enable users to interact with it. It is how users can access and interact with the features and...
User Interface Design		UI design stands for User Interface design, and it's the process of crafting the visual and interactive elements that people see and interact with when using a software application, website, or even a physical device. It's...
User Persona		A user persona is a fictional representation of a target user group based on research and data about real users. It's a tool used in user-centered design to understand better the users' needs, behaviors, motivations, and goals....
User Testing		User testing is a crucial design phase that assesses a product's usability through real user interactions, aiming to identify issues, gather feedback, and inform design decisions. Participants perform specific tasks, and their...
User-Centered Design		User-centered design (UCD) is an approach to designing products, systems, and services that prioritizes the needs and preferences of the end-users throughout the entire design process. The primary goal of user-centered design is...
UX		User Experience (UX) can be described as the overall impression or satisfaction a person has when interacting with a product, service, or system. It encompasses their perceptions, emotions, and responses throughout the entire...
UX Audit		A UX audit, also referred to as a usability audit, is essentially a checkup for your website or mobile app. It's a comprehensive evaluation process designed to assess how easy and enjoyable it is for users to interact with your...
UX Design		UX design involves the creation of user-centered designs that are intuitive, accessible, and efficient. It includes researching the needs and preferences of the target user group, developing user personas, creating user flows...
UX Documentation		User Experience (UX) documentation refers to the collection of materials and resources that document various aspects of a user-centered design process. These documents serve as references, guidelines, and records for design...
UX Research		UX Research, short for User Experience Research, is a crucial aspect of the design process aimed at understanding the needs, behaviors, and preferences of the end users. The primary goal of UX research is to enhance the overall...
UX SiteMap		A UX Sitemap, short for User Experience Sitemap, is a visual representation of the structure and hierarchy of a website or application. Unlike a traditional sitemap that primarily focuses on the organization of content for...
UX Storyboard		A UX storyboard is a visual representation of a user's experience (UX) with a product, typically depicted as a series of sketches or illustrations arranged chronologically. It captures key screens, interactions, and emotional...

Back to top

V

Visual Design

Visual Design is a crucial aspect of the user interface (UI) and user experience (UX) design process that focuses on the aesthetics and visual elements of a product. It involves the thoughtful and intentional arrangement of...

Back to top

W

WCAG		WCAG, which stands for Web Content Accessibility Guidelines, is a comprehensive set of guidelines crafted by the Web Accessibility Initiative (WAI), a branch of the World Wide Web Consortium (W3C). These guidelines are designed...
Wireframe		Wireframes are a visual representation of a user interface design that shows the layout and functionality of a digital product or system. They are essentially a blueprint or rough sketch of the user interface, without the actual...
Wireframing		Wireframing is an essential phase in the early stages of the design process, where a visual blueprint or skeletal outline of a website, application, or user interface (UI) is created. It serves as a low-fidelity representation,...
Wireframing Tool		A wireframing tool is a software application that is designed to create digital wireframes for user interface design. These tools allow designers to create wireframes quickly and easily, using pre-built UI components and a range...

Back to top