Scott
Если подготовка большого файла занимает несколько минут, одного вращающегося индикатора недостаточно. Человеку важно понять, началась ли работа, можно ли уйти со страницы, где появится результат и что делать, когда ссылка на скачивание перестанет действовать. Представим вымышленную команду, которая собирает пакет для передачи в разработку из 42 экранов интерфейса. Разберём путь от запроса до готового файла и проверим его в прототипе Pixso.
Сначала определите состав задачи и место результата
В нашем примере пакет содержит 42 выбранных экрана, актуальные спецификации дизайна и перечень связанных ресурсов. Автор выбирает формат и запускает формирование. Прежде чем рисовать экран ожидания, команда должна решить четыре вопроса: что входит в пакет, продолжит ли сервер работу после закрытия вкладки, где будут перечислены готовые файлы и когда истечёт срок ссылки. Это правила продукта и серверной части; красивая анимация прогресса не заменит их.
На экране запроса покажите выбранный объём: «42 экрана проекта Autumn launch», формат и папку назначения. Если часть экранов нельзя включить, предупредите до отправки либо после завершения назовите пропущенные элементы. Неполный пакет нельзя без пояснения объявлять «экспорт завершён». В этом вымышленном случае файл доступен семь дней. Это параметр примера, а не описание срока хранения или функций экспорта самого Pixso.
У каждого запроса должен быть устойчивый идентификатор задачи. Перейдя на другую страницу, человек должен найти тот же процесс, а не случайно запустить его снова. Что означает второй щелчок — открытие существующей задачи, создание новой версии или возобновление — определяется реальным поведением сервера. Интерфейс обязан ему соответствовать.
Не показывайте процент, которого система не знает
Надпись «Подготовка пакета» полезна, когда за ней следует понятный следующий этап. Число «73%» бесполезно, если общий объём работы выдуман. В примере сервер сообщает состояния «в очереди», «сбор файлов», «упаковка» и «готово», но не умеет надёжно предсказывать оставшееся время. Показывайте название этапа и индикатор без процента. Если позже появится стабильный способ измерять общее число единиц работы, можно использовать определённую шкалу прогресса.
| Что известно системе | Что показать человеку | Чего избежать |
|---|---|---|
| Запрос принят, но обработка ещё не началась | Название задачи, статус «в очереди», место, где её найти | Неподвижной шкалы, создающей впечатление начатой работы |
| Известен этап, но нет точного общего объёма | Название этапа и индикатор без процента | Придуманного процента или обратного отсчёта |
| Измерены выполненные единицы и стабильный итог | Выполнено из общего числа и шкала прогресса | Отката процентов без объяснения изменения объёма |
| Пакет готов | Имя файла, формат, размер при наличии данных и скачивание | Экрана, застывшего на 100% без готового результата |
Если работа состоит из нескольких этапов, завершение первого не равно 100% всего экспорта. Называйте переход от «сбора файлов» к «упаковке» обычными словами. Когда измеряемый объём меняется, например часть экранов была исключена, объясняйте это, а не молча уменьшайте процент. Индикатор должен отвечать на вопрос пользователя, а не просто украшать страницу.
Позвольте уйти со страницы, не потеряв задачу
Если сервер продолжает работать после перехода, человеку не нужно несколько минут смотреть на модальное окно. В нашем примере экран говорит: «Можно продолжить работу. Пакет появится в разделе „Экспорт“». Пользователь закрывает панель, открывает другой файл и возвращается к списку экспорта. В списке сохраняются название той же задачи, время создания, текущий этап и действительно доступные действия.
Если закрытие вкладки останавливает серверную обработку, нельзя обещать фоновую работу. Это требование к функции, которое нужно решить до написания текста. Уведомление о готовности полезно, но его можно пропустить или отключить. Надёжным способом вернуться к файлу остаётся список задач.
Несколько одинаковых запросов тоже должны различаться. «Autumn launch — PDF — начало в 10:42» удобнее, чем пять строк с названием «Экспорт». Покажите, какая версия новее, но не заменяйте старый готовый файл незаметно. Закрытие панели и отмена серверной задачи — разные действия: уход с экрана не обязан останавливать обработку.
Превратите «готово» в доступный файл
Состояние готовности должно содержать имя файла, формат, размер, если он уже известен, и действие «Скачать пакет». Если ссылка живёт семь дней, как в примере, укажите конкретные дату и время окончания с учётом локали пользователя. Фраза «доступно некоторое время» не помогает понять, можно ли передать результат коллеге завтра. Пока срок не истёк, оставляйте постоянный путь к задаче из списка.
Готовность пакета на сервере и успешное сохранение на устройстве — разные шаги. Браузер может заблокировать скачивание, соединение может оборваться, на диске может закончиться место. Из-за этого не следует переводить готовую серверную задачу в «ошибку». Результат остаётся готовым до конца срока хранения. Документация HTTP-заголовка Content-Disposition описывает передачу файла как вложения с предлагаемым именем, однако серверный заголовок не заменяет понятное имя и кнопку на странице.
После истечения срока не отправляйте человека на абстрактную страницу 404. Назовите пакет, сообщите, что он больше недоступен, и предложите сформировать новый с ранее выбранным составом, если состав ещё действителен. Когда исходный дизайн изменился, поясните, что новая выгрузка отражает текущую версию, а не обещайте точную копию прошлого файла.
Различайте ошибку, истечение срока и неизвестный исход
Не всякая неудача одинакова. Ошибка проверки до запуска должна назвать отсутствующее разрешение, недоступный экран или неподдерживаемый формат. Если уже запущенная обработка завершилась с ошибкой, сохраните запись задачи, объясните, что пригодного файла нет, и предложите безопасный повтор, если он возможен. Истёкшая ссылка — не ошибка обработки; ей нужен собственный статус.
Потеря сети в момент отправки особенно неоднозначна: сервер мог создать задачу, хотя браузер не получил ответа. Прежде чем предлагать «Повторить», проверьте запрос по идентификатору или найдите его в списке. Иначе могут появиться два больших пакета вместо одного. Объясните и смысл повтора: возобновление старой задачи, создание новой версии либо использование частичного результата. Выбор зависит от реальной реализации.
Если есть кнопка отмены, определите, может ли сервер действительно остановить работу, остаются ли промежуточные файлы и когда статус становится «отменено». Если кнопка лишь прячет панель, называть её «Отменить экспорт» нельзя. Честное «Закрыть панель» лучше обещания, которое не выполняется.
Сообщайте состояние доступно и проверьте весь путь
Дайте задаче понятное название, а изменение статуса передавайте текстом, не одним цветом. Для измеряемой шкалы прогресса предоставьте вспомогательным технологиям текущий показатель и пределы; когда итог неизвестен, не выдумывайте числовое значение. Руководство W3C по meter отличает измеритель величины от прогресса задачи, для которого предназначена роль progressbar. Техника с live region показывает, как сообщать обновления статуса: визуальная шкала сама по себе не гарантирует объявления изменений пользователю экранного диктора.
Создайте в Pixso экраны запроса, очереди, активного этапа, строки фоновой задачи, готового файла, истёкшей ссылки, ошибки и неизвестного результата отправки. Соедините два маршрута: дизайнер остаётся на странице и дизайнер уходит, а затем возвращается. Попросите коллегу ответить: «Задача ещё работает?», «Где я найду файл?» и «Что делать, если ссылка пропала?» Если ответ приходится угадывать, уточните состояние и текст до передачи в разработку.
Передайте разработчикам прототип вместе с действительными событиями статуса, сроком хранения, правилами повторного запуска и доступом. Pixso помогает спроектировать и обсудить взаимодействие; серверная обработка и выдача файлов должны быть реализованы самим сервисом. Откройте Pixso и соберите сценарий экспорта.
