Ui UX Flashcards

The visual and interactive elements of a product that users directly interact with, including buttons, icons, spacing, typography, and color schemes.

The overall experience a user has when interacting with a product, encompassing usability, accessibility, performance, design, and emotional impact.

UI focuses on the visual presentation and interactive elements; UX focuses on the overall experience, including usability, accessibility, and user satisfaction. UI is what you see, UX is how it feels.

1) Visibility of system status 2) Match between system and real world 3) User control and freedom 4) Consistency and standards 5) Error prevention 6) Recognition rather than recall 7) Flexibility and efficiency 8) Aesthetic and minimalist design 9) Help users recognize and recover from errors 10) Help and documentation

The time to acquire a target is a function of the distance to and size of the target. Larger and closer targets are faster to click. Used to optimize button sizes and placement.

The time it takes to make a decision increases with the number and complexity of choices. Reducing options simplifies decision-making.

The average person can only keep 7 (±2) items in their working memory. Used to limit menu items, form fields, and chunking information.

Users spend most of their time on other sites, so they prefer your site to work the same way as all the other sites they already know. Familiarity reduces cognitive load.

The arrangement of elements to show their order of importance, using size, color, contrast, spacing, and position to guide user attention.

Laws of how humans perceive visual elements: Proximity (close items are grouped), Similarity (similar items are grouped), Closure (completing incomplete shapes), Continuity (following continuous patterns), Figure-Ground (distinguishing objects from background).

Users typically scan web content in an F-shaped pattern: two horizontal stripes followed by a vertical stripe. Place important content along these areas.

Eye movement pattern for less text-heavy designs: top-left to top-right, then diagonally to bottom-left, then to bottom-right. Used for landing pages and advertisements.