Рекомендации по развертыванию анимированных индикаторов прогресса в ваших интересах

Если вы когда-либо пользовались ПК, то наверняка знаете об анимированном символе Windows, который появляется при загрузке системы. Потребовалась эволюция дизайна и анимации, чтобы превратиться в то, что мы видим сегодня, но еще в Windows 1995 изображение вообще не двигалось. Некоторые из вас могут подумать, зачем вообще использовать эти анимированные индикаторы?

Но подумайте, вы бы предпочли ждать и смотреть на пустой экран, чтобы увидеть, как ваше действие завершено? Или продолжать развлекаться чем-то значимым, пока экран не появится снова?

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

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

Кто не любит быстрый ответ от приложения или веб-сайта? Хотя это действительно много значит для пользователя, невозможно запустить его с неизменной согласованностью. В уравнение всегда добавляются определенные факторы, которые могут снизить скорость вашего приложения. Эти факторы в основном включают плохое интернет-соединение, низкую производительность из-за большой нагрузки и даже сбой программы. В таких обстоятельствах лучшим шагом было бы свести к минимуму напряжение пользователя и предоставить уверенность в том, что приложение работает и прогресс идет. Для этого вы должны предоставить пользователю обратную связь, чтобы время не сказалось на его терпении.

Держите пользователей на крючке с обратной связью

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

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

Как использовать индикатор прогресса для любого действия, которое занимает больше одной секунды?

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

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

Типы индикаторов прогресса

1. Неопределенный: анимированные индикаторы ожидания предназначены для связи с пользователем и информирования его о последнем действии пользователя. Наиболее распространенным и довольно простым типом индикатора ожидания является «Неопределенный». Такие типы индикаторов говорят пользователям дождаться завершения действия, не давая им знать о времени, которое может потребоваться для завершения прогресса. Почти понятно, что индикатор неопределенного прогресса следует использовать для быстрых действий, желательно в течение 2-10 секунд. Любое время больше, чем это, может повлиять на терпение пользователя. Это может увеличить показатель отказов для веб-сайта и отказов для приложений.
2. Определить: в случае индикатора прогресса «Определить» время в анимации полностью растянуто. Индикаторы такого типа информируют пользователя о приблизительном или точном времени, необходимом для завершения процесса. Это, скорее, более популярный тип индикаторов ожидания, поскольку они показывают прогресс с того места, где оно началось, сколько было сделано и сколько еще потребуется, чтобы убить ожидание. Это помогает пользователю быть уверенным в достигнутом прогрессе, который показывается с помощью анимации, и в то же время повышает его готовность оставаться на веб-сайте или в приложении.

Индикатор зацикленной анимации и индикатор процента готовности

• Циклическая анимация: Индикатор циклической анимации предназначен для представления прогресса без указания приблизительного или точного времени загрузки. Именно поэтому большинство зацикленных анимированных индикаторов прогресса неопределенны. Например, индикатор прогресса в Windows 7 был разработан для отображения повторения одной и той же анимации без какой-либо обратной связи о точном времени, которое может потребоваться для завершения прогресса. Кроме того, он включал в себя все, начиная от функций загрузки, настройки работы интерфейса и других форм загрузки данных. По этим двум причинам пользователи не предпочитают видеть зацикленный индикатор ожидания, отображающий время загрузки веб-сайта или приложения.

• Индикатор процента выполнения: как следует из названия, индикатор процента выполнения показывает ход загрузки, заполняя диапазон анимации, круг или полосу от 0% до 100%. Поскольку он показывает время, необходимое для завершения выполнения, индикатор процента выполнения классифицируется как определенный индикатор ожидания. Для этого конкретного качества лучше всего использовать индикатор процента выполнения для задач, на выполнение которых требуется более 10 секунд.

  Согласно исследованию, 10 секунд — это порог среднего терпения пользователя. Кроме того, пользователь становится безрассудным и нетерпеливым, пока не будет предоставлена ​​​​дальнейшая обратная связь. Показывая индикатор выполнения в процентах для процессов, загрузка которых занимает более 10 секунд, вы можете удерживать пользователя на веб-сайте или в приложении, не ставя под угрозу его терпение.

Как эффективно использовать индикаторы прогресса?

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

1. Держите пользователя в курсе о причине ожидания: это ошибка новичка, чтобы пользователь не обращал внимания на процесс загрузки, который выполняется в фоновом режиме. Это увеличивает их тенденцию терять терпение и выходить из приложения или веб-сайта. Вы можете держать пользователя в курсе, показывая анимированный индикатор прогресса, сопровождаемый текстом для дополнительного понимания. Вы можете показать, какой процесс конкретно является целевым. Например, вы можете показать ход ожидания видеоигры с помощью полосы загрузки и текста, который читает, какой процесс выполняется, например, «загрузка графики» или «загрузка карт» и т. д.
2. Укажите простую оценку времени для задачи, требующей более длительных периодов времени: не доводите дело до микромасштабов. Вы можете поддерживать интерес пользователя, предоставляя простую оценку. Дурачиться с обещаниями, которые вы не можете выполнить, может раздражать пользователей и вынуждать их уйти.
3. Показать точное количество требуемого времени. Однако для операций, которые обычно занимают больше времени, чем средний предел ожидания пользователя, выбор определенных индикаторов выполнения будет более разумным шагом. Идеальным выбором был бы индикатор выполнения в процентах, так как он привлекает внимание к точному времени загрузки. Для операций, которые еще дольше обрабатывать, рассмотрите возможность использования количества шагов, чтобы выделить достигнутый прогресс.
4. Не отставайте от прогресса: старайтесь следить за последовательностью индикатора выполнения во время загрузки задач. После нескольких опытов индикатор выполнения заставляет пользователей ожидать, насколько быстро действие будет завершено. Следовательно, любые зависания на фоне прогресса могут нанести серьезный удар по ожиданиям пользователей. Например, когда полоса достигает 99% и остается такой в ​​течение длительного периода времени, большинство пользователей расстраиваются из-за такого поведения и покидают приложение, полагая, что оно зависло. Чтобы противостоять этому, вы можете замаскировать эти непоследовательные задержки в индикаторе выполнения, показывая, что он движется мгновенно и постоянно.
5. Показывать прогресс в полосе быстрее, чем фактическая скорость: необработанная скорость может проявляться простым восприятием, которое вы можете создать, чтобы полоса прогресса казалась быстрее. Вы можете добиться этого, спроектировав анимацию так, чтобы она сначала двигалась медленно, а затем набирала темп по мере закрытия. Это создаст иллюзию быстрого прогресса без ущерба для времени на выполнение задачи.
6. Предложите отвлечение: восприятие времени пользователем можно значительно уменьшить, если ввести индикаторы творческого прогресса. Если приложение показывает некоторые интересные текстовые или визуальные детали во время выполнения, это может отвлечь внимание пользователя от времени, необходимого для завершения действия. Вы можете предложить множество вещей, чтобы занять пользователей, например, короткие видеоролики, интересные факты, анимацию и даже тривиальные игры.

Альтернатива — использовать экраны скелетов против индикаторов прогресса анимации

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

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

Последние мысли

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

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