proto.io

Instantly transfer Photoshop and Sketch designs into Proto.io Proto.io

Плагины для вашего любимого инструмента.

Артборды, группы и слои переносятся корректно на ваш холст в Proto.io и полностью готовые к интерактивной анимации

 

 

 

Связывайте экраны

Начните добавлять области простого взаимодействия для переходов по скринам в пользовательском интерфейсе.

 

связывайте скрины в Proto.io

 

Залинковыный экран

 

Добавление взаимодействий

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

 

Добавление взаимодействий

 

Добавление анимации

 

Добавление анимаций

Используйте временную шкалу анимации и состояния Proto.io, чтобы создавать максимально реалистичные прототипы.

 

Добавление анимаций

 

add-animations

 

Синхронизируйте ваш дизайн с прототипом в Proto

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

 

Скачайте исходники для Photoshop и Sketch.

Скачайте для Photoshop и  для Sketch.

Подпишитесь на рассылку

Раз в неделю мы будем присылать на почту дайджест с лучшими материалами

Похожие записи

Полное руководство по дизайну iOS 9 в Sketch

iOS сильно выросла в течение последних лет. С ее iOS 9 апгрейдом, Apple представил новый системный шрифт под названием San Francisco, 3D Touch и многозадачность на iPad. В Xcode вы найдете Stack Views, фантастический инструмент для более адаптивных макетов, гораздо проще Auto Layout.

Самое подробное руководство по дизайну в Sketch

Работая со Sketch последние три года, я освоил ряд ключевых техник, которые значительно улучшили мой рабочий процесс. Так как я, помимо рисования, также обожаю прототипировать и кодить, мне нужен инструмент для быстрого выполнения дизайн-проектов и легкой генерации исходников. Sketch вместе с его плагинами и другие инструменты для прототипирования полностью справляются с этой задачей. Часть 1 Часть 3 Часть 4

Серия уроков Sketch (часть1 из 5): Настройка Sketch

Первое что нам следует изучить, это настройка Sketch. Если вы только начали создавать дизайны для веб и являетесь новичком в Sketch или Photoshop, или вы просто разработчик, желающий включить UI-дизайн в свой репертуар, эти простые уроки по настройке идеально подойдут для быстрого ознакомления с работой Sketch. Часть 2 Часть 3 Часть 4 Часть 5