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

1. Общаемся с заказчиком

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

2. Ищем похожие приложения

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

3. Набрасываем схему

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

4. Рисуем позитивный флоу

Для каждого экрана рисуем грубый прототип. Мы используем Figma, но также подойдут Sketch, Adobe Illustrator и Balsamiq. Собираем полученные экраны в схему с сопутствующими указаниями: «по клику на кнопку А переходим на экран Б».

5. Рисуем скрины с ошибками

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

6. Краш-тестим

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

7. Проводим демо

Упорядочиваем экраны, собираем в прототип — кликабельный или со стрелочками, а затем презентуем заказчику. После демо нас наверняка попросят что-то поправить. Не стоит этого боятся, никто не обязан читать мысли с первого раза.

8. Доводим до ума

Вносим правки и снова показываем заказчику. Когда всё согласовано, готовые user flow отдаем дизайнерам или на оценку разработчикам.

Совет:

Поменьше красок

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

… и побольше движения

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