• строку заголовка с кнопкой системного меню;
• компоненты, обеспечивающие пользователю возможность ввода или выбора ответа;
• вспомогательные компоненты, обеспечивающую подсказку, например, поле предварительного просмотра или кнопку вызова справки.
Как правило, размер диалогового окна неизменяем, но его можно перемещать по экрану.
Информационные окна бывают двух типов: окна сообщений и окна помощи. Окна
сообщений (рис. 8.15, в), кроме заголовка с кнопкой системного меню, обычно содержат текст сообщения и одну или несколько кнопок реакции пользователя, например, кнопки Yes и No или кнопки Yes, No и Cancel.
Окно помощи имеет более сложную структуру: оно может содержать меню, полосы прокрутки и информационная область, т. е. по структуре оно аналогично окну приложения, но отличается от него тем, что имеет узко специальное назначение, обеспечивая навигацию по справочной информации.
240
Окна меню Windows (рис. 8.15, г) можно использовать как открывающиеся панели иерархического меню или как отдельные контекстные меню. Каждой строке окна меню может соответствовать:
• команда;
• меню следующего уровня, что обозначается стрелкой;
• окно диалога, что обозначается тремя точками.
Кроме того, в некоторых строках добавляется указание клавиш быстрого вызова.
Пиктограммы. Пиктограмма представляет собой небольшое окно с графическим изображением, отражающим содержимое буфера, с которым она связана. Различают:
• программные пиктограммы;
• пиктограммы дочерних окон;
• пиктограммы панели инструментов;
• пиктограммы объектов.
Программными пиктограммами, которые связаны с соответствующей программой, управляет операционная система. Так, можно «свернуть» окно приложения в пиктограмму на панели задач Windows или «развернуть» его обратно «на рабочий стол».
Аналогично многодокументная программная система управляет пиктограммами
дочерних окон, обеспечивающими доступ к различным документам, одновременно обрабатываемым программной системой.
Пиктограммы панели инструментов обычно дублируют доступ к соответствующим функциям через меню, обеспечивая их быстрый вызов.
Пиктограммы объектов используют для прямого манипулирования этими объектами.
Как правило, все пиктограммы можно перемещать мышью. Кроме того, для облегчения работы с пиктограммами обычно используют «всплывающие» подсказки, которые появляются, если пользователь в течение некоторого времени удерживает мышь над пиктограммой панели инструментов.
Прямое манипулирование изображением. Прямое манипулирование изображением
— это возможность замены команды воздействия на некоторый объект физическим действием в интерфейсе, осуществляемым с помощью мыши. При этом любая область экрана рассматривается как адресат, который может быть активизирован при подведении курсора и нажатии клавиши мыши.
По реакции на воздействие различают следующие типы адресатов:
• указание и выбор (развертывание пиктограмм, определение активного окна и т. п.);
• буксировка и «резиновая нить» (перенос объекта или его границ);
• экранные кнопки и «скользящие» барьеры (выполнение дискретных или циклически повторяемых действий, например, выполнение некоторой
241
операции или рисование, подразумеваемых при активизации определенной области экрана
— кнопки).
Не последняя роль в графических интерфейсах отводится
динамическим визуальным сигналам, которые представляют собой изменение изображения на экране. Основная цель этих сигналов заключается в предоставлении пользователям дополнительной информации.
Простейшим примером такого сигнала является изменение изображения курсора мыши при выполнении конкретных операций, например, изображение его в форме песочных часов во время обработки. Другой пример — изменение изображения кнопки при нажатии на нее.
Хотя в отличие от анимационных интерфейсов прямого манипулирования эти визуальные сигналы играют в графических интерфейсах вспомогательную роль, обеспечивая более реалистическую картинку.
Компоненты ввода-вывода. Как уже упоминалось, в окнах приложения могут размещаться специальные компоненты, используемые для ввода-вывода информации.
Интерфейс практически любого современного программного обеспечения включает несколько меню: основное или «ниспадающее» иерархическое меню, пиктографические меню (панели инструментов) и контекстные меню для разных ситуаций. Любое из указанных меню представляет собой компонент ввода-вывода, реализующий диалог с пользователем, используя табличную форму.
Иерархические меню используют, чтобы
организовать выполняемые программным обеспечением операции, если их число превышает 5 — 8 (6 в соответствии с рекомендациями фирмы IBM), и обеспечить пользователю их обзор. Панели инструментов и контекстные меню применяют для обеспечения
быстрого доступа к часто используемым командам, обеспечивая пользователю возможность относительно свободной навигации.
Кроме меню в интерфейсе используют и другие компоненты ввода-вывода, которые можно разделить на три группы в соответствии с тем, какую форму диалога они реализуют: фразовую, табличную или смешанную. Директивная форма диалога обычно предполагает ввод комбинаций клавиш или перемещение пиктограмм, а потому не требует использования компонентов ввода-вывода. В табл. 8.2 приведены основные компоненты WINP- интерфейса
Windows и даны рекомендации по их использованию.
8.6. Реализация диалогов в графическом пользовательском интерфейсе Как правило, сложное программное обеспечение с развитым пользовательским интерфейсом использует диалоги обоих типов: управляемые пользователем и управляемые системой.
Реализация диалогов, управляемых пользователем. Для реализации диалогов, управляемых пользователем, применяют меню различных видов:
242
243
основное, панели инструментов, контекстные и кнопочные, т. е. сформированные из отдельных кнопок. Как альтернативу меню целесообразно использовать директивную форму диалога, поставив в соответствие основным
командам определенные комбинации клавиш.
Кроме того, целесообразно предусмотреть возможность управления меню клавиатурой, что особенно важно, если большую часть времени работы с системой пользователь вводит текст или данные, т. е. взаимодействует с клавиатурой.
Меню. Меню проектируют на основе графов диалогов разрабатываемого программного обеспечения. При этом, если число операций не превышает 5, то обычно используют кнопки. Если число операций не более 9 — 10, то- одноуровневое меню. И, наконец, если число реализуемых операций более 10, то используют «ниспадающее» двухуровневое иерархическое меню.
Ниспадающее меню. Первый уровень иерархического меню должен содержать имена основных групп операций. Традиционно первым является пункт Файл, вторым — Правка, третьим — Вид, а последним — Справка. Такое распределение пунктов специфично для программ обработки данных, размещенных в файлах, например, текстовых и графических редакторов. В последнее время с таким распределением пунктов возникают проблемы, так как большинство программ уже не работает с данными традиционным способом. Так, в примере 8.4 все данные находятся не в файлах, а в базе данных.
Количество уровней иерархического меню не должно превышать 2 — 3, так как при большем числе уровней требуемую операцию будет сложно искать. Причем желательно, чтобы число операций в окне меню не превышало 7 — 8, по той же причине.
Если число операций превышает 70 — 80, то возникает проблема, как построить наглядное меню с таким большим числом операций. Интересное решение было предложено разработчиками Microsoft Word. Они реализовали
адаптивное иерархическое меню, где содержимое
окна меню второго уровня постоянно меняется, отображая только те операции, которые использует пользователь. Если пользователь не находит нужной операции, то через несколько секунд или при нажатии специальной кнопки Word демонстрирует окно меню полностью.
Пример 8.4. Разработать основное меню системы решения комбинаторно- оптимизационных задач.
Поскольку пользователю может понадобиться сравнить несколько вари- антов решений, целесообразно разрабатывать многодокументный интерфейс, каждый документ которого соответствует заданию. В качестве отдельного документа также должны рассматриваться данные, которые могут обрабатываться разными алгоритмами или корректироваться для использования в других задачах.
На рис. 8.11 представлен граф абстрактного диалога системы, на основе которого необходимо построить меню. К операциям, предусмотренным гра-
244
фом диалога, следует добавить служебные операции обслуживания файла задания, управления дочерними окнами и работы со справочной информацией, а затем полученное множество операций разбить на группы.
Вариант 1. Стандартизованный вариант меню для данной системы представлен на рис. 8.16. Пункт Файл объединяет все операции с информационными блоками обоих типов: проектами и данными. Пункт Правка— стандартные операции правки. Пункт Проект — операции управления проектом. Пункт Выполнить — два вида операции выполнения. Пункт
Окна — операции управления окнами многодокументного интерфейса. И, наконец, пункт
Справка — стандартные операции работы со справочной информацией. Этот вариант, скорее всего, будет интуитивно понятен пользователям, имеющим большой опыт работы со средами программирования, так как он разработан по типу таких сред (сравните, например, с интерфейсом Delphi). В основе данного интерфейса лежит понятие «проект». Для каждого проекта определяют решаемую задачу, к проекту присоединяют данные (новые или вы- бранные из уже существующих) и выбирают алгоритм решения задачи. При выполнении проекта результаты заносятся в протокол проекта. Полученный
245
246
протокол можно сохранить или просто закрыть без сохранения. При необходимости сохраненный протокол можно удалить.
Новые данные можно создавать отдельно от проекта, но при этом необходимо указать задачу. Можно модифицировать данные, в том числе и изменить тип решаемой задачи, и сохранить данные с новым идентификатором. Уже сохраненные данные можно удалить.
Для просмотра результатов необходимо открыть уже выполненные проекты. Их можно распечатать и/или удалить.
Вариант 2. «Нестандартный» вариант, основанный на интуитивной мо- дели пользователя, т. е. концептуальной модели предметной области (см. рис. 6.9), представлен на рис. 8.17. В этом меню два типа блоков данных управляются операциями, отнесенными
к разным группам «Задание» и «Данные». В результате удается
частично разгрузить первый пункт меню, но необходимо дублировать операции с блоками данных (создание, открытие, закрытие и т. п.). Чтобы еще сократить количество пунктов в первой и во второй группах, можно использовать адаптивный вариант.
Панель инструментов. На панель инструментов помещают пиктограммы часто используемых операций. Если множество таких операций существенно зависит от специфики выполняемых с разрабатываемым программным обеспечением работ, то целесообразно обеспечить пользователю возможность формирования панелей инструментов по собственному усмотрению. В качестве примера можно посмотреть, как реализована операция настройки (Сервис\Настройка) Microsoft Word.
247
Контекстные меню. Контекстные меню включают операции, вероятность обращения к которым из данной зоны окна приложения с точки зрения разработчика максимальна. В процессе тестирования «удобства использования» (см. 9.6) содержание контекстного меню может уточняться. Так же, как и в случае основного меню, нежелательно, если число операций этого меню превышает 6 — 8. Причем, чтобы облегчить пользователю поиск нужной операции целесообразно операции контекстного меню горизонтальными линиями делить на группы.
Реализация диалогов, управляемых системой. Для реализации диалогов, управляемых системой, обычно используют диалоговые окна. Причем, если число настраиваемых в процессе диалога элементов невелико, и диалогу соответствует последовательный сценарий, то проектируют одно диалоговое окно, включающее все необходимые компоненты. Такое окно часто называют
формой Если же диалог имеет сильно разветвленную структуру, в которой следующий вопрос зависит от уже полученных ответов, или число на- страиваемых в процессе диалога элементов велико, то для каждого шага диалога проектируют свое диалоговое окно.
Проектирование форм заключается в выборе необходимых компонентов интерфейса и размещении их в пределах диалогового окна. Если количество компонентов более 4 — 5, то целесообразно их визуально разделить, используя рамки.
Проектирование последовательностей диалоговых окон. Как уже упоминалось выше, в основе диалогов, управляемых системой, лежит жестко или нежестко заданный сценарий.
Именно этот сценарий должен быть реализован последовательностью диалоговых окон.
Независимо от степени жесткости сценария при проектировании такой последовательности необходимо предусмотреть возможность возврата на предыдущий шаг.
Пример 8.5. Реализовать диалог Новое задание системы решения комбинаторно- оптимизационных задач.
Граф диалога представлен на рис. 8.12. Этот управляемый системой диалог допускает возвраты на предыдущие шаги. Соответственно для него последовательность действий определена не жестко. В данном случае можно предложить два варианта реализации диалога: с использованием одной формы и с использованием последовательности диалоговых окон.
Вариант 1. Реализация диалога с использованием формы предполагает, что все шаги выполняются в одном окне. Следовательно, необходимо организовать выбор типа задачи, ввод/выбор данных, выбор алгоритма. После выполнения задания необходимо также предусмотреть возможность его сохранения, сохранения с другим именем и закрытия (рис.
8.18). Результаты
целесообразно демонстрировать в отдельном окне, которое будет открываться при нажатии кнопки. Показать результаты, так как у каждого типа задачи свои результаты.
248
Вариант 2. Последовательность диалоговых окон реализует последовательный или древовидный сценарий. Поэтому преобразуем сценарий диалога (см. рис. 8.13), к последовательному с возможностью возврата на один шаг (рис. 8.19).
Первое окно реализует выбор типа задачи (рис. 8.20, а). Результат выбора фиксируется в специальном документе — Протоколе. Второе — определение способа задания данных (рис. 8.20, б), третье — непосредственно задание данных в зависимости от выбранного способа (рисунок отсутствует, так как формы определения данных зависят от задачи и их целесообразно проектировать отдельно для каждой задачи вместе с формами вывода результатов). Четвертое — выбор алгоритма (рис. 8.20, в). Пятое — инициацию выполнения (рис. 8.20, г). Шестое — демонстрирует результат (рисунок отсутствует).
Седьмое — определяет, что следует сделать с результатом (рис. 8.20, д). Все диалоги строятся по максимально схожей схеме, что упрощает пользователю ориентацию в них.
Оба рассмотренных варианта имеют недостатки. Так, реализация в виде формы содержит слишком много кнопок, регулирующих процесс, а реализация в виде последовательности диалогов предлагает слишком много шагов, одновременно усложняя доступ к данным и результатам, представляемым в виде отдельных форм.
Варианты 3. Рассмотрим вариант реализации, который улучшает навигацию за счет использования закладок. Это позволяет визуально разнести
249
кнопки, четко обозначив, что кнопки нижнего ряда относятся к протоколу в целом. В таком интерфейсе достаточно просто посмотреть данные и результаты — для этого просто переходим на другую страницу (рис. 8.21).
250
251
Интерфейс, полученный в результате реализации диалогов, проверяют на полноту, а затем предлагают пользователю для тестирования удобства применения. При наличии сомнений можно предложить несколько вариантов. После одобрения интерфейса его реализуют, кодируя соответствующие процедуры.
8.7. Пользовательские интерфейсы прямого манипулирования и их
проектирование
Возможность прямого манипулирования, предусмотренная в WIMP интерфейсах, позволяет разрабатывать для приложений объектно-ориентированные интерфейсы прямого манипулирования.
Интерфейсы данного типа на внешнем уровне используют директивную форму диалога: ввод команды осуществляется при выполнении определенных действий с пиктограммой объекта мышью. Основными элементами этих интерфейсов являются: метафоры, объекты, представления объектов и технология Drag and Drop («перетащил и бросил»).
Метафоры. Метафора - мысленный перенос свойств или признаков одного объекта на другой, чем-то аналогичный первому. Использование метафор в интерфейсах предполагает активизацию имеющегося у пользователя опыта (ментальных моделей выполнения аналогичных действий в повседневной жизни или на рабочем месте).
252
Интерфейс прямого манипулирования должен обеспечивать пользователю среду, содержащую знакомые ему элементы, с которыми пользователь не раз встречался в профессиональной деятельности или в быту, и предоставлять ему возможность манипулирования отдельными объектами. Наличие метафор упрощает для пользователя процесс освоения интерфейса. Например, метафора «Выбрасывание мусора», которую использует Windows для удаления файлов, облегчает пользователю усвоение этой операции.
Использовать
метафоры надо очень аккуратно, так как при этом смысл придается всем элементам интерфейса, например, похожие элементы должны вести себя похожим образом, а элементы, выделенные одним цветом должны находиться в определенной связи друг с другом. Семантическое несоответствие между элементами интерфейса, тем, что от них ожидают, и тем, что они на самом деле выполняют, раздражает и дезориентирует пользователей.
Следует также учитывать, что полное соответствие может обмануть ожидание пользователя, так как все-таки он оперирует не реальными предметами, а их моделями. А значит, его возможности ограничены, о чем необходимо напоминать. Поэтому целесообразно не делать изображения слишком реалистичными.
Метафоры и анимация. При реализации метафор все большая роль уделяется средствам мультимедиа, в основном анимации. В § 8.2 уже упоминалось, что движение привлекает внимание, а резкая смена кадров требует некоторого времени на определения связи данного кадра с предыдущим и на изучение этого кадра. Следовательно, используя мультипликацию, можно не только развлекать пользователя, но и «готовить» его к смене кадров, сокращая время, необходимое на адаптацию к изменившейся ситуации. Например, длинный список можно представить в виде стены, уходящей в бесконечность (по закону перспективы). Тогда
«движение» вдоль этой стены, сопровождаемое «естественным» укрупнением названий, позволит рассматривать список, отыскивая необходимую информацию без резкого изменения картинки. При этом в сознании человека сохраняется идентичность объектов, а потому он постоянно готов к взаимодействию с ними.
Однако, решая проблемы,
связанные с особенностями восприятия человека, анимационные интерфейсы создают дополнительные проблемы для разработчиков и программистов. К ставшим привычными функциональному и интерфейсному уровням программы добавляется еще и визуальный уровень. Программа, реализующая такой интерфейс, никогда не простаивает, так как во время ожидания ввода команды пользователя она продолжает отображать соответствующие кадры. В основе таких программ лежит временное программирование. В отличие от событийного программирования, которое позволяет связывать изображение на экране с внешними и внутренними событиями в системе, временное программирование обеспечивает изменение
253
проецируемой
последовательности кадров в зависимости от состояния моделируемых процессов и действий, пользователя.
Скачать 7.85 Mb.