Принципы проектирования пользовательского интерфейса

    Тема: Принципы проектирования пользовательского  интерфейса

  1. Определение интерфейса, виды интерфейсов

2.Классификация  интерфейсов пользователя

3. Основные этапы разработки интерфейса 

1 Определение интерфейса, виды интерфейсов

Взаимодействие  оператора с вычислительной машиной является важным звеном вычислительного процесса при решении различных прикладных задач как научного, так и производственного плана. Создание программ в области организации рыночных отношений при создании информационных сайтов различных организаций и предприятий, при создании программ управления производственными процессами, учета выпускаемой продукции и ее реализации, управления качеством и даже при такой задаче, как сортировка электронной почты секретарем, требуется разработка удобного для пользователя взаимодействия с ЭВМ.  

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

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

    Интерфейс распространяется на все логические и физические средства взаимодействия вычислительной системы с внешней средой, например с операционной системой, с оператором и т.п.

    Виды  интерфейсов

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

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

    Различают два варианта организации  внутри машинного интерфейса:

    - многосвязный интерфейс, при котором каждый блок ПК связан с другими блоками своими локальными проводами;

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

2. Внешний интерфейс – система связи системного блока с периферийными устройствами ЭВМ или с другими ЭВМ

      Здесь можно выделить  также несколько типов внешнего интерфейса:

    - интерфейс периферийных устройств, подключаемых с помощью шин ввода-вывода (ISA, EISA, VLB, PCI, AGP, USB IEEE 1384 SCSI и др.);

    - сетевой интерфейс, типа одноранговой сети или сети клиент-сервер с топологиями типа звезда, кольцевая или шинная.

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

    Интерфейс является ориентированным на человека, если он отвечает нуждам человека и учитывает его слабости.

    Машинная  часть интерфейса – часть интерфейса, реализованная в машине (аппаратно-программной ее части) с использованием возможностей вычислительной техники.

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

    Наиболее  распространенные интерфейсы определены государственными и международными стандартами. 

    2.Классификация интерфейсов пользователя

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

    Различают три вида интерфейсов  пользователя: командный, WIMP и SILK – интерфейсы.

    Взаимодействие  перечисленных интерфейсов с операционными системами и технологиями показано на рис.1: 

      

    Рис. 1. Взаимодействие интерфейсов пользователя их технологий и операционных систем. 

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

        Пакетная  технология.

    Исторически этот вид технологии появился первым на электромеханических  вычислительных машинах К. Цюзе, Г. Айкина, а затем на электронных вычислительных машинах Эккерта и Моучли, на отечественных ЭВМ Лебедева, Брусенцова, на ЭВМ IBM-360, на ЕС ЭВМ и так далее. Идея его проста и состоит в том, что на вход компьютера подается последовательность программ, набитых, например, на перфокартах и последовательность символов, определяющих порядок выполнения этих программ. Человек здесь имеет малое влияние на работу машины. Он может лишь приостановить работу машины, сменить программу и снова запустить ЭВМ.

        Технология  командной строки.

    При этой технологии в качестве способа ввода информации оператором в ЭВМ служит клавиатура, а компьютер выводит информацию человеку с помощью алфавитно-цифрового дисплея (монитора). Комбинацию монитор-клавиатура стали называть терминалом или консолью. Команды набираются в командной строке, представляющей собой символ приглашения и мигающий курсор, при этом набранные символы можно стирать и редактировать. По нажатию клавиши  «Enter» («Ввод») ЭВМ принимает команду и начинает ее выполнять. После перехода в начало следующей строки компьютер выдает на монитор результаты своей работы. Наиболее распространенным командный интерфейс был в операционной системе MS DOS.

    2. ООМУ (окно, образ,  меню, указатель)  WIMP (window, image, menu, pointer) - интерфейс. Характерной чертой этого интерфейса является то, что диалог пользователя с компьютером ведется не с помощью командной строки, а с помощью окон, графических образов меню, курсора и других элементов. Хотя в этом интерфейсе подаются команды машине, но это делается через графические образы.

    Идея  графического интерфейса зародилась в средине 70-х годов в исследовательском центре фирмы Xerox Palo Alto Research Center (PARC). Предпосылкой графического интерфейса явилось уменьшение времени реакции компьютера на команду, увеличение объема оперативной памяти, а также развитие элементной базы, технических характеристик ЭВМ и в частности мониторов. После появления графических дисплеев с возможностью вывода любых графических изображений различного цвета графический интерфейс стал неотъемлемой частью всех компьютеров. Постепенно проходил процесс унификации в использовании  клавиатуры и мыши прикладными программами. Слияние этих двух тенденций привело к созданию такого пользовательского интерфейса, с помощью которого при минимальных затратах времени и средств на переучивание персонала можно работать с любыми программными приложениями

    Этот  вид интерфейса реализован в виде двух уровней:

    - простой  графический интерфейс;

    - полный  WINP – интерфейс.

    Простой графический интерфейс, который на первом этапе очень походил на технологию командной строки со следующими отличиями:

    - при отображении  символов с целью  повышения выразительности изображения допускалось выделение части символов цветом, инверсным изображением, подчеркиванием и мерцанием;

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

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

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

    - широкое использование  цветных мониторов.

    Появление простого графического интерфейса  совпадает  с широким распространением операционной системы MS DOS. Типичным примером его использования является файловая оболочка Norton Commander и текстовые редакторы MaltiEdit, ChiWriter, Microsoft Word для DOS, Лексикон и др.

    Полный  WIMP-интерфейс, явился вторым этапом развития графического интерфейса, который характеризуется следующими особенностями:

    - вся работа с  программами, файлами  и документами  происходит в окнах;

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

    - все действия с  объектами осуществляются  с помощью меню, которое становится  основным элементом управления;

    - манипулятор выступает  в качестве главного  средства управления.

    Следует отметить, что WIMP-интерфейс требует для своей реализации повышенного требования к производительности компьютера, объему его памяти качественного растрового цветного дисплея программного обеспечения, ориентированного на этот вид интерфейса. В настоящее время WIMP-интерфейс стал стандартом де-факто, а операционная система Microsoft Windows стала ярким его представителем.

    3. РОЯЗ (речь, образ,  язык, знания) SILK (speech, image, language, knowledge) - интерфейс. Этот интерфейс наиболее приближен к обычной человеческой форме общения. В рамках этого интерфейса идет обычный разговор человека и компьютера. При этом компьютер находит для себя команды, анализируя человеческую речь и находя в ней ключевые фразы. Результаты выполнения команд он также преобразует в понятную человеку форму. Этот вид интерфейса требует больших аппаратурных затрат, поэтому находится в стадии разработки и совершенствования  и используется пока только в военных целях.

    SILK- интерфейс для общения человека с машиной использует:

    - речевую  технологию;

    - биометрическую  технологию (мимический интерфейс);

    - семантический  (общественный) интерфейс. 

    Речевая технология появилась в середине 90-х годов после появления недорогих звуковых карт и широкого распространения технологий распознавания речи. При этой технологии команды подаются голосом путем произнесения специальных стандартных слов (команд), которые должны выговариваться четко, в одном темпе с обязательными паузами между словами. Учитывая, что алгоритмы распознавания речи недостаточно развиты, требуется индивидуальная предварительная настройка компьютерной системы на конкретного пользователя. Это простейшая реализация SILK- интерфейса.

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

    Семантический (общественный) интерфейс возник еще в конце 70-х годов ХХ века, с развитием искусственного интеллекта. Его трудно назвать самостоятельным видом интерфейса, так как он включает в себя и интерфейс командной строки, и графический, и речевой, и мимический интерфейсы. Основной его особенностью является отсутствие команд при общении с компьютером. Запрос формируется на естественном языке, в виде связанного текста и образов. По сути - это моделирование общения человека с компьютером. В настоящее время используется для военных целей. Такой интерфейс крайне необходим в обстановке ведения воздушного боя.

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

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

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

    3. Основные этапы разработки интерфейса

    В процессе разработки интерфейса можно выделить три основных этапа, а именно:

    * первоначальное проектирование,

    * создание прототипа

    *тестирование/модификация прототипа.

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

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

    Документация  есть часть интерфейса, причем в сложных  системах – большая  часть 

    3.1. Первоначальное проектирование

    Проектирование состоит из следующих этапов:

    1. Определение необходимой функциональности  системы.

    2. Создание пользовательских сценариев.

    3. Проектирование общей структуры.

    4. Конструирование отдельных блоков.

    5. Создание глоссария

    6. Сборка и начальная проверка  полной схемы системы.

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

    Определение необходимой функциональности системы

    Результат. В конце этого этапа должна получиться примерно такая схема (Рисунок 2). 

    

 

    Рис. 2. Пример общей схемы. Прямоугольник  обозначает отдельный экран, прямоугольник  со скругленными углами – область  экрана, пунктирная линия – альтернативное действие. Обратите внимание, что в этой схеме интерфейс заставляет пользователя выполнять задачу в сугубо определенной последовательности. 

      3. Построение прототипа

      Итак, первый этап пройден. У вас есть полная схема, описывающая всё взаимодействие пользователя с системой. Настало время делать прототип системы для тестирования. При создании прототипа наиболее частой ошибкой является чрезмерное наведение глянца и вообще стремление сделать прототип возможно более похожим на результирующую систему. В самом таком подходе нет ничего плохого (всё равно определенные части прототипа приходится делать максимально совершенными), проблема в том, что в большинстве случаев прототип после тестирования оказывается неправильным. Его приходится переделывать, причем иногда полностью, при этом все инвестированные в прототип ресурсы оказываются выброшенными на ветер.

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

      Итак, как быстрее и дешевле построить  прототип?

      Первая  версия. Бумажная

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

      Вторая  версия. Презентация

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

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

      Фактически  для большинства систем этой версии оказывается достаточно.

      Третья  версия

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

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

      Четвертая версия

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

      4. Тестирование и модификация прототипа

      Вообще, слушать потребителей обычно неправильно. Разве мы спрашиваем канарейку, в какой  клетке она хочет  жить? Сюжет проамериканский  автопром, например, стал уже частью истории  бизнеса: все американские потребители в семидесятых годах дружно утверждали, что они хотят большие, мощные машины, при этом так же дружно покупая маленькие и маломощные японские автомобили. Или другой пример – в советское время измученные коммунизмом люди мечтали вовсе не об отпуске на Тенерифе, о котором они ничего не знали, но о финском хромированном смесителе, который поставил себе сосед – хотя Тенериф, безусловно, в качестве мечты интереснее.

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

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

      Собственно  тестирование

      Технически  сеанс тестирования довольно прост. Нужно иметь несколько пользователей, которые ни разу не видели текущего состояния системы. За исключением  редких случаев, когда ваша система  рассчитана на продвинутых пользователей (power user), нужно подбирать не слишком опытных субъектов. Тестерам дается задание, они его выполняют, после чего результаты анализируются.

Принципы проектирования пользовательского интерфейса