Контрольная работа. Отчет по контрольной работе по дисциплине Человекомашинное взаимодействие
 Скачать 3.3 Mb.
|
 Министерство науки и высшего образования Российской Федерации ФЕДЕРАЛЬНОЕ ГОСУДАРСТВЕННОЕ БЮДЖЕТНОЕ ОБРАЗОВАТЕЛЬНОЕ УЧРЕЖДЕНИЕ ВЫСШЕГО ОБРАЗОВАНИЯ «ОРЕНБУРГСКИЙ ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ» Факультет математики и информационных технологий Кафедра программного обеспечения вычислительной техники и автоматизированных систем ОТЧЕТ по контрольной работе по дисциплине «Человеко-машинное взаимодействие» ПРОЕКТИРОВАНИЕ ГРАФИЧЕСКОГО ПОЛЬЗОВАТЕЛЬСКОГО ИНТЕРФЕЙСА ПО ТЕХНОЛОГИИ WIMP Проверил канд. техн. наук, доцент _____________ Л.Ф. Тагирова «___» ______________ 2022 г. Исполнитель студент группы З-19ПИнж(б)РПиС _____________ В.П. Чеснокова «___» ______________ 2022 г. Оренбург 2022 Содержани Название 10 Описание 10 Кнопочное меню 10 Выбор опций работы программы по нажатию 10 1 Описание и проектирование диалога пользователя с программным средством. 3 2 Реализация диалогов в графическом пользовательском интерфейсе по технологии WIMP 8 3 Проектирование и реализация системы помощи пользователю в обучении программному средству 13 4 Юзабилити-тестирование 16 1 Описание и проектирование диалога пользователя с программным средством 1.1 Основные аспекты предметной области «Продажа билетов на железнодорожные перевозки пассажиров» Программа является автоматизированным рабочим местом работника вокзала, ПС позволяет хранить информацию о поездах, о продаже билетов, а также о расписание поездов. 1.2 Оценка интерфейса конкурирующих систем  Рисунок 1 – Интерфейс сайта «РЖД.ру»  Рисунок 2 – Интерфейс сайта «Туту.ру» На данный момент существует множество сайтов по автоматизации продажа билетов на железнодорожные перевозки пассажиров, например «РЖД.ру», «Туту.ру» но эти сайты рассчитаны лишь на обработку данных и продажи, в связи с чем ЛПР не сможет выполнить поставленную задачу. 2.3 Контекст использования программы Пользователи должны обладать элементарными навыками работы с клавиатурой и мышью и знать основы предметной области «Продажа билетов на железнодорожные перевозки пассажиров». Причиной разработки послужило несовершенство программ аналогов. В результате должно быть создано ПС, доступное даже не опытному пользователю. ПС разрабатывается для ОС Windows 2.4 Бизнес-роли пользователей При разработке программного средства разграничений на пользователей не было предусмотрено ввиду отсутствия конфиденциальной информации, пользователем будет являться кассир железнодорожного вокзала. 2.5 Сценарий работы пользователей  Рисунок 3 – Сценарий работы пользователей  Рисунок 4 – Сценарий работы пользователей  Рисунок 5 – Сценарий работы пользователей 1.6 Полная схема экранов системы Полная схема экранов представлена на рисунке 6. Рабочий стол является главным окном. На ней расположены управляющие элементы, определяющие весь функции программного приложения.  Рисунок 6 – Полная схема экранов системы 1.7 Типы и формы каждого диалога, а также синтаксис и семантика используемых языков Таблица 2 – Типы, формы, синтаксис и семантика диалогов
1.8 Основные и дополнительные устройства и процессы ввода-вывода для каждого диалога Основными устройствами для работы в данном программном продукте, являются клавиатура и мышь. При помощи мыши выбираются различные пункты меню. При помощи клавиатуры вводятся различные данные в программу. 2. Реализация диалогов в графическом пользовательском интерфейсе по технологии WIMP 2.1 Меню интерфейса Для обеспечения удобства использования программы, меню должно иметь интуитивно-понятный интерфейс, который не будет вызывать особых трудностей у неподготовленного пользователя. Меню программы должно соответствовать правилу шести, т.е. в одну линейку меню не должно включаться более шести пунктов, каждый из которых не должен содержать более шести опций. Также, в программе должны быть предусмотрены различные подсказки или пояснения, облегчающие использование программы. В программе должна быть предусмотрена справка, которая подробно описывает принципы работы с программой. На рисунке 7 представлена структурная схема программы, согласно этой схеме, и абстрактным графам диалога, представленных на рисунках ниже.  Рисунок 7 – Структурная схема программы 2.2 Меню различных видов  Рисунок 8 – Основное меню  Рисунок 9 – Контекстное меню 2.3 Возможность управления меню клавиатурой Предусмотрена возможность управления меню клавиатурой, а также возможность использовать сочетания клавиш для быстрого доступа к функциям.  Рисунок 10 Функциональные клавиши кнопки «Выполнить распознавание» 2.4 Состав, внешний вид и расположение визуальных интерфейсных компонентов Внешний вид и взаимное расположение визуальных интерфейсных компонентов, показанный на эскизах интерфейса пользователя.
Рисунок 11 – Главная форма 2.5 Разработка программного средства, содержащего различные элементы управления Инструментальные средства современных IDE, предлагают программисту или человеку, занимающемуся оформлением интерфейсов пользователя довольно много видов различных элементов управления, позволяющих пользователю данного программного средства осуществлять навигацию по графическому интерфейсу программы различными способами, наиболее удобными тому или иному пользователю. Многообразие элементов управления имеет за собой несколько функций, которые положительно влияют на восприятие графического интерфейса программы пользователем, во-первых, это функциональное разнообразие программы, т.е. множество функций, которое можно реализовать с помощью тех или иных элементов управления, а во-вторых, это возможность создать свой непосредственный стиль приложения на основе различного вида форм элементов управления, которые в избытке существуют во всяческих библиотеках компонент. Спецификация типовых объектов управления графического интерфейса представлена в таблице 2. Таблица 2 – Спецификация типовых объектов управления графического интерфейса
2.6 Макеты экранов с описанием функциональности интерфейсных элементов  1 Основное меню   Рисунок 12 – Элементы главного окна Справочная информация  Таблицы «Рейсы»          Поля до ввода информации Добавить Отменить Рисунок 13 – Элементы окна «Редактирование справочной информации таблицы «Рейсы» 2.7 Реакции программного средства на действия пользователя  Рисунок 14 – Ошибка при попытке ввести символы вида: ‘, ”, ., !, &,? и т.д. На рисунке 15 показано предупреждение о выходе из программного средства, так как пользователь может случайно нажать на закрытие.  Рисунок 15 – Выход из программного средства 3 Проектирование и реализация системы помощи пользователю в обучении программному средству 3.1 Выбор способов обеспечения общей понятности системы Общая понятность системы обеспечивается: 1. Метафора Метафора позволяет пользователю не создавать новую модель, а воспользоваться готовой моделью, которую он ранее построил по другому поводу. В данном программном средстве используется метафора инструментов: значок «График» соответствует команде «Анализ данных». 2. Идиома Идиоматический подход основан на знании о том, как решать ту или иную задачу – естественный для человека процесс. Большинство элементов управления в графическом интерфейсе пользователя – идиомы. Примеры идиомы в системе: добавление и редактирование данных осуществляется нажатием на соответствующие кнопки на панели меню. 3. Аффорданс В современном значении этого термина аффордансом называется ситуация, при котором объект показывает субъекту способ своего использования своими неотъемлемыми свойствами. Аффорданс на экране получить сложнее, нежели в предметах реального мира, поскольку единственным способом его передачи оказывается визуал. В данном программном средстве использовано визуальное совпадение аффордансов экранных кнопок с кнопками в реальном мире (кнопка в реальном мире предлагает пользователю нажать на неё, псевдотрехмерная кнопка предлагает нажать на неё по аналогии). 3.2 Использованные обучающие материалы В приложении использованы следующие обучающие материалы: 1. Базовая справка объясняет пользователю сущность и назначение системы.  Рисунок 16 – Базовая справка  Рисунок 17 – Базовая справка (страница «Начало работы») 2. Справка предметной области в данном приложении реализована электронным учебником и алфавитным указателем по предметной области. 3. Процедурная справка отвечает на вопрос «Как это сделать?». Процедурная справка находится в выделенной справочной системе. 1 Основное меню Рисунок 18 – Процедурная справка 4. Справка состояния отвечает на опрос «Что происходит в настоящий момент?». В данном приложении справка состояний описывает, что делает система в данным момент или что означает элемент интерфейса. 3.3 Среды передачи обучающих материалов В приложении реализованы следующие среды передачи обучающих материалов: 1. Структурированная электронная документация реализована в виде Справки, которая находится в разделе меню «Помощь».  Рисунок 19 – Содержание справки 2. Фрагменты пространства интерфейса, показывающие справочную информацию: в данном приложении в качестве фрагментов пространства интерфейса, показывающих справочную информацию, используются подписи к полям ввода. 4 Юзабилити-тестирование 4.1 Контрольный список интерфейса программного обеспечения 4.1.1 Окна Окна хорошо сканируется взглядом, окно читается, как текст. 4.1.1.1 Заголовки Заголовки короткие и адекватные содержимому окна. Заголовки соответствуют названиям элементов, при помощи которых окна были вызваны. 4.1.1.2 Дизайн окна Тип окна (модальное, немодальное, возможность минимизации/ максимизации) был выбран осознанно, в соответствии с задачами пользователей. Управляющие и информационные элементы расположены достаточно далеко друг от друга. Информация в окне адекватно сгруппирована (связанные элементы объединены в группы). Кнопки находятся в секции, на которую они оказывают непосредственное воздействие. Переход от элемента к элементу внутри окна осуществляется сверху вниз слева направо. 4.1.1.3 Диалоговые окна В диалоговых окнах отсутствуют меню или инструментальные панели. 4.1.2 Меню 4.1.2.1 Пункты главного меню Пункты меню имеют адекватные названия. Первая буква в названии пунктов заглавная. Каждому пункту меню назначены общепринятые горячие клавиши. 4.1.2.2 Раскрывающиеся меню и элементы меню второго уровня Все элементы начинаются с заглавной буквы. Если в меню используются пиктограммы, они расположены слева от названия пункта меню. Все списки содержат более одного элемента. Высота меню не превышает размер экрана (меню не нужно прокручивать). Пункты меню адекватно сгруппированы. Осмысленно использованы разделители в меню. Пункты меню расположены в порядке связанности выполняемых функций, частоте использования, важности. Используются не более двух подуровней меню. Большинство пунктов меню имеют соответствующую горячую клавишу. Название пункта меню соответствует названию вызываемого окна. 4.1.3 Инструментальные панели Каждому элементу инструментальной панели соответствует всплывающая подсказка. Элементы упорядочены и сгруппированы в соответствии с задачами пользователей. Для стандартных действий используются общепринятые графические элементы. 4.1.4 Управляющие элементы 4.1.4.1 Командные кнопки Кнопки имеют краткие и ясные названия. В каждом диалоге используется не более 6 кнопок. Кнопки, выполняющие в разных диалогах идентичные функции, имеют одинаковые названия. Типовые кнопки имеют общепринятые названия и общепринятые горячие клавиши. Опасные для пользователя кнопки не являются кнопками по умолчанию. 4.1.4.2 Подписи (Labels) Все элементы имеют подписи. Подписи выровнены по левому краю поля (если они находятся над полем). Подписи расположены по середине высоты поля (если название находится с боку). Если элемент недоступен, подпись отображается серым шрифтом. 4.1.4.5 Списки Если список содержит более 50 элементов, используется фильтр или режим поиска. Высота ограничена 3-8 элементами. Если все элементы не умещаются, автоматически появляется полоса прокрутки. 4.1.4.6 Текстовые поля ввода (Text Box) Для недоступных полей используются серый цвет (название, текст и фон поля). Высота всех текстовых полей в окне одинакова. Содержимое полей выровнено по левому краю, за исключением полей с числовыми значением (напр., для вывода денежных сумм). Длина поля не меньше длины вводимых в него данных. 4.1.4.7 Порядок табуляции фокуса ввода При открытии окна фокус попадает на элемент внутри окна. Схема табуляции соответствует очередности заполнения полей (слева направо, сверху вниз). Командные кнопки включены в табуляцию. Невидимые и недоступные элементы исключены из схемы табуляции. 4.1.4.8 Пиктограммы Направление теней во всех пиктограммах одинаково: слева сверху. 4.1.4.9 Курсоры Используется индикация видом курсора. 4.2 Тестирование разработанного интерфейса на удобство использования 4.2.1 Оценка информационной производительности интерфейса программного обеспечения В поле меню 6 кнопок, то есть 6 равновероятных состояния, тогда выбор альтернативы несет количество информации, соответствующее 1/6 log 6 = 0.5 4.2.2 Оценка скорости работы с программным обеспечением по методу GOMS В 1983 году Кард, Моран и Ньювел создали метод оценки скорости работы с системой, названной аббревиатурой GOMS (Goals, Operators, Methods, and Selection Rules – цели, операторы, методы и правила их выбора). Идея метода очень проста: все действия пользователя можно разложить на составляющие (например, взять мышь или передвинуть курсор). Ограничив номенклатуру этих составляющих, можно замерить время их выполнения на массе пользователей. После чего получить статистически верные значения длительности этих составляющих. Для его использования достаточно знать правила разбиения задачи на составляющие и длительность каждой составляющей. Нажатие на клавишу клавиатуры, включая Alt, Ctrl и Shift. (К) Нажатие на кнопку мыши (М); Перемещение курсора мыши (П); Взятие или бросание мыши (В); Продолжительность выбора действия (Д). В среднем, 1.2 секунды пользователь принимает решение, какое именно действие он должен совершить на следующем шаге; Время реакции системы (З). Для базовых операций, таких как работа с меню, это время можно не рассчитывать, поскольку с момента создания метода производительность компьютеров много кратно выросла. Предположим, что пользователю со средним опытом требуется просмотреть/добавить/удалить список материалов, которые проходят распознавание. Диалоговое окно «Рейсы» представлено на рисунке 20. Рисунок 20 – Диалоговое окно «Рейсы» Эта задача состоит из следующих составляющих, представленных в таблице 3. Таблица 3 – Тестирование №1
Итого на эту операцию пользователю потребовалось 9,24 секунд. Предположим, теперь что туже самую операцию выполнит продвинутый пользователь, знающий, что открыть окно поиска товара можно с помощью сочетания клавиш Ctrl + S, а осуществить поиск – с помощью Alt + S. Результат второго тестирования представлен в таблице 4. Таблица 4 – Тестирование №2
Итого 8,2 секунды. Из итога видно, что второй вариант при прочих равных условиях эффективнее. 4.2.3 Методы предотвращения ошибок пользователя Используемые в программе методы предотвращения ошибок пользователя: 1. Плавное обучение пользователя в процессе работы: для обучения пользователя используются фрагменты пространства интерфейса, например подписи к полям ввода, всплывающие подсказки ко всем интерфейсным элементам (лабораторная работа 2). 2. Повышение заметности и разборчивости индикаторов: кнопки, согласно закону Фитса, сделаны физически большими и между ними есть пустое пространство, чтобы исключить ошибочное нажатие. 3. Метод снижения чувствительности системы к ошибкам: 1) Блокировка потенциально опасных действий пользователя. 2) Проверка действий пользователя перед их принятием. 4.2.4 Оценка эстетичности интерфейса программного обеспечения Интерфейс должен быть незаметен в процессе его использования, но приятно восприниматься на бессознательном уровне. Для достижения этого: 1. Интерфейс насыщен визуальными закономерностями: высота кнопок равна удвоенной высоте поля ввода в диалоговых окнах, одинаковая высота подписей к полям ввода и высота полей ввода. 2. Использована модульная сетка: интерфейсные элементы располагаются на сторонах невидимой сетки. 3. Размеры и координаты привязаны к золотому сечению – 0.618: 0.382. В частности, это используется при проектировании размеров диалогового окна (ширина: высота), размера кнопок (ширина: высота). 4. При проектировании интерфейса по возможности избегали ярких цветов – интерфейс выполнен в спокойных, холодных тонах: синий, бежевый, черный, серый. 4.2.5 Оценка использованных приемов для уменьшения субъективного восприятия времени работы программного обеспечения Для уменьшения субъективного восприятия времени работы программного обеспечения используются индикаторы типа «Слышу и вижу». Предполагаемые задержки не превышают двух секунд. В течении этого времени форма курсора изменяется на кружочек. Предусмотрены меры для уменьшения вероятности стрессовых ситуаций при работе с программным обеспечением: – Контроль над системой. – Пока пользователь ничего не сделает, ничего не произойдет, пока он этого не захочет. 4.2.6 Обоснованность использования паролей в программном обеспечении Оценив степень важности созданной ПС информации, был сделан вывод, что использовать пароли в программе не целесообразно, данная программа предназначена для широкого круга пользователей и не требует администрирования. 4.2.7 Оценка разработанной системы сообщений пользователям об ошибках Для уменьшения количества сообщений ошибок используются следующие методы: 1. Осуществляется проверка введенных данных на полноту и наличие недопустимых символов. 2. Используются компоненты, которые делают ошибки в принципе невозможными: выбор элементов из таблицы. Сообщения об ошибке отвечают на 2 вопроса: В чем заключается проблема? Как исправить проблему сейчас? 4.3 Методики юзабилити-тестирования и краткие протоколы тестирования интерфейса Юзабилити-тестирование – эксперимент, выполняемый с целью определения, насколько хорошо люди могут использовать некоторый искусственный объект (такой как веб-страница, пользовательский интерфейс или устройство) для его предполагаемого применения, то есть юзабилити-тестирование измеряет юзабилити объекта. Юзабилити-тестирование сосредоточено на определенном объекте или небольшом наборе объектов, в то время как исследования взаимодействия человек-компьютер в целом – формулируют универсальные принципы. Юзабилити-тестирование – метод оценки удобства использования продукта, основанный на привлечении пользователей в качестве тестирующих. Технически сеанс тестирования довольно прост. Имеется 3 пользователя, которые ни разу не видели текущего состояния системы, но имели практику работы с программами-аналогами. Тестерам дано задание из ранее написанных сценариев, они его выполняют, после чего результаты анализируются. В большинстве случаев достаточно помнить следующее: - тестирование на одном пользователе позволяет найти примерно 60% ошибок; - если у вас есть возможность оставить тестера одного, не пренебрегайте этим; - никогда не прерывайте пользователя. |