UXPUB 🇺🇦 Дизайн-спільнота

Cover image for Генерация HTML, CSS прямо из Sketch с помощью Protoship
Редакція
Редакція

Опубліковано • Оновлено

Генерация HTML, CSS прямо из Sketch с помощью Protoship

Protoship - это генератор кода для дизайнеров и фронт-енд программистов, который создает компоненты HTML, SASS и React из дизайна Sketch. Вы сможете перейти от дизайна к работающему приложению в считанные часы вместо того, чтобы вручную писать тонны строк в HTML и CSS. Обычно подобные заявления встречаются с большим скепсисом. Можно ли будет использовать сгенерированный код? Правильно ли будут заданы позиции элементов? Корректно ли будут названы CSS-классы, и насколько их можно будет использовать в будущем? Мы ответим на все эти вопросы, но сначала посмотрите это короткое превью! В отличие от результатов работы типичных инструментов по генерации кода, Protoship действительно генерирует качественный код, неотличимый от того, который разработчик напишет вручную. С его помощью можно сократить рутинную работу вроде экспорта и сборки исходников, измерения границ и отступов, игры с позициями объектов для достижения идеальной пиксельной точности, оптимизации CSS и прочих забот фронт-енд разработки. Мы также извлекаем компоненты React из вашего дизайна, выделяем их свойства и даже генерируем JSON-схему с предзаполненным контентом. С помощью Protoship мы хотим вернуть эти горячие деньки быстрой разработки приложений, как было в эпоху xBase, Visual Basic, Delphi и т.д. Важная цель продукта - упростить и ускорить сложный процесс передачи исходников дизайна в разработку. Вместо передачи визуальных артефактов, никак не связанных с будущим кодом, Protoship предлагает более интегрированный подход, в котором можно свободно перейти от дизайна к коду и наоборот. Все это - довольно масштабная задача, так что каждый ее этап будет реализован по отдельности. Protoship Teleport - еще один инструмент из этой ниши, который недавно был представлен в ранней бета-версии. Teleport позволяет вам конвертировать существующий вебсайт в дизайн-проект Sketch и использовать его как шаблон для последующей работы. Узнайте больше о Teleport из ознакомительного поста. Мы также в деталях расписали все мотивации к разработке Protoship в отдельном посте.

Подпишитесь, чтобы получить доступ к ранней бета-версии.

Как видите, продукт все еще на ранней стадии разработки, нам предстоит много работы. Тем не менее, он уже полезен пользователям - мы больше не можем представлять, как это писать код в HTML и CSS вручную. После того, как вы попробуете поработать в Protoship, вы тоже вряд ли сможете! Подпишитесь на получение ранней приватной бета-версии на protoship.io#signup и присоединитесь к ранним пользователям, которые помогут нам развивать продукт в верном направлении.


Перевод статьи Jasim A Basheer

Найновіші коментарі (0)