Поделиться через


Индикаторы состояния (основы проектирования)

Заметка

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

Строка состояния — это область в нижней части первичного окна, в которой отображаются сведения о состоянии текущего окна (например, что просматривается и как), фоновые задачи (например, печать, сканирование и форматирование) или другие контекстные сведения (например, выбор и состояние клавиатуры).

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

снимок экрана типичной строки состояния

Типичная строка состояния.

Заметка

Рекомендации, связанные с областью уведомлений , представлены в отдельной статье.

Это правильный пользовательский интерфейс?

Чтобы решить, рассмотрите следующие вопросы:

  • Актуально ли состояние, когда пользователи активно используют другие программы? В этом случае используйте значки области уведомлений .

  • Должен ли элемент состояния отображать уведомления? В этом случае необходимо использовать значок области уведомлений.

  • Является ли окно основным окном? Если нет, не используйте строку состояния. Диалоговые окна, мастера, панели управления и листы свойств не должны иметь строк состояния.

  • Является ли информация главным образом состоянием? Если нет, не используйте строку состояния. Строки состояния не должны использоваться в качестве дополнительного строки меню или панели инструментов панели инструментов.

  • Объясняет ли информация, как использовать выбранный элемент управления? Если да, отобразятся сведения рядом с соответствующим элементом управления с помощью дополнительного объяснения или метки инструкций.

  • Полезно ли состояние и релевантно? Это значит, что пользователи, скорее всего, изменят свое поведение в результате этой информации? Если нет, не отображайте состояние или поместите его в файл журнала.

  • Является ли состояние критически важным? Требуется ли немедленное действие? Если это так, отображение сведений в форме, которая требует внимания и не может быть легко проигнорирована, например диалоговое окно или в самом первичном окне.

    снимок экрана с красной строкой состояния

    Красная адресная строка в Windows Internet Explorer.

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

Концепции проектирования

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

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

  • Убедитесь, что информация о состоянии полезна и актуальна. Если нет, не укажите строку состояния вообще.
  • Не используйте строки состояния для критически важных сведений. Пользователям никогда не нужно знать, что находится в строке состояния. Если пользователи должны видеть его, не помещайте его в строку состояния.

Если вы делаете только одну вещь...

Убедитесь, что сведения о строке состояния полезны и важны, но не важны.

Шаблоны использования

В строках состояния есть несколько шаблонов использования:

Употребление Пример
текущее состояние окна
Отображение источника отображаемых объектов вместе с любыми режимами представления
снимок экрана строки состояния
В этом примере строка состояния отображает путь к документу.
ход выполнения
Отображение хода выполнения фоновых задач с определенным индикатором выполнения или анимацией.
снимок экрана строки состояния с индикатора выполнения
В этом примере строка состояния включает панель хода выполнения для отображения загрузки веб-страницы в окно Internet Explorer.
контекстная информация
Отображение контекстных сведений о том, что делает пользователь в настоящее время.
снимок экрана с строкой состояния с числом пикселей
В этом примере Microsoft Paint отображает размер выделения в пикселях.

Руководящие принципы

Общее

  • Рассмотрите возможность предоставления команды "Просмотр строки состояния", если только некоторым пользователям потребуется информация о строке состояния. Скрытие строки состояния по умолчанию, если большинству пользователей это не понадобится.
  • Не используйте строку состояния для объяснения элементов строки меню. Этот шаблон справки недоступен для обнаружения.

Представление

  • Отключите модальное состояние, которое не применяется. Модальное состояние включает состояния клавиатуры и документа.
  • Удалите не модальное состояние, которое не применяется.
  • Представление сведений о состоянии в следующем порядке: текущее состояние окна; прогресс; и контекстная информация.

Иконки

  • Выберите легко распознаваемые макеты значков состояния. Предпочитайте значки с уникальными контурами на квадратных или прямоугольных фигурных значках.

  • Используйте полосу чистых красных, желтых и зеленых только для передачи сведений о состоянии. В противном случае такие значки запутаны.

    правильно:

    снимок экрана строки состояния с синими значками

    неправильно:

    снимок экрана строки состояния с красным значком

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

  • Используйте варианты значков или наложения для указания изменений состояния или состояния. Используйте варианты значков для отображения изменений в количествах или силах. Для других типов состояния используйте следующие стандартные наложения:

    Покрышка Статус
    снимок экрана значка предупреждения
    Предупреждение
    снимок экрана значка ошибки
    Ошибка
    снимок экрана с отключенным и отключенным значком
    Отключен или отключен
    снимок экрана с значком заблокированного или автономного режима
    Заблокировано или в автономном режиме
  • Не изменяйте состояние слишком часто. Значки строки состояния не должны отображаться шумно, нестабильно или требовать внимания. Глаз учитывает изменения в периферийном поле зрения, поэтому изменения состояния должны быть тонкими.

  • Для значков, предоставляющих важные сведения о состоянии, предпочитайте метки на месте.

  • Значки панели состояния без меток должны иметь подсказки.

Дополнительные сведения см. в разделе Значки.

Взаимодействие

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

СМС

  • Как правило, используйте краткие метки. Вырезать любой текст, который можно устранить.
  • Предпочитайте фрагменты предложений, не завершая знак препинания. Используйте полные предложения (с окончанием препинания) только в том случае, если фрагменты предложений не являются значительно короче.
  • Для необязательных меток хода выполнения укажите, что делает операция с меткой, которая начинается с команды (герунд формы) и заканчивается многоточием. Например: "Копирование...". Эта метка может динамически изменяться, если операция имеет несколько шагов или обрабатывает несколько объектов.
  • Не используйте цвет, полужирный или курсив для выделения текста строки состояния.
  • Рекомендации по фразе подсказки см. в подсказках и подсказках.

Документация

Обратитесь к строкам состояния в виде строк состояния, а не строк состояния или других вариантов. Пример: "Текущий номер страницы отображается в строке состояния".