Browse commands

/impeccable layout

Layout

Исправьте макет, интервалы и визуальный ритм.

Когда использовать

/impeccable layout — для страниц, где технически всё правильно, но ничего не дышит. Одинаковые отступы везде, монотонные сетки карточек, контент от края до края, иерархия, основанная только на размере. Обращайтесь к нему, когда макет «кажется неправильным», и вы не можете объяснить почему.

Хорошие триггеры: «всё кажется переполненным», «читается как стена», «не знаю, куда смотреть сначала».

Как это работает

Навык проходит через пять измерений макета:

  1. Интервалы: масштаб интервалов согласован или есть случайные 13px промежутки, сгруппированы ли связанные элементы плотно с щедрым пространством между группами, есть ли вообще какой-то ритм.
  2. Визуальная иерархия: попадает ли взгляд на основное действие в течение 2 секунд, работает ли иерархия по-настоящему или всё кричит.
  3. Сетка и структура: есть ли базовая сетка или макет случаен, выровнены ли элементы по базовым линиям.
  4. Ритм: чередуется ли страница между плотными и щедрыми интервалами или всё однообразно.
  5. Плотность: макет перегружен или расточителен, соответствует ли плотность типу контента.

Исправления обычно включают перестройку масштаба интервалов, введение асимметрии, замену монотонных сеток на смешанный макет с hero и поддерживающими элементами, а также предоставление основному действию реального пространства.

Попробуйте

/impeccable layout the settings page

Типичные изменения:

  • Масштаб интервалов унифицирован до 8 / 16 / 24 / 48 / 96px
  • Разделы секций через 48px, промежутки строк через 16px, группы полей формы через 8px
  • Основные действия вынесены из потока формы с буфером 32px
  • Декоративные рамки удалены, заменены группировкой через интервалы
  • Пропорции боковой панели и основной колонки перебалансированы (280 / flex vs 25 / 75)

Подводные камни

  • Путаница layout с distill. Если проблема в слишком большом количестве элементов, сначала запустите /impeccable distill. Layout — для компоновки уже правильного набора.
  • Ожидание спасения сломанной сетки. Если у страницы вообще нет сетки, layout создаст её. Просто знайте, что diff будет больше, чем вы ожидаете.
  • Игнорирование вердикта по иерархии. Если layout говорит «нет ничего основного», никакая работа с интервалами это не исправит. Вам нужно контентное решение, а не настройка макета.