После того, как UX дизайнер собрал информацию о проблемах пользователя и провел исследование своего проекта, он начинает работу над дизайном с наработки нескольких идей и вариантов решений. Здесь и происходит настоящая магия. Дизайнеры делают скетчи, чтобы выявить, какое из этих решений будет совпадать с видением продукта заказчиком и отвечать потребностям. Далее они сводят выбор к одному мощному концепту. На его основе создается рабочий прототип.
Используя этот концепт, далее можно тестировать его на жизнеспособность и соответствие целям и потребностям бизнеса.
UX дизайнеры создают прототипы — первые модели продукта, которые способны дать понимание, над чем еще нужно работать, как тестировать дизайн для пользовательского интерфейса на сайтах и приложениях. Прототипы дают гораздо больше статики. Они также позволяют продемонстрировать функциональность интерфейса, интерактивность, анимацию и общее юзабилити.
Существует несколько диджитал-инструментов, доступных дизайнерам наших дней, каждый – с собственными возможностями и результатом. Но ни одна не стоит на месте, развивается с каждым днем, поэтому поиск платформы для себя становится очень увлекательным.
Есть много факторов, которые нужно учесть, когда выбираешь инструмент для прототипирования. Среди важнейших:
- Простота изучения: Не все платформы – интуитивно понятны для использования. Насколько легко будет ею пользоваться даже начинающему?
- Стоимость: Сколько вы готовы инвестировать в новый, неизвестный инструмент? Стоимость колеблется от бесплатной до нескольких сот долларов в год.
- Типы файлов и исходный файл: Как вы хотите экспортировать свой прототип или делать демо-версию?
- Цель проекта: Какова ваша конечная цель по проекту? Хотите ли вы презентовать клиенту продукт, близкий к полноценному? Готовите рабочую версию для коллег с аннотациями? Демонстрируете анимационный интерактивный дизайн-концепт для всей команды? Тестируете пользовательский дизайн? Различные платформы разработаны в соответствии с разными целями.
Sketch + InVision
Инструмент, известный как Sketch, быстро стал одной из самых популярных платформ для работы в UI, вытеснив из звена таких гигантов как Adobe Photoshop и Illustrator, а вместе с ними и десяток других организаций. Дизайнеры используют Sketch для создания качественных интерфейсов на основе вайрфреймов в низком расширении. Основным недостатком Sketch является отсутствие возможности имитировать взаимодействие пользователя со страницей: клики, зависание, таппинг и т.п. без посторонних встроенных патчей. Итак, дизайнеры научились создавать такую имитацию с помощью интерактивных инструментов, таких как InVision. В InVision нет возможности рисовать или создавать дизайны – здесь все сводится исключительно к интеракциям, подключению страниц, анимации для дизайна. InVision и Sketch вместе позволяют дизайнерам строить прототипы для полноценного тестирования и фидбека.
Недавно InVision’s презентовали новую InVision Studio. Эта новая платформа может положить конец тандему вышеупомянутых программ, поскольку теперь дизайнеры могут делать все вместе в одной платформе, что наверняка исключит Sketch из уравнения. Увидим.
Axure
Axure, выпущенный в 2003, резко подскочил в популярности потому, что дизайнерам требовался инструмент для продвинутой имитации взаимодействия с пользователем. Так что программа включает индивидуально разработанные анимации и взаимодействие с JavaScript. Но у нее очень обсуждаемый недостаток: исходный файл не может быть сохранен в векторном формате, Axure переводит изображение в bitmap. То есть прототип может терять в качестве при изменении. И вообще, программа сложнее, необходимо больше времени на ее изучение.
Figma
Инструмент Figma создан для разработки «drag-and-drop» интерфейсов и интерактивных прототипов, и это – новое слово для UX дизайнеров, особенно для тех, кто не знаком с HTML и CSS. Платформа включает возможность рисования в хорошем качестве, поэтому вы можете создавать продукт, близкий к финальному, прямо в одной программе. Из полезных фич: автоматическая настройка дизайна к любому экрану, адаптивные дизайны, система layout grids для упорядоченных элементов, отступы которых сохраняются автоматически, без дополнительных манипуляций с композицией и прочее.
Adobe XD
Официально программа появилась в октябре 2017 и не имеет столько дизайнерских возможностей как, например, «скетч». Но это потому, что у Adobe XD есть своя цель. Продукт создан специально для дизайнеров, желающих создавать свои прототипы в одном месте. Софт имеет кнопку «play», чтобы показать демо-версию прототипа в любое время. У Adobe есть недостатки: довольно часто может «вылетать», поэтому придется храниться чаще. Но здесь есть крутые фишки – например, работа с текстом, с отдельными элементами, возможность показывать прототип в полном масштабе – так, как минимум, на AdobeXD стоит посмотреть.
Webflow
Webflow был изобретен в 2013; это результат работы программы акселератора Combinator’s. Первоначально его создали как инструмент для разработки полноформатных кастомных сайтов. Хороший инструмент для создания интерактивных дизайнов, имеет интуитивно понятный интерфейс для тех дизайнеров, хотя бы кое-что понимающих в HTML и CSS. Интерфейс Webflow дает возможность создать стильный продукт, более подробный, чем на других CMS-платформах как Squarespace или Wix, которые не созданы для прототипирования.
Иметь столь широкий выбор программ – рай для дизайнера нашего времени. Ведь все они, наконец, только инструменты для того, чтобы мы развивали себя как специалистов. И, прежде всего, специалисту нужно определиться с целью его работы, чтобы не заблудиться в дебрях вариативности интерактивных платформ. Итак, если теряетесь, что выбрать, подумайте в первую очередь, для чего вам необходима та или иная программа.