+7 (812) 600-80-74

yagooru@yandex.ru

Наши услуги

+7 (812) 600-80-74

yagooru@yandex.ru

Обзор 21 инструмента для создания прототипов

Создание прототипа – комплекс мероприятий по подготовке макета будущего сайта. Данный подход вытесняет классическую схему, при которой дизайнер рисует эскиз, а программист добавляет код.

Работы по прототипированию проводятся с использованием профильного ПО. Оно помогает быстро добиться результата, автоматизирует большинство операций. Значительное количество функций делает процесс разработки более гибким и простым.

Чтобы сделать полноценный прототип, нужен набросок и базовое владение программным продуктом.

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

Критерии оценки

При разборе доступных инструментов будут использоваться следующие критерии.

  • Язык интерфейса. Важным преимуществом сервиса является возможность работы на русском языке. Это упрощает взаимодействие подрядчика и клиента, позволяет быстро ставить и корректировать задачи. У исполнителя не возникает сложностей со шрифтами и проблем с отображением элементов.

  • Бесплатный тариф. Наличие бесплатного тарифа (пробного периода) облегчает знакомство с продуктом. Веб мастер может изучить его структуру, понять, подходит сервис или нет. Если использование ПО начинается с оплаты, появляются дополнительные риски.

  • Минимальный тариф. Стоимость самого доступного тарифа, предполагающего внесение средств. Параметр влияет на целесообразность применения продукта в долгосрочной перспективе.

  • Особенности. Каждый инструмент обладает собственными особенностями. Один экономит время на создание блоков, другой – позволяет лучше работать с лендингами, третий – имеет оптимизированную схему расположения элементов. Анализ всех перечисленных возможностей помогает выбрать лучший вариант.

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

  • Интеграция. Возможности интеграции не менее важны. Они обеспечивают совместное использование нескольких инструментов, позволяют создать проект в комфортных условиях.

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

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

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

Axure

Популярное приложение по созданию прототипов, используемое многими специалистами. Возможна работа с website и интернет-приложениями. Предусмотрена полноценная поддержка Windows и MAC.

  • Язык – только английский.

  • Бесплатный тариф – пробный период на 1 месяц, в дальнейшем придется приобретать лицензию.

  • Минимальный тариф – 29$ в месяц для одного пользователя.

  • Особенности: наиболее известное приложение, посвященное работе с прототипами. Возможно создание каркасов, макетов, маршрутов перехода посетителей и т.д. Разработчики интенсивно развивают платформу, регулярно добавляют новые функции.

  • Интеграция – данные о совместимости с прочими системами отсутствуют.

  • Версия – только для десктопов.

  • Мобильное приложение – отсутствует.

  • Техническая поддержка – общение по электронной почте.

До 87% компаний из списка Fortune использовали Axure для создания прототипов. Столь высокая популярность обусловлена обширными возможностями продукта, стабильной работой и регулярными обновлениями.

Axure.png

Origami Studio

Бесплатное приложение, доступное всем желающим. Разработчиком ПО является Facebook, что говорит о качественной проработке продукта и высоких интеграционных возможностях. Попробовать Origami Studio стоит новичкам, интересующимся созданием сайтов. Это позволит освоить специальность, не расходуя средства на коммерческие проекты.

  • Язык – только английский.

  • Бесплатный тариф – полностью бесплатное ПО.

  • Минимальный тариф – платное использование продукта не предусмотрено.

  • Особенности: разработку программного обеспечения осуществляли специалисты Meta. Присутствуют значительные коммуникативные возможности, позволяющие делиться прототипами и обсуждать их.

  • Интеграция – полная совместимость со Sketch.

  • Версия – только для десктопов, работающих под управлением MAC.

  • Мобильное приложение – присутствует, возможна работа с Android и iOS.

  • Техническая поддержка – взаимодействие с модераторами и другими пользователями в тематических сообществах.

В роли основных клиентов выступают социальные сети Facebook и Instagram. Кроме того, на базе Origami Studio создано множество любительских сайтов.

Origami Studio.jpg

Proto.io

Сервис для коллективной работы над прототипами. Присутствует возможность быстрого внесения правок и обсуждения изменений. Каждый параметр созданного прототипа можно проверить. Поддерживаются классические и мобильные версии сайтов.

  • Язык – только английский.

  • Бесплатный тариф – пробный период на 2 недели.

  • Минимальный тариф – ежемесячная оплата в размере 29$.

  • Особенности: взаимодействие с прототипами без подключения к интернету. Офлайн-работа на десктопе и мобильном устройстве.

  • Интеграция – полная совместимость с Photoshop, Sketch и Dropbox.

  • Версия – только для браузеров.

  • Мобильное приложение – присутствует, возможна работа с Android и iOS.

  • Техническая поддержка – помощь осуществляется посредством системы тикетов в Zendesk.

Среди наиболее известных клиентов сервиса – Amplify и Salesforce. Наличие пробной бесплатной версии нередко приводит к использованию платформы в образовательных целях.

Proto io.png

Vectr

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

Каждый проект получает собственный URL-адрес. Такой подход позволяет быстро делиться результатами деятельности, упрощает согласование.

  • Язык – только английский.

  • Бесплатный тариф – возможность бесплатного использования без ограничений.

  • Минимальный тариф – абонентская плата не предусмотрена.

  • Особенности: работа на десктопе и в мобильном приложении. Полная синхронизация данных. Оперативная передача информации коллегам и заказчику.

  • Интеграция – совместимость с Wordpress.

  • Версия – для браузеров и для десктопов.

  • Мобильное приложение – отсутствует.

  • Техническая поддержка – прямая связь с разработчиками через специальную форму.

У платформы нет популярных клиентов, однако она активно используется частными лицами.

Vectr.png

InVision

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

  • Язык – только английский.

  • Бесплатный тариф – только 1 пользователь (работа с единственным прототипом).

  • Минимальный тариф – абонентская плата в размере 15$ в месяц.

  • Особенности: возможность быстрой адаптации «под себя», слаженная и продуктивная работа в команде.

  • Интеграция – полная совместимость с Slack, Trello, Basecamp, GitHub и Jira.

  • Версия – только для браузеров.

  • Мобильное приложение – отсутствует.

  • Техническая поддержка – консультирование пользователей относительно программного продукта через Twitter.

Сервис пользуется значительной популярностью среди крупных компаний. С его помощью разработаны прототипы для официальных сайтов Sony, Adobe и Nike.

Invision-Studio.jpg

Adobe Experience Design

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

  • Язык – только английский.

  • Бесплатный тариф – пробная версия сроком действия 7 дней.

  • Минимальный тариф – абонентская плата в размере 3322 руб. в месяц.

  • Особенности: оперативный переход от работы с прототипом в любое программное обеспечение производителя. Комфортный просмотр внесенных изменений посредством планшетов и смартфонов.

  • Интеграция – все продукты компании.

  • Версия – для десктопов под управлением Windows 10.

  • Мобильное приложение – присутствует.

  • Техническая поддержка – для получения консультаций требуется заполнить форму на сайте.

Среди популярных клиентов платформы компания Airbnb. Высокая стоимость продукта отпугивает большинство пользователей в России, несмотря на многочисленные преимущества.

Adobe Experience Design.jpg

Principle

Прогрессивное ПО для создания анимированных прототипов. Основной недостаток – работа только с операционными системами Apple.

  • Язык – только английский.

  • Бесплатный тариф – триал-период сроком на 2 недели.

  • Минимальный тариф – абонентская плата в размере 129$ в месяц.

  • Особенности: специализация на анимированных прототипах, предоставление обширных возможностей пользователям платформы Apple.

  • Интеграция – отсутствует.

  • Версия – для десктопов под управлением MAC.

  • Мобильное приложение – отсутствует.

  • Техническая поддержка – общение между пользователями и консультантами организовано через Facebook.

На счету Principle немало именитых клиентов: Apple, Facebook, Google, Amazon и Starbucks. Созданные сайты отличаются практичностью и прекрасной эстетической составляющей.

Principle.jpg

Just in mind

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

  • Язык – только английский.

  • Бесплатный тариф – присутствует.

  • Минимальный тариф – абонентская плата в размере 19$ в месяц.

  • Особенности: множество дополнительного контента и функциональных возможностей, наличие готовых шаблонов.

  • Интеграция – совместимость с JIRA, Microsoft TFS и Doors.

  • Версия – для десктопов.

  • Мобильное приложение – отсутствует.

  • Техническая поддержка – использование системы тикетов Zendesk.

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

Just in mind.jpg

Moqups

Moqups – востребованный сервис по разработке и редактированию прототипов. Его основная особенность – отсутствие ограничений по числу пользователей на платных тарифных планах. Это особенно важно для крупных проектов с большим количеством участников.

  • Язык – только английский.

  • Бесплатный тариф – работа над одним проектом с количеством не более 500 элементов без ограничений по времени.

  • Минимальный тариф – абонентская плата в размере 19$ в месяц.

  • Особенности: отсутствие ограничений по числу пользователей, продуктивная командная работа.

  • Интеграция – совместимость с JIRA, Confluence.

  • Версия – для браузеров.

  • Мобильное приложение – отсутствует.

  • Техническая поддержка – взаимодействие с пользователями через форму обратной связи на официальном сайте.

Многие известные компании использовали Moqups для разработки своих сайтов. Среди них: Intel, Cisco и Mozilla.

Moqups.png

Marvel

Инструмент с названием, созвучным известной вселенной. Его основная «фишка» - возможность создания прототипов для любых платформ, включая «умные» часы.

  • Язык – только английский.

  • Бесплатный тариф – разработка двух прототипов без ограничений по времени и возможности скачивания.

  • Минимальный тариф – абонентская плата в размере 14$ в месяц.

  • Особенности: создание прототипов для любых платформ. Оптимальное решение для студии с разносторонним профилем.

  • Интеграция – совместимость с Adobe Photoshop, Google Drive и Dropbox.

  • Версия – для браузеров.

  • Мобильное приложение – присутствует.

  • Техническая поддержка – общение в рамках корпоративного онлайн-чата.

Сервис используется для реализации коммерческих и муниципальных проектов. Наиболее крупные компании, воспользовавшиеся им: Dice, M&S и FinTech.

Marvel.jpg

Mockplus

Программа позволяет не только создавать прототипы, но и сканировать QR-коды. Пользователю доступно до 3 000 иконок, способствующих реализации самых смелых решений.

·         Язык – только английский.

·         Бесплатный тариф – присутствует.

·         Минимальный тариф – абонентская плата в размере 129$ в год.

·         Особенности: комфортная работа с мобильными устройствами, сканирование QR-кодов для доступа к прототипам, обширные возможности для творчества.

·         Интеграция – отсутствует.

·         Версия – для десктопов.

·         Мобильное приложение – отсутствует.

·         Техническая поддержка – пользователи могут задать вопросы через Скайп или электронную почту.

Многогранность ПО привлекает многих крупных клиентов. Одним из основных заказчиков является Tencent – лидер игровой индустрии.

Mockplus.png

UXPin

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

  • Язык – только английский.

  • Бесплатный тариф – пробная версия с ограничением в 1 месяц.

  • Минимальный тариф – абонентская плата в размере 19$ в месяц.

  • Особенности: обширный функционал, позволяющий работать с «умными» часами. Единственное ограничение – устройства должны управляться Android OS.

  • Интеграция – поддержка Sketch и Photoshop.

  • Версия – для десктопов под управлением Windows и MAC OS.

  • Мобильное приложение – присутствует, поддерживает платформы Android и iOS.

  • Техническая поддержка – общение посредством формы обратной связи и электронной почты.

Среди известных клиентов стоит выделить HBO и CHECK24.

UXPin.jpg

Flinto

Flinto подходит для работы с типовыми и шаблонными решениями. Он позволяет создавать оригинальные проекты, направленные на решение различных задач. Присутствует поддержка передовых операционных систем.

  • Язык – только английский.

  • Бесплатный тариф – пробная версия на 30 дней.

  •  Минимальный тариф – разовая покупка за 99$ либо ежемесячная оплата по 20$.

  • Особенности: множество шаблонов и оптимизированных решений для Android OS. Богатый ассортимент дополнений.

  • Интеграция – отсутствует.

  •  Версия – для десктопов под управлением Windows и MAC OS, а также Web-версия.

  • Мобильное приложение – присутствует, только для iOS.

  • Техническая поддержка – переписка с консультантами посредством электронной почты.

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

Flinto.png

Sketch

Sketch – узкоспециализированное решение, созданное специально для Mac. Здесь присутствует все необходимое для разработки прототипов, их последующей отладки и оптимизации.

  • Язык – только английский.

  • Бесплатный тариф – пробная версия на 30 дней.

  • Минимальный тариф – отсутствует, предусмотренная разовая покупка софта за 99$.

  • Особенности: ориентация исключительно на MAC. Множество возможностей для всех категорий специалистов.

  • Интеграция – возможна конструктивная работа с прочими сервисами по созданию прототипов.

  • Версия – для десктопов под управлением MAC OS.

  • Мобильное приложение – присутствует, только для iOS.

  • Техническая поддержка – общение с пользователями посредством формы обратной связи.

Среди реализованных проектов сайты для ряда известных компаний: Google, DropBox, Sega, Booking, IBM и Twitch.

Sketch.png

OmniGraffle

Еще одно узкоспециализированное решение для MAC и iOS. По факту, это универсальный инструмент, одной из функций которого является подготовка прототипов.

  • Язык – только английский.

  • Бесплатный тариф – пробная 2-недельная версия.

  • Минимальный тариф – отсутствует, предусмотренная разовая покупка за 99$.

  • Особенности: ориентация исключительно на MAC. Функция по созданию прототипов – одна из многих, доступных пользователю.

  • Интеграция – поддержка Stenciltown.

  • Версия – для десктопов под управлением MAC OS.

  • Мобильное приложение – присутствует, только для iOS.

  • Техническая поддержка – переписка пользователей и службы поддержки ведется посредством электронной почты.

Программное обеспечение используется вебмастерами с широким профилем. Оно решает обширный спектр задач, удобно в настройке.

OmniGraffle.png

Pidoco

Веб-сервис с возможностью коллективной работы над проектом. Наличие продуманного интерфейса упрощает решение сложных задач большим числом пользователей.

  • Язык – только английский.

  • Бесплатный тариф – пробная версия на полный календарный месяц.

  • Минимальный тариф – 12$ в месяц за работу над 2 проектами.

  • Особенности: интуитивный интерфейс, возможность подключения большого количества исполнителей.

  • Интеграция – посредством API.

  • Версия – для браузеров.

  • Мобильное приложение – присутствует, только для iOS.

  • Техническая поддержка – вопросы, связанные с использованием продукта, решаются посредством e-mail.

В «портфолио» сервиса находятся сайты для Finnlabs и Unimall.

Pidoco.jpg

Mockingbird

Оптимальное решение для новичков. Сервис позволяет создавать простые прототипы, предъявляет минимальные требования к уровню подготовки вебмастеров.

  • Язык – только английский.

  • Бесплатный тариф – пробная версия на 6 дней.

  •  Минимальный тариф – 12$ в месяц за работу над 3 проектами.

  • Особенности: максимальная простота, возможность создать несложный прототип за несколько минут.

  • Интеграция – отсутствует.

  • Версия – для браузеров.

  • Мобильное приложение – отсутствует.

  • Техническая поддержка – консультации предоставляются через Twitter и e-mail.

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

Mockingbird.jpg

iPlotz

Еще один простой сервис для начинающих исполнителей. Есть все необходимое для выполнения базовых операций.

  • Язык – только английский.

  • Бесплатный тариф – предусмотрен полностью бесплатный тариф с возможностью работы над одним прототипом.

  • Минимальный тариф – 15$ в месяц.

  • Особенности: простота и лаконичность, минимальный порог вхождения.

  • Интеграция – отсутствует.

  • Версия – для браузеров и десктопов.

  • Мобильное приложение – присутствует.

  • Техническая поддержка – консультации через Twitter и e-mail.

В «послужном списке» iPlotz множество работ начинающих исполнителей.

iPlotz.png

Proto Share

Посредством сервиса создается неограниченное число проектов, выполняется широкий спектр операций по редактированию.

  • Язык – только английский.

  • Бесплатный тариф – пробный период продолжительностью 30 дней.

  • Минимальный тариф – 29$ в месяц.

  • Особенности: эффективная работа с большим числом проектов, множество возможностей для настройки.

  • Интеграция – JIRA, Confluence и Google Drive.

  • Версия – для браузеров.

  • Мобильное приложение – присутствует.

  • Техническая поддержка – для получения консультаций необходимо воспользоваться формой обратной связи на официальном сайте.

Наиболее яркие примеры прототипов представлены сайтами Fox и Universal.

Proto Share.jpg

MockFlow

Богатый на инструменты сервис, позволяющий работать с любыми проектами.

  • Язык – только английский.

  • Бесплатный тариф – двухнедельный пробный период.

  • Минимальный тариф – 14$ в месяц.

  • Особенности: получение множества дополнительных инструментов при оплате лицензии.

  • Интеграция – Google Drive.

  • Версия – для десктопов.

  • Мобильное приложение – отсутствует.

  • Техническая поддержка – взаимодействие с консультантами посредством электронной почты.

Программное обеспечение использовалось для разработки сайтов следующих компаний: Autodesk, Disney и Aweber.

MockFlow.jpg

Mockup Builder

Инструмент начального уровня, содержащий все необходимые функции.

  • Язык – только английский.

  • Бесплатный тариф – двухнедельный пробный период.

  • Минимальный тариф – 7$ в месяц или один прототип.

  • Особенности: простота освоения, наличие массы возможностей.

  • Интеграция – отсутствует.

  • Версия – для браузеров.

  • Мобильное приложение – отсутствует.

  • Техническая поддержка – получение подробных консультаций при помощи электронной почты.

Среди клиентов немало известных компаний, таких как Dell и Siemens.

Mockup Builder.jpg

Заключение

Использование качественных инструментов для прототипирования – залог получения современного и функционального ресурса. Оптимальный вариант – применение популярных программ с обширным комьюнити и полноценной технической поддержкой.

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