Skeleton-экраны против спиннеров: что реально ускоряет восприятие загрузки

Один и тот же секунды, разное ощущение

Nielsen Norman Group — исследовательская UX-лаборатория, работающая с 1998 года, — неоднократно проверяла, как индикаторы загрузки влияют на восприятие времени ожидания. Итог устойчив: пользователи воспринимают ожидание как более короткое, если видят индикатор прогресса, даже когда реальное время не меняется. По оценке NN/g, ожидание с обратной связью субъективно ощущается на 11–15% быстрее «голого» ожидания без индикаторов.

Когда skeleton-экран работает, а когда нет

Skeleton-экран — это серый «скелет» будущего интерфейса (блоки-заглушки на месте текста и картинок), который постепенно заполняется реальным контентом. По актуальным рекомендациям NN/g, skeleton-экраны улучшают восприятие только в узком окне: при реальном времени загрузки от 400 мс до 3 секунд. Если контент грузится быстрее 400 мс — скелет просто мигнёт и создаст лишний визуальный шум. Если дольше 3 секунд — одного скелета недостаточно, нужен ещё и индикатор прогресса с примерной оценкой времени.

Цифры по отказам

По совокупным данным исследований UX (включая NN/g), skeleton-экраны способны снижать показатель отказов на 9–20% при абсолютно неизменном реальном времени загрузки — эффект целиком объясняется восприятием: экран «выглядит», будто страница уже почти готова, и создаёт ощущение прогресса вместо пустоты.

Практическое применение

• Карточки, списки, ленты (посты блога, товары, отзывы) — почти всегда хороший кандидат для skeleton вместо спиннера: форма контента заранее известна.
• Полноэкранные переходы между страницами — здесь спиннер или прогресс-бар честнее: skeleton всей страницы может создать ложное впечатление, что структура определена, хотя она может измениться.
• Не держите skeleton дольше 3 секунд без доп. индикатора — иначе эффект «терпения» сменится раздражением от того, что ничего не происходит.

Источник: Nielsen Norman Group, «Skeleton Screens 101» (nngroup.com).