Какими инструментами для прототипирования интерфейсов вы пользуетесь Статьи редакции
И список из нескольких полезных сервисов.
Пользователи сайта Designer News поделились своими любимыми инструментами для прототипирования. В основном они пользуются продуктами от Adobe, Sketch, Figma, но выделили и несколько других сервисов.
Axure
Инструмент для создания интерактивных прототипов сайтов и мобильных приложений. Разрабатывает Axure одноименная компания, основанная в 2002 году. С помощью него можно также создавать диаграммы, оформлять документацию и так далее.
Компания предлагает бесплатный 30-дневный пробный период.
Protopie.io
Призер престижной дизайн-премии Reddot 2017 года. Инструмент позволяет создавать интерактивные прототипы без кода и запускать их на устройствах на базе iOS и Android.
Стоимость бессрочной подписки на сервис составляет $99. Есть бесплатный пробный период — 7 дней. Его можно продлить на 10 дней, зарегистрировавшись на платформе Protopie Studio.
Fluid UI
Сервис для прототипирования сайтов и мобильных приложений в браузере. Пользователи Designer News отметили его простоту и скорость.
У инструмента есть бесплатная версия для некоммерческих пользователей (например, для тех, кто только учится дизайну), а также руководство гарантирует полный возврат средств в течение 30 дней после первой оплаты в случае, если пользователя что-то не устроит.
Click Dummy
Плагин для Sketch, с помощью которого можно быстро создавать интерактивные HTML-страницы из статичных прототипов.
Flinto
Инструмент для прототипирования приложений на macOS и iOS. Позволяет создавать интерактивные и анимированные прототипы, делиться ими с коллегами и тестировать на нескольких устройствах. Есть бесплатная 14-дневная версия.
Framer X
Инструмент для прототипирования, в котором прототипы создаются на основе кода. При этом собрать нужный макет можно и только визуальными средствами — так что пользоваться Framer X можно и без знаний программирования. Позволяет быстро тестировать полученные прототипы и делиться ими в облаке.
Предлагает бесплатную двухнедельную подписку.
Какие инструменты используете вы?
Пффф, слабаки. Paint. За 5 минут любой прототип можно набросать.
набросайте интерактивный прототип, пожалуйста
Комментарий недоступен
мы бедный стартап. предлагаем долю, как поднимемся и станем известными
Плюс за старание
Чтобы что, поиграть с вами в игру принеси мне камень?
ахахахахах полный хохотач просто ))))))))))))))
Adobe XD + Illustrator + Photoshop
А про Figma автор забыл -_-
Читайте внимательнее:
В основном они пользуются продуктами от Adobe, Sketch, Figma, но выделили и несколько других сервисовFigma
Да Figma топчик, причем думаю скоро будет и там анимация интерфейса.
скорее бы
Комментарий недоступен
Олды здесь
Если олды — то у Adobe был классный Fireworks, который они убили (и в итоге выпустили XD)
На личной практике, вёрстка выходит дороже, т. к. нужно прикручивать какой-то шаблонизатор, чтобы не копипастить, например, одну и ту же шапку со страницы на страницу.
Плюс нужно куда-то её выкладывать, настраивая флоу, хоть на том же git hooks (можно, конечно, всё фигачить напрямую на фтп).
Плюс нет интерактивных комментариев, которые может накидать заказчик.
Плюс, если предполагаются какие-то нестандартные контролы, их всё равно быстрее накидывать в графическом редакторе.
Профит тоже есть, но чем больше правок, тем быстрее он тает.
фотошоп и xd (ну и иллюстратор)
Охх, фотошоп, это же путь страдающей улитки
Лист бумаги и ручка для варфреймов, а для остальной детализации Скетч. В нём же и дизайн, и прототипы.
Лично мне нравится для черновиков https://balsamiq.cloud. Очень быстро всё и в облаке.
Ранее я работал в axure. Он требовательный к ноутбуку, довольно сложный и многоуровневый. Зато в нём можно что угодно делать и интерактивные элементы мутить (выпадающие списки / анимацию / итп). Когда-то мне он очень нравился, но я больше не рисую чистовые макеты, а делаю только черновые и отдаю дизайнеру чтобы рисовал уже в ФШ или скетче.
Как-то раз я сделал прототип сайта на тильде. Для того, чтобы прикинуть что будет с контентом это очень удобно. Но никаких сложных элементов там не замутить.
А за статью спасибо, узнал про парочку новых сервисов.
Sketch
!
Так прототипирование или дизайн? По картинкам кажется, что второе.
Комментарий недоступен
У себя используем Adobe XD + готовый набор для вайрфрнйминга Platforma. Экспортируем страница прототипа в PNG, закидываем в Invision App, перевязываем, готово.
InVision очень удобен в плане дальнейшего обсуждения и комментирования.
С последним обновлением в Adobe XD завезли интересную штуку — авто анимацию. Для пользователей Windows довольно удобная фича. Не всегда работает как хочется, но в будущем подтянут.
Но вы только взгляните как можно использовать это https://dribbble.com/shots/5452024-Smart-Fridge-AR-Drag-Interaction-with-XD-Auto-Animate
Обычно так:
Листы а4 для разработки схем и логики. Если проект сложный, то переношу все в axure, с детальной проработкой и интерактивом.
Для новичков:
Для начинающих советую Balsamiq Mockups (десктоп версия). Она очень простая в освоении. Порог для входа минимальный.
Я думал все скетчем пользуются и это стандарт уже, а про него не написали даже. Или он для других задач?
Moqups.com
https://www.invisionapp.com/
и для сайтов и для приложений
Но, все-таки нормальные прототипы апп, где есть например дропдауны и драг энд дроп, на нем так себе делать
Marvel, ранее Pop до поглощения
Axure. Очень удобно и интерактив легко делать.
а интерактивные прототипы "Protopie.io", можно потом прикручивать к разработке и коду ?
Adobe XD
Раньше было много акшуры у нас, сейчас ее вытеснил скетч + инвижн, но в акшуре можно показать сложную логику, так что до конца она не исчезла. Собираемся пробовать фигму.
бумага и framer x
Бумага - каеф. Попробуйте ipad pro + apple pencil + one note.
ну не, я лучше синтик какой-нибудь прикуплю, чем с айпэдом извращаться
Sketch + Marvel + Principle
Sketch cloud
А где обзор на sketch, adobe xd, axure и figma ? :( Забыл про ветеранов(((
Proto.io
сразу дизайн рисую.
Комментарий удален модератором
попробуйте скетч, фигма на 100+ экранах начинает _слегка_ притормаживать
Но все минусы фигмы компенсируются их реализацией дизайн систем, возможностью командной работы над одни «файлом»
не, допускать людей в свои файлы я точно не собираюсь
Интересно как вы работаете в команде
репозиторий
Это да, но скетч или фигму хотя бы попробуйте.