Техпроцесс работы дизайнера-проектировщика интерфейсов

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

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

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

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

Для улучшения качества продукта или услуги  количество этапов увеличивается, и могут появляться новые профессии.

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

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

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

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

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

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

Данные о технологическом процессе я брал из изученной литературы, собственного опыта и опыта работы других компаний. Лучше всего в русском сегменте технологический процесс описывает компания «UI Modeling Company» и показывает реализацию на примерах, часть реализуемых этапов я взял с их сайта.

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

 

1. Предпроектный анализ (исследование)

- видение проекта: описание целей и задач

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

- если проект существует и необходимо изменение проекта: анализ данных статистики (Google Analytics, Яндекс.Метрика и др.), проведение юзабилити тестирования

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

- описание целевой аудитории (персонажи)

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

- карта проекта (краткая)

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

- краткие сценарии взаимодействия

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

 

2. Предпроектный анализ (сбор требований)

- Анализ и описание существующих и создаваемых бизнес-процессов

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

- Интервью

Проводятся интервью с целевой аудиторией, заинтересованными лицами.

- Сценарии взаимодействия подробные

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

- Подробная карта проекта и схема навигации

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

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

- Диаграммы переходов между страницами

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

- Перечень функциональности

подробный список того, что пользователь может делать в системе. Вся функциональность будущего продукта разбивается на простейшие возможности в виде «<кто> <что делает> <с чем>»

- Сбор данных

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

 

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

Создание чернового прототипа или прототипа с существующими элементами интерфейса

wireframe — это еще не дизайн, но уже основа для него, по сути является техническим заданием для дизайнера.

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

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

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

 

4. Дизайн интерфейса

Создание дизайн концепции интерфейса

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

Отрисовка всех страниц в соответствии с дизайн концепцией

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

Руководство по стилю интерфейса, создание элементной базы

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

Создание чистового функционального прототипа

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

Юзабилити-тестирование на чистовом функциональном прототипе

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

 

5. Подготовка технического задания (спецификации)

Написание технического задания с использованием накопленного материала

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

 
  © 2012 — «Wayson»