Прогресс Бар или Спиннер: что и когда использовать

Хотя ответ очевиден, кого-то выбор того или иного индикатора загрузки ставит в тупик. Разбираемся, когда стоит использовать каждый из них.

И не забывайте подписываться на мой блог, чтобы у меня была хоть какая-то мотивация 🙃

Вам ведь не нравится стоять в очереди на одном месте, не продвигаясь вперёд? Так и юзерам не нравится смотреть на спиннеры больше четырёх секунд.

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

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

Индикатор процесса (прогресс бар) задаёт чёткие ожидания времени загрузки. Юзеры своими глазами наблюдают прогресс загрузки, что снижает негативные эмоции от ожидания. Спиннер не даёт этого ощущения, он не показывает прогресс и не подталкивает юзера к ожиданию загрузки. Юзеры просто не знают, обрабатывает ли приложение их запрос или просто зависло.

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

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

Казалось бы - всё просто. Загрузка меньше 4 секунд - используй спиннер. Больше - прогресс бар.

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

Что делать в таких "промежуточных" случаях - тема для отдельной статьи, потому что вариантов много. Например, можно последовать примеру Google и показывать небольшую нотификашку о том, что "процесс занимает дольше, чем ожидалось".

Если вам понравилось - подписывайтесь на мой блог и кидайте деньги в монитор. Жмите на колокольчик, чтобы ничего не пропустить. И выращивайте петрушку. Она полезная.

#дизайн #ui #ux #загрузка