проект Вадима Митякина
Май, 2017
#Исследования

Инструменты для построения диаграмм переходов между экранами (обновляется)

Собираю ссылки на инструменты для построения диаграмм переходов в интерфейсах мобильных приложений и сайтов. Если у вас есть что добавить, пишите в комменты к статье, буду добавлять.
Justinmind
Кажется после долгих поисков обрел хороший инструмент для проектирования так, как я себе это вижу. А вижу я это так, что мне важно видеть продукт (в части UX) в разных измерениях — прототипов отдельных экранов, кликабельного прототипа, чтобы посмотреть вживую на устройстве и! в виде набора разных пользовательских сценариев, которые можно оформить графически.

Я пересмотрел массу продуктов. В большинстве случаев выглядит так, что мы закачиваем макеты из Скетча (это тот же Invision + Craft), дальше собираем из них прототип. В других продуктах (например, Proto.io) можно сделать собственными средствами прототипы экранов и также из них собираем прототип. Но нигде блин нету визуализации схемы переходов.

Есть конечно плагин для Скетча (User Flows), в котором можно просто нарисовать такие переходы между расставленными артбордами. Но из этого не получается кликабельного прототипа.

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

И вот нашел. Штука называется Justinmind. Помимо возможностей подготовки прототипов экранов собственными средствами, можно импортировать то, что сделано в Скетче. Из экранов собирается прототип. И из экранов можно собрать бесконечное количество пользовательских сценариев. Причем, что особенно доставляет, сначала ты можешь составлять сценарии просто из плейсхолдеров экранов, а потом переходить к созданию детальных прототипов каждого из них.
Сделаю на инструменте один проект и попробую расписать рабочий workfow использования на команду с продактом, дизайнеров и разработчиками.
Craft by Invision
Плагин к Скетчу