NNGroup Design Systems · Icons · Visual Style · Motion · Visual Testing (19 articles · Design Systems vs. Style Guides · 4 Icon Usability Criteria / Recognition vs. Interpretation · Skeuomorphism / Glassmorphism / Flat / Neumorphism · Clickable Element Identification + Banner Blindness · 6 Uses of Animation · Visual Testing Attitudinal vs. Behavioral / Desirability Toolkit / Mood Boards)
19 curated articles from Nielsen Norman Group’s “Visual Design” topic, covering the design systems and icons subset. Six clusters: ① Design systems and style guides (Design System = parent, containing Component Library / Pattern Library / Style Guide; Style Guide = child, divided into content, brand, and frontend types; three implementation approaches with three-way tradeoffs among cost, customization, and brand consistency: adopt / adapt / create; examples include NASA 1976, Material, Carbon, USWDS). ② Icons and signifiers (Icon usability = Recognition, whether users recognize the shape, + Interpretation, whether users understand the meaning; 4 quality criteria: Findability / Recognition / Information Scent / Attractiveness; isolated vs. contextual testing matrix; Accordion signifier experiment with 11 prototypes and 5 variants → Caret dropdown indicator performs best, right arrow ≈ no icon; floppy disk = save 83%, circular arrow = sync/refresh 73%, down arrow + container = download 78%; Sparkles icon AI overuse · none of 107 people associated it with AI · 16.82% misread it as bookmark/favorites). ③ Visual style evolution (Skeuomorphism as learning aid vs. visual trend → Flat → Neumorphism low-contrast pain point; Glassmorphism since 2020 with transparency + background blur + outlined gradients · Apple SwiftUI / Microsoft Fluent Acrylic / Vision Pro · WCAG contrast risk). ④ Clickable element identification (Beyond Blue Links 5 types of cues · Interaction Cost) + Banner Blindness (selective attention · proximity poisoning · hot potato effect · pseudo-advertising · persistent since 1997). ⑤ Animation and motion (6 uses: feedback / state transitions / spatial metaphor navigation / signifiers / attracting attention / attention hijacking dark pattern; restraint principle). ⑥ Visual testing (Attitudinal vs. Behavioral; 5-second test / first click / preference test / open and closed word selection; Microsoft Desirability Toolkit 118 word cards 2002 controlled vocabulary · trimmed to under 25 words · Venn diagram grouping; Mood Board 4–5 keywords → visual collage). Also includes brief summaries and attribution for 3 research/team method misfit articles (affinity diagramming / UX mapping visuals / groupthink / NPS shortcomings). Audience = product managers; in-line terminology explanations, decision-oriented (when to use / how to choose / counterexamples), all numbers retained.