4. Требования к содержанию работы
Расчетно-графическая работа должна состоять из следующих обязательных разделов:
1) содержание (1 страница);
2) введение (1 страница);
3) аналитическая часть (7-10 страниц);
4) конструкторская часть (5-8 страниц);
5) заключение (1 страница);
6) список литературы (5-10 источников).
Выполнение расчетно-графической работы предполагает описание процесса проектирования пользовательского интерфейса или дизайна сайта, начиная с написания анализа предметной области, интерфейса аналогов и технического задания, заканчивая проектированием дизайна отдельных окон и описанием обработки исключительных ситуаций.
Для определения требований, предъявляемых к интерфейсу, необходим анализ предметной области и интерфейсов аналогичных программ. Данный анализ должен быть представлен в аналитической части работы. Необходимо выполнить сравнительный анализ двух аналогичных интерфейсов с обоснованием их достоинств и недостатков с точки зрения эргономики.
При проведении анализа должны использоваться периодические издания, учебники, монографии и Internet-ресурсы, ссылки на которые обязательны в тексте курсовой работы. Библиографические данные источников информации, оформленные согласно ГОСТ Р 7.1-2003, размещаются в списке литературы в алфавитном порядке.
По результатам анализа должны быть сделаны выводы, в которых обосновывается актуальность разработки интерфейса, определяются требования к эргономическим характеристикам интерфейса системы, указывается, какие достоинства интерфейсов аналогов нужно перенять, и какие недостатки необходимо исправить в собственной разработке. Формализованное описание требований оформляется в виде контрольного списка интерфейса.
Контрольный список – это документ с перечнем требований к выполняемой работе. Каждому свойству готовой работы присваивается весовой коэффициент (например, «элементы интерфейса расположены по модульным сеткам – 0,05»). Сумма коэффициентов всех требований должна равняться единице.
Примерная структура контрольного списка интерфейса.
1. Требования к окнам
При проектировании было учтено, при каком разрешении, а так же размере монитора и шрифтов будут работать пользователи.
Заголовки окон
Заголовки короткие и адекватные содержимому окна.
Заголовки соответствуют названиям элементов, при помощи которых окна были вызваны.
1.2. Дизайн окна
Тип окна (модальное, немодальное, возможность минимизации/максимизации) был выбран осознанно, в соответствии с задачами пользователей.
Управляющие и информационные элементы расположены достаточно далеко друг от друга (не менее 7 DLU; 1DLU = 0,5 ширины символа используемого шрифта).
Информация в окне адекватно сгруппирована (связанные элементы объединены в группы).
Переход от элемента к элементу внутри окна, осуществляется сверху вниз слева направо.
2. Требования к меню
2.1. Пункты главного меню
Пункты меню имеют адекватные названия.
Первая буква в названии пунктов заглавная.
Все пункты первого уровня активизируют выпадающее меню.
2.2. Элементы основного меню второго уровня
Все элементы начинаются с заглавной буквы.
Если в меню используются пиктограммы, они расположены слева от названия пункта меню.
Все списки содержат более одного элемента.
Пункты меню адекватно сгруппированы. Осмысленно использованы разделители в меню.
Пункты меню расположены в порядке связанности выполняемых функций, частоте использования, важности.
Используются не более двух подуровней меню.
Каждый пункт меню имеет соответствующую горячую клавишу.
Название пункта меню соответствует названию вызываемого окна.
Пункты меню, открывающие диалоговые окна, обозначены в конце многоточием (…).
Недоступные пункты меню обозначены серым цветом шрифта.
3. Требование к панелям инструментов
Каждому элементу инструментальной панели соответствует всплывающая подсказка.
Элементы упорядочены и сгруппированы в соответствии с задачами пользователей.
Для стандартных действий используются общепринятые графические элементы.
4. Требования к элементам управления
Переключатели (Check boxes)
В одном окне используется не более 10 переключателей.
Переключатели сгруппированы и каждой группе присвоено название.
Внутри группы переключатели расположены строго вертикально.
В названиях используется только позитивная, утвердительная форма.
4.2. Командные кнопки
Кнопки имеют краткие и ясные названия.
В каждом диалоге используется не более 5 кнопок.
Кнопки, выполняющие в разных диалогах идентичные функции, имеют одинаковые названия.
Типовые кнопки имеют общепринятые названия и общепринятые горячие клавиши.
Кнопки, вызывающие продолжение диалога в вложенных формах, обозначены многоточием (…).
Недоступные кнопки имеют соответствующие атрибуты (серый цвет шрифта и т.п.).
Опасные для пользователя кнопки не являются кнопками по умолчанию.
4.3. Раскрывающиеся списки
Высота выводимого на экран списка ограничена 3-8 элементами.
Если список содержит более 50 элементов, используется фильтр или режим поиска.
Если все элементы не умещаются в одном фрагменте списка, автоматически появляется полоса прокрутки.
4.4. Группы элементов
Каждая группа имеет осмысленное название, помимо рамки отделена от других групп и элементов свободным пространством.
4.5. Подписи (Labels)
Все элементы имеют подписи.
Подписи выровнены по левому краю поля (если они находятся над полем).
Подписи расположены по середине высоты поля (если название находится с боку).
Если элемент недоступен, подпись отображается серым шрифтом.
4.6. Кнопки выбора (Option Buttons или Radio Buttons)
В одной группе используется не более 6 кнопок.
В пределах группы кнопки расположены по вертикали.
Нет состояния, когда ни одна кнопка не выбрана.
Последовательность расположения кнопок в группе учитывает частоту использования.
4.7. Вкладки (Tabs)
Названия вкладок выровнены по центру.
Каждой вкладке присвоено осмысленное название.
Все связанные между собой данные находятся внутри одной закладки.
Кнопки, относящиеся ко всему блоку закладок, расположены за пределами блока закладок.
4.8. Текстовые поля ввода (Text Box или Edit)
Для недоступных полей используются серый цвет (название, текст и фон поля).
Высота всех текстовых полей в окне одинакова.
Содержимое полей выровнено по левому краю, за исключением полей с числовыми значением (напр., для вывода денежных сумм).
Длина поля не меньше длины вводимых в него данных.
Если в поле вводится численное значение границы диапазона выводятся во всплывающей подсказке.
5. Взаимодействие с пользователем
Система, завершив длительную операцию, издает звуковой сигнал.
При вводе информации, осуществляется проверка и выполняется индикация в случае неверного значения.
Контрольный список веб-интерфейса будет обладать специфическими требованиями, связанными с оформлением гиперссылок, скоростью загрузки страниц, более разветвленной структурой окон, стабильностью отображения на печати и в различных браузерах.
Опираясь на требования контрольного списка к разрабатываемому интерфейсу, переходим к проектированию, ход которого описывается в конструкторской части работы.
На первом этапе выполняем высокоуровневое проектирование. Необходимо выделить основные окна системы и установить навигационные связи между ними. Результатом данного этапа является схема окон интерфейса (аналог функциональной схемы) и описание взаимодействия между ними. Каждый блок (окно) должен иметь осмысленное название, отражающее суть реализованных в нем функций. Нужно избегать связи одного окна (кроме главного) с большим количеством других окон, чтобы не усложнять навигацию по системе.
На данном этапе также важно описать сценарии (алгоритмы решения основных задач) работы пользователя с интерфейсом исходя из связей на схеме окон. Сценарии приводятся в текстовом или графическом виде (блок-схемы).
Этап низкоуровневого проектирования посвящен детальной разработке интерфейса отдельных окон системы. Необходимо кратко обосновывать выбор программной системы для разработки прототипа интерфейса.
На примере 3-4 основных окон обосновывается выполнение требований контрольного списка (технического задания). Кроме этого, необходимо раскрыть, каким образом достигается выполнение в интерфейсе основных критериев эргономики актуальных для разработанного интерфейса – скорости работы пользователя, уменьшения числа ошибок, субъективной удовлетворенности и скорости обучения.
Описывается за счет каких мер повышается скорость работы пользователя (интеллектуальная и физическая), меры по борьбе с ошибками при вводе данных.
Особое внимание уделяется дизайну интерфейса. Для каждого рассматриваемого окна приводятся меры по повышению субъективной удовлетворенности пользователя, связанные с использованием визуальных констант, модульных сеток, выбора размеров и форм элементов, цветов, шрифтов и т.п. В некоторых системах целесообразно описать реализацию механизма отмены действий пользователя. Обеспечение гибкости интерфейса потребует реализации в работе альтернативных видов взаимодействия (меню, панель инструментов, горячие клавиши и т.п.).
На последнем этапе конструкторской части описывается структура и содержание системы обучения пользователя. Приводятся примеры использования интуитивно-понятных проектных решений (использование метафор, наглядности, стандарта).
В заключении расчетно-графической работы указываются общие выводы и результаты каждого из основных этапов.