Изложите содержимое панели
Выбор ящика при просмотре основного контента по-прежнему помогает выполнить задачу.
Ящик Система дизайна
Открывайте дополнительный контент, сохраняя контекст основного экрана.
Содержание чек-листа
Прогресс проверки
01
Структура и значение
Сравните информацию и представление в контексте использования.
02
Взаимодействие и удобство использования
Попробуйте выполнить операцию, измените статус и продолжайте работу.
03
Завершите опыт
Проверьте детали, которые легко упустить при вводе проекта в эксплуатацию.
Прогресс автоматически сохраняется в этом браузере.
РЕКОМЕНДАЦИИ
Как проверять
ПРИМЕРЫ
Примеры использования
Изложите содержимое панели
Справа откроется панель «Детали заказа», список заказов останется сзади.
Варианты и сценарии использования
Направление открытия панели
Выбирайте сторону открытия по связи с содержимым и сохраняйте расположение между экранами.
Проверьте панель на компьютере и мобильном устройстве: название и кнопка закрытия должны оставаться видимыми.
Пример Подробности записи открываются справа, а мобильный фильтр — снизу.
Фоновый слой и фокус
Определите, блокирует ли выдвижная панель содержимое за ней; модальная панель удерживает фокус внутри.
Используйте Tab, Escape и нажатие на фон: после закрытия фокус должен вернуться к нужной кнопке открытия.
Пример Панель сообщений закрывается клавишей Escape, затем фокус возвращается к кнопке сообщений.
Компоновка панели
Разделяйте заголовок, прокручиваемое содержимое и нижние действия, чтобы длинная панель оставалась удобной.
Проверьте длинное содержимое и мобильную клавиатуру: кнопка подтверждения не должна выходить за видимую область.
Пример Заголовок фильтров закреплён вверху, список прокручивается отдельно, а кнопка применения находится внизу.