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

Но одно дело — идея, а другое — её реализация. Чтобы проверить, насколько это вообще интересно магазинам, нужно им что-то показать. А разрабатывать для этих целей mvp — займёт какое-то время.

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

Почти что прототип для пользовательского тестирования, только в этот раз для демонстрации идеи и усиления коммерческого предложения.

Клиенту моё предложение понравилось, по времени это заняло чуть больше недели — и так я впервые за пятнадцать лет сам сделал то, чему обучал тысячи людей в статьях и видеороликах на Ютубе и одновременно отговаривал применять это на практике: демонстрационный интерактивный прототип, напичканный динамическими элементами.

Там были якорные ссылки в основном меню навигации. Они постоянно торчали в верхней части экрана на полупрозрачной плашке, скролили до нужной части каталога и меняли свой цвет в зависимости от активности. И встроенный ролик с видеоинструкцией из Ютуба, появляющийся в модальном окне. И галерея, которую можно полистать. В общем, вот это всё. Клиент остался доволен и отправился решать куда как более сложную задачу: искать контакты представителей магазинов, которым это можно показать и предложить.

Кажется, уже подросло поколение UX-дизайнеров, которое могло даже не слышать об Axure. А я всё ещё считаю её лучшим инструментом для быстрого создания динамических прототипов. Впрочем, сразу отмечу, что сам я из динамики использую только перелинковку (чтобы все ссылки в интерфейсе куда-то вели), да глобальные переменные для разных ролей (чтобы шапки для аутентифицированных пользователей отличались от шапок для неаутентифицированных).

Я начал пользоваться Axure в 2009 году. Тогда это была версия 5.6. На сегодняшний день последняя версия программы — 10-я.

Сегодня у меня спрашивают: «Почему ты не перешёл на Фигму?». Во-первых, потому что запрос на интерактивные прототипы в Axure никуда не исчез. Он просто стал меньше раз в десять :) А если есть спрос, то зачем мне переходить на что-то ещё? Во-вторых, у меня появился опыт запуска собственных стартапов, благодаря которому я очень хорошо понял, что и Axure, и Фигма — это просто инструменты. Каждый со своими сильными и слабыми сторонами. И на практике убедился, что Axure всё ещё уделывает Фигму в прототипировании. А Фигма всё так же уделывает Axure в вопросах дизайна и передачи макетов в вёрстку.

Поэтому я проектирую и прототипирую в Axure. А UI прорабатываю в Фигме (впрочем, освоив Фигму, я всё же предпочитаю обращаться к дизайнерам за этой частью работы, а сам продолжаю не отвлекаться от создания проектной документации). Получается, я с удовольствием использую оба инструмента в зависимости от обстоятельств.

Когда проект начинается с идеи — можно очень быстро сделать интерактивный прототип в Axure, не отвлекаясь на дизайн. И уже потом переносить это дело в Фигму. А когда у проекта уже есть дизайн и UI-кит в Фигме, то имеет смысл прототипировать уже в самой Фигме, а не плодить сущности.

Бывает и так, что в Фигме уже всё есть, но нам надо протестировать на пользователях какую-то новую неразработанную функцию, которая включает в себя много динамики. Тексты в поля вводить, работать с выпадающими списками, содержимое которых зависит друг от друга, запоминать выбранные на предыдущих шагах варианты и подстраивать под них следующие. В таких случаях проще будет всё-таки перенести это в Axure, чем пытаться заставить работать в Фигме с помощью костылей.

В общем, разные инструменты для разных целей.

Несмотря на то, что уже давно вышла десятая версия Axure, я чаще использую восьмую. Потому что, начиная с девятой, Axure, как мне кажется, просто пытается двигаться в сторону Фигмы. Больше удобств для работы с дизайном. Стили, эффекты, вот это всё. Даже «мастера», которые в Axure всю дорогу играли роль «компонентов» взяли и переименовали в «компоненты».

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

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

Итак, что умеет Axure?

  • Создавать древовидную структуру страниц, в том числе раскладывать их по папкам

  • Работать с каждой из этих страниц. Это как работать с отдельным фреймом в Фигме

  • Работать с адаптивными состояниями каждой из страниц. Показывать, как они ведут себя на разных вьюпортах

  • Создавать компоненты

  • Управлять стилями чего угодно

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

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

  • Генерировать получившийся прототип в виде набора html-страниц. Его можно смотреть как локально, так и выложить к себе на сервер

  • Публиковать получившиеся прототипы в облаке Axure

  • Есть командная работа и генерация проектной документации, но я их протестировал разок — и больше к ним не возвращался :)

И ещё сто пятьсот функций, присущих любому подобному инструменту. Сетки, линейки, работа с векторами, динамическими панелями, масками, вот это всё. Но, конечно, на сегодняшний день мы привыкли всё сравнивать с Фигмой. И если посмотреть на список, то основных различий будет два: работа с адаптивкой и программирование логики. Это то, чего в Фигме пока нет.

Для себя из плюсов также считаю возможность выложить получившийся прототип на своём сервере. Это кажется более надёжным, чем публикация в облаке. Но всё равно облако удобнее.

Когда я проектирую в Фигме, то не могу не отвлекаться на дизайн. Иногда, вместо того, чтобы быстро набрасывать необходимые элементы на страницу и прорабатывать пользовательские сценарии, я сижу и подгоняю отступы, размеры и цвета. А Axure с этим проще. Плюс в Axure я никогда не увижу «ёжика» из огромного количества связей между перелинкованными элементами в режиме прототипирования, потому что там работа организована в виде «папок», а не «полотна». Но опять же: это просто инструменты и я их использую в зависимости от контекста.

Полезные ссылки:

Пример прототипа. Он из кейса — сайта торгового бота.

Группа по Axure Вконтакте. Вместе с падением популярности Axure упала и актуальность группы. Но нет-нет — да придёт кто-нибудь с вопросом по работе в программе, и я делаю очередной обучающий ролик.

Уроки по Axure в базе знаний Проектората.

Мини-курс Антона Григорьева: Axure 7 для начинающих за 100 минут.

Ну и мой Телеграм-канал. Он про проектирование интерфейсов и работу на фрилансе.

Комментарии (3)


  1. Grav
    24.08.2024 15:57
    +3

    Среди полезных ссылок не хватает, конечно, ссылки на серию видео Axure 7 для начинающих за 100 минут :)


    1. Ekamelev Автор
      24.08.2024 15:57

      Антон, согласен, не хватало. Добавил!


  1. Dussky02
    24.08.2024 15:57

    Простите за не популярное мнение, но, кажется что, весь смысл интерактивных прототипов в быстрой проверке идей. А выбор инструмента зависит от того насколько быстро можно идею проверить. Что-то можно нарисовать на салфетке, что-то в фигме. Кажется что вместо того чтобы недели мучить axure, можно было либо за денёк собрать протик в фигме, да без некоторых нюансов, но так ли они важны. Либо позвать разработчика и сверстать ui на моках за пару дней. А что-то можно и по-бырому собрать в tilda