В работе веб-дизайнера часто встречаются слова wireframe, prototype и mockup. Эти три типа инструментов не то же самое. Даже при том, что имена этих инструментов иногда  путают неопытные разработчики, и не всегда могут сказать чем отличается одно от другого.

  • Wireframe (Каркас)  — это низко детализированное представление дизайна. Вайрфрейм это скелет вашего дизайна. Главное в вайрфрейме должны быть представлены все важные элементы конечного продукта.
  • Mockup (Макет) — это средне или высоко детализированное статичное представление дизайна. Очень часто мокап — это черновик дизайна или даже фактический дизайн-макет.
  • Prototypes   Прототипы динамичные. Прототип, часто путают с вайрфреймом это средне или высоко детализированное представление конечного продукта, которое имитирует взаимодействие пользователя с интерфейсом. Некоторые прототипы могут моделировать точный стиль веб-сайта или мобильного приложения. Прототип может быть красивым или ужасным, но работать он должен с функциональностью конечного продукта.

InVision

InVision

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

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

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

15-дней действует пробная версия, для того чтобы попробовать и разобраться с программой.

Pidoco

Pidoco

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

Этот инструмент также может быть использован для каркасного прототипирования, поэтому он является полезным инструментом, на протяжении всего процесса проектирования. Ваша работа может быть предварительно просмотрена в вашем веб-браузере / или на мобильном устройстве.

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

Proto.Io

Proto.Io

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

С Proto.io Вы можете создать прототип для любого размера экрана. Вы можете удовлетворить все свои потребности разработки прототипа на этой единственной платформе. Используйте его во время ранних стадий дизайна, для создания каркасов и макетов. В последних стадий дизайна используйте его, чтобы создать динамичные, интерактивные высокочастотные прототипы для тестирования.

Не требует знание кода, и так прост в использовании, что Вы можете начать создавать потрясающие прототипы сразу же, без дополнительных навыков. Используйте Proto.io в своих интересах 15-дней бесплатно.

WebFlow

WebFlow

WebFlow не стандартный инструмент прототипирования. Все, что Вы создаете на этой платформе, включая потрясающие высокочастотные прототипы, приводится в действие готовыми HTML/CSS и JavaScript.

Вы можете плавное переместиться в стадию производства или представить свой дизайн, с отзывчивым кодом, разработчику. У Webflow есть другие особенности, в которые вам также пригодятся, включая работу командой и автоматическое управление.

PowerMockup

PowerMockup

PowerMockup служит дополнением к Microsoft PowerPoint (программе создания презентаций), давая возможность создавать вайрфреймы  и макета.

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

Lucidchart

Lucidchart

Lucidchart обладает обширной библиотекой элементов дизайна, c которым Вы можете быстро создать статические макеты и каркасы. Если вайрфрейм или мокап это все, что вам нужно, то это приложение отлично вам подходит.

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

HotGloo

HotGloo

С HotGloo, вы можете создавать прототипы прямо в вашем браузере. У Вас будет доступ к библиотеке в 2,000+ элементов пользовательского интерфейса, а также учетную запись нескольких лицензий для совместной работы и тестирования. HotGloo хорошо документирована и поддерживается видеоуроками и вебинарами. И самый большой плюс этого сервиса, это не только то, что вы можете пользоваться им прям в браузере, а в том что он переведен на русский язык).

Вывод

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

Смотрите также