Инструменты UX прототипирования: обзор 8 Инструменты UX прототипирования: обзор 9 Инструменты UX прототипирования: обзор 10

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

#UI/UX дизайн

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

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

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

Axure

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

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

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

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

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

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

InVision

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

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

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

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

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

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

Figma

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

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

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

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

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

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

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

12.06.2019
Используемые в статье картинки взяты из открытых источников и используются как иллюстрации.
Хотите обсудить ваш проект или заказать разработку?
Отправить
Цей сайт є українською мовою. Ви можете переключити мову у меню, або зробити це зараз.