---
name: psychology/cognitive-fluency
title: Cognitive Fluency in Design
description: Design patterns that make information easy to process — reducing friction and increasing trust.
tags: [psychology, cognitive, fluency, simplicity, trust]
source: Nielsen Norman Group, baymard.com, stripe.com, linear.app
---

# Cognitive Fluency

## Что это
Дизайн, который делает информацию максимально простой для восприятия. Мозг доверяет тому, что легко понять.

## Принципы

1. **Простота** — одна идея на экран
2. **Предсказуемость** — знакомые паттерны
3. **Контраст** — важнее = больше
4. **Группировка** — связанные вместе

## Паттерны

```css
/* ✅ Fluent */
.card {
  background: var(--color-surface);
  border-radius: 16px;
  padding: 32px;
  border: 1px solid var(--color-border);
}

/* ❌ Complex */
.card {
  background: linear-gradient(...);
  border-radius: 16px 8px 20px 12px;
  padding: 33px 37px;
  box-shadow: ...;
  border: 2px solid ...;
}
```

## Anti-patterns

| ❌ Плохо | ✅ Хорошо |
|----------|-----------|
| 5 идей на экран | 1 идея на экран |
| Сложная навигация | 3–5 пунктов |
| Абстрактные иконки | Распознаваемые |
| Без whitespace | 128px между секциями |