Лучшие инструменты для UX прототипирования

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

Axure –  универсальный комбайн

При помощи программного обеспечения Axure, единственного в своем роде, можно полностью воспроизвести функционал сервиса/сайта/продукта. Прототип, полученный в результате, полностью кликабельный, позволяет сделать адаптивку, вводить глобальные переменные, спроектировать и проверить на деле различные user flow для зарегистрированнного и не зарегистрированного пользователя.

Данное ПО позволяет создать прототипы различных продуктов, даже онлайн-калькулятора на сайте. У него также имеются дополнительные преимущества:

• возможность создать аннотации для многих элементов интерфейса;
• возможность создать прототипы в форматах HTML и .chm;
• возможность создавать проекты для одновременной работы над одним прототипом нескольких участников;
• возможность быстро создавать прототипы и быстро вносить в них изменения, а также множество других преимуществ.

Однако у системы имеются также и недостатки:

• устаревший интерфейс и небольшое количество виджетов;
• средне-высокий уровень вхождения (чтобы полноценно пользоваться продуктом, необходимо выучить многие функции);
• трата времени на переноса из акшур в другую программу для дизайна (поэтому для несложных проектов вроде корпоративных сайтов мы используем инструмент Figma);
• Axure – платный продукт, и его стоимость ощутимо выше, чем у программ-аналогов на рынке.

InVision – мощная система

По сравнению с Axure InVision – простой сервис, позволяющий загрузить уже нарисованные в другой программе экраны и расставить необходимые линки. Сервис работает на основе интерфейса типа drag-n-drop, а также пакета инструментов для быстрой обработки и работы в самом браузере.

Чаще всего мы используем InVision для прототипирования мобильных приложений, в связке с Adobe Illustrator.  Среди главных преимуществ системы – интуитивный современный дизайн сервиса, возможность делать простые анимации-переходы экранов, а также многие другие:

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

У программы также есть ощутимые недостатки:

• нельзя рисовать прямо в сервисе, необходимо делать экспорт из другой программы, а это значительная потеря времени (наибольший недостаток всей системы);
• при большом количестве ссылок она глючит, а ховер работает плохо;
• бесплатная версия программы дает возможность проектировать только ограниченное количество проектов;
• InVision – платная система.

Figma – сервис, которым мы пользуемся чаще всего

Отличный сервис, которым мы пользуемся практически постоянно. Он состоит из трех основных функций: дизайн, прототипирование, просмотр css кода и дает возможность делать кликабельные прототипы, на которые можно давать ссылки клиентам, разработчикам.  Также в Figma есть возможность организовать совместную работу всех специалистов в режиме реального времени.

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

Ключевые преимущества Figma:

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

Чтобы быть полностью честными, укажем также некоторые недостатки продукта:

• нет возможности создавать прототипы для сложных сервисов и продуктов – банально не хватает функционала;
• работа возможна только при наличии интернета;
• изменение размера текста может смещать его границы;
• импортированные файлы не всегда соответствуют оригиналу, разваливаются. Макет на Figma лучше создавать с нуля.

Таковые основные UX prototiping tools, которыми пользуемся мы в Evergreen, вместе с их преимуществами и недостатками, с которыми мы научились справляться, чтобы достигать лучшего результата при проектировании вашего продукта.

Нужно создать дизайн стартапа, небольшого проекта, полноценного SaaS-портала, мобильного приложения или любого другого онлайн-продукта? Обращайтесь к нам, создадим продукт вашей мечты. И начнем с UX прототипа, которому позавидуют конкуренты.

Используемые в статье картинки взяты из открытых источников и используются как иллюстрации.

Хотите обсудить ваш проект или заказать разработку? Спасибо за заявку. Мы свяжемся с вами в ближайшее время

Отправить