Axure RP Pro – средство для прототипирования

Требования, которые мы предъявляем к прототипам, обычно такие:

  1. высокая скорость создания первой версии
  2. высокая скорость внесения изменений
  3. эстетичность
  4. возможность просмотра прототипа заказчиком без установки дополнительных программ
  5. поддержка минимальной интерактивности

Я создал несколько прототипов при помощи Axure RP Pro (триальной версии, которая работает 1 месяц) и теперь могу оценить насколько эта программа удовлетворяет типичным требованиям.

Скорость разработки первой версии
Процесс создания прототипа можно условно разделить на два этапа: создание первой версии и внесение изменений. На первом этапе “все горит”, энтузиазма выше крыши, хочется “выстрелить” и сразу попасть в цель. И поэтому очень важно, чтобы никто не мешал нам на этом этапе, в особенности пагубным может оказаться влияние программы, в которой мы создаем прототипы. Чем меньше времени у нас отнимает работа с интерфейсом программы, тем больше времени у нас остается на саму задачу, а в данном случае – на рисование прототипа. Axure RP Pro являет собой пример программы, в которой мы почти целиком и полностью концентрируемся на задаче, а не на средствах по ее решению. И вот почему.

Axure RP Pro – пример функциональной простоты, в нем нету понятия “проектов” или “диаграмм” – вы работаете со “страницами”, которые организованы в “дерево”:

sitemap.jpg

Вы можете менять порядок страниц в “дереве” при помощи drag&drop.

Скорость разработки прототипа может быть значительно увеличена с помощью принципа повторного использования (посмотрите как сильно увеличилась скорость написания пр-ограмм после появления технологии COM – компонентной объектной модели; чтобы встроить, например, бразуер в свою программу в Visual Studio нужно сделать всего один drag&drop – перетащить бразуер с панели визуальных компонентов на свою форму). В Axure RP Pro прекрасно реализовали этот принцип, создав панель виджетов и разместив на ней основные веб-контролы: ссылки, картинки, текст, элементы форм, таблицы и многое другое.

widgets1.jpg

При этом у каждого виджета есть свои свойства, которые определяют его внешний вид и поведение. Так, например, можно задать максимальное количество символов для ввода в edit box и включить радио-кнопку или чекбокс.

Cкорость внесения изменений
Когда первая версия прототипа создана и отрецензирована заказчиком, наступает этап внесения изменений: подправить текст, убрать из меню пару элементов, изменить заголовок сайта, исправить синтаксические ошибки в copyright и т.д. Хорошо, если вы рисуете прототип для одной страницы, а если страниц на сайте – 50 и глобальное меню отображается на всех страницах? Повторное использование и шаблоны спасут отцов и детей русской демократии.

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

Для работы с шаблонами в Axure RP Pro предназначена панель Masters.

masters.jpg
Шаблон в Axure RP Pro может вести себя трояко:

  1. Normal – вставка по ссылке, то есть изменения в шаблоне немедленно отражаются во всех местах, где он вставлен
  2. Place in Background – то же самое, что и Normal, но только шаблон лочится от перемещения (что очень хорошо, так как спасает шаблон от случайного перемещения при редактировании страницы) и занимает на странице ту позицию, которая была задана в шаблоне
  3. Custom Widget – вставка по значению, то есть при вставке такого шаблона в страницу программа создаст новый экземпляр, который можно редактировать; при этом связи между экземпляром и шаблоном нету – изменения в шаблоне не отразятся на его экземплярах

master_behavior.jpg
По большому счету, большой разницы между Place in Background и Normal нету. Я использовал Place in Background, так он умеет лочится (в Axure есть проблема с выделением группы объектов – с нажатым Ctrl их нельзя выделить – только мышкой, НО: при нажатии на левую кнопку мыши (для начала выделения объектов) вы рискуете переместить объект, на фоне которого вы нажали кнопку; поэтому для выделения группы объектов приходится искать место, свободное от объектов и начинать “охват” объектов; если на фоне лежит шаблон вида Place in Background, то перемещения не произойдет).

Эстетичность
Если прототип не эстетичен – ничего страшного, но если он привлекателен, то и заказчик счастлив и программисты чаще заглядывают в прототип, да и порою нудный процесс внесения изменений в прототип становится приятнее.

Прототип в Axure RP Pro эстетичен как “внутри” (в режиме проектирования), так и “снаружи” (в режиме просмотра). Я думаю это из-за использования .NET Framework 2.0.

Просмотр прототипа заказчиком без установки дополнительных программ
В Axure RP Pro существует 2 вида экспорта: в картинки и в HTML. Вы можете экспортировать картинки для всех страниц при помощи одного клика (нужно только указать папку назначения).

MS Visio 2003 тоже умеет экпортировать в квази-HTML. Но Visio использует VML (Vector Markup Language). Это язык позволяет создавать векторные рисунки и выводить их в браузере. Фактически это XML + XSL: на XML дается описание фигур, а XSL позволяет выполнять операции с рисунком, например, масштабирование. Самим рендерингом рисунков занимается компонент, который встроен в IE. В результате получается не HTML, а набор картинок. Я вижу два основных недостатка у этого подхода: во-первых, прототип получается неинтерактивным, так как, например, элементы форм – это просто картинки, скроллинга нету, кнопки не нажимаются (можно сделать только переходы между страницами по клику на объекты прототипа) и во-вторых, такой прототип можно просмотреть только в Internet Explorer.

Axure RP Pro лишен этих недостатков. Во-первых, прототип экспортируется в HTML (активно используются div’ы) и его можно смотреть во всех браузерах, которые “понимают” div’ы: IE6, FireFox, Mozilla, Netscaper 6+. Во-вторых, прототип получается полностью интерактивным: линки и кнопки нажимаются, все элементы форм – настоящие, в них можно вводить данные, если страница прототипа длинная, то выводится скроллинг и т.д.

Пример прототипа в режиме просмотра:

prototypethumbnail.jpg

Минимальная интерактивность
Интерактивность нужна прежде всего для того, чтобы протестировать прототип с реальными пользователями будещего сайта. Для минимального тестирования достаточно работающих ссылок и алертов (pop-up диалогов). При помощи ссылок уже можно проверить навигацию и структуру сайта – насколько последние понятны пользователям. Алерты можно использовать для эмуляции электронном почты. Например, после того как пользователь заполняет регистрационную форму, система высылает ему e-mail с кодом подтверждения и с дальнейшими инструкциями по работе с аккаунтом. Так как почты у нас нету, то мы можем показать текст сообщения в алерте – пользователь прочитает этот текст и последует указанным инструкциям, то есть продолжит тестирование сайта.

links.jpg
Помимо взаимодействия со ссылками и кнопками, испытуемый может также вводить данные в формы и скроллировать длинные страницы, что также увеличивает ценность прототипа для тестирования.

В Axure RP Pro есть и другие возможности: динамические панели (которые позволяют делать еще более интерактивные прототипы) и документация прототипа (можно добавлять аннотации и спецификации к страницам, виджетам, шаблонам и др.). Но я эти возможности пока не использовал на практике, поэтому сказать о них ничего не могу.

Заключение
В Axure RP Pro можно быстро создавать эстетичные прототипы, пригодные для юзабилити-тестирования.

Я увидел два недостатка, которые довольно сильно меня раздражали: проблемы с выделением группы объектов и “тормознутость” интерфейса, которая вероятно связана с тем, что программа написана под .NET Framework 2.0.

Вы можете скачать триальную версию (на 30 дней) Axure RP Pro 4.2 на сайте Axure RP.

Ссылки по теме:

  • bobrdobr
  • memori
  • del.icio.us
  • Digg
 Понравилась заметка? Подписывайся на обновления блога!

О статье




Самые популярные статьи
[?]




Реклама



Стоит также почитать



Контактная информация



Заказ

Warning: include(/h/guicciru/htdocs/tsbmailer/show_form.php): failed to open stream: No such file or directory in /home/sites/guicci.ru/htdocs/wp-content/themes/hemingway-reloaded-10/single.php on line 192 Warning: include(): Failed opening '/h/guicciru/htdocs/tsbmailer/show_form.php' for inclusion (include_path='.:/usr/share/php:/usr/share/pear') in /home/sites/guicci.ru/htdocs/wp-content/themes/hemingway-reloaded-10/single.php on line 192