Сдам Сам

ПОЛЕЗНОЕ


КАТЕГОРИИ







ПРОЕКТИРОВАНИЕ ПОЛЬЗОВАТЕЛЬСКОГО ИНТЕРФЕЙСА





ПРОЕКТИРОВАНИЕ ПОЛЬЗОВАТЕЛЬСКОГО ИНТЕРФЕЙСА

Пользовательский интерфейс (ПИ) – это совокупность информационной модели проблемной области, средств и способов взаимодействия пользователя с информационной моделью, а также компонентов, обеспечивающих формирование информационной модели в процессе работы программной системы. Под информационной моделью понимается условное представление проблемной области, формируемое с помощью компьютерных (визуальных и звуковых) объектов, отражающих состав и взаимодействие реальных компонентов проблемной области. Одним из основных компонентов ПИ являются экранные формы для ввода первичных данных в ЭВМ или вывода результатной информации, которые также относятся к внутримашинному информационному обеспечению.

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

а) реализующих служебные функции (например, проверки пароля, ведения календаря, архивации баз данных и др.),

б) реализующих основные функции ввода первичной информации, обработки, ведения справочников, ответов на запросыи др. (рис. 13)

Рис.13. Пример дерева функций

Выявление состава функций, их иерархии и выбор языка общения (например, языка типа «меню») позволяет разработать структуру сценария диалога, дающего возможность определить состав кадров диалога (рис. 13), содержание каждого кадра и их соподчиненность.

Структура диалога. При разработке структуры диалога необходимо предусмотреть возможность работы с входными документами, формирование выходных документов, корректировки вводимых данных, просмотра введенной информации, работу с файлами нормативно-справочной информации, а также помощь на всех этапах работы.



В этом пункте следует выбрать способ описания диалога. Как правило, применяется два способа описания диалога. Первый предполагает использование табличной формы описания. Второй использует представление структуры диалога в виде орграфа, вершины которого могут быть перенумерованы (рис. 14), а описание его содержания в соответствии с нумерацией вершин, либо в виде экранов, если сообщения относительно просты, либо в виде таблицы.

Главное меню обычно содержит МЕНЮ и/или ВКЛАДКИ.


Рис. 14. Пример сценария диалога

Диалог в ИС не всегда можно формализовать в структурной форме. Как правило, диалог в явном виде реализован в тех ИС, которые жестко привязаны к исполнению предметной технологии. В некоторых сложных ИС (например, в экспертных системах) диалог не формализуется в структурной форме и тогда данный пункт может не содержать описанных схем.

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

Основные принципы создания интерфейса

Естественность (интуитивность)

Работа с системой не должна вызывать у пользователя сложностей в поиске необходимых директив (элементов интерфейса) для управления процессом решения поставленной задачи.

Непротиворечивость

Если в процессе работы с системой пользователем были использованы некоторые приемы работы с некоторой частью системы, то в другой части системы приемы работы должны быть идентичны. Также работа с системой через интерфейс должна соответствовать установленным, привычным нормам (например, использование клавиши Enter).

 

Неизбыточность

Это означает, что пользователь должен вводить только минимальную информацию для работы или управления системой. Например, пользователь не должен вводить незначимые цифры (00010 вместо 10). Аналогично, нельзя требовать от пользователя ввести информацию, которая была предварительно введена или которая может быть автоматически получена из системы. Желательно использовать значения по умолчанию где только возможно, чтобы минимизировать процесс ввода информации.

 

Гибкость

Насколько хорошо интерфейс системы может обслуживать пользователя с различными уровнями подготовки? Для неопытных пользователей интерфейс может быть организован как иерархическая структура меню, а для опытных пользователей как команды, комбинации нажатий клавиш и параметры.

 

Тексты и диалоги

Приведем некоторые принципы, которыми необходимо руководствоваться при создании текстовых диалогов и отображений:

· текст в нижнем регистре читается приблизительно на 13% быстрее, чем текст, который напечатан полностью в верхнем регистре;

· символы верхнего регистра наиболее эффективны для информации, которая должна привлечь внимание. НЕ ИСПОЛЬЗУЙТЕ ВЕРХНИЙ РЕГИСТР, ЕСЛИ ВЫ НЕ ХОТИТЕ ВЫДЕЛЯТЬ КАКУЮ-ЛИБО ИНФОРМАЦИЮ;

· Выровненный по правому краю текст труднее читать, чем равномерно распределенный текст с невыровненным правым полем;

· Оптимальный интервал между строками равен или немного больше, чем высота символов.

Шрифты способствуют организации информации и созданию определенного настроения. Изменяя размер и плотность шрифта, можно указать пользователю на степень важности той или иной информации и порядок, в котором она должна быть прочитана. На экранах стандартных мониторов шрифты обычно менее разборчивы, чем на отпечатанной странице. Старайтесь не использовать курсив (Italic) и рубленный шрифт (Serif), поскольку они трудны для чтения, особенно при низком разрешении монитора.

Количество применяемых шрифтов и стилей необходимо ограничить. По возможности, используйте стандартный системный шрифт для общих элементов интерфейса.

 

Рис.16. Пример кнопок из разрабатываемой системы

 

 

 

Рис.17. Пример средств графического интерфейса пользователя

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

Слайдеры – обычно это элемент 'полоса прокрутки', они могут быть помещены или в горизонтальную или вертикальную линейку на экране.

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

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

 

Изображения (Иконки)

В интерфейсе непосредственного манипулирования, пользователи выполняют действия непосредственно на видимых объектах. Этими объектами могут быть кнопки, метки, меню или изображения (иконки).

Все иконки можно классифицировать согласно тому, насколько точно они отображают несущую функцию:

· Иконки Подобия (рис. 18) - иконки похожи на объекты, которые они отображают (типа ножниц, чтобы отобразить операцию 'вырезки');

Рис. 18. Пример иконки подобия

· Иконки по образцу (рис. 19) – представляют пример типа объекта (например, иконкой, показывающей линию, чтобы представить средство рисования);

Рис. 19 Пример иконки по образцу

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

· Произвольные иконки (рис. 20) - не несут никакой информации по поводу их представления, поэтому их назначение должно быть описано (например, обратная круговая стрелка, чтобы представить действие ' отмена последней команды ')

Рис.20. Пример произвольной иконки

Меню

Необходимый элемент автоматизированной системы - меню, позволяющее пользователю выполнять задачи внутри приложения и управлять процессом решения(рис. 21). Меню - набор опций, отображаемых на экране, где пользователи могут выбирать и выполнять действия, тем самым производя изменения в состоянии интерфейса. Достоинство меню в том, что пользователи не должны помнить название элемента или действия, которое они хотят выполнить - они должны только распознать его среди пунктов меню. Таким образом, меню может использовать даже неопытный пользователь. Однако, проект меню должен быть тщательно продуман – чтобы меню было эффективным, названия пунктов меню должны быть очевидными.

Меню может занимать много экранного места, но есть решение для этой проблемы - использование всплывающего или ниспадающего меню. При нажатии на иконку, строку меню или другой объект вызывается всплывающее или ниспадающее меню.

 

Рис.21. Пример меню

 

ФОРМЫ

Формы – основной элемент интерфейса. Назначение форм – удобный ввод и просмотр данных, состояния, сообщений автоматизированной системы. (рис. 22).

Рис.22. Пример разработки формы

Основные принципы проектирования форм:

· Форма проектируется для более удобного, более понятного и скорейшего достижения решения поставленной задачи. Если форма переносится из бумажной формы, то передвижение по смежным полям не должно вызывать затруднений у пользователя.

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

· Важно использовать незаполненное пространство, чтобы создать равновесие и симметрию среди информационных элементов формы, для фиксации внимания пользователя в нужном направлении.

· Логические группы элементов необходимо отделять пробелами, строками, цветовыми или другими визуальными средствами.

· Взаимозависимые или связанные элементы должны отображаться в одной форме.

 

Дизайн заголовков и полей

· Для отдельных полей заголовок должен быть выровнен по левому краю; для полей списков, заголовок должен быть выше и левее по отношению к основному полю, числовые поля выравниваются по правому полю.

· Длинные колоночные поля или длинные столбцы информационных единиц с одиночными полями необходимо объединять в группы пять элементов, разделяемых пустой строкой - это помогает пользователю мысленно обрабатывать информацию по выделенным группам.

· В формах с большим количеством информации необходимо использовать названия разделов, которые однозначно свидетельствуют о характере принадлежащей им информации.

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

· Заголовки должны быть краткими, знакомыми и содержательными.

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

 

Форматы ввода

· Необходимо обеспечить ввод значений по умолчанию во все поля, которые это допускают, и такая функция не будет раздражать пользователя. Можно назначить клавиши или коды для ввода часто повторяющихся значений.

· Входные данные должны быть значимыми и общепринятыми. Данные или коды на международном Английском языке будут проще для узнавания и понимания, чем произвольные коды.

· Не объединяют поля ввода чисел и символов, поскольку числовые и алфавитные клавиши находятся неудобно относительно друг друга на клавиатуре.

· Моделируют поля ввода короткими, насколько это возможно.

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

· Нельзя требовать от пользователя ввода незначимых цифр (например, вместо 00000010 пользователь должен ввести только 10).

 

Рис.19. Пример кнопок из разрабатываемой системы

 

Проектирование сообщений

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

Сообщения могут предложить пользователю:

· Выбрать из предложенных альтернатив некую опцию или набор опций;

· Ввести некоторую информацию;

· Выбрать опцию из набора опций, которые могут изменяться в зависимости от текущего контекста;

· Подтвердите фрагмент введенной информации перед продолжением ввода.

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

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

 

 

Рис.23. Пример сообщения

ПРОЕКТИРОВАНИЕ ПОЛЬЗОВАТЕЛЬСКОГО ИНТЕРФЕЙСА

Пользовательский интерфейс (ПИ) – это совокупность информационной модели проблемной области, средств и способов взаимодействия пользователя с информационной моделью, а также компонентов, обеспечивающих формирование информационной модели в процессе работы программной системы. Под информационной моделью понимается условное представление проблемной области, формируемое с помощью компьютерных (визуальных и звуковых) объектов, отражающих состав и взаимодействие реальных компонентов проблемной области. Одним из основных компонентов ПИ являются экранные формы для ввода первичных данных в ЭВМ или вывода результатной информации, которые также относятся к внутримашинному информационному обеспечению.

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

а) реализующих служебные функции (например, проверки пароля, ведения календаря, архивации баз данных и др.),

б) реализующих основные функции ввода первичной информации, обработки, ведения справочников, ответов на запросыи др. (рис. 13)

Рис.13. Пример дерева функций

Выявление состава функций, их иерархии и выбор языка общения (например, языка типа «меню») позволяет разработать структуру сценария диалога, дающего возможность определить состав кадров диалога (рис. 13), содержание каждого кадра и их соподчиненность.

Структура диалога. При разработке структуры диалога необходимо предусмотреть возможность работы с входными документами, формирование выходных документов, корректировки вводимых данных, просмотра введенной информации, работу с файлами нормативно-справочной информации, а также помощь на всех этапах работы.

В этом пункте следует выбрать способ описания диалога. Как правило, применяется два способа описания диалога. Первый предполагает использование табличной формы описания. Второй использует представление структуры диалога в виде орграфа, вершины которого могут быть перенумерованы (рис. 14), а описание его содержания в соответствии с нумерацией вершин, либо в виде экранов, если сообщения относительно просты, либо в виде таблицы.

Главное меню обычно содержит МЕНЮ и/или ВКЛАДКИ.


Рис. 14. Пример сценария диалога

Диалог в ИС не всегда можно формализовать в структурной форме. Как правило, диалог в явном виде реализован в тех ИС, которые жестко привязаны к исполнению предметной технологии. В некоторых сложных ИС (например, в экспертных системах) диалог не формализуется в структурной форме и тогда данный пункт может не содержать описанных схем.

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









Не нашли то, что искали? Воспользуйтесь поиском гугл на сайте:


©2015- 2019 zdamsam.ru Размещенные материалы защищены законодательством РФ.