Бумага

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

Естественно, у бумаги есть и свои недостатки: она не подойдёт, если вы хотите оценить влияние цвета на удобство использования приложения и другие визуальные тонкости. Плюс работа будет затруднена, если члены команды находятся далеко друг от друга. Чтобы эту проблему решить, можно воспользоваться приложением Prototyping on Paper, которое существует только для iPhone. Оно позволяет сфотографировать ваши зарисовки экранов, а затем связать их через систему линков. Линки соответственно прикрепляются к тем частям фотографии, где нарисованы кнопки. Сами прототипы из бумаги могут выглядеть по-разному: например,  так,  так и даже так. На видео выше команда Saatchi Moscow делает всё то же самое, только для рекламы и в большем масштабе. 

 

Proto

Proto.io — сервис для создания прототипов приложений для iPhone, iPad и Android. Его создатели особенно гордятся функционалом Proto, позволяющим имитировать различные типы прикосновений к тачскрину. Очень часто программы для прототипирования (например, Solidify и Wireframe.cc) позволяют просто создавать макеты экранов, но этого бывает недостаточно для того, чтобы понять, как именно будет вести себя приложение в реальности.

Proto добавляет макетам интерактивности. Сначала пользователю предлагается создать макет экрана при помощи богатой библиотеки дизайнерских элементов, а затем добавить эффекты воздействия на каждый элемент. Это может быть пролистывание, масштабирование, удерживание, нажатие, перемещение, повороты и другие формы продвинутой анимации. Прототипы можно протестировать в браузере и на мобильных устройствах. Есть 15-дневный бесплатный доступ, а затем можно выбрать один из тарифных планов, стоимость которых начинается от $24 в месяц.  

 

PowerMockup

PowerMockup — это плагин, позволяющий создавать прототипы в PowerPoint. Удобный, понятный в использовании инструмент без особых изысков и дополнительных функций. После его установки в программе PowerPoint появляется новая панель с набором из сотен элементов для создания макета сайта или приложения. Элементы просто нужно последовательно переносить на слайд.

Также есть возможность создавать свои собственные элементы, добавлять их в библиотеку и делиться ими с другими пользователями. Удобная функция — поиск элементов. Можно ввести в поисковое окно название необходимого элемента, и сервис покажет возможные варианты, в том числе и похожие по смыслу. PowerMockup работает с Office 2007, 2010 и 2013. Лицензия на программу стоит $59,95 для одного пользователя, цена для рабочей группы зависит от количества человек.

 

Wires

Сервис QuirkTools объединяет три различных инструмента: он позволяет проектировать карты сайтов, смотреть, как сайт выглядит на различных устройствах, и создавать макеты страниц будущего сайта или приложения прямо в браузере. Простой, аккуратный интерфейс, «созданный дизайнерами для дизайнеров», как написано на сайте. Он представляет собой трафарет, на который добавляются различные элементы: меню, окна, формы, кнопки, иконки, текст.

К каждому элементу можно прикрепить комментарий, а созданные страницы — залинковать и сохранить в определённой последовательности. Главная фишка — удобство и простота совместной работы над прототипом. У каждого проекта есть постоянный веб-адрес, к которому можно открыть доступ коллегам и клиентам. Они могут вносить свои изменения или оставлять комментарии и пожелания, которые будут видны в реальном времени. Сервис позволяет параллельно работать над тремя проектами совершенно бесплатно.      

 

Antetype

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

Antetype хорош не только своей богатой библиотекой элементов для Windows, OS X,  iOS и Android, которые можно дополнять своими, но также тем, что способен избавить пользователя от рутины, самостоятельно выполняя однотипную работу. Это значит, что при изменении одного элемента сервис может автоматически «подогнать» остальной макет под новые условия. Также есть возможность предпросмотра макета на различных устройствах и множество других интересных функций. Программа стоит $189. Есть 30-дневный бесплатный доступ, льготная цена для студентов.

Фото: Lucas Zanotto