Правильно
Раздел отвечает на свой вопрос, каркас остаётся снаружи
Причина ограничения стоит над содержимым, дальше идут показатели и записи раздела, справа — сводка с остатком и владельцем. Навигация продукта и поддержка остаются в каркасе.
Обзор раздела
Обзор отвечает на вопрос «как обстоят дела» в одном разделе продукта: биллинг, сводка кабинета, карточка аккаунта. Человек читает, сверяет со сводкой и уходит, поэтому списка секций у обзора нет — переход между разделами продукта рисует каркас, — а действие появляется только тогда, когда раздел его правда предлагает.
Статус: experimental · в системе с 2026-08
Когда использовать
- Раздел продукта отвечает на вопрос «как обстоят дела»: остаток и платежи, показатели за период, состояние аккаунта.
- Человек читает раздел целиком, а не правит его по частям.
- Рядом с содержимым нужна сводка, с которой человек сверяется по ходу чтения.
Не использовать:
- Сущность правят по секциям — это «Редактор сущности».
- Однородные записи отбирают, сравнивают и листают — это «Список сущностей».
- Экран собирает значения и отправляет их одним действием — это «Форма».
Состав
| Юнит или компонент | Роль |
|---|---|
entity-id | Идентификатор аккаунта в сводке. |
feedback | Отзыв о разделе без перехода на другую страницу. |
code | Готовый код подключения в обзоре аккаунта. |
alert | Причина, по которой раздел доступен не целиком: ограниченный доступ, приостановка, требуемое подтверждение. |
title | Заголовок блока показателей или секции внутри обзора. |
label | Подпись показателя, группы значений или самостоятельного переключателя. |
user-line | Владелец аккаунта или автор записи одной строкой в сводке. |
widget | Карточка дашборда: показатель и график в компактной или широкой ячейке. |
card | Именованный блок показателей или сводки с дочерними узлами. |
island | Поверхность региона без заголовка: блок показателей, ссылка «показать ещё» в подвале. |
combobox | Длинный справочник в сводке раздела: кампания, источник, страна. |
checkbox | Самостоятельный признак раздела: подписка на отчёт, автопродление. |
input | Короткое значение раздела, которое правят на месте: имя, идентификатор внешней системы. |
action-panel | Ряд отбора над сводкой: период и срез в теле, выбранное чипами в слоте. |
user-card | Владелец аккаунта или раздела: имя и идентификатор в сводке. |
description | Пояснение к показателю или блоку сводки. |
status | Состояние раздела или аккаунта рядом с именем. |
indicator | Состояние объекта в сводке одной точкой рядом с числом или подписью. |
tag | Метки аккаунта и раздела в сводке. |
extra-group | Сводные счётчики раздела рядом с именем блока: израсходовано, лимиты через слеш. |
meter | Доля израсходованного от известной границы: лимит, квота, остаток пакета. |
progress | Известный ход длительной операции раздела: обработка платежа, выгрузка отчёта. |
chart | Динамика показателей раздела за период: расход, показы, клики. |
table | Однородные записи раздела без отбора: последние операции, счета, начисления. |
input-date-range | Период, за который показаны показатели раздела. |
segmented-control | Представление показателей: день, неделя, месяц. |
select | Одно значение над содержимым: валюта, площадка. |
switch | Один самостоятельный признак раздела: автопополнение, уведомления. |
input-number | Сумма в панели действия раздела: пополнение, лимит. |
copy-field | Готовое значение раздела для переноса наружу: реквизиты, идентификатор аккаунта. |
avatar | Владелец аккаунта в сводке. |
thumbnail | Превью привязанного объекта в сводке. |
icon | Значок у показателя и строки: предупреждение, внешняя ссылка. |
divider | Граница групп внутри сводки или блока. |
link | Переход к связанной сущности и к справке раздела. |
button | Действие раздела и второстепенные команды: пополнить, продлить, выгрузить. |
tooltip | Пояснение к показателю или карточке сводки по наведению — поверх обзора. |
popover | Панель с полями рядом с кнопкой раздела: пополнить баланс, задать лимит — поверх обзора. |
menu | Дополнительные действия над разделом из титульной строки — поверх обзора. |
dialog | Подтверждение оплаты и других необратимых шагов — поверх обзора. |
drawer | Отбор сводки, который не помещается в ряд: поля фильтров панелью поверх обзора. |
column-settings | Состав и порядок колонок таблицы сводки — поверх обзора. |
toast | Результат действия над разделом — поверх обзора. |
Ограничения
- Обязательно: Отвечать на вопрос раздела первым блоком: главное число, состояние и причина ограничения, если раздел доступен не целиком.
- Обязательно: Держать главное действие
accentтем, ради чего человек пришёл в раздел: пополнить, продлить, выгрузить. Поддержка, новости и профиль главным действием раздела не становятся: они живут в шапке каркаса. Раздел, который только читают, остаётся безaccent: выдуманное главное действие врёт про экран. - Запрещено: Повторять в содержимом то, что рисует каркас: глобальную навигацию, бренд, остаток в шапке и её глобальные действия. Человек видит одно и то же дважды, а вопрос раздела остаётся без ответа.
- Запрещено: Заполнять регион ради самого региона: у обзора обязателен только
main, а сводка, предупреждение и действия появляются, когда разделу есть что в них положить. - Рекомендуется: Держать в сводке то, что человек сверяет с содержимым: остаток, владельца, метки, состояние.
- Рекомендуется: Показывать закрытую часть раздела причиной, а не пустотой: ограниченный доступ объясняется один раз над содержимым.
Логика отклика
- Ориентация Человек открывает раздел из глобальной навигации продукта. Титульная строка называет раздел, первый блок отвечает на его вопрос, сводка показывает остаток и состояние.
- Чтение Человек читает содержимое и сверяется со сводкой. Содержимое и сводка стоят рядом и остаются на месте: за сверкой не нужно уходить со страницы.
- Ограничение Человек упирается в закрытую часть раздела. Причина стоит один раз над содержимым и называет, что именно недоступно и почему.
- Действие Человек делает единственное действие раздела. Результат приходит уведомлением и обновлённой сводкой; раздел остаётся открытым.
Контекстный пример
Скелет экрана
mainСодержимое раздела одним потоком: показатели, записи, блоки сведений.summaryСводка рядом с содержимым: остаток, владелец, метки, привязанные объекты.feedbackПричина по всему разделу: ограниченный доступ, приостановка, требуемое подтверждение.actionsДействие раздела, когда оно есть; стоит в титульной строке страницы.