Прежде чем начать разрабатывать приложение, нужно понять, что оно будет из себя представлять: какие функции нужны, сколько должно быть экранов и как будущие пользователи будут взаимодействовать с приложением. Для этого мы внимательно изучаем идею, а затем создаем прототип будущего приложения. И вот, как мы это делаем.
1. Общаемся с заказчиком
Важно понять цель приложения и выяснить, какие функции нужны в продукте. Не рекомендуем зарываться в мелочи. Лучше уделить внимание концепции, а детали согласовывать в процессе.
2. Ищем похожие приложения
А точнее сервисы, которые решают похожие проблемы. Прежде чем создать что-то новое, полезно посмотреть, как эту задачу решали до нас.
3. Набрасываем схему
Определяем набор обязательных функций и для каждой продумываем user flow — цепочку действий, которую пользователь должен совершить, чтобы достичь цели. Схему экранов рисуем на листе бумаги или в графическом редакторе.
4. Рисуем позитивный флоу
Для каждого экрана рисуем грубый прототип. Мы используем Figma, но также подойдут Sketch, Adobe Illustrator и Balsamiq. Собираем полученные экраны в схему с сопутствующими указаниями: «по клику на кнопку А переходим на экран Б».
5. Рисуем скрины с ошибками
Продумываем альтернативные варианты развития событий, когда пользователю не удается достичь цели. В этих случаях приложение должно сообщить об ошибке или об отсутствии результата. Добавляем такие кейсы в нашу схему.
6. Краш-тестим
Получившиеся сценарии обсуждаем с командой. Выпиливаем неочевидные для пользователя решения и думаем, как сделать UX лучше. Повторяем ритуал до тех пор, пока сомнений в пользовательских сценариях не останется.
7. Проводим демо
Упорядочиваем экраны, собираем в прототип — кликабельный или со стрелочками, а затем презентуем заказчику. После демо нас наверняка попросят что-то поправить. Не стоит этого боятся, никто не обязан читать мысли с первого раза.
8. Доводим до ума
Вносим правки и снова показываем заказчику. Когда всё согласовано, готовые user flow отдаем дизайнерам или на оценку разработчикам.
Совет:
Поменьше красок
Мы не рисуем прототипы в цвете. На стадии анализа придерживаемся нейтрального вида, чтобы сосредоточиться на функциях приложения и не отвлекаться на цвета кнопок.
… и побольше движения
Кликабельный прототип поможет команде выявить недостающие экраны, а заказчику — представить приложение в деле и дать дополнительный фидбек.