November 12, 2022

Производительность приложений на Bubble. Заметки. Часть 19. Прозрачные ответы на действия пользователей.

Данная серия статей — это мои заметки по книге The Ultimate Guide to Bubble Performance. Тут изложено только то, что фиксировал я, т.к. посчитал это важным.

Сложные процессы и задержки можно скрыть разными способами, чтобы пользователю было комфортно использовать приложение.

Автор проводит аналогию с реальной жизнью:

Представьте, что вы находитесь на работе и попросили свою вторую половинку приготовить ужин в 17:00. Но вы вдруг понимаете в 14:00, что никак не успеваете приехать вовремя. В итоге вы приезжаете в 19:00 и видите рассерженную половинку и холодный ужин.

А теперь представьте тот же сценарий, но с небольшой поправкой — в 14:00 вы сообщили своей половинке о том, что опоздаете. Поэтому ужин можно приготовить к 19:00. Вы приезжаете домой, на столе горячий ужин, а половинка счастлива.

Ситуации почти одинаковые, но в них разная коммуникация между людьми.

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

Посмотрите, как сервис TransferWise показывает процесс перевода денег кому-либо:

Здесь отсутствует анимация, но сервис показывает, как деньги переходят от вас к TransferWise и далее к получателю, как если бы перемещался физический объект. Сервис отправки файлов с аналогичным названием WeTransfer имеет более традиционный индикатор выполнения загрузки:

Вы признаете, что оба процесса могут занять несколько минут, и честно говорите об этом. Дизайн приложения притягивает пользователя и вызывает у него желание позалипать на процесс.

То, как мы общаемся с пользователями, влияет на их отношение к приложению.

Мы можем ориентироваться при коммуникации с пользователем на три процесса:

  • Действие получено (нажата кнопка)
  • Процесс запущен (панель загрузки)
  • Процесс завершен (всплывающее окно)

Все эти три момента объединяет общая черта - они сообщают пользователю, что его действия не игнорируются, приложение делает свою работу и не планирует падать.

Ниже приведены примеры, как мы можем общаться с пользователями в различных ситуациях:

Действие получено

Как только пользователь инициирует процесс, он будет ожидать, что ваше приложение подтвердит его. Было бы странно нажимать кнопку, когда ничего не происходит, верно?

Коммуникация может быть незаметной: может быть достаточно небольшого изменения цвета или тени кнопки:

До нажатия
После нажатия

Простого текстового подтверждения может быть достаточно, чтобы показать, что действие получено и обрабатывается:

Элемент Alert в Bubble автоматически может сообщать об изменении данных без дополнительных воркфлоу.

Про фишку с Алертом я не знал. Если так делали, то киньте в комменты, как.

Процесс запущен

Вы не только говорите своему пользователю, что что-то произошло, но и что процесс продолжается и, возможно, сколько времени осталось до его завершения.

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

Ниже один из самых простых способов показать выполняемый процесс. Отлично подходит для простых процессов, но в нем не хватает информации о том, что происходит, и сколько времени это займет:

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

Процесс завершен

Яркие, забавные иллюстрации сделают приложение более дружелюбным. Например, Notion активно их использует.

Иногда обработка информации может занять большое количество времени и будет логично отправить пользователю уведомление. Например, на почту.


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

Конец

→ Подписывайтесь на мой канал в Телеграме Иван Некодит.

В канале рассказываю про:

  • Путь разработчика
  • Разработку на Nocode-инструментах.