Геометрия в дизайне: золотое сечение и модульные сетки

1.618 — число, которое определяет красоту ракушки наутилуса, пропорции Парфенона и… идеальный отступ между заголовком и текстом на вашем сайте. Золотое сечение — не магия, а инструмент, который дизайнеры используют тысячи лет.

Золотое сечение в цифровом дизайне

Мы не фанатики пропорций — но используем их как отправную точку. Если ширина контентной области 1200px, боковая панель будет ~742px (1200/1.618). Если основной текст 16px, подзаголовок — 26px (16×1.618). Это не правило, а ориентир.

Модульные сетки

Каждый наш проект строится на сетке. Для веба стандарт — 12-колоночная с базовым модулем 8px. Но для некоторых проектов мы используем 5-колоночные и даже асимметричные сетки — когда это оправдано задачей.

Практический пример: Sonarex

Дашборд Sonarex построен на 8-колоночной сетке с модулем 4px. Карточки данных используют соотношение 3:2, графики — 16:9. Отступы между секциями — 32px (8×4), внутри карточек — 16px (4×4). Система, а не хаос.

Когда нарушать правила

Правила геометрии нужно знать, чтобы осознанно их нарушать. Намеренное нарушение сетки создаёт акцент. Мы используем этот приём для CTA-блоков и ключевых сообщений — элемент, который «выбивается» из сетки, привлекает внимание.