# Concepts > Core UX and product design concepts explained clearly — from mental models and affordances to cognitive load and design thinking. ## Pages - [Accessibility in UX: Designing for Everyone](https://www.fernandoux.com/en/wiki/concepts/accessibility-ux/) Accessibility in UX means designing digital products that are usable by everyone, including people with disabilities. - [Affordances and Signifiers: Making UI Self-Explanatory](https://www.fernandoux.com/en/wiki/concepts/affordances-signifiers/) An affordance is what an object actually invites you to do; a signifier communicates that affordance to the user. - [Affordances vs. Signifiers: The Invisible Language of Design](https://www.fernandoux.com/en/wiki/concepts/affordances-vs-signifiers/) Discover the crucial difference between Affordances (what an object can do) and Signifiers (the signal that tells us how to do it) to create intuitive and easy-to-use interfaces. - [ARIA vs. Semantic HTML: The Golden Rule](https://www.fernandoux.com/en/wiki/concepts/aria-vs-semantics/) Understand the difference between native semantic HTML and ARIA attributes, and learn why the first rule of accessibility is to not use ARIA if a native alternative exists. - [Atomic Design: Building UIs from the Ground Up](https://www.fernandoux.com/en/wiki/concepts/atomic-design/) Atomic design is a methodology for creating reusable component libraries by breaking interfaces into five hierarchical levels: atoms, molecules, organisms, templates, and pages. - [Breakpoint vs. Container Queries: Component-Based Design](https://www.fernandoux.com/en/wiki/concepts/breakpoint-vs-container-queries/) Learn the difference between designing for screen width (Breakpoints) and designing for container width (Container Queries), and how this revolutionizes component design. - [Cognitive Load Management in UX](https://www.fernandoux.com/en/wiki/concepts/cognitive-load-management/) Learn to manage cognitive load in interface design to reduce user mental fatigue, improve information retention, and optimize the usability of your digital product. - [Cognitive Load: Why Simpler Is Always Better](https://www.fernandoux.com/en/wiki/concepts/cognitive-load/) A measure of mental effort required to use a product; lower cognitive load means easier to use. - [Conflict Resolution in Collaboration: UI and UX](https://www.fernandoux.com/en/wiki/concepts/conflict-resolution/) Learn how to design interfaces and user flows that elegantly manage editing conflicts when multiple users work simultaneously on the same product. - [CRDT Basics for Product Designers](https://www.fernandoux.com/en/wiki/concepts/crdt-for-designers/) Discover why CRDTs are the technology that enables applications like Figma or Notion, and how they affect the way you design collaborative and offline-first interfaces. - [Dark Patterns: What They Are and Why to Avoid Them](https://www.fernandoux.com/en/wiki/concepts/dark-patterns/) Dark patterns are deceptive design techniques that trick users into taking actions against their interests for benefit to the business. - [Design Principles](https://www.fernandoux.com/en/wiki/concepts/design-principles/) Design Principles are a set of brief, clear, and memorable guidelines that articulate the core values that should guide a team's design work. - [Design System](https://www.fernandoux.com/en/wiki/concepts/design-system/) A Design System is a collection of reusable UI components, guided by clear standards (principles, style guides), that enables teams to design and build digital products in a coherent and efficient manner. - [Designing for Perceived Performance: Faster Than Light](https://www.fernandoux.com/en/wiki/concepts/perceived-performance-design/) Learn how design can make your application feel faster than it really is, using cognitive psychology techniques and visual tricks. - [Error Prevention vs. Recovery: A Forgiving Interface](https://www.fernandoux.com/en/wiki/concepts/prevention-vs-recovery-errors/) Learn to design interfaces that prevent user errors before they occur and offer clear recovery paths when failure is inevitable. - [Fitts's Law: Reach and Ergonomics in UI](https://www.fernandoux.com/en/wiki/concepts/fittss-law/) Learn how Fitts's Law influences the speed and accuracy of user movement to select targets in a digital interface, improving the ergonomics of your designs. - [Foundations of the Accessibility Tree: How Machines See](https://www.fernandoux.com/en/wiki/concepts/accessibility-tree/) Learn what the Accessibility Tree is and why it is the foundation of how screen readers and other assistive technologies interpret your interface design. - [Gestalt Principles for UX Designers](https://www.fernandoux.com/en/wiki/concepts/gestalt-principles/) Gestalt principles describe how humans naturally perceive and organize visual information into meaningful patterns and groups. - [Haptic Feedback Principles: Feeling the Interface](https://www.fernandoux.com/en/wiki/concepts/haptic-feedback-principles/) Learn how designing tactile (haptic) responses can improve interaction speed, accessibility, and user delight in your mobile applications. - [Hick's Law: Decision and Response Time](https://www.fernandoux.com/en/wiki/concepts/hicks-law/) Learn how Hick's Law influences user decision-making and how to reduce response time by simplifying options in your digital interface. - [Inclusive Design vs. Accessible Design: Why Both Matter](https://www.fernandoux.com/en/wiki/concepts/inclusive-vs-accessible/) Accessible design removes barriers for people with disabilities; inclusive design considers the broadest possible range of human diversity from the start. - [Information Architecture](https://www.fernandoux.com/en/wiki/concepts/information-architecture/) Information Architecture (IA) is the practice of deciding how to organize, structure, and label the content of a digital product in a way that is understandable and allows users to find information and complete tasks efficiently. - [Intrinsic Sizing Behavior in UI](https://www.fernandoux.com/en/wiki/concepts/intrinsic-sizing/) Learn how intrinsic sizing works in digital interface design to create components that intelligently adapt to their real content. - [Mental Models of Undo and Redo: Time in the Interface](https://www.fernandoux.com/en/wiki/concepts/mental-models-undo-redo/) Learn how users perceive time travel in digital interfaces through Undo and Redo models, and how to design them for complex collaborative environments. - [Mental Models: Designing for How Users Think](https://www.fernandoux.com/en/wiki/concepts/mental-models/) A mental model is the internal framework users build about how a system works, shaped by past experiences and expectations. - [Mobile-First Design: Principles and Practice](https://www.fernandoux.com/en/wiki/concepts/mobile-first-design/) Mobile-first design is an approach that prioritizes designing for mobile devices first, then progressively enhancing for larger screens. - [Real-Time Presence Modeling: Collaborative UX](https://www.fernandoux.com/en/wiki/concepts/presence-modeling/) Learn to design effective presence indicators (cursors, avatars, activity) so that your users feel they are working together in real-time within your digital product. - [Skeleton VS Optimistic UI: Loading Strategies](https://www.fernandoux.com/en/wiki/concepts/skeleton-vs-optimistic-ui/) Learn the difference between Skeleton Screens and Optimistic UI, and how to choose the best loading strategy to improve the perceived performance of your digital product. - [Status Awareness in UI](https://www.fernandoux.com/en/wiki/concepts/status-awareness/) Learn to design interfaces that keep the user always informed about the current state of the system and each component to reduce uncertainty and errors. - [The Command Pattern in Product Design](https://www.fernandoux.com/en/wiki/concepts/command-pattern/) Move from designing static screens to designing dynamic flows based on encapsulated actions through the Command Pattern, the technical foundation of modern and collaborative interfaces. - [Token Architecture (Global vs. Semantic vs. Component)](https://www.fernandoux.com/en/wiki/concepts/token-architecture/) Discover how to structure a robust design token architecture using the three-layer model (Global, Semantic, and Component) to create scalable and maintainable design systems. - [Token Parity Across Multiple Platforms](https://www.fernandoux.com/en/wiki/concepts/token-parity/) Learn how to achieve design token parity across Web, iOS, and Android to ensure a consistent brand experience and accelerate multiplatform development. - [User-Centered Design: The Foundation of Everything](https://www.fernandoux.com/en/wiki/concepts/user-centered-design/) An approach where user research and user needs drive every design decision from start to finish. - [UX vs UI Design: What's the Real Difference?](https://www.fernandoux.com/en/wiki/concepts/ux-vs-ui/) UX focuses on how a product works and feels, while UI focuses on how it looks visually. - [Variables vs. Styles in Figma: Strategies and Trade-offs](https://www.fernandoux.com/en/wiki/concepts/variables-vs-styles/) Discover the key differences between Figma Variables and Figma Styles to decide which is best for your design system and prototyping workflows. - [Visual Hierarchy VS DOM Hierarchy: Accessibility](https://www.fernandoux.com/en/wiki/concepts/visual-vs-dom-hierarchy/) Learn the difference between what the user sees and what the browser reads, and how to align visual hierarchy with the DOM for flawless accessibility in your product. - [Visual Hierarchy: Guiding Users Through Your Design](https://www.fernandoux.com/en/wiki/concepts/visual-hierarchy/) Visual hierarchy is the arrangement of design elements to guide users' attention toward the most important information or actions. --- Source: https://www.fernandoux.com/en/wiki/concepts/