Валерия Крупина
Мы в Doubletapp часто транслируем в социальных сетях, как важно соблюдать все этапы процесса создания продукта: аналитика, дизайн, разработка, тестирование и так далее.
Гораздо реже мы говорим о том, что каждый из этих этапов также является составным и о каждой ступени можно рассказывать в отдельности. Поговорим про стадии дизайн-процесса — их целых 10!
1. ИССЛЕДОВАНИЕ
Для начала нужно задаться вопросом, зачем мы делаем проект. Ответить на этот сложный вопрос может заказчик или менеджер проекта, следовательно именно к ним мы и должны обратиться за помощью. Как продукт будет работать, какие пользователи будут на него заходить, каким контентом он будет заполнен? От целей зависит вектор проектирования.
На первом этапе дизайнер собирает данные о будущем продукте. Анализирует конкурентов, расписывает функции, думает над логикой работы. Хороший метод исследования — это разговор с реальными пользователями. Дизайнер старается представить, что важно для этого человека в продукте, какие задачи он будет решать? Пропустить шаг исследования — все равно что построить дом без фундамента, обрекая его на скорое разрушение.
Результат работы: собранная база знаний по проекту.
2. ЦА И ПЕРСОНАЖИ
Мы должны понять, кто именно наша целевая аудитория, кто из представителей ЦА является ядром, для кого мы делаем продукт. Тут могут быть важны социально-демографические характеристики (пол / возраст / образование / род занятий), географические (страна, город), психографические характеристики (стиль жизни, особенности личности, черты характера), поведенческие характеристики (образ жизни и потребительские предпочтения, их мотивация, готовность совершать те или иные действия).
Результат работы: подробно расписанные портреты потенциальных пользователей.
3. АНАЛИЗ ДАННЫХ
Мы определились «зачем», теперь вопрос «как»? Когда задачи продукта ясны, дизайнер продумывает логику взаимодействия, как пользователь будет решать свои задачи. На этом этапе создаются сценарии пользователя. На основе анализа целевой аудитории мы составляем портрет типового пользователя, вживаемся в его роль, ставим себя на его место, формулируем конкретные задачи для нашего персонажа и продумываем его потенциальный сценарий поведения.
Результат работы: выжимка из всего UX-исследования материалов, которые пригодятся для формирования сценариев и составления прототипов.
4. CUSTOMER JOURNEY MAP (КАРТА ПУТЕШЕСТВИЯ ПОЛЬЗОВАТЕЛЯ)
CJM фиксирует подробности взаимодействия с услугой. Главная задача CJM — создание непрерывного взаимодействия на протяжении всего потребления услуги, от точки входа до точки выхода. Что пользователь нажимает, как перемещается по интерфейсу, какие этапы проходит на пути к своим целям, где он сталкивается с барьерами, не позволяющими достигать целей. Иными словами, CJM представляет цепочку: «цель — шаги для ее достижения — возможные препятствия — способы их устранения», применимо к каждой точке соприкосновения пользователя с вашим продуктом.
Результат работы: собственно, CJM.
5. USER FLOWS (ПОЛЬЗОВАТЕЛЬСКИЕ СЦЕНАРИИ)
User flows — это наглядные материалы, которые иллюстрируют весь путь пользователя в продукте целиком. User Flow помогает понять, все ли процессы в продукте имеют логическое завершение, нет ли висящих страниц или наоборот, может, какого-то сценария не хватает для полноты картины. Иными словами, User Flow — это схематичная навигация по вашему продукту.
Результат работы: User Flow в любом его воплощении.
6. ТЕХНИЧЕСКОЕ ЗАДАНИЕ
Обычно как раз где-то на этом этапе начинает составляться техническое задание. Дизайнеры могут принимать в этом участие, а могут не принимать. В любом случае они делятся своими наблюдениями, исследованиями и опытом, чтобы на этапе описания продукта не возникло недоразумений, которые усложнят дальнейшую работу.
Результат работы: техническое задание во плоти.
7. ПРОТОТИПИРОВАНИЕ (WIREFRAMING)
Все детали с заказчиком обсуждены, исследование проведено, ТЗ составлено, вы уже знаете «зачем» и «как» будет работать ваш продукт, значит, наконец-то можно начать проектировать. На этапе проектирования вы визуализируете все собранные ранее данные, разрабатываете каркас продукта, его скелет, на который постепенно будет наслаиваться функционал.
Важно понимать, что проектирование — это не создание готового дизайна. Это наброски, цель которых — понять, решит ли продукт в таком виде задачу.
Прототипы — это про решение проблемы, про получение фидбэка от пользователя и заказчика, чтобы вовремя проработать все недостатки и сэкономить в дальнейшем время как себе, так и разработчикам.
Результат работы: каркасы (Wireframes), описывающие полный функционал проекта.
8. ТЕСТИРОВАНИЕ
Предыдущий шаг однозначно требует проверки. Помимо получения фидбэка от стороны заказчика, очень важно протестировать продукт на реальных пользователях (пусть даже внутри вашей компании). Отсутствие дизайна как такового на данном этапе — это даже плюс, потому что пользователь сможет максимально сконцентрироваться на функционале, не отвлекаясь на оценку цветов / шрифтов / иконок и картинок.
Результат работы: собранный и проанализированный фидбэк с дальнейшим планом правок и изменений.
9. ДИЗАЙН-МАКЕТЫ
После нескольких кругов правок прототипов (если они потребовались), можно приступать к визуализации, работе с цветом, композицией и типографикой, оформлением контента. Сухие черно-белые наброски трансформируются в детальные макеты, соответствующие всем гайдлайнам и принципам построения интерфейсов.
Важная задача — не забывать постоянно возвращаться к UX-составляющей, следить за преображениями, наблюдать, чтобы при добавлении визуальных эффектов не потерялся основной смысл продукта.
Результат работы: макеты экранов с высокой точностью, детально иллюстрирующие все составляющие проекта.
10. СПЕЦИФИКАЦИИ
Макеты готовы, утверждены и проверены. Теперь их нужно передать разработчикам. Этап, на котором составляются UI-киты, дизайн-системы, еще более детально прорабатываются все состояния элементов и адаптивы экранов под разные платформы и разрешения экранов. Макеты загружаются на удобную для экспорта площадку и передаются разработчикам.
Результат работы: UI-гайдлайны, дизайн-система проекта и адаптивы.
ЗАКЛЮЧЕНИЕ
Итого 10 шагов на пути к созданию дизайна продукта в том виде, в котором его видит конечный пользователь. 10 задач, с которыми сталкивается дизайнер в каждом своем проекте. Соблюдение процесса — рецепт качественно выполненной работы. Именно поэтому мы считаем, что знать о нем нужно как нашим коллегам, так и потенциальным заказчикам!
А как устроены процессы в вашей компании? Поделитесь своими наработками.
Ну а если вы хотите так же подробно прочитать про каждую из наших услуг — вы знаете, как дать нам об этом знать!
