02. ОСНОВНЫЕ ПОНЯТИЯ

СОДЕРЖАНИЕ
Введение в предмет. Основные понятия. ................................................................................................. 1
Психология цветовосприятия .................................................................................................................... 3
Характеристики цветов. ......................................................................................................................... 3
Ощущение и восприятие цвета. ............................................................................................................. 4
Рекомендации по использованию цвета с точки зрения физиологии (Мерч). .................................. 5
Визуальные атрибуты отображаемой информации. Композиция и организация экрана. ................... 5
Разработка структуры диалога................................................................................................................... 8
Диалог типа «вопрос-ответ». ................................................................................................................. 8
Диалог на основе меню. ......................................................................................................................... 9
Диалог на основе экранных форм. ........................................................................................................ 9
Диалог на основе командного языка ................................................................................................... 10
Выбор подходящей структуры диалога через таблицу выбор ......................................................... 10
Разработка сценария диалога. .............................................................................................................. 11
Описание структуры диалога с помощью сети переходов. .............................................................. 12
ВВЕДЕНИЕ В ПРЕДМЕТ. ОСНОВНЫЕ ПОНЯТИЯ.
Центральным понятием является термин «человеко-машинное взаимодействие» – Humancomputer interaction (HCI). Неразрывно связаны с ним понятия: эргономика, юзабилити,
интерфейс, пользователь. Перечислим Факторы, значимые для HCI:
 эргономичность HCI;
 окружение HCI (средства взаимодействия, гипермедиа и Web, средства связи);
 разработка и развитие систем, ориентированных на пользователя;
 модели пользователя (восприятие, моторика, мышление, взаимодействие, организация
работы, адаптация к многообразию);
 принципы разработки удобных пользовательских HCI;
 критерии и проверка легкости использования.
Эргономика (от греч. érgon — работа и nómos — закон), научная дисциплина, комплексно
изучающая человека (группу людей) в конкретных условиях его (их) деятельности в современном
производстве. Эргономическое обеспечение АРМ – создание благоприятных условий для
использования АРМ при высокой производительности труда и низкой утомляемости
пользователей.
Функциономика — раздел эргономики, исследующий алгоритмы действия человекаоператора в эргатических системах, включает:
 разработку тренажёров, моделирующих установок и испытательных стендов для
определения эргономических показателей;
 исследование тренируемости и утомляемости для данного вида деятельности и условий
восприятия информации;
 разработка методик функционирования человека-оператора в контуре управления;
 разработка методов контроля психо-физиологического состояния человека оператора.
Юзабилити (англ. usability — досл. «пользуемость», «возможность быть используемым»)
какой-то вещи — это степень её удобства в использовании. Также юзабилити называют
определённое учение среди разработчиков пользовательских интерфейсов, в том числе вебинтерфейсов. (Из Википедии). Международный стандарт ISO 9241-11 определяет юзабилити как
«cтепень, в которой продукт может быть использован определенными пользователями при
определенном контексте использования для достижения определенных целей с должной
эффективностью, продуктивностью и удовлетворенностью» (англ.: the extent to which a product can
be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a
specified context of use). Главный постулат usability состоит в том, что пользователь всегда прав. И
если он в чем-то ошибается, то это не его трудности, а проблемы системы. Рольф Молич,
датский юзабилити-специалист
Интерфейс (interface) - это средства взаимодействия, средства связи, сопряжения,
согласования. Интерфейс – совокупность технических, программных и методических
(протоколов, правил, соглашений) средств сопряжения в вычислительной системе пользователей с
устройствами и программами, а также устройств с другими устройствами и программами.
Интерфейс — в широком смысле слова, это способ (стандарт) взаимодействия между объектами.
Интерфейс в техническом смысле слова задаёт параметры, процедуры и характеристики
взаимодействия объектов. (Из Википедии). Различают:
 Интерфейс пользователя — набор методов взаимодействия компьютерной программы и
пользователя этой программы.
 Программный интерфейс — набор методов для взаимодействия между программами
(модулями программы).
 Физический интерфейс — способ взаимодействия физических устройств. Чаще всего речь
идёт о компьютерных портах.
Интерфе́йс по́льзователя — совокупность средств, при помощи которых пользователь
общается с различными устройствами, чаще всего — с компьютером или бытовой техникой.
Интерфейс пользователя компьютерного приложения включает:
 средства отображения информации, отображаемую информацию, форматы и коды;
 командные режимы, язык «пользователь — интерфейс»;
 устройства и технологии ввода данных;
 диалоги, взаимодействие и транзакции между пользователем и компьютером, обратную
связь с пользователем;
 поддержку принятия решений в конкретной предметной области;
 порядок использования программы и документацию на неё.
Графический интерфейс пользователя (англ. graphical user interface, GUI) в
вычислительной технике — система средств для взаимодействия пользователя с компьютером,
основанная на представлении всех доступных пользователю системных объектов и функций в
виде графических компонентов экрана (окон, значков, меню, кнопок, списков и т. п.). При этом, в
отличие от интерфейса командной строки, пользователь имеет произвольный доступ (с помощью
клавиатуры или устройства координатного ввода — вроде мыши) ко всем видимым экранным
объектам.
Впервые концепция ГИП была предложена учеными из исследовательской лаборатории
Xerox PARC в 1970-х, но получила коммерческое воплощение лишь в продуктах корпорации
Apple Computer. В настоящее время ГИП является стандартной составляющей большинства
доступных на рынке операционных систем и приложений.
Интерфейс командный – вид диалогового взаимодействия пользователя с ПК, при котором
используются различные команды, набираемые на клавиатуре и отображаемые на экране (пример:
OS MSDOS). Интерфейс командной строки — разновидность консольного интерфейса человека и
компьютера, в котором инструкции компьютеру даются только путём ввода с клавиатуры
текстовых строк (команд). Интерфейс командной строки не имеет чёткой стандартизации, формат
вывода информации в интерфейсе командной строки не регламентируется.
Интерфейс многооконный – вид диалогового взаимодействия пользователя с ПК, при
котором каждой программе или данным отводится своя прямоугольная область (окно) на экране.
Проектирование интерфейса не является частью процесса разработки программного
обеспечения, а должен быть частью процесса создания спецификаций на систему.
Любой интерфейс, независимо от сферы его применения, имеет пять основных
характеристик, а именно:
1.
2.
3.
4.
5.
производительность пользователей
количество человеческих ошибок
скорость обучения работе с системой
субъективное удовлетворение пользователей
способность сохранения пользователями навыков работы с системой в течение длительного
времени.
ПСИХОЛОГИЯ ЦВЕТОВОСПРИЯТИЯ
Операционные системы предлагают стандартные цветовые палитры и схемы. Вы должны
использовать их при разработке интерфейса. Они созданы, потому что цвета сложно
согласовывать и люди часто ошибаются при выборе цвета или цветовой комбинации.
Области, фон которых представлен более теплыми оттенками красной части спектра,
кажутся крупнее, чем области, цвет фона которых смещен к голубой части. Объекты экрана на
белом фоне или на фоне цвета из средней части спектра кажутся ярче и легче воспринимаются при
разном внешнем освещении.
Наибольший контраст между двумя областями экрана достигается в том случае, если цвет
фона одной из них – черный или близок к любой из границ спектра, а цвет фона другой – белый
или взят из средней части спектра.
Различные психологические состояния человека характеризуются различными
предпочитаемыми (наиболее приятными) цветами. Помимо этого отмечена обратная зависимость
– влияние цвета на настроение и работоспособность. В работах, посвященных исследованию
психологического воздействия различных цветов, приводятся такие данные:
 Голубой – успокаивает;
 Красный – волнует и утомляет;
 Зеленый – настраивает на добродушный и безынициативный лад;
 Желтый – веселый, оптимистичный, вызывает легкомысленный настрой;
 Оранжевый – раскрепощает фантазию;
 Фиолетовый – гибелен для глаз, цвет зависти, тревоги, неудовлетворенности;
 Коричневый – угнетает умственную активность;
 Черный – мрачный, способствует возникновению головных болей, но снижает число
ошибок.
Поскольку цвет является субъективным фактором, разрешите пользователю самому настраивать
цветовую гамму, где это возможно. Для стандартных элементов интерфейса система обеспечивает
стандартные цветовые схемы. Если при создании приложения вы будете их использовать в
качестве основы, то это позволит избежать включения в интерфейс дополнительных элементов
управления. Кроме того, указанный подход гарантирует, что ваши собственные визуальные
элементы не будут выпадать из общего ряда, когда пользователь изменяет системные цвета.
Характеристики цветов.
Белый. Считается нормой цветовосприятия. Как и серый, и черный, белый – это фон для цвета. И
этот фон сильно повышает интенсивность находящегося рядом с ним цвета.
Серый. Согласно Люшеру, нейтральный серый цвет не вызывает никаких психологических
реакций. Не успокаивает и не возбуждает, хотя и создает внутреннюю стабильность, частично
отгораживая от внешних воздействий.
Красный. Вызывает волнение, беспокойство, усиливает нервное напряжение, фокусирует
внимание, повышает уровень тревожности. Поэтому мощное возбуждение психики от красного
цвета имеет весьма навязчивый характер. В этом возбуждении участвует весь организм: пульс
учащается и усиливается, увеличивается артериальное давление крови и внутриглазное давление,
дыхание учащается и углубляется, активизируется мускульная система. Увеличивается скорость
движений, т.к. время в красном цвете переоценивается. В целом, за счет возбуждения нервной
системы, красный цвет вызывает вначале резкий подъем работоспособности. Например,
производительность труда уже через 10 мин. повышается на 26% (за счет увеличения мышечного
напряжения и скорости движений, ускоряется реакция «счет чисел»). Однако, при адаптации к
красному цвету число правильно решенных задач снижается на 20%, а производительность труда
– на 34% (после 20 мин. адаптации). Появляется цветовое утомление, приводящее к дальнейшему
понижению работоспособности.
Оранжевый. Цвет тепла. Действие оранжевого вызывает у нас некоторое возбуждение – менее
сильное, чем от красного, создает ощущение благополучия и веселья. Имеет сильное
стимулирующее влияние на чувства. Увеличивает силу сжатия кисти в 1,5 раза по сравнению с
белым цветом. Оказывает благоприятное воздействие на работоспособность при условии
периодического отдыха от него. При длительном восприятии оранжевого может появиться
утомление и даже головокружение. Легкое ускорение кровообращения практически не
сказывается на давлении крови. Незначительно учащает пульс и дыхание.
Желтый. Восприятие желтого цвета вызывает более нежное, по сравнению с оранжевым,
действие на пульс и дыхание – бодрое, веселящее возбуждение. Наиболее благоприятен для
большой скорости зрительного восприятия, устойчивости ясного видения и остроты зрения.
Стимулирует деятельность мозга. Наиболее благоприятен зеленовато-желтый оттенок – в
нормальных условиях не утомляет зрение.
Зеленый. Благоприятно воздействует на человека. При воздействии на нервную систему человека
проявляет промежуточные свойства между холодными и теплыми цветами. Нормализует кровяное
и внутриглазное давление. Увеличивает остроту зрения. Приводит к нормализации дыхания и
пульса. Уменьшает величины мускульной реакции. Создает несильный, но прочный подъем
умственной работоспособности. Благоприятствует концентрации внимания. После привыкания к
зеленому число правильно решенных задач увеличивается на 10% при сокращении числа ошибок
на 20%. Наблюдается небольшое замедление реакции «счет чисел», поскольку возникает
определенная недооценка времени. Оказывает уравновешивающее, успокаивающее действие.
Голубой. Не воспринимается при дальтонизме (порядка 10% взрослого населения не
воспринимают голубой цвет). При восприятии голубого цвета время еще более, чем в зеленом,
недооценивается. Уменьшает уровень тревожности. Успокаивает и расслабляет. Снижает
мускульное напряжение и кровяное давление. Дыхание замедляется, становится менее глубоким.
Немного снижается частота и сила пульса (после адаптации - наоборот). В то же время,
злоупотребление голубым может вести к некоторой усталости и угнетенности.
Синий. Может оказывать тормозящее действие на человека, порождать своеобразное
беспокойство, печаль, усталость и слабую угнетенность. Одна из причин этого – обычная для
человека близорукость к синему цвету (поверхность синего цвета как бы удаляется от смотрящего
на нее). Дыхание становится менее глубоким, чем при голубом. Пульс становится реже и
ослабляется. Снижается мускульное напряжение. При длительных физических работах
отрицательно сказывается на производительности труда. Время недооценивается. Цвет душевного
покоя. Низкий уровень тревожности.
Фиолетовый. С одной стороны – наблюдается максимальная степень замедления и ослабления
дыхания, замедляется и слабеет пульс. Даже при кратковременном воздействии фиолетовый
понижает работоспособность более, чем полная темнота. Максимально замедляется реакция «счет
чисел». Оказывает подавляющее действие на интеллект, вызывает депрессию. С другой стороны,
положительно влияет на сердце, легкие, кровеносную систему, увеличивая их выносливость.
Пурпурный. Сочетает «теплые» свойства красного и «холодные» синего. Реакция организма на
него обычно благоприятна.
Ощущение и восприятие цвета.
Любой начинающий дизайнер задается вопросом о том, каким цветом и на каком фоне
лучше оформлять текст. Ответ на этот вопрос можно искать в рассуждениях о сочетаемости
цветов и таблицах удачных и неудачных сочетаний. Однако есть и другой подход к решению этого
вопроса (собственно психологический). Известно, что рецепторы освещенности эволюционно
более древние и в этом смысле базовые по отношению к рецепторам цвета. Восприятие контраста
как разницы в освещенности происходит раньше, чем восприятие цветового тона.
Необходимо помнить о такой особенности контрастных сочетаний: белый цвет подавляет
более темные. Приведем распространенную иллюстрацию этого явления.
Белый квадрат на черном фоне кажется больше, чем черный на белом, хотя на самом деле
они абсолютно идентичны по своим размерам. Это явление в психофизике досконально изучено и
объясняется при помощи концепции сенсорного оператора. Но, не углубляясь в психофизику, мы
можем сформулировать рабочее правило: чтобы белые буквы на черном фоне казались такими же,
как черные буквы на белом фоне, черные буквы должны быть чуть больше белых.
Рекомендации по использованию цвета с точки зрения физиологии
(Мерч).
Не применяйте одновременно высоконасыщенные и спектрально-интенсивные цвета.
Избегайте насыщенно-синего цвета для текстов, тонких линий и малых форм.
Не используйте близкие цвета, отличающиеся только количеством синего.
Для четкого различения цветов старшим по возрасту операторам назначайте более высокие
уровни яркости.
5. Не забывайте о том, что цвета меняют свои оттенки в зависимости от цвета окружения.
6. Помните: величина заметного изменения оттенка варьируется в диапазоне спектра.
7. Старайтесь выделять края не только цветом.
8. Избегайте красного и зеленого цветов на периферии.
9. Сочетайте противоположные цвета (красный – зеленый или синий - желтый).
10. Для пользователей с дефектами зрения в различении цветов не применяйте близких цветов.
Существуют дополнительные рекомендации по использованию цвета. Арон Маркус –
известный разработчик интерфейсов и консультант в области компьютерной индустрии применяет
следующие принципы использования цвета: организация, экономия, выделение, взаимодействие,
символизм и коммуникация. Его «10 заповедей по использованию цвета» являются хорошим
добавлением к рекомендациям Мерча:
1. Используйте от трех до семи цветов.
2. Применяйте цвета, расположенные в центре и на периферии, следующим образом: красный
и зеленый – в центре визуального поля; синий – для слайдов, фона и выделения границ
экрана.
3. При модификации размеров и изобразительного ряда выбирайте цвета, которые
изменяются минимально от кадра к кадру.
4. Не используйте одновременно цвета высокой интенсивности и спектрально-экстремальные.
5. Применяйте соответствующее кодирование для стандартных элементов.
6. Для элементов, принадлежащих к одной группе, назначайте один и тот же цвет.
7. Выбирайте один и тот же цветовой код, для тренинга, тестирования, приложений и
публикаций.
8. Для привлечения внимания пользуйтесь интенсивными и насыщенными цветами.
9. По возможности обращайтесь к избыточному кодированию форм с помощью цвета.
10. За счет добавления цвета улучшайте восприятие информации.
1.
2.
3.
4.
ВИЗУАЛЬНЫЕ АТРИБУТЫ ОТОБРАЖАЕМОЙ ИНФОРМАЦИИ.
КОМПОЗИЦИЯ И ОРГАНИЗАЦИЯ ЭКРАНА.
К визуальным атрибутам отображаемой информации относятся:
 взаимное расположение и размер отображаемых объектов;
 цветовая палитра;
 средства привлечения внимания пользователя.
Проектирование размещения данных на экране предполагает выполнение следующих
действий:
1.
Определение состава информации, которая должна появляться на экране.
2.
Выбор формата представления информации.
3.
Определение взаимного расположения данных (или объектов) на экране.
4.
Выбор средств привлечения внимания пользователя.
5.
Разработка макета размещения данных на экране.
6.
Оценка эффективности размещения информации.
Общие принципы расположения информации на экране должны обеспечить для
пользователя:

возможность просмотра экрана в логической последовательности;

простоту выбора нужной информации;

возможность идентификации связанных групп информации;

различимость исключительных ситуаций (сообщений об ошибках или
предупреждений);

возможность определить, какое действие со стороны пользователя требуется
(и требуется ли вообще) для продолжения выполнения задания.
Правила, регулирующие плотность расположения данных на экране (или в пределах окна):
 оставлять пустым приблизительно половину экрана (окна);
 оставлять пустую строку после каждой пятой строки таблицы;
 оставлять четыре-пять пробелов между столбцами таблицы.
Фрагменты текста должны располагаться на экране так, чтобы взгляд пользователя сам
перемещался в нужном направлении. Содержимое полей должно не «прижиматься» к краю
экрана, а располагаться около его горизонтальных или вертикальных осей. Меню, содержащее
относительно небольшой объем информации, должно смещаться в левую верхнюю часть экрана.
Чтобы подчеркнуть симметрию, содержимое и наименования полей, относящихся к одной группе,
должны выравниваться по вертикали. По возможности необходимо выравнивать все логически
связанные группы данных. Текстовые сообщения группировать справа.
Методы выделения информации. Основная рекомендация по их использованию: следует
использовать минимально необходимое число атрибутов (чтобы привлечь внимание человека,
достаточно лишь легонько его «коснуться»).
Для объективной оценки плотности заполнения экрана, сбалансированности данных и других
показателей качества форматирования экрана рекомендуется отделить содержание от формы. Для
этого применяются два метода – прямоугольников и выделенных точек. При использовании
метода прямоугольников после разбиения экрана на поля каждое из них заполняется
произвольным текстом и отделяется от других по всему периметру по крайней мере одним
пробелом. Через центр экрана мысленно проводятся оси, позволяющие оценить
сбалансированность размещения полей. Метод выделенных точек позволяет определить число и
размещение областей экрана, к которым будет привлечено внимание пользователя (из-за
повышенной яркости, цвета или мерцания символов). Для этого каждая область, требующая
повышенного внимания, моделируется группой символов, отличных от пробелов.
Человек значительно лучше воспринимает визуальную информацию, если она
соответствующим образом организована в пространственном отношении. Взгляд всегда
привлекают в первую очередь цветные элементы, а не черно-белые, изолированные (отдельно
стоящие), а не сгруппированные, графические, а не текстовые.
При проектировании визуальных элементов интерфейса приложения целесообразно
опираться на определенные принципы:
 иерархическая организация отображаемой информации;
 визуальное выделение наиболее важных элементов;
 сбалансированность структуры экрана;
 визуальное объединение логически взаимосвязанных элементов;


обеспечение удобочитаемости и логической согласованности отображаемой информации;
использование единых подходов к визуализации отображаемой информации не только в
рамках приложения, но и рабочей среды в целом (принцип интеграции).
Принцип иерархической организации информации означает размещение информации с
учетом ее значения относительно других визуальных элементов приложения. Результат этого
упорядочения влияет на реализацию всех других принципов визуального представления
информации. С точки зрения работы пользователя иерархическая организация информации
определяет доступность тех или иных данных и последовательность выполнения решаемой
задачи. На экранах стандартных мониторов шрифты обычно менее разборчивы, чем на
отпечатанной странице. Старайтесь не использовать курсив и рубленый шрифт (serif), поскольку
они трудны для чтения, особенно при низком разрешении монитора. Ограничьте количество
применяемых шрифтов и стилей. По возможности используйте стандартный системный шрифт
для общих элементов интерфейса. Это обеспечивает визуальную согласованность между
интерфейсом вашего приложения и интерфейсом рабочей среды, и, кроме того, делает ваш
интерфейс легче масштабируемым. Поскольку многие элементы интерфейса могут
модифицироваться пользователем, проверьте системные параметры для встроенного системного
шрифта и установите аналогичные значения для вашего приложения.
«Многомерность» экрана. При изображении многих элементов интерфейса полезно
использовать перспективу, подсветку и затенения с целью обеспечения эффекта трехмерного
образа. Это способствует повышению функциональности интерфейса и наглядности обратной
связи при работе пользователя с компьютерными аналогами реального мира. Например, кнопки
изображаются таким образом, чтобы при их выборе у пользователя появлялась иллюзия, что
кнопка действительно нажата. При создании эффектов освещенности/затенения по умолчанию
принимается, что гипотетический источник света находится в верхнем левом углу экрана.
Разрабатывая ваши собственные визуальные элементы, будьте осторожны: не
переусердствуйте в использовании «объемных» образов, поскольку изображение каждого
«трехмерного» объекта занимает на экране значительно больше места, чем его «плоский» аналог.
Используйте трехмерные элементы только для изображения интерактивных элементов. При этом
вводите лишь те детали, которые действительно необходимы для идентификации образа
пользователем.
Пространственное размещение визуальных элементов. Размер и взаимное расположение
визуальных элементов очень важны для создания визуально последовательной и предсказуемой
среды. Визуальная структура важна также с точки зрения передачи назначения элементов,
отображенных в окне. В общем случае при выборе варианта размещения элементов следует
придерживаться тех же правил, которые используются при компоновке печатной страницы.
Группирование. Группирование предполагает компактное размещение взаимосвязанных
элементов. Для реализации группирования может использоваться либо специальный элемент –
группирующий блок, либо просто размещение элементов на соответствующем расстоянии друг от
друга.
С целью обеспечения единого подхода к пространственному размещению графических
элементов введена специальная единица измерения – dialog base unit (единица площади
диалоговой панели) – дискрета окна. Дискрета окна – это аппаратно-независимая величина; в
горизонтальном направлении она равна одной четверти средней величины символов текущего
системного шрифта; по-вертикали – одной восьмой средней высоты символов текущего
системного шрифта.
Рекомендуется оставлять между элементами в группе промежуток, равный по крайней мере
четырем дискретам, а расстояние до края окна и между группами должно быть не менее семи
дискрет.
Использование цвета для визуальной группировки объектов не всегда удачно, поскольку
может привести к нежелательным эффектам при изменении пользователем цветовой схемы.
Элементы управления в панели инструментов следует по возможности располагать так,
чтобы от края панели до края окна оставался промежуток, равный по меньшей мере ширине рамки
окна. Между элементами самой панели должно быть не менее четырех дискрет высоты (если не
группируется набор связанных кнопок). В некоторых случаях, например, когда кнопки панели
инструментов используются подобно набору переключателей, они могут располагаться слитно
(без промежутка).
Основные кнопки управления вторичного окна целесообразно сгруппировать в верхнем
правом углу окна или расположить в виде линейки вдоль нижнего края окна. Если в окне имеется
предопределенная кнопка, то она, как правило, должна стоять первой. Кнопки <OK> и
<Отменить> должны располагаться рядом. Замыкать группу должна кнопка <Справка> (если она
поддерживается приложением). Если кнопка <OK> не используется в данном окне, но имеются
другие кнопки управления, то лучше всего установить кнопку <Отменить> в конце набора кнопок
управления, но перед кнопкой <Справка>. Если какая-то кнопка применяется только для
конкретной области окна – включите ее в эту область. Если кнопки (или другие элементы
управления) вынесены на вкладку, предполагается, что их область действия распространяется
только на эту вкладку; соответственно, кнопки, не входящие в состав ни одной из вкладок окна,
относятся к окну в целом. Выравнивание представляет собой еще один дополнительный способ
визуального отображения взаимосвязанной информации (или элементов управления). Различают
три основных способы выравнивания информации:
 вертикальное (по левому или правому краю выравниваемых элементов);
 горизонтальное (по верхней строке или по верхнему краю элемента);
 смежное выравнивание (когда элементы смыкаются краями).
Если информация расположена вертикально, целесообразно выровнять ее элементы по
левому краю соответствующей области. Это обычно облегчает пользователю быстрый просмотр
информации. Если в виде столбца выводятся числовые данные, значения которых могут
изменяться, их лучше выровнять по правому краю.
Рекомендации по разработке интерфейса и компоновке окна (Рики Уилкинс):
 асимметрия = активное состояние; симметрия = состояние покоя;
 никогда не гоняйтесь за умеренностью;
 тщательно следите за последовательностью и согласованностью;
 помните, что согласованные интерфейсы означают лучшую внедряемость системы;
 четко выравнивайте управляющие элементы;
 если вы собираетесь располагать некоторые элементы за пределами выравнивания, то
делайте это логично;
 создавайте экранные объекты по образу и подобию объектов из реального физического
мира;
 не забывайте: абсолютная симметричность затрудняет чтение информации с экрана;
 элементы, не соответствующие шаблону, выделяются из общей массы;
 элементы одинакового цвета и размера воспринимаются как принадлежащие к одной
группе.
РАЗРАБОТКА СТРУКТУРЫ ДИАЛОГА
При проектировании диалога, необходимо определить:
 структуру диалога;
 возможный сценарий развития диалога;
 содержание управляющих сообщений и данных, которыми могут обмениваться человек и
приложение (семантику сообщений);
 визуальные атрибуты отображаемой информации (синтаксис сообщений).
Диалог типа «вопрос-ответ».
Структура диалога типа «вопрос-ответ» (Q&A) основана на аналогии с обычным интервью.
Система берет на себя роль интервьюера и получает информацию от пользователя в виде ответов
на вопросы. Это наиболее известная структура диалога; все диалоги, управляемые компьютером, в
той или иной степени состоят из вопросов, на которые пользователь отвечает, однако в структуре
Q&A этот процесс выражен явно.
В каждой точке диалога система выводит в качестве подсказки один вопрос, на который
пользователь дает один ответ. В зависимости от полученного ответа система может решить, какой
следующий вопрос задавать.
Структура Q&A предоставляет естественный механизм ввода как управляющих сообщений
(команд), так и данных. Никаких ограничений на диапазон или тип входных данных, которые
могут обрабатываться, не накладывается.
Эта структура может удовлетворить требования различных пользователей и типов данных.
Такая структура особенно уместна при реализации диалога с множеством ответвлений (в тех
случаях, когда на каждый вопрос предусматривается большое число ответов, каждый из которых
влияет на то, какой вопрос будет задан следующим). По этой причине, структура Q&A часто
используется в экспертных системах.
Данная структура имеет ряд существенных недостатков. Во-первых, не гарантирует
минимального объема ввода, оцениваемого по количеству нажатий клавиш; во-вторых, возможны
проблемы с анализом и интерпретацией вводимых данных; в-третьих, процедура ввода ответов
набором их с клавиатуры достаточно утомительна для пользователя.
Диалог на основе меню.
Существует несколько основных форматов представления меню на экране:
 список объектов, выбираемых прямым указанием, либо указанием номера (или
мнемонического кода);
 меню в виде блока данных;
 меню в виде строки данных;
 меню в виде пиктограмм.
Меню в виде строки данных может появляться вверху или внизу экрана и часто остается в этой
позиции на протяжении всего диалога. Таким образом, посредством меню удобно отображать
возможные варианты данных для ввода, доступных в любое время работы с системой. Если в
системе имеется достаточно большое разнообразие вариантов действий, организуется
иерархическая структура из соответствующих меню. Дополнительные меню в виде блоков данных
«всплывают» на экране в позиции, определяемой текущим положением указателя, либо
«выпадают» непосредственно из строки меню верхнего уровня. Эти меню исчезают после выбора
варианта. Меню в виде пиктограмм представляет собой множество объектов выбора,
разбросанных по всему экрану; часто объекты выбора содержат графическое представление
вариантов работы.
Диалог на основе экранных форм.
Диалог на основе экранных форм допускает обработку на одном шаге диалога нескольких
ответов. На практике формы используются там, где учет какой-либо деятельности требует ввода
стандартного набора данных. Человек работает с формой до тех пор, пока не заполнит ее
полностью и не передаст системе. Система может проверять каждый ответ непосредственно при
вводе или по окончании заполнения всей формы. Сообщения об ошибках, выводимые
непосредственно после ответа, могут отвлечь внимание, но могут оказать и положительное
влияние. В тех случаях, когда информация для ввода выбирается из некоторого целостного
документа, проверку лучше отложить до конца заполнения формы, чтобы не прерывать процесс
ввода; если же такой целостности нет, то проверку следует выполнять сразу после ввода ответа
(после заполнения очередного поля). Если встретилась какая-либо ошибка, приложение не должно
заново выводить пустую форму; выводится форма с предыдущими ответами и допущенными
ошибками. Новый «бланк» выдается лишь в случае соответствующего запроса пользователя.
Такую структуру уместно применять там, где источником данных служит существующая входная
(«бумажная») форма документа. Не обязательно, чтобы внешний вид этих форм совпадал, но все
вводимые элементы данных должны располагаться в том же относительном порядке и иметь такой
же формат, что и в исходном документе.
Часто все необходимые единицы ввода нельзя отобразить одновременно в пределах одного
экрана (или окна), и их необходимо разделить на группы, которые отображаются на
последовательности экранов (окон). Важно, чтобы это разбиение сохраняло логические связи и не
приводило к разделению связанных частей документа.
Поскольку эта структура имеет последовательную, а не древовидную организацию, она в
меньшей степени подходит для работы в режиме выбора вариантов. Еще одной областью
применения экранных форм является задание параметров запроса в базах данных. Этот механизм
иногда называют запросом по образцу (Query by Example).
Диалог на основе командного языка
Очень часто используется в операционных системах. Исторически это первая из
реализованных структур диалога.
При такой организации диалога система не выводит ничего, кроме постоянной подсказки
(приглашения на ввод команды), которая означает готовность системы к работе. Каждую команду
вводят с новой строки и обычно заканчивают нажатием клавиши «ввод». Ответственность за
правильность задаваемых команд ложится на пользователя. Система информирует о
невозможности выполнения неверной команды, не поясняя, как правило, причин.
Подобно меню, диалог на базе команд удобен для ввода управляющих сообщений, однако
он обеспечивает более широкие возможности выбора в любой точке диалога и не требует
иерархической организации обслуживающих его программ.
Диалог должен управлять данными. В интерфейсах на основе командного языка это
достигается с помощью составных командных строк, где команда предшествует списку
параметров (входным данным). Параметры в списке можно задавать в одной из двух форм –
позиционной и ключевой.
Назначение позиционного параметра определяется по его месту в командной строке.
Позиционные параметры уменьшают объем вводимой информации, но их существенным
недостатком является то, что вводимые значения должны указываться в строго определенном
порядке, нарушение
которого может повлечь непредсказуемые последствия. Задание
позиционных параметров осложняется, если их список достаточно велик. Этот недостаток
стремятся компенсировать путем пропуска неизменяемых параметров, вводя два разделителя друг
за другом.
В случае ключевых параметров каждое значение предваряется определенным
идентификатором, который определяет его назначение. Ключевые параметры уменьшают
нагрузку на память пользователя в том отношении, что отпадает необходимость в запоминании
порядка их следования; можно опускать необязательные параметры. Недостатком является то, что
пользователю приходится запоминать множество ключевых слов, а разработчику – подбирать для
них «осмысленные» имена. Этот подход требует большего времени работы системы, чтобы
распознать ключевые слова, заданные в произвольном порядке.
Структура на основе языка команд по своим возможностям самая быстрая и гибкая из всех
структур диалога. Большинство пользовательских интерфейсов на базе естественного языка
реализуется с помощью языков команд с очень большим набором ключевых слов.
Выбор подходящей структуры диалога через таблицу выбор




Закрыть графы «Тип диалога».
В графе «Выбор пользователя» пометить критерии, относящиеся к рассматриваемому
применению.
Для каждого типа диалога подсчитать число случаев, когда помечены соответствующие
пункты в графе «выбор пользователя», и в графе «тип диалога».
Подсчитать число совпадений для каждого типа диалога.
Критерии
Цель
Выбор
пользователя
Меню
Тип диалога
ВопросЯзык
ответ
команд
+
+
+
+
+
+
+
+
+
+
Экранные
формы
+
+
Запрос
+
Вычисления
+
Сложный выбор
Ввод данных
Ввод данных (большой
+
+
объем)
Пользователь Программист
+
+
Непрограммист
без
+
+
+
+
опыта
Непрограммист
с
+
+
*
*
опытом
Время
Очень малое
+
+
обучения
Менее 1 дня
+
+
**
**
Более 1 дня
+
+
Результат оценки
В таблице знак * означает, что использование этого типа диалога данной категорией пользователей
требует наличия системы помощи; знак ** означает, что использование средств системы возможно
только в ограниченном объеме.
Разработка сценария диалога.
Развитие диалога во времени можно рассматривать как последовательность переходов
системы из одного состояния в другое. Ни одно из этих состояний не должно быть тупиковым, т.е.
пользователь должен иметь возможность перейти из любого текущего состояния диалога в
требуемое (за один или несколько шагов). Для этого в ходе разработки интерфейса необходимо
определить все возможные состояния диалога и пути перехода из одного состояния в другое –
разработать сценарий диалога. Цели разработки сценария:
 выявление и устранение возможных тупиковых ситуаций в ходе развития диалога;
 выбор рациональных путей перехода из одного состояния диалога в другое (из текущего в
требуемое);
 выявление неоднозначных ситуаций, требующих оказания дополнительной помощи
пользователю.
Сценарий диалога можно упростить, снизив степень неопределенности действий пользователя:
 использование смешанной структуры диалога (применение меню с целью «ограничения
свободы» пользователя там, где это возможно);
 применение входного контроля вводимой информации (команд и данных).
Дополнительные возможности по снижению неопределенности действий пользователя
предоставляет объектно-ориентированный подход к разработке интерфейса, при котором для
каждого объекта заранее устанавливается перечень свойств и допустимых операций. Наиболее
эффективен такой подход при создании графического интерфейса.
Способ описания сценария диалога зависит от степени его сложности. Методы описания
сценариев делятся на две группы: неформальные и формальные методы.
Главное достоинство формальных методов состоит в том, что они позволяют
автоматизировать как проектирование диалога, так и его модификацию (адаптацию) в
соответствии с характеристиками пользователя.
В настоящее время наиболее широко используются формальные методы описания сценариев
на основе сетей Петри и их расширений, а также на основе систем представления знаний
(фреймовые модели и продукционные системы).
Независимо от способа описания сценария его основной структурной единицей является шаг
диалога, соответствующий одному акту взаимодействия пользователя с системой.
Подготовка сообщения
участником 1
Выдача сообщения
участником 1
Выдача сообщения
участником 2
Подготовка сообщения
участником 2
К следующему
шагу диалога
Описание структуры диалога с помощью сети переходов.
Развитие диалога можно рассматривать как последовательность переходов от одного
состояния к другому. Диалог может находиться в особом состоянии ожидания ввода от
пользователя и будет переходить в одно из нескольких возможных состояний в зависимости от
характера принятой информации. В соответствии с этим диалог можно представить в виде сети
переходов или диаграммы состояний. Каждое состояние представляется вершиной графа,
помеченной соответствующим ей номером. Будем рассматривать вершину как некоторую точку, в
которой диалог выводит сообщение пользователю или требует входного сообщения от
пользователя. Связи между вершинами обозначаются направленными дугами, соединяющими две
вершины, метка на дуге определяет условие, при выполнении которого возможен переход. Может
существовать несколько дуг, соединяющих две вершины и определяющих, что переход может
быть вызван несколькими условиями. Выделяют три типа вершин.
1. Вершина, в которой выводится сообщение пользователю с запросом на ввод. Передача на
соседнюю вершину зависит от контекста введенного сообщения.
2. Вершина, в которой выводится сообщение пользователю без запроса на входное
сообщение; следует автоматическая передача на соседнюю вершину.
3. Вершина, в которой выводится сообщение пользователю с запросом на ввод, после
которого осуществляется безусловный переход на соседнюю вершину.
Рассмотрим различия между вершинами типа 2 и 3. В типе 2 переход осуществляется
автоматически, т.е. не требуется никакого входного сообщения. В типе 3 перехода не произойдет
до тех пор, пока не будет сделан ввод, но, независимо от контекста введенных данных, будет
иметь место один и тот же переход.
Каждая вершина в сети переходов представляет собой отдельное состояние диалога. Она
образует точку переключения в развитии диалога. Переключением можно управлять
придерживаясь структуры, в которой устанавливается соответствие между назначением
следующей вершины и каждым элементом из набора условий.
Условие
C(1)
C(2)
…..
C(k)
Следующая
вершина
N(1)
N(2)
……
N(k)
N(k+1)
Каждому условию C(i) соответствует вершина N(i), в которую должен быть осуществлен
переход. Если никакое из условий не выполнено, то переход произойдет в вершину N(k+1)
(например, в случае ошибки). Такое же обозначение используется и для безусловного перехода.