Пользовательский интерфейс и его виды
Пользовательский интерфейс – это совокупность правил взаимодействия пользователя с программой или вычислительной системой и средств, реализующих это взаимодействие.
В информационных технологиях конечного пользователя важное значение имеет пользовательский интерфейс – совокупность элементов, позволяющих пользователю управлять работой программы или вычислительной системы и получать требуемые результаты. Фактически, пользовательский интерфейс — это канал, по которому осуществляется взаимодействие пользователя и программы.
Пользовательский интерфейс реализует работу человека на персональном компьютере посредством элементов взаимодействия.
Элемент взаимодействия — это элемент пользовательского интерфейса, с помощью которого пользователь непосредственно взаимодействует с программой или вычислительной системой.
Различают активные и пассивные элементы взаимодействия, представленные
Пассивный элемент взаимодействия — это элемент пользовательского интерфейса, через который пользователь не имеет прямого доступа к системным или программным ресурсам, т.е. не может управлять или изменять эти ресурсы напрямую и непосредственно.
К пассивным элементам взаимодействия относятся информационные сообщения, подсказки и т.д.
Активный элемент взаимодействия - это элемент пользовательского интерфейса, через который пользователь имеет прямой доступ к системным и программным ресурсам с возможностью непосредственного управления и изменения их.
К активным элементам взаимодействия относятся команды управления системными настройками и программными ресурсами, средства конфигурации системы, команды работы с файловыми системами.
Виртуализация – переход на более высокий уровень абстракции в управлении конкретными конфигурациями вычислительной системы.
Согласно общепринятой классификации, существующие на практике интерфейсы можно разделить на следующие виды:
- командный интерфейс;
- графический интерфейс
- SILK-интерфейс.
1. Командный интерфейс. Одним из основных и наиболее старых является интерфейс командной строки. Командный (командно-строчный) интерфейс получил наибольшее развитие во времена расцвета больших многопользовательских систем с алфавитно-цифровыми дисплеями. Он характеризуется тем, что пользователь осуществляет взаимодействие с ЭВМ посредством командной строки, в которую вводятся команды определенного формата, а затем передаются к исполнению.
Командный интерфейс повышает эффективность работы профессиональных пользователей, и он до сих пор используется в некоторых приложениях (консольных приложениях). Использо-вание командного интерфейса обусловлено тем, что клавиатура является непревзойденным по скорости средством ввода информации. Конкуренцию клавиатуре в перспективе может составить только голосовой способ ввода.
2. Графический интерфейс пользователя является обязательным компонентом большинства современных программных продуктов, ориентированных на работу конечного пользователя. Основными достоинствами графического интерфейса являются наглядность и интуитивная понятность для пользователя, а также общность интерфейса программ, написанных специально для функционирования в графической среде. Пользователь, научившись работать с одной программой, легко может начать работать и со всеми остальными.
Наиболее часто графический интерфейс реализуется в интерактивном режиме работы пользователя и строится в виде системы спускающихся меню с использованием в качестве средства манипуляции мыши и клавиатуры. Работа пользователя осуществляется с экранными формами, содержащими объекты управления, панели инструментов с пиктограммами режимов и команд обработки.
3. SILK-интерфейс (Speech, Image, Language, Knowledge — речь, образ, язык, знание). В настоящее времяSILK-интерфейс существует лишь как «голосовой» (если не считать биометрических интерфейсов, применяющихся не для управления компьютером, а лишь для идентификации пользователя). Это очень перспективное направление по той причине, что вводить информацию с голоса — самый быстрый и удобный способ. Но его практические реализации пока не стали доминирующими, т.к. качество распознавания устной речи пока далеко от идеала.
Принципы проектирования пользовательского интерфейса
Создание качественного интерфейса требует значительно большего, чем просто соблюдение некоторых инструкций. Оно предполагает реализацию принципа «интересы пользователя превыше всего» и соответствующую методологию разработки всего программного продукта.
Основное достоинство хорошего интерфейса пользователя заключается в том, что пользователь всегда чувствует, что он управляет программным обеспечением, а не программное обеспечение управляет им.
Для создания у пользователя такого ощущения «внутренней свободы» интерфейс должен обладать целым рядом свойств, рассмотренных ниже.
1. ЕСТЕСТВЕННОСТЬ ИНТЕРФЕЙСА
Естественный интерфейс — такой, который не вынуждает пользователя существенно изменять привычные для него способы решения задачи. Это, в частности, означает, что сообщения и результаты, выдаваемые приложением, не должны требовать дополнительных пояснений. Целесообразно также использование знакомых пользователю понятий и образов (метафор) обеспечивает интуитивно понятный интерфейс при выполнении его заданий.
2. СОГЛАСОВАННОСТЬ ИНТЕРФЕЙСА
Согласованность позволяет пользователям переносить имеющиеся знания на новые задания, осваивать новые аспекты быстрее, и благодаря этому фокусировать внимание на решаемой задаче, а не тратить время на уяснение различий в использовании тех или иных элементов управления, команд и т. д.
Например, если в одном диалоговом окне команда Копировать означает немедленное выполнение соответствующих действий, то в другом окне она не должна требовать от пользователя дополнительно указать расположение копируемой информации. Другими словами, используйте одну и ту же команду, чтобы выполнить функции, которые кажутся подобными пользователю.
Например, если для программного объекта Корзина определить операцию Запуск, то для уяснения ее смысла пользователю, скорее всего, потребуется посторонняя помощь.
3. ДРУЖЕСТВЕННОСТЬ ИНТЕРФЕЙСА
• ПРИНЦИП «ПРОЩЕНИЯ» ПОЛЬЗОВАТЕЛЯ
Пользователи обычно изучают особенности работы с новым программным продуктом методом проб и ошибок. Эффективный интерфейс должен принимать во внимание такой подход. На каждом этапе работы он должен разрешать только соответствующий набор действий и предупреждать пользователей о тех ситуациях, где они могут повредить системе или данным; еще лучше, если у пользователя существует возможность отменить или исправить выполненные действия.
Даже при наличии хорошо спроектированного интерфейса пользователи могут делать те или иные ошибки. Эти ошибки могут быть как «физического» типа (случайный выбор неправильной команды или данных) так и «логического» (принятие неправильного решения на выбор команды или данных). Эффективный интерфейс должен позволять предотвращать ситуации, которые, вероятно закончатся ошибками. Он также должен уметь адаптироваться к потенциальным ошибкам пользователя и облегчать ему процесс устранения последствий таких ошибок.
• ПРИНЦИП «ОБРАТНОЙ СВЯЗИ»
Всегда обеспечивайте обратную связь для действий пользователя. Каждое действие пользователя должно получать визуальное, а иногда и звуковое подтверждение того, что программное обеспечение восприняло введенную команду; при этом вид реакции, по возможности, должен учитывать природу выполненного действия.
Ничто так не смущает не очень опытного пользователя, как заблокированный экран, который никак не реагирует на его действия. Типичный пользователь способен вытерпеть только несколько секунд ожидания ответной реакции от своего электронного «собеседника».
4. ПРОСТОТА ИНТЕРФЕЙСА
Интерфейс должен быть простым. При этом имеется в виду не упрощенчество, а обеспечение легкости в его изучении и в использовании. Кроме того, он должен предоставлять доступ ко всему перечню функциональных возможностей, предусмотренных данным приложением.
5. ГИБКОСТЬ ИНТЕРФЕЙСА
Гибкость интерфейса — это его способность учитывать уровень подготовки и производительность труда пользователя. Свойство гибкости предполагает возможность изменения структуры диалога и/или входных данных.
6. ЭСТЕТИЧЕСКАЯ ПРИВЛЕКАТЕЛЬНОСТЬ
Корректное визуальное представление используемых объектов обеспечивает передачу весьма важной дополнительной информации о поведении и взаимодействии различных объектов. В то же время следует помнить, что каждый визуальный элемент, который появляется на экране, потенциально требует внимания пользователя, которое, как известно, не безгранично. Обеспечьте формирование на экране такой среды, которая не только содействовала бы пониманию пользователем представленной информации, но и позволяла бы сосредоточиться на наиболее важных ее аспектах.
Полноэкранные и многопанельные приложения
Интерфейс бывает двух видов – SDI (Single Document Interface - однодокументный интерфейс) и MDI (Multi Document Interface - многодокументный интерфейс).
SDI-приложения работают одновременно с одним документом (напр. Блокнот)
В SDI-приложениях окна могут быть двух видов - модальные и немодальные. Создаются они одинаково, разница заключается только в способе вывода этих окон на экран.
Модальное окно блокирует программу, не даёт с ней работать, пока вы это окно не закроете. Стандартный пример модального окна - окно "О программе", которое присутствует почти в любом приложении. Как правило, такое окно находится в меню "Справка". Пока вы не нажмете "ОК", закрыв это окно, вы не сможете работать с основной программой.
Немодальные окна позволяют переключаться между ними, и программой, и работать одновременно и там, и там. Немодальные окна могут быть открыты одновременно с основной программой, и не мешают её работе.
MDI-приложения могут содержать в себе несколько дочерних окон, каждое из которых может работать независимо от других. Классическим примером MDI-приложения является текстовый процессор WORD фирмы Microsoft. Запустив это приложение в работу, пользователь имеет возможность одновременной работы с несколькими документами, каждый из которых представляется самостоятельным дочерним окном.
Принципы построения интерфейсов
1. Золотое сечение
Золотое сечение - это самая комфортная для глаза пропорция, форма, в основе построения которой лежит сочетание симметрии и золотого сечения, способствует наилучшему зрительному восприятию и появлению ощущения красоты и гармонии.
В математике пропорцией называют равенство двух отношений: a:b=с:d.
Отрезок прямой АВ можно разделить точкой С на две части следующими способами:
- на две равные части АВ:АС=АВ:ВС,
- на две неравные части в любом отношении (такие части пропорции не образуют);
таким образом, когда АВ:ВС=ВС:АС.
Последнее и есть золотое деление или деление отрезка в крайнем и среднем отношении.
Золотое сечение - это такое пропорциональное деление отрезка на неравные части, при котором весь отрезок так относится к большей части, как сама большая часть относится к меньшей; или другими словами, меньший отрезок так относится к большему, как больший ко всему.
а:b=b:с или с:b=b:а.
Отрезки золотой пропорции выражаются бесконечной иррациональной дробью 0,618..., если с принять за единицу, а=0,382. Отношение же отрезков а и b составляет 1,618.
Прямоугольник с таким отношением сторон стали называть золотым прямоугольником. Он также обладает интересными свойствами. Если от него отрезать квадрат, то останется вновь золотой прямоугольник. Этот процесс можно продолжать до бесконечности. А если провести диагональ первого и второго прямоугольника, то точка их пересечения будет принадлежать всем получаемым золотым прямоугольникам.
Принцип золотого сечения был открыт людьми еще в глубокой древности. Знаменитые египетские пирамиды в Гизе, например, основаны на пропорциях золотого сечения. Более молодые мексиканские пирамиды и античный храм Парфенон также содержат в себе пропорцию 1,618.
С развитием дизайна и технической эстетики действие закона золотою сечения распространилось на конструирование машин, мебели и т. д. Проектирование компьютерных интерфейсов - не исключение. Формы диалоговых окон и элементов управления, стороны которых относятся как 1,618, очень привлекательны для пользователей. Например, очень много восторгов у пользователей программы Chameleon Clock (http://www.softshape.com) вызывает такая, казалось бы, обыденная вещь, как вид диалогового окна Свойства. А все потому, что при его проектировании использовался именно принцип золотого сечения.
2. Кошелек Миллера
Этот принцип назван так в честь ученого-психолога Г. А. Миллера, который исследовал кратковременную память, проверяя выводы, сделанные ранее его коллегой, Г. Эббингаузом. Эббингауз пытался выяснить, сколько информации может запомнить человек без каких-либо специальных мнемонических приемов. Оказалось, что емкость памяти ограничена семью цифрами, семью буквами или названиями семи предметов. Это "магическое число" семь, служащее своего рода меркой памяти, и было проверено Миллером, который показал, что память действительно в среднем не может хранить более семи элементов; в зависимости от сложности элементов это число может колебаться в пределах от пяти до девяти.
Если необходимо в течение короткого времени сохранить информацию, включающую больше семи элементов, мозг почти бессознательно группирует эту информацию таким образом, чтобы число запоминаемых элементов не превышало предельно допустимого. Например, номер банковского счета 30 637 402 710, состоящий из одиннадцати элементов, будет, скорее всего, запоминаться как 30 63 740 27 10, т. е. как пять числовых элементов, или восемь слов (тридцать, шестьдесят, три, семьсот, сорок, двадцать, семь, десять).
Применяя принцип кошелька Миллера в дизайне интерфейсов, следует группировать элементы в программе (кнопки на панелях инструментов, пункты меню, закладки, опции на этих закладках и т. п.) с учетом этого правила- т. е. не более семи в группе, в крайнем случае - девяти.
Итак, принцип кошелька Миллера говорит о семи плюс-минус двух элементах. Но если взглянуть на программы, интерфейс которых совершенствовался годами (тот же Microsoft Word), то можно заметить, что число объектов (пунктов меню, кнопок на панелях инструментов) в группах доходит до шести-семи довольно редко, а в основном элементы сгруппированы по три-четыре объекта. Такие небольшие группы объектов наиболее хорошо воспринимаются взглядом пользователя, уже слегка утомленного сложными интерфейсами современных программ.
3. Принцип группировки
Согласно этому правилу, экран программы должен быть разбит на ясно очерченные блоки элементов, может быть, даже с заголовком для каждого блока. При этом группировка, естественно, должна быть осмысленной: как расположение элементов в группах, так и расположение самих групп друг от друга должны быть продуманы.
Примеров реализации этого принципа очень много: это уже упоминавшиеся при разговоре о кошельке Миллера пункты меню, кнопочные панели инструментов, а также сгруппированные по назначению флажки и переключатели, с помощью которых настраиваются параметры работы программы в диалоговых окнах Свойства, Настройка и т. п..
4. Бритва Оккама или KISS
Философский принцип, носящий название "Бритва Оккама", гласит: "Не множить сущности без надобности". Или, как говорят американцы, KISS ("Keep It Simple, Stupid" - "He усложняй, болван").
На языке интерфейсов это означает, что:
- любая задача должна решаться минимальным числом действий;
- логика этих действий должна быть очевидной для пользователя;
- движения курсора и даже глаз пользователя должны быть оптимизированы.
5. Видимость отражает полезность
Смысл этого принципа состоит в том, чтобы вынести самую важную информацию и элементы управления на первый план и сделать их легкодоступными пользователю, а менее важную - переместить, например, в меню.
Отличие принципа "Видимость отражает полезность" как раз и состоит в том, что интерфейс программы должен быть построен вокруг объектов, с которыми манипулирует пользователь, и отражать состояние текущего объекта. Реализацию этого принципа вы видите каждый раз, когда пользуетесь компьютером: контекстные панели инструментов в программах пакета Microsoft Office, которые меняются в зависимости от того, с какой частью программы (редактором, предварительным просмотром, рисованием и т. п.) и данный момент работает пользователь.
6. Умное заимствование
Заимствование широко распространенных приемов дизайна интерфейсов и удачных находок авторов конкурирующих программ позволяет резко сократить время обучения и повысить комфорт пользователя.
Проектирование пользовательского интерфейса
Проектирование интерфейса представляет собой довольно сложный и многоэтапный процесс, каждый этап которого состоит в свою очередь из отдельных ступеней. В общем случае весь процесс можно представить в виде четырёх этапов, направленных на решение основной задачи — обеспечить оптимальное взаимодействие пользователя с системой:
Начало работ над проектом
На этом этапе определяются объёмы работ, планируются затраты и т. п. Длительность этого этапа, как правило, не превышает 5–8% от общего времени разработки. Для адекватной оценки ресурсов (времени, денег, количества специалистов) требуемых для разработки (пере- работки) интерфейса, необходимо хорошо представлять себе объём ин- формации, с которой следует ознакомиться. К ней относится информация о предметной области и прототипах. Она получается из литературных источников и опросов экспертов. Результатом этой работы является количественная оценка ресурсоёмкости проекта.
Чтобы предлагать адекватные интерфейсные решения, необходимо иметь ясное представление о предметной области системы. Предметная область изучается по литературе, кроме того, весьма полезны беседы с опытными пользователями, другими сотрудниками (эксперта- ми) для выяснения всех деталей и характеристик предметной области. Вместе с «жалобами» заказчика на текущую версию системы результаты этого этапа составляют основное содержание работы над проектом (экспертная оценка часто обнаруживает проблемы, которые заказчику не видны, маскируясь под другие). Проблемы, выявленные на данном этапе, должны быть решены в новом интерфейсе. Удачные решения желательно сохранить, чтобы имеющимся пользователям не пришлось переучиваться (и чтобы сократить затраты на переделку). По сути, этот этап завершается созданием перечня удачных и неудачных интерфейсных решений (основное внимание уделяется решениям неудачным). На этом этапе проводится юзабилити тестирование текущей версии интерфейса, и составляются краткие протоколы и перечень выводов исследования.
Постановка задачи. Сбор информации о разрабатываемом продукте
На этой стадии анализируют данные о пользователях, формализуется функциональность и определяются критерии оценки проекта.
Залогом успешного проектирования пользовательского интерфейса является наличие наиболее полной информации об аудитории пользователей: их целях, задачах, предпочтениях, привычках и представлениях, и о заказчиках. Чем более полная информация о продукте будет собрана и передана проектировщикам, тем более чёткое и правильное представление о его качествах будет у них сформировано и, соответственно, тем эффективнее будет проходить процесс разработки на всех последующих стадиях.
Данные о пользователях и о проекте должны содержать следующие позиции:
- характеристики пользователей: их опыт работы с компьютером, знание предметной области, мотивы, размер/важность групп пользователей, примеры (типовые ситуации) использования;
- цели и задачи пользователей;
- задачи проекта: что послужило причиной создания проекта, этапы создания проекта, какие результаты должны быть получены, какая информация необходима и когда;
- технология разработки и платформа, на которой будут работать пользователи;
- среда, в которой будет создаваться и использоваться проект (программная, физическая, рыночная, организационная и культурная).
Эта работа предполагает доступ к имеющимся и потенциальным пользователям системы, экспертам и проектной документации. На этом этапе разрабатываются пользовательские профили, модели пользователей. Обязательно должна присутствовать информация о субъективных ожиданиях пользователей системы. Без этого трудно или невозможно предугадать отношение пользователей к будущей системе. Поэтому должны быть описаны свойства, которым должен отвечать интерфейс для повышения субъективного удовлетворения, приведён перечень значимых для пользователей характеристик системы. Завершается эта часть работы описанием среды, в которой используется система, и основных характеристик ПИ. Характеристики ПИ отражаются в версии прототипа ПИ, которая на данном этапе будет, скорее всего, бумажной. Проводится юзабилити тестирование этой версии прототипа, и определяются скорость работы, количество человеческих ошибок, скорость обучения, субъективная удовлетворенность пользователей и т. д.
Иными словами, на данном этапе конкретизируются действительные цели проектирования нового интерфейса.
Необходимо чётко понимать, что пользователям не нужны инструменты сами по себе, нужны лишь результаты их работы. Никому не нужна программа обработки изображений — нужны уже обработанные изображения. Это значит, что пользователям просто нужно средство, делающее возможным выполнять определенную работу, достигнуть требуемого результата.
Высокоуровневое проектирование
Схематично работу на данном этапе можно представить, как показано на рисунке.
Сценарий пользователя — краткое, простое описание того, как пользователь пытается удовлетворить потребности с помощью разрабатываемого продукта. Представив процедуру, через которую могли бы пройти потенциальные пользователи, можно более точно выработать требования к программному продукту.
На основе выявленных сценариев работы осуществляется разработка структуры экранов, т. е. определяется количество экранов, функциональность каждого из них, навигационные связи между ними, формируется структура меню и других навигационных элементов.
По сути, на этом этапе выделяются отдельные функциональные блоки. Под функциональными блоками будем понимать функцию или группу функций, связанных по назначению или области применения — в случае программы, и группу функций/фрагментов информационного наполнения — в случае сайта.
Существует три основных вида связи между блоками:
- логическая связь;
- связь по представлению пользователей;
- процессуальная связь.
Логическая связь определяет взаимодействие между фрагментами системы с точки зрения разработчика. Полученные связи очень существенно влияют на навигацию в пределах системы (особенно когда система многооконная). Поэтому, чтобы не перегружать интерфейс, стоит избегать как слишком уж отдельных блоков (их трудно найти), так и блоков, связанных с большим количеством других.
Связь по представлению пользователей важна, потому что пользователи имеют своё мнение о системе, и это мнение должно быть отражено в интерфейсе. Известно, что самый распространенный способ поиска, а именно поиск по классификации признаков, работает только в том случае, когда пользователи согласны с принципами этой классификации. Многие понятия не могут быть достаточно чётко классифицированы из-за большого количества значимых признаков. Кроме того, проблема состоит в том, что субъективный классификационный при- знак может отличаться от общепринятого. Из этой ситуации существует простой выход — способ карточной сортировки. Все понятия, которые требуется классифицировать, пишутся на карточках из расчета «одно понятие — одна карточка». После чего группе пользователей из целевой аудитории предлагается рассортировать эти карточки (при этом каждый субъект получает свой набор карточек). Получившиеся стопки из карточек нужно разобрать на составляющие и свести результаты от разных субъектов в один способ классификации.
Процессуальная связь описывает взаимодействие, не обязательно логичное, но естественное для процесса. Установление процессуальной связи обычно довольно трудная задача, поскольку единственным источником информации является наблюдение за пользователем. В то же время установление такой связи дело исключительно полезное. Жёстко заданная связь позволяет также уменьшить количество ошибок.
На основе разработанной структуры экранов на этом этапе выбирается наиболее адекватная навигационная система и разрабатывается её детальный интерфейс. Навигационная система показывает механизм распределения функций и задач между окнами программы.
Структура справочной системы должна не просто описывать интерфейс, но и помогать пользователю решать его задачи. После разработки структуры экранов и навигации по ним составление соответствующей справочной системы обычно не вызывает трудностей.
Низкоуровневое проектирование
Низкоуровневое проектирование заключается в детальной проработке поставленных задач и в проверке качества разработанных решений.
Этапы низкоуровневого проектирования:
- проектирование основных экранов;
- юзабилити-тестирование;
- проектирование второстепенных экранов;
- финальное юзабилити-тестирование.
При проектировании основных экранов производится полное описание их интерфейса (без обработки исключительных ситуаций), организация информации на экранах. К отчёту прилагаются макеты экранов с описаниями функциональности каждого интерфейсного элемента. Разрабатывается презентационный или псевдореальный прототип ПИ, а в конце этого этапа прототип вполне может быть и реальным. При юзабилити-тестировании на основе критериев оценки ПИ и сценариев действий пользователей разрабатываются тестовые задания, которые выполняются пользователями на прототипе с фиксацией всех значимых характеристик деятельности (таких, как производительность труда, количество человеческих ошибок). После этого выполняется подсчет соответствующих показателей и сравнение их с заданными (или желаемыми). На основании полученных данных интерфейс либо орабатывается, либо считается разработанным. К второстепенным экранам относятся диалоговые окна и всевозможные сообщения. Их интерфейс полностью описывается, равно как описываются и исключительные ситуации, влияющие на интерфейс. При финальном юзабилити-тестировании на какой-то версии прототипа разрабатываются и выполняются тестовые задания, оставшиеся после предварительного тестирования. На основании полученных данных интерфейс либо дорабатывается, либо считается разработанным, т. е. это итерационная процедура (как и юзабилити-тестирование в целом).
