Почему один и тот же слайд бывает «кашей» и «понятным»
Возьмите набор элементов и просто измените расстояния между ними. Не цвет, не размер, не шрифт. Только пустоту вокруг. И смысл соберётся сам. Это и есть закон близости, самый дешёвый способ навести порядок в чём угодно.
Закон близости простыми словами
Мозг группирует объекты, которые расположены рядом, и воспринимает их как одно целое ещё до того, как вы осознанно что-то прочитали. Расстояние мозг считывает раньше цвета и формы. Что близко, кажется связанным. Что далеко, кажется отдельным.
Точки не меняются вообще, меняется только восприятие.
Близость снимает нагрузку с того, кто смотрит
Когда всё расставлено с равными отступами, зритель сам решает, что к чему относится, и это лишняя работа. Группировка делает её за него: связи считываются мгновенно. Человек понимает структуру за доли секунды, а не «разбирается».
Это не настоящий замер времени, а наглядное «ощущение» усилия: на равных отступах взгляд мечется дольше.
Чем ближе, тем сильнее связь
Подпись рядом с полем = они одно целое. Отодвиньте подпись, и станет непонятно, к какому полю она относится. Работает везде: подпись и значение, иконка и текст, заголовок и абзац.
А так делать не надо: подпись на равном расстоянии от двух полей сразу
К какому полю относится «Телефон»? Непонятно, потому что близость не работает.
Пустота разделяет лучше, чем линии
Чтобы отделить блоки, не нужны рамки, линии и заливки, обычно хватает воздуха. Лишние разделители только шумят. Сначала пробуйте разделить пустотой, и только если воздуха не хватило, добавляйте линию.
Сколько смысловых групп вы видите?
Смотрите только на расстояния между плашками.
Внутри группы теснее, чем между группами
Расстояние внутри группы должно быть меньше, чем между группами. Заголовок ближе к своему абзацу, чем к следующему разделу. Сломайте это соотношение, и заголовок «прилипнет» не к тому блоку.
Где близость ломается чаще всего
- Равные отступы у всего подряд
- Подпись висит между двумя полями
- Внутри группы воздуха больше, чем между группами
- Список, где пункты не сгруппированы по смыслу
Где сломана близость?
Нажмите на макет, в котором нарушен закон близости.
Соберите слайд сами
Теперь ваша очередь. Перетащите элементы так, чтобы связанное стояло рядом, а несвязанное на расстоянии. Работает мышью и пальцем.
Подсказка: рядом должны стоять элементы одного смысла, то есть заголовок со своими пунктами, контакты вместе, цена с кнопкой.
Три правила близости
Близость остаётся самым дешёвым инструментом порядка: ничего не добавляете, только управляете пустотой. Близость решает, что с чем связано. Там, где элементы разнесены по слайду и расстоянием их уже не связать, ту же работу делает закон подобия. За то, прочитают ли текст вообще, отвечает контрастность, а за порядок, в котором взгляд обойдёт группы, отвечает закон непрерывности.
Рядом = связано
Расстояние и есть связь. Близкое читается как одно целое.
Воздух, а не линии
Сначала разделяйте пустотой. Рамку добавляйте, только если воздуха не хватило.
Внутри теснее
Внутри группы отступ меньше, чем между группами. Всегда.
Чек-лист самопроверки слайда
Отметьте то, что выполнено на вашем слайде.
Одно правило в неделю
Подпишитесь на рассылку: каждую неделю присылаем разбор одного правила дизайна и материалы, которые можно применить сразу.
Те же разборы выходят в телеграм-канале школы. Другие термины разобраны в Учебнике.