Interaction design shapes how users accomplish tasks, and well-designed patterns make complex actions feel natural. Affordances are visual cues that suggest how an element should be used: buttons look pressable, sliders look draggable, and clear affordances reduce guesswork. Feedback provides immediate response to user actions, confirming that a system has received input and showing what is happening through loading states, button presses, or error messages. Calls-to-action (CTAs) guide users toward desired outcomes with action-oriented language like 'Sign Up' or 'Buy Now,' ideally placed above the fold where they receive maximum visibility. Micro-interactions, such as button hover states, pull-to-refresh gestures, or like-button animations, add delight while reinforcing usability. Together, these patterns form the vocabulary of interaction that experienced designers deploy instinctively.
Forms and inputs are among the most consequential components, since they directly capture user data. Input fields should always have visible labels rather than relying on placeholder text, which disappears during typing and creates accessibility issues. Inline validation provides immediate feedback as users type or move between fields, reducing errors and frustration compared to validation only at submission. Forms should group related fields, use single-column layouts where possible, mark optional fields rather than required ones, and leverage smart defaults and autocomplete to minimize effort. Checkboxes handle independent multi-select options, radio buttons handle mutually exclusive choices, and dropdowns work best for four to fifteen options, with autocomplete preferred for longer lists. Multi-step forms with progress indicators break complex flows like checkout into manageable pieces, reducing cognitive load and abandonment.
Beyond forms, designers work with a vast library of established component patterns. Modals trap focus, respond to the Escape key, and clearly indicate how to close, but should be used sparingly because they interrupt workflow. Tooltips provide brief additional information on hover or focus, while popovers offer richer click-triggered content. Toasts and snackbars deliver non-intrusive temporary confirmations, alerts and banners communicate persistent system messages, and badges show notification counts. Carousels and sliders require stoppable auto-rotation and clear manual controls. Cards group related information and actions, accordions collapse and expand content sections, and data tables present structured information with sortable columns, pagination, and responsive strategies for mobile. Mastering these patterns allows designers to assemble interfaces that feel familiar, efficient, and respectful of user attention.