Лекция 14.

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

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

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

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

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

Согласно исследованиям, проведенным компанией Xerox и ее сотруднику Дэвиду Лиддлу, пользовательский интерфейс состоит из следующих основных компонентов, представленных в виде айсберга.

Согласно данному исследованию, интерфейс состоит из трех основных частей - подачи информации пользователю, взаимодействию и взаимосвязям между объектами. При этом «видимая» часть айсберга значительно меньше его «невидимой», скрытой части (слайд 14.2). Верх айсберга - информация для пользователей (цвет, анимация, звук, форма объектов, расположение информации на экране, графика) составляет всего 10% и является отнюдь не самой важной составляющей пользовательского интерфейса. Следующая часть пользовательского интерфейса (30% модели проектировщика) - это техника общения с пользователем и обратная связь с ним. И, наконец, нижняя часть айсберга (60%) модели проектировщика - наиболее важная его часть - это свойства объектов и связи между ними.

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

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

Для создания у пользователя такого ощущения «внутренней свободы» интер­фейс должен обладать целым рядом свойств (слайд 14.4) :

Естественность интерфейса.

Согласованность интерфейса.

Дружественность интерфейса (Принцип «прощения пользователя»)

Принцип «обратной связи».

Простота интерфейса.

Гибкость интерфейса.

Эстетическая привлекательность.

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

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

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

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

Согласованность в пределах рабочей среды. Поддерживая согласованность с интерфейсом, предоставляемым операционной сис­темой (например, ОС Windows), пользовательское приложение может «опираться» на те знания и навыки пользователя, которые он получил ранее при работе с другими приложениями.

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

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

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

Принцип «обратной связи». Необходимо всегда обеспечивать обратную связь для действий пользователя. Каждое дей­ствие пользователя должно получать визуальное, а иногда и звуковое подтверж­дение того, что программное обеспечение восприняло введенную команду; при этом вид реакции, по возможности, должен учитывать природу выполненного действия.

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

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

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

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

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

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

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

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

Метафорический принцип положен и в основу технологии WISIWIG - немедленную визуализацию на экране результатов действий. Это означает, что экран должен имитировать средства полиграфической печати, и если пользователь хочет напечатать часть текста курсивом, то он и на экране должен быть набран курсивом. Если файл уничтожается, то пользователь видит, что файл исчезает из изображенного на экране списка файлов. Интерфейс в естественной форме обеспечивает пользователя информацией о состоянии объекта, подтверждая, что действие было выполнено. Можно сказать, что эта метафора более точно соответствует формуле «Ты видишь то, что получил в результате своих действий» .

Гибкость интерфейса. Гибкость интерфейса - это его способность учитывать уровень подготовки и производительность труда пользователя. Свойство гибкости предполагает возможность изменения структуры диалога и/или входных данных. Концепция гибкого (адаптивного) интерфейса в настоящее время является одной из основных облас­тей исследования взаимодействия человека и ЭВМ. Основная проблема состоит не в том, как организовать изменения в диалоге, а в том, какие признаки нужно использовать для определения необходимости внесения изменений и их сути.

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

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

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

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

Скорость решения задачи с помощью данного приложения; при этом должнооцениваться не быстродействие системы и не скорость ввода данных с клавиатуры, авремя, необходимое для достижения цели решаемой задачи. Исходя из этого, критерий оценки по данному показателю может быть сформулирован, например, так: пользо­ватель должен обработать за час не менее 20 документов с ошибкой не более 1 %.

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

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

Формализация контекста использования

Формализация объективных критериев успеха

Анализ целей

Формализация бизнес-ролей пользователей

Формализация функциональности

Формализация сценариев действий пользователей

Обзор интерфейса конкурирующих систем

Формализация привычек и ожиданий пользователей

Формализация контекста использования

На этом этапе собирается большинство сведений о пользователях. Описываются следующие свойства аудитории системы:

Характеристики пользователей: их опыт работы с компьютером, знание предметной области, мотивы, размер/важность групп пользователей, образцы (типовые ситуации) использования;

Цели и задачи пользователей;

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

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

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

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

На выходе: описание контекста использования системы, возможно более детальное описание свойств пользователей.

наверх к оглавлению

Формализация объективных критериев успеха.

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

Соответственно, на данном этапе создается реальное задание на проектирование интерфейса. Например:

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

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

на 20% снизить количество человеческих ошибок.

На входе: доступ к пользователям, экспертам и проектной документации.

На выходе: список объективных критериев успеха.

наверх к оглавлению

Анализ целей

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

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

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

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

На входе: доступ к пользователям, экспертам и проектной документации

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

наверх к оглавлению

Формализация бизнес-ролей пользователей

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

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

Обычно есть несколько разных способов реализации одной и той же функции. Анализ действий пользователей как раз и позволяет определить, какой именно способ следует реализовать. Поскольку на этом этапе мы узнаём, какая именно функциональность нужна для каждой бизнес-роли, можно избрать верный путь по правилу «чем меньше действий требуется от пользователя, тем лучше».

На выходе: описание бизнес-ролей пользователей.

наверх к оглавлению

Формализация функциональности

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

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

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

наверх к оглавлению

Формализация сценариев действий пользователей

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

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

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

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

Андрей Фёдорович делает активным окно уже открытой почтовой программы и включает процесс скачивания новой почты. Получив почту, он ее читает. Одно сообщение он пересылает другому адресату, после чего удаляет его, а еще одно печатает. После чего переключается на другую задачу.

Пришло новое сообщение, и системный администратор Андрей воспринимает соответствующий индикатор. Он делает активным окно почтовой программы и открывает полученное сообщение. Он читает его, после чего перемещает его в другую папку. После чего переключается на другую задачу.

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

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

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

наверх к оглавлению

Обзор интерфейса конкурирующих систем

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

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

На входе: доступ к конкурирующим системам.

На выходе: обзор преимуществ и недостатков интерфейса конкурирующих систем.

наверх к оглавлению

Формализация привычек и ожиданий пользователей

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

На входе: доступ к пользователям.

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

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

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

Так что же делать, чтобы начать проектировать?

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

Без опыта и ответа на вопрос «С чего начать?» возникает страх. Что-то новое делать боязно, но и бесконечно сидеть без дела смысла нет. Первый блин все равно будет комом. Не бойтесь говорить о своем первом опыте. Любой интерфейс, который вы сделали, — будь он даже ужасен — все равно можно использовать.

Создаем истории

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

Чтобы понять, что мы имеем в виду под термином «история», давайте представим: Максим становится клиентом автосалона «Звезда Невы» — он купил себе новый автомобиль. При заключении договора в офисе компании сотрудники автосалона сообщают ему о существовании онлайн-системы для клиентов, где он может видеть свои платежи, оплаты по кредиту, напоминания про технический осмотр и страховку, а также новости автосалона.

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

При входе в систему Максим видит свой первый платеж в автосалоне, характеристики своего автомобиля, документы на авто, имя своего менеджера. Если его покупка попадает под действие какой-либо промоакции, то он увидит в системе оповещение об условиях акции (например, бесплатная мойка автомобиля класса «люкс» в течение августа).

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

Без истории нет ни продукта, ни проекта, ни интерфейса. А связный рассказ позволит объяснить поведение пользователя и понять, чего ему не хватает.

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

Жгите глаголом

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

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

Дайте поиграть!

Популярные грабли, на которые можно наступить, — это сказать «к черту теорию, дайте поиграть!». Конечно, это тоже способ научиться проектировать: осваиваем инструмент и по ходу дела получаем навык. Но проблема в том, что инструмент не позволит решить задачу правильно, в этом обычно помогают знания и опыт. И, чтобы вы не тратили время на перебор программ, коротко расскажем о них.

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

Предложенное деление не является универсальным. Каждый из этапов можно поделить на подэтапы. И на под подэтапы - так процесс выглядит еще сложнее, а значит дороже в глазах клиентов:-)

1. Сбор данных

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

• общается с клиентом , чтобы понять смысл и философию программы;
• смотрит наработки : готовые прототипы (пусть даже они существуют только на салфетке);
• анализирует программы конкурентов (и, возможно, проводит тестирование юзабилити программ конкурентов);
• проводит структурированные интервью с клиентами или потенциальными клиентами.

2. Проектирование

На этом этапе разработки интерфейса программы дизайнер:

• определяет сетку, цвета, шрифты и фон;
• а также часто создает нестандартные элементы управления, такие как выпадающие меню.

Естественно, на каждом из этапов идет обсуждение и, при необходимости, бесплатная доработка. Ваш заказ вы получите либо в качестве графических файлов в формате Photoshop , либо в виде HTML- или XAML-кода .

4. Имплементация

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

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

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

5. Юзабилити-тестирование

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

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

• быстро : 2-7 дней на тест;
• дешево - на один-два порядка дешевле, чем большие исследования;
• в рамках вашей целевой аудитории . Мы ее найдем. Вам нужны американцы со среднего запада 30-55 лет, заинтересованные в русских невестах? Пожалуйста.

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

Сроки

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

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

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

Стоимость

Проектирование и дизайн одного экрана также стоят одинаково:

• проектирование/дизайн первого экрана стоит 48 800 р . Первый экран стоит дороже, поскольку является определяющим для всего приложения. При его разработке мы должны учитывать структуру всего приложения;
• проектирование/дизайн остальных экранов – 18 350 р . за каждый.

Таким образом, разработка прототипа (или дизайна) пяти экранов будет стоить 48 800р.+18 350р. х 4 = 122 200р.

Ориентировочная стоимость юзабилити-тестирования 52 500р. – 126 000р.

Большие проекты

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

• интерфейс голосового общения;
• интерфейс общения с видео;
• управление списком контактов;
• и так далее.

Для каждого из перечисленных модулей целесообразно пройти через все этапы , затем перейти к следующему модулю. Такой метод разработки называется Agile (читается "эджайл"). Эту методологию принято уважать и упоминать каждый раз, когда хочешь произвести впечатление на клиентов и красивых девочек:-)

Я хотел бы дать вам простой, но парадоксальный совет: не верьте всему, что говорят про проектирование.

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

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

Миф № 1. Проектирование - это дополнительная услуга

Проектировщик, занятый важным общественно-полезным делом

Многие считают, что этап проектирования - это дополнительная услуга, которой можно пренебречь. Это не так.

Ради чего мы создаем IT-продукты? Если мы находимся в своём уме и доброй памяти, мы создаем их ради решения бизнес-задач (своих собственных или своих клиентов - не так важно); решение этих бизнес-задач, в свою очередь, опирается на выполнение создаваемым продуктом задач пользователей с учётом условий рынка, технологических ограничений и всего прочего.

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

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

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

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

Миф № 2. Проектирование стоит дорого

Менеджер проекта выколачивает бюджет из заказчика

Бытует мнение, что этап проектирования только удорожает продукт.

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

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

Сорок процентов - и это для Америки, где царят совершенно иные отношения между заказчиком и разработчиком! Для России, мне кажется, эта цифра ещё выше - раза эдак в полтора.

При этом правильное системное проектирование, по подсчётам того же Вигерса, отнимает 15-20% бюджетов на разработку (и эта цифра полностью подтверждается нашим опытом).

Получается интересный эффект: мы тратим фиксированные 15-20% на проектирование, но при этом сводим к минимуму «пустые» траты (те самые 40% бюджета), которые потенциально могут похоронить проект и, к тому же, чрезвычайно затягивают сроки получения работоспособного продукта.

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

Миф № 3. Проектирование - это написание ТЗ

Слон, сделанный по ТЗ

Часто приходится слышать, что проектирование - это процесс написания ТЗ, который можно приложить к договору. Это не так.

Как мы выяснили в ходе разбора предыдущего мифа, проектирование минимизирует риски разработки. Вы будете смеяться, но это и является единственным и главным его назначением - всё остальное гармонично проистекает из этого факта:

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

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

Миф № 4. Проектирование - это про пользовательские интерфейсы

Продукт с продуманным дружественным интерфейсом

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

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

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

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

Миф № 5. Проектировать может и менеджер

Менеджер, занятый профильной активностью

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

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

В больших проектах и, в частности, в заказной разработке это играет с менеджерами очень злую шутку: если менеджер встаёт перед дилеммой решить проблему, связанную с проектом в целом (например, вытащить дизайнера из запоя - совершенно реальная история, кстати), либо решить проблему, связанную с проектированием (более детально прописать протокол данных в ТЗ), то любой менеджер выберет решение, которое потушит пожары, бушующие здесь и сейчас. В самом деле - недоработанное ТЗ скажется где-то на дальней перспективе, а вот вовремя не потушенный проектный пожар приведет к потере проекта прямо в текущий момент. Да и, в конце концов, как можно спокойно писать ТЗ, когда тебя постоянно отвлекают клиенты по мелочам?

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

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

Миф № 6. Проектированием должны заниматься психологи

Техническое содержание продукта по версии психолога

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

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

Миф № 7. Проектирование должны заниматься инженеры

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

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

Кто же такой проектировщик?

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

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

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

Но такие люди есть - и именно для их поиска и формирования я создал в свое время Гильдию вольных проектировщиков, и это тоже отдельная тема для разговора.

Единого подхода к проектированию не существует

Проектировщик не выдерживает накала страстей на проекте

Подходов к проектированию много, и неискушенный читатель может запросто сойти с ума от обилия приемов, подходов и аббревиатур, щедро сдобренных терминологическим бардаком (всеми этими UX, UI, CX, HCD и прочими IDDQD с кривыми русскоязычными аналогами).

Некоторые, впрочем, пытаются вывести универсальные модели проектирования, но в итоге получается так, что в попытке объединить существующие 20 (условно) подходов к проектированию мы получаем в итоге 21 подход - и методологии, как кажется, начинают плодить самих себя.

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

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

Вместо заключения

Итак, что мы с вами сегодня выяснили?

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

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