Modern UI & AI Vocabulary
No need to call in the nerdsquad, when talking to your AI/LLM/tool - these are some of the most used terms in building digital services. NAVIGATION & STRUCTURE Accordion Expandable sections revealing hidden content. Tabs Side-by-side content switchers. Sidebar / Drawer Persistent vertical navigation. Breadcrumbs Hierarchy path showing where you are. Modal Overlay requiring user attention. Toast / Snackbar Temporary bottom-corner notifications. --- INPUT & CONTROLS Form Grouped input fields for collecting data. Text Field Single- or multi-line user input. Dropdown / Select Compact choice list. Radio Buttons Choose one of a small set. Checkbox Choose multiple. Toggle / Switch Immediate on/off action. --- CONTENT PRESENTATION Card Structured content block (image / text / actions). List Vertical stack of repeated items. Table / Data Grid For large, structured datasets. Badge Status or count indicator. Tag / Chip Compact category label. Tooltip Hover-based micro-hint. --- FEEDBACK & STATUS Spinner / Loader Indicates ongoing processes. Skeleton Grey placeholder UI during loading. Progress Bar Shows completion percentage. --- DESIGN SYSTEM CONCEPTS Component Reusable UI building block. Pattern Repeatable UX solution. Flow Steps a user follows to complete a task. Wireframe Low-fidelity structural sketch. Prototype Interactive testable concept. Prototry Functioning Interactive testable concept. --- AI-FIRST VOCABULARY AI Agent Semi-autonomous worker performing tasks. Prompt Instruction sent to an AI model. Prompt Template Reusable prompt structure. Agent Flow Behind-the-scenes AI steps. Inference AI output generation process. RAG AI + knowledge retrieval. Orchestration Layer Coordinates tools, agents, APIs.