Блог Perkova&Perkova

Пустое состояние интерфейса: упражнение для новичка

Пустое состояние объясняет, почему привычного содержания нет и что можно сделать дальше. Оно отличается от ошибки загрузки и от списка без подходящих результатов. Точная причина помогает выбрать сообщение и действие, сохраняя контекст текущего выбора.

Расписание без встречи в выбранный день

В условной учебной программе есть несколько событий недели. Посетитель выбрал среду, но на этот день ничего не запланировано. Он может изменить дату и увидеть ближайшие варианты. Это отсутствие данных для выбранного условия, а не технический сбой.

Напишите сообщение, которое называет день и результат: «На выбранную дату встреч нет». Рядом предложите изменить день. Если показываете ближайшее событие, используйте данные модели и объясните, что это другой день. Пустая картинка без текста не даёт такой ясности.

Три разных причины

Если событий пока вообще нет, полезно объяснить состояние расписания и доступный путь уточнения. Если список отфильтрован, покажите ограничения и возможность их изменить. Если сведения не загрузились, сообщение должно описывать проблему и допустимую повторную попытку. Эти случаи нельзя автоматически объединять одной фразой «Ничего не найдено».

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

Практическая проверка

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

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

Что показать в кейсе

Сохраните исходную пустоту, новый текст и переход к другому дню. Объясните, какую причину моделировали. Для клиента полезно передать перечень состояний и источник данных каждого. Так будущая реализация различает отсутствие события и техническую ошибку, а портфолио демонстрирует проектирование процесса за пределами идеального заполненного экрана.

Продолжить помогут выбор в каталоге и сообщения формы. Найденное затруднение поможет сформулировать вопросы к программам в подборке обучения Perkova&Perkova.

2025-11-23 10:00 Обучение веб-дизайну