Информационный дизайн в разработке пользовательского интерфейса программных продуктов и web-сайтов




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

Введение

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

Информационный дизайн — один из подвидов дизайна, отвечающий за представление информации ( логические связи, компоновка, средства визуального представления)

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

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

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

Год-месяц-день
День-месяц-год
Месяц-день-год

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

MS Excell как и многие другие программные продукты не избежал указанной проблематики, что еще раз подчеркивает неисследованность данного направления даже для таких мощных корпораций как Microsoft. В Web среде в связи с быстрым развитием инфраструктуры проблематика конкретно ввода даты встречается на каждом динамическом сайте.

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

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

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

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

Психологический аспект явления

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

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

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

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

Теперь давайте рассмотрим такой пример:
Человек начиная работать с новым программным продуктом, особенно обладая устоявшимся стереотипом поведения для выполнения какой либо задачи, начинает чувствовать себя некомфортно.

Срок формирования нового рефлекса или привычки для человека составляет в среднем от 21 до 24 дней.

Процесс информационного дизайна.

В проведении первичного дизайна или редизайна программной системы или сайта нет ничего сложного достаточно выполнить ряд последовательных этапов описанных ниже.

1. Составить пользовательские требования

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

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

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

Во вторых необходимо произвести среди них сбор данных

Есть 2 пути для получения данных: опрос пользователей или наблюдение

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

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

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

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

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

2. Составить функциональный набор

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

В этой таблице размещается информация о всех функциях уровня пользователя необходимых для работы системы.

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

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

3. Определить характеристики потенциальных пользователей

Необходимо ввести классификацию пользователей желательно в форме таблицы или диаграммы разбив их на классы (оператор, администратор, наблюдатель)

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

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

4. Написать пользовательские сценарии

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

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

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

5. Оптимизировать пользовательские сценарии

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

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

6. Разработать структуру интерфейса

Обладая набором оптимизированных пользовательских сценариев дизайнер разрабатывает структуру интерфейса будущего программного продукта или сайта.

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

При разработке интерфейса необходимо помнить:

a. Меню не должно содержать более 5-7 элементов на одном уровне.

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

c. Группировка элементов управления осуществляется согласно функциональной принадлежности

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

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

f. В идеальном варианте доступ к любой функциональной возможности требует от пользователя не более 2-х кликов или нажатий клавиш.

7. Описать и разработать нестандартные элементы управления

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

Стоит помнить о том, что введение нестандартных элементов интерфейса можно считать обоснованным в случае если они:
1. Дублируют физические, привычные пользователю сущности (управление Winamp)
2. Обладают интуитивно понятными внешним видом и функциями

8. Провести тестирование на фокус группе

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

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

Выводы

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

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

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

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







С этим читают так же:

Вы можете пропустить до конца и оставить ответ. Диагностики в настоящее время не допускается.

Написать комментарий