Доклад

Автоматизация дизайна на JS

На русском языке

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

Обычно это делают верстальщики, если автоматизация недоступна. Помочь может автоматизация в Adobe, но она сильно ограничена, так как Adobe не «выпускает» в интернет, или текст может быть длиннее дизайна, и его необходимо уменьшать. Либо какие-то элементы дизайна могут отсутствовать. Отдельная боль для менеджеров — наличие ошибок и отсутствие отчетности. Обновление данных и проверка количества макетов — важная задача, которую автоматизация помогает решать.

У диджитал-дизайнеров есть Figma и аналоги, которые решают часть проблем. Но макеты из них не подходят для полиграфии. В полиграфии CMYK, а не RGB, миллиметры, а не пиксели, шрифты надо переводить в кривые… Поэтому я начал разрабатывать экстеншены, которые позволили выйти за пределы Adobe: получать данные из Google-таблиц, делать автоматическую верстку, сохранять готовые макеты на сайт клиента. И все быстро и с проверкой данных.

После создания подобных систем я сконцентрировался вообще на отказе от Adobe при масштабировании дизайна. Современный JS позволяет создавать PDF-файлы с любыми шрифтами, вкладывать графику или даже делать PDF-файлы из других PDF-файлов. Так я сделал движок для генерации графики.

Спикеры

Приглашенные эксперты

Расписание