Axure RP — удобное средство прототипированияАвтор: Серов Георгий
Опубликовано: 28.02.2013
Источник: SoftKey.info Перед началом
На сайте программы забавный рисованный супергерой рассказывает о преимуществах программы и о том, как просто теперь создавать прототипы. Надо сказать, что доводы весьма убедительные. Я выделил самые важные:
Клиенты могут дать вразумительную обратную связь, когда видят интерактивный макет. Как часто, вместо того чтобы обсуждать структуру сайта с заказчиком, вы просто перекрашиваете кнопочки? У меня такое случается постоянно. Макет, созданный в Axure RP, всем своим видом подчеркивает, что это прототип и смотреть нужно только на структуру.
Программисты и верстальщики наконец-то поймут, что хочет от них дизайнер. На статичном макете сложно показать, как должен вести себя сайт в динамике. Axure RP позволяет легко создавать интерактивные HTML-прототипы за несколько минут.
Ваш менеджер будет в восторге. Разговор о сроках – больная тема для дизайнера и менеджера. Первый хочет довести проект до идеала, и неважно, сколько на это потребуется времени. Второй стойко отстаивает позицию заказчика, который ожидает, что все будет готово вчера. В этой вечной борьбе Axure – это универсальный инструмент, ощутимо сокращающий время на разработку.
Звучит убедительно; получается Axure RP действительно незаменим в арсенале дизайнера? Посмотрим, каков он в условиях, близких к боевым. Я постараюсь создать макет интернет-магазина и понять, насколько он хорош в деле.
Интерфейс
После запуска появляется окно приветствия. Как обычно, тут можно выбрать недавно открытый файл или создать новый. Слева ссылки на обучающие материалы. По традиции ставим галочку у пункта «Не показывать снова» и забываем о нем навсегда.
Вид программы меня немного обескуражил и чем-то напомнил интерфейс редактора «Хоум Сайт», который был популярен лет десять назад. С другой стороны, для профессионального инструмента важно, чтобы все функции были доступны в кратчайшее время. С этим у программы никаких проблем нет.
 | | Форматирование страницы |
В центре традиционно рабочая область. Она занимает примерно треть всего пространства. Остальное — функциональные элементы. Слева, справа, сверху и снизу – все заполнено кнопочками и панелями. Вначале немного теряешься, но после беглого осмотра оказывается, что изначально на экран выведены почти все доступные инструменты. Благо ничего не мешает отключить ненужные.
Присмотримся к интерфейсу внимательнее. Сверху, как обычно, меню. Тут все достаточно стандартно, ничего необычного. Некоторые пункты из меню продублированы в качестве панелей инструментов в рабочем окне.
Слева сверху древовидный список страниц. В нашем случае главная страница будет "стволом" дерева, из которого будут отходить «ветви» - внутренние разделы и карточки товаров. Вот как получилось у меня.
 | | Древовидная структура сайта |
Древовидную структуру можно преобразовать в диаграмму (flow diagram). Объекты на ней можно перемещать, добавлять элементы и события по клику и наведению мыши.
 | | Схема всех страниц |
Ниже находится панель виджетов (Widgets). Это сгруппированные по типу элементы макета, которые можно быстро вставить в проект. Например, текстовый блок, кнопка или гиперссылка. Обычно сайт состоит из таких однотипных элементов. Таким образом, работа над макетом значительно упрощается. Виджеты можно создавать самостоятельно. Они сохраняются в файл с расширением rplib и представляют собой сборник элементов интерфейса. Axure может гордиться своим сообществом. Теперь не нужно тратить время на создание стандартных элементов управления. Уже созданы виджеты всех популярных платформ и сайтов: iOS, Android, Twitter или Facebook.
Стандартные виджеты, хоть и не выглядят образцами прекрасного дизайна (это и не нужно для прототипа), отличаются широкими возможностями для редактирования. Например, легко создать выпадающее меню с несколькими уровнями вложенности и взаимодействием с другими элементами на странице.
 | | Панель виджетов |
Следующая панель – «Мастеры» (Masters). Несколько элементов можно объединить в мастер. Обычно сайт содержит в себе некоторую повторяющуюся информацию на всех страницах. Например, шапка или футер. Единожды создав мастер, можно одним кликом располагать набор элементов на всех страницах. Это ускоряет и упрощает работу.
Для нашего магазина я создал несколько мастеров, и теперь нет необходимости каждый раз копировать и вставлять один и тот же набор инструментов.
Снизу, под рабочей областью, находится панель с тремя вкладками. Тут настраиваются параметры, относящиеся к странице в целом. Первая вкладка – заметки, представляет собой текстовое поле, куда можно внести описание или техническую информацию о странице. Из таких заметок программа генерирует техническое описание. Следующая вкладка позволяет задавать события, которые будут происходить при загрузке странице. Эта функция позволяет создавать динамические макеты. Последняя вкладка – форматирование страницы, содержит настройки оформления, цвета и форматирования.
| | Форматирование страницы |
Примечательна панель настройки эскиза. Тут можно задать желаемый уровень "скетчевости", изменить шрифт, скажем, на рукописный и выбрать монохромный вариант отображения цветов. Манипуляции позволяют придать эффект наброска от руки. Это нужно для того, чтобы заказчик не отвлекался на дизайн, а оценивал только логику и структуру будущей системы.
Слева расположены две панели: настройки виджетов (Widget Properties) и панель управления динамическими элементами (Dynamic Panel Manager). И если с первой все более-менее понятно - виджеты имеют настройки оформления и форматирования, - то с динамическими страницами все не так ясно. Попробуем разобраться, что это такое и как их использовать.
 | | Параметры виджета |
 | | Управление динамическими панелями |
Иногда на странице нужно показать пользователю определенную информацию только в нужный момент и при соблюдении определенных условий. Например, блок с информацией о неверно введенном пароле или подсказкой для формы. Также такая панель может быть динамической и в зависимости от действия пользователя изменяться определенным образом. На сайте Axure есть подробные видеоуроки по этой и любой другой функции. Всего 30 полутораминутных записей, каждая из которых знакомит пользователя с одной из функций. Разобраться просто.
Панель управления динамическими элементами позволяет контролировать все динамические панели и позволяет удобно ими управлять. Это особенно полезно, когда необходимо использовать и работать с несколькими формами на одной странице.
 | | Рабочая область |
И о последней, но, пожалуй, самой главной области программы тоже стоит сказать пару слов. Рабочая область представляет собой холст без ширины и высоты. Сверху и слева пиксельные линейки, которые позволяют удобнее рассчитывать параметры элементов и страницы в целом. Каждая новая страница открывается в своей вкладке.
Готовый прототип можно развернуть на хостинге Axure. В таком случае он всегда будет доступен там, где есть Интернет. И тут важно отметить одну из самых приятных функций Axure RP - это возможность создавать интерактивные HTML-прототипы. Конечно, качество такого кода никуда не годится. Однако это не имеет особого значения. Главное – можно оценить и протестировать макет непосредственно в браузере. Финальной версткой займется профессионал.
Разумеется, помимо экспорта в HTML есть еще и другие варианты представления готового результата. Это и сохранения страницы в картинку или в формат PDF. Тут же можно сгенерировать спецификации в текстовый документ или формат электронных таблиц CSV.
Пара недостатков все же есть
К сожалению, Axure RP не обладает возможностью генерировать модульную сетку, поэтому, если вы привыкли проектировать по сетке, ее нужно предварительно создать в другой программе. Будет очень кстати, если разработчики реализуют этот функционал в будущих версиях.
Также к недостаткам я бы отнес стоимость программы, за стандартную версию Axure RP разработчики просят $289. Профессиональная версия, в которой помимо стандартного функционала также присутствует функция совестной командной работы, обойдется на $300 дороже.
Выводы
Приятная во всех отношениях программа Axure RP по праву считается лидером на рынке программ для прототипирования. Полезные возможности для работы тут найдут дизайнеры, проектировщики интерфейсов и инженеры информационных систем. Широкие возможности вкупе с простым интерфейсом позволяют рекомендовать программу как начинающим свой путь дизайнерам, так и профессионалам, которые предпочитают серьезные и мощные инструменты.
| 
