← К публикациям
Дизайн и разработка

Пустой экран в интерфейсе: что показать, пока данных ещё нет

Пустое состояние — не заглушка «ничего не найдено», а подсказка, что делать дальше. Спроектируйте его отдельно, а не оставляйте на волю разработчика.

CreativeMedia1 мин чтения
Дизайнер изучает пустое состояние приложения с подсказкой для первого действия.

Новый пользователь заходит в раздел «Проекты» или «Заказы», а там пусто — ни одной карточки, ни объяснения. Экран, спроектированный только для заполненного состояния, в этот момент выглядит как ошибка, хотя это нормальная часть пути.

Объясните, почему пусто, и что делать

Разделите причины: раздел пуст, потому что пользователь ещё не начал работу, потому что фильтр отсеял всё, или потому что произошла ошибка загрузки. Для каждой причины нужен свой текст и своё действие — кнопка «Создать первый проект» отличается от кнопки «Сбросить фильтр». Общая надпись «ничего не найдено» на все три случая путает пользователя.

Не переносите макет заполненного состояния

Пустой экран часто рисуют в последнюю очередь, копируя контейнер из заполненной версии и убирая карточки. Получается голое пространство без ориентиров. Проверьте макет отдельно: достаточно ли контраста у текста-подсказки, помещается ли кнопка действия на маленьком экране, не выглядит ли иллюстрация тяжелее самого функционала.

Проверьте на реальном новом аккаунте

Попросите коллегу, который не участвовал в разработке, открыть раздел с чистой учётной записью и не подсказывайте ему следующий шаг. Если человек не понимает, что нажать, текст или расположение кнопки нужно поправить до релиза, а не после жалоб в поддержку.