Прототипирование — это один из этапов разработки, который заключается в продумывании содержания и расположения важных элементов интерфейса.
5 лет назад в нашей компании вообще не использовалось прототипирование. Еще 2 года назад прототипирование использовалось для внутренних задач и делалось после составления технического задания и оценки проекта. Сейчас прототипирование информационной системы делается до технического задания и выполняет несколько функций.
Основная задача проектирования
Основной задачей проектирования информационной системы является сокращение разницы между ожиданиями клиента и конечным результатом. На это нацелены все этапы проектирования, в том числе составление технического задания и его формат, анализ требований, бизнес-анализ и прототипирование. Не путать с целью — ей будет повышение эффективности бизнес-процессов.
В производство систем автоматизации бизнеса процесс прототипирования был позаимствован из разработки сайтов. Там он выполнял ту же функцию: чтобы заказчик на ранних стадиях понимал, как будет выглядеть сайт, где и какие элементы будут расположены. От прототипа отталкивался дизайнер при производстве дизайна сайта.
При разработке информационной системы проектирование выполняет ту же функцию. Учитывая особенность нашей работы, а именно индивидуальную разработку, заказчику очень важно визуально представлять, что же он получит в итоге. Сколько бы мы не пробовали подробнейшим образом описать в техническом задании интерфейсы, местоположение и вид элементов, но при презентации информационной системы у клиента всегда возникало очень большое количество вопросов, связанных с ожиданиями, что “будет по-другому”. Да, то что сделано — это классно, но вот эти элементы лучше переместить в другое место, порядок полей поменять, а вон то лучше не всплывающим окном, а страницей.
Это видение заказчика, и оно обосновывается тем, что в данном конкретном случае есть все основания для того, чтобы расположить элемент в другом месте, и это справедливо. Однако, разработчики узнают об этом, когда система уже сделана. Это и есть Diff (от слова different) — разница между ожиданиями клиента и тем, что получилось (то, что описано в техническом задании, а теперь и в прототипах). Сократить эту разницу — это и есть основная задача процесса прототипирования.
На ранних стадиях при первом приближении прототипирование выполняется менеджером проекта вместе с клиентом, чтобы вообще понять общее количество интерфейсов и примерное расположение и количество элементов.
Этапы прототипирования
Проектирование проекта происходит постепенно. Определенными этапами, каждый из которых выполняет свою задачу. Проектирование включает в себя три этапа, однако иногда, в зависимости от проекта, третий этап может быть исключен из процесса. Мы называем этот этап дизайном. Трудозатраты на каждый последующий этап становятся больше по сравнению с предыдущим, то есть каждый последующий этап требует больше сил и времени.
Предварительное прототипирование
Данный процесс выполняется менеджером проекта при участии клиента. Задача данного этапа — синхронизировать понимание количества интерфейсов, а также количество и особенности структурных элементов в этих интерфейсах. Задача данного процесса — выявление слепых пятен проекта, о которых менеджер проекта не знает, а заказчик предполагает, что это будет по умолчанию или наоборот, он не понимает их значимости.
Например, у нас есть информационная система по управлению и распределению задач между сотрудниками, где задачи привязываются к проектам и назначаются на ответственных лиц. Вопрос: “А где типы задач? Задачи должны делиться на типы”. Этот вопрос может возникнуть тогда, когда заказчик увидел схему интерфейса на этапе предварительного проектирования, заметив, что нет выбора типа задачи в карточке задачи. Или когда система уже оценена, изготовлена и сдается. Во втором случае это приводит к дополнительным работам: созданию справочника типов задач, изменению интерфейса задачи, разработке списка задач, добавлению фильтров и так далее.
Согласование с заказчиком предварительных прототипов, в отличие от второго этапа, выполняется, как правило, только в части спорных вопросов. Есть простые разделы, например справочники, на которые нет смысла тратить время заказчика и это не принесет пользу проекту. А вот индивидуальные интерфейсы, которые делаются специально под задачу, должны согласовываться и обсуждаться в обязательном порядке.
Предварительное проектирование выполняет также вторую функцию — информация для дизайнера.
Прототипирование интерфейса дизайнером
У нас прототипированием информационных систем занимается дизайнер пользовательских интерфейсов. Для создания прототипов у дизайнера должна быть вводная информация. Этой информацией являются согласованные с клиентом предварительные прототипы.
Результат данного этапа — прототипы, которые подлежат обязательному согласованию с клиентом. Они имеют вид черно-белой схемы, в которой показывается расположение элементов, полей и кнопок в виде, сильно приближенном к будущей информационной системе. Иногда этот вид отличается только наличием или отсутствием цвета.
Прототипы могут быть как в виде изображений, так и в виде ссылки на интерактивный проект, в котором уже можно нажать на какой-то элемент или пункт меню и перейти в нужный раздел или вызвать окно. В последнее время мы предоставляем преимущественно второй вариант, так как он более удобен заказчику для ознакомления с интерфейсами будущей информационной системы.
Задач у результата данного этапа (прототипов этого вида) две. Первая — полное представление заказчиком будущей системы, её интерфейсов, наличия или отсутствия функционала. Вторая — при отсутствии третьего этапа (дизайна) — это дополнительное руководство для работы над проектом для Front-end инженера (разработчика, отвечающего за создание и функционирование интерфейсов).
Дизайн интерфейса
Данный этап самый трудозатратный по отношению к предыдущим. Необходимость его создания зависит от двух факторов. На основании результатов прошлого этапа у заказчика есть четкое понимание того, что будет в системе, у менеджера проекта есть полное видение всех участников процесса для составления технического задания, а у программистов есть схема интерфейса и расположения элементов. Зачем же нужен еще и дизайн?
Данный этап используется, если заказчик имеет четкое требование увидеть 1 в 1 то, что он получит, в цвете, с попиксельно выверенными отступами. Второй случай, когда необходим дизайн интерфейса — это если интерфейсы используются пользователями вне организации заказчика. То есть, внешними пользователями. Тогда информационная система носит некий функционал сайта с авторизацией. Частым примером этого являются разного рода личные кабинеты на сайтах. Даже если личный кабинет архитектурно и технически не является частью сайта, он должен соответствовать его дизайну, чтобы пользователи находились в визуально идентичной среде. Также дизайн выполняется тогда, когда информационная система сильно отличается по оформлению управляющих элементов, полей, панелей, окон, меню. В этих случаях данный процесс необходим не только заказчику, но и программистам для детализации создания интерфейсов.
Для чего так много прототипирования
Данный процесс, включая описанные этапы, нацелен на эффективность. В общем процессе проектирования, создании системы автоматизации и её внедрении в организации данный процесс сокращает трудозатраты на то, чтобы получить качественный итоговый результат.
Постепенное, пошаговое приведение интерфейсов к четкому пониманию заказчиком и наличие четкой инструкции (в виде прототипов интерфейсов) у разработчиков помогает:
В разы сократить количество необходимых доработок проекта, чтобы получить ожидаемый результат
- Сократить трудозатраты разработчиков на создание интерфейсов
- Сократить время составления технического задания и количество корректировок
- Улучшить понимание проекта заказчиком, в том числе понимание им технического задания
- Не упустить то, что необходимо проекту, заметить отсутствие необходимого функционала вовремя