Интерфейс
Мобильный кошелек криптовалют для «Atomic Wallet»
Сервис запуска промо сайтов «Octomark»
Мобильная экономическая игра с использованием криптовалюты
Админ-панель и Дэшборд для блокчейн сервиса «Polyworld»
5 шагов UX-процесса
Продуктовый дизайн как правило следует подходу Design Thinking, в котором процесс разложен на 5 основных шагов:
1
Пользовательское исследование (погружение в опыт и проблемы пользователей)
2
Определение проблемы (Определяем конкретные задачи, которые нужно решить)
3
Генерация идей (генерация идеи и выбор решения)
4
Прототипирование (создаем модели для тестирования найденных решений)
5
Тестирование (Получаем обратную связь и находим наилучшие решения)
Первые 2 шага (Пользовательское тестирование и Определение проблемы) как правило группируются в общий термин User Research (пользовательское исследование). Таким образом, определяется образ пользователя и то, как этот образ влияет на его потребности. Далее, мы опишем все 5 шагов и расскажем, какие подходы используются для достижение главной цели, создания успешного продукта.
01 — 02
Пользовательское исследование
Persona

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

Storyboards

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

В нашем случае мы используем немного иной подход, который называется Job Story.
Customer Journey Map

Или карта пользователя
, которая показывает все шаги (или процесс) пользователя при достижении его цели. Располагая весь процесс на таймлайне, дизайнер может понять изменения поведения пользователя в контексте, а также его мотивации, проблемы и потребности. Благодаря этому процессу определяются основные проблемные точки (Pain Points) продукта, которые затем можно приоритизировать и начать их исправлять.

03
Определение
проблемы
Brainstorming

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

04
Прототипирование
User Flow

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

При построении User Flow важно воссоздать схему основного функционала продукта, на который мы будем ориентироваться при создании ТЗ, Site Map, и прототипов.

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

Sitemaps

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

Low-fidelity prototypes

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

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

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

Уже на этом этапе начинается бэкенд-разработка продукта, так как на этом шаге понятна, какая будет архитектура приложения.


High-fidelity prototypes

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

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

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

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

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

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

1. Общий итог: что мы тестировали, где и как, инструменты и оборудование которые мы использовали и кто был вовлечен в исследование.

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

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

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

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

Аналитический отчет

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

1. Аналитические инструменты и настройка целей в Google Analytics и Yandex.Metrika

2. NPS (Net Promoter Score) — Рассылка с вопросом о том, насколько продукт нравится, или не нравится пользователям

3. Survey, опрос, как правило некий список вопросов в обмен на скидку или другие бонусы клиенты за то, что он потратит свое время на эту задачу

4. И др.

Когда разработанный продукт выпущен и работает уже некоторое время, то можно получить данные их Google Analytics и Яндекс.Метрики. Изучение этих данных может помочь лучше понять, как улучшить удобство использования, особенно если эти данные содержат переходы и поведение пользователей в вашем продукте.

Например через аналитику можно увидеть, что пользователи кладут товар в корзину, но отваливаются на этапе регистрации. Возможно, регистрация слишком сложная, или какие-то действия не совсем очевидные. Аналитический отчет содержит выводы из этих данных и фокусируется на точках, в которых дизайн может быть улучшен. Отчет должен содержать данные, объяснения и рекомендации о том, что делать. Это также полезная запись, чтобы вы могли видеть влияние изменений дизайна на ваш сайт после того, как вы определили проблемы и попытались их решить.
2009–2019 © ИП Прокудин Никита Игоревич
ОГРНИП 317715400058312