Релиз альфа-версии C4 Studio, новый инструмент для прототипирования

С гордостью представляем альфа-версию C4 Studio.

Несмотря на наличие множества инструментов для прототипирования, и процессов для коммуникации, пропасть между дизайном и разработкой все еще велика. На протяжении нескольких лет, мы могли наблюдать восхождение многих инструментов для протопирования на “сцену” дизайна. Некоторые уходили из нашего поля зрения, а такие, как Flinto, Framer, Principle и Pixate, остались и развиваются. И, в то время, пока новые продукты продолжают появляться на рынке (Adobe XD), становится ясно, что эта ниша до сих пор открыта для инновационных предложений… и пропасть все еще есть.

Что такое C4 Studio?

C4 Studio это новый класс в дизайне для мобильных устройств. Разработан для дизайнеров и разработчиков, C4 Studio позволяет запросто анимировать дизайн и генерировать готовый код для разработчика. Дизайнер может работать в Sketch, анимировать дизайн в C4 Studio и экспортировать уже готовый код. Разработчик может адаптировать код согласно своим нуждам для более простой и быстрой интеграции в уже существующие проекты. Если вы просто хотите просмотреть анимацию, воспользуйтесь окном просмотра.

Интеграция со Sketch

C4 Studio подключается напрямую в файл Sketch. После создания нового проекта, пользователь может запросто прилинковать файл Sketch и выбрать начальную / конечную точку для перехода. При внесении изменений в файле, они сразу отобразятся в C4 Studio. В отличии от других инструментов для прототипирования, где плагин Sketch создает одностороннюю связь (например изменения в прототипе могут быть утеряны в оригинальном файле), наш инструмент работает корректно.

Начальные/конечные состояния

Фундаментальная парадигма C4 Studio состоит в том, чтобы создать начальные и конечные состояния, между которыми происходит анимация. Например: дизайнер создает закрытое и открытое состояние меню, а затем, может создать переход между этими состояниями в C4 Studio. После создания начального и конечного состояния в Sketch, вы можете анимировать этот переход в C4 Studio

Переходы

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

Множественные переходы

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

Привычные временные рамки

Наш подход к анимации очень понятный. C4 Studio использует слайдер для настройки анимации. Вы можете регулировать временные интервалы, объекты и даже индивидуальные свойства каждого объекта.

Экспорт

Это звездный час C4 Studio. Мы создали превосходную систему экспорта кода, которая позволяет генерировать просмотры, контроллеры и даже целые Xcode проекты. Код, сгенерированный C4 Studio хорошо построенный, легкий и легко внедряемый в существующие проекты. Если вас это заинтересовало, посмотрите на руководства по кастомной кнопке (7,5 мин) и кастомному меню (10 мин), чтобы убедиться, как быстро вы можете внедрить элементы из C4 Studio в проекты, которые используют конструктор интерфейсов.

Предварительный просмотр кода

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

А также видео

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

Хотите испытать C4 Studio?

Как мы и говорили ранее, в данный момент, мы предлагаем закрытую альфа-версию. Мы ищем людей, которые работают на пересечении дизайна и разработки, и которые захотели бы попробовать C4 Studio. Если вас заинтересовал наш проект: Зарегестрируйтесь Для получения детальной информации, функций и уроков, посетите наш сайт: www.c4studio.co

---

Перевод статьи C4Studio