01
Accessibility
Available in the Database
Accessibility ensures designs are usable by people with disabilities, adhering to guidelines such as WCAG. It involves considering color contrast, screen readers, keyboard navigation, and more to create inclusive digital experiences for all users.
02
Atomic Design
Atomic Design is a methodology for creating Design Systems, organizing components hierarchically. It begins with the smallest elements (atoms) and builds up to molecules, organisms, templates, and pages, promoting scalability and consistency.
03
Atom
Atom in Atomic Design refers to the smallest, indivisible elements of a design—like buttons, labels, or text fields. These are foundational components that, when combined, form more complex UI elements.
04
05
Color system
Available in the Database
Color system organizes a palette into semantically understandable and reusable values, with variations for different states and contexts. It ensures consistency across a UI and helps in achieving brand alignment and accessibility standards.
06
Component
Available in the Database
07
Component library
Component library is a collection of pre-built, reusable UI components, each styled consistently according to a Design System. It streamlines the design and development process by promoting reuse and reducing design inconsistencies.
08
Data visualization
Available in the Database
Data visualization transforms complex data sets into visual formats like charts, graphs, and maps. It enables users to understand trends, patterns, and insights at a glance, aiding in decision-making and storytelling.
09
Design language
Design language is a unified set of design principles, guidelines, and visual elements that ensure consistency across products. It encompasses typography, colors, icons, and patterns, shaping the overall user experience.
10
Design System
Available in the Database
Design System is a set of standards, components, and guidelines that provide a consistent design language across digital products. It promotes efficiency, scalability, and cohesion in design and development workflows.
11
Design System principles
Design System principles are foundational guidelines that shape the design and development of a system. They focus on consistency, scalability, usability, and accessibility, ensuring a unified user experience across platforms.
12
Design token
Available in the Database
Design tokens are variables used to store design values such as colors, typography, spacing and other values. They ensure consistency across platforms by providing a Single Source of Truth for design-related properties in a system.
13
Elevation
Available in the Database
Elevation refers to the visual layering of UI elements through shadows or z-index, creating depth and hierarchy in design. It's commonly used in Material Design, Gitlab Pajamas, Atlassian Design System, Microsoft Fluent 2, and other Design Systems to indicate the importance and interactivity of elements.
14
Figma
Available in the Database
Figma is a web-based design and prototyping tool that allows teams to collaborate in real time. It supports the creation of UI/UX designs, prototyping, and Design System management, enhancing workflow efficiency.
15
Framework
Framework is a pre-built structure of code and components that developers use to build applications. Popular front-end frameworks like React, Vue, and Angular simplify the development process by providing reusable solutions.
16
Grid system
Grid system is a layout framework that helps align and organize content on a page. It creates visual structure and balance, ensuring responsive, consistent designs across different devices and screen sizes.
17
Icons
Available in the Database
Icons are small, graphic symbols used to represent actions, objects, or ideas. They improve user understanding by visually conveying meaning, often simplifying text-heavy interfaces and enhancing navigation.
18
Information architecture
Information architecture refers to the organization and structure of information within a product. It helps users find and navigate content efficiently, improving overall usability and user experience.
19
Layout
Available in the Database
Layout refers to the arrangement of elements on a page or screen. It ensures visual hierarchy, balance, and usability by organizing components in a way that supports user goals and aligns with the design's purpose.
20
Material Design
Material Design is a design system created by Google that emphasizes consistency across devices. It uses principles like grid-based layouts, responsive animations, and depth effects like shadows to create intuitive user interfaces.
21
Molecule
In Atomic Design, a molecule is a group of atoms combined to form a more complex UI element, such as a search form (text field and button). Molecules are the building blocks for more intricate components and organisms.
22
Motion
Available in the Database
Motion in design refers to the use of animation and transitions to create fluid interactions. It guides users through an interface, adds context, and enhances user experience by making digital environments feel more responsive.
23
Organism
In Atomic Design, an organism is a relatively complex group of molecules that function together as a unit, like a navigation bar. It is one of the higher levels in the design hierarchy, built from smaller atomic units.
24
Pattern
Available in the Database
Pattern is a repeatable design solution to common user interface problems. It provides best practices and consistency across a product, improving usability and reducing cognitive load for users.
25
Prototype
Prototype is interactive, low- to high-fidelity representations of a product. They simulate the user experience, allowing designers and stakeholders to test and refine interactions before full development begins.
26
Properties
Properties in design refer to attributes assigned to elements, such as color, size, or typography. They are the building blocks of style, helping define how components look and behave across various states.
27
Repository
Available in the Database
Repository is a storage location where code, design assets, or documentation are stored and managed. In Design Systems, repositories ensure that all components, guidelines, and tokens are accessible and maintained consistently.
28
Responsive
Available in the Database
Responsive design adapts layouts to various screen sizes and devices, providing an optimal user experience on mobile, tablet, and desktop. It uses breakpoints, fluid grids, and flexible images to ensure content adjusts dynamically.
29
Single Source of Truth
Single Source of Truth refers to having a centralized reference point for design or development assets. In a Design System, this ensures that all teams use consistent components, tokens, and guidelines, reducing inconsistencies.
31
Slots
Slots refer to placeholder areas within components that allow for content to be dynamically inserted. They offer flexibility, enabling the customization of reusable components without altering their core structure or functionality.
32
Spacing
Available in the Database
33
States
Available in the Database
States are variations of UI components that indicate their behavior in different scenarios, such as hover, active, or disabled states. They provide users with visual feedback, improving interactivity and the overall user experience.
34
Storybook
Available in the Database
Storybook is an open-source tool for developing UI components in isolation. It allows designers and developers to create, view, and test individual components outside the application, ensuring reusability and consistency.
35
Style guide
Style guide is a comprehensive document that outlines the rules for typography, color, icons, and other design elements. It ensures consistency across all user interfaces and reflects the brand’s visual identity.
36
System architecture
System architecture in design refers to the overall structure of a Design System, including its components, tokens, and documentation. It provides a blueprint for how the system scales and integrates across teams and platforms.
37
Theming
Available in the Database
Theming refers to the application of specific styles, such as colors and typography, to alter the appearance of a UI while keeping the underlying structure intact. It allows for customization without changing the core components.
38
Typography
Available in the Database
Typography refers to the style, arrangement, and appearance of text in a design. It plays a critical role in readability, visual hierarchy, and user experience, impacting how users perceive and interact with content.
39
UI Kit
UI Kit is a collection of pre-designed UI elements, like buttons, text fields, and icons, that are reusable across projects. It provides a set of standardized components, enabling faster design and development while maintaining consistency.
40
Usability
Usability measures how easily and efficiently users can interact with a product or system. It focuses on ease of use, user satisfaction, and error reduction, ensuring that users can achieve their goals with minimal friction.
41
User-centered design
User-centered design is a design approach that prioritizes the needs, behaviors, and goals of the user. It involves user research, prototyping, and testing to create intuitive, user-friendly products that solve real problems.
42
User Experience (UX)
User experience (UX) encompasses all aspects of a user's interaction with a product, focusing on usability, functionality, and emotional satisfaction. A well-designed UX ensures users find value, efficiency, and enjoyment in the product.
43
User Interface (UI)
44
45
Voice and Tone
Available in the Database
Voice and tone refers to the consistent personality of a brand, while tone changes based on context and audience. Together, they shape how users perceive the brand, influencing emotional engagement and the overall user experience.
46
Wireframes
Wireframes are low-fidelity, simplified visual representations of a design's structure. They outline key elements like navigation, content layout, and functionality, serving as the foundation for the final visual design.