Сергей Турулин

Про скорость создания шаблонов для генерации PDF в вебе

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

Действительно, генерить макеты по шаблонам — это понятная штука. Есть шаблон и массив данных: заменяем тексты, поправляем стили и генерим PDF. А как делать эти шаблоны? Кто их делает? И что это вообще «шаблон для PDF»?

Проблема шаблонов для PDF в том, что готовые PDF файлы всегда делают из какой-то другой программы: Иллюстратора, Индизайна, Ворда или даже Экселя.

Когда на Yatalks.Yandex рассказывал про генерацию дизайна в вебе, показывал свои шаблоны. Это просто JSON-файлики с описанием макета — цвета, размеры, шрифты, выравнивания и прочее. Первая картинка следующего поста как раз это шаблон. Конечно, пока я их делаю сам. Там ничего сложного, но всё равно их надо делать. Сейчас эти «JSON-файлики» мы уже называем «конфиги», потому что там намного больше информации. Но об этом в следующих постах.

И тут случился показательный кейс про скорость создания макетов, о котором хочу рассказать.

Клиент, который сделал уже всё инфопланирование в вебе на нашем Автокрафте с вёрсткой в Индизайне через плагин, пришёл с новым проектом. Мы посмотрели макеты, которые были средней сложности, и предложили попробовать сгенерить всю навигацию в вебе. Вообще без Индизайна. И чтобы у клиента была возможность самим потом править данные в вебе и генерить PDF полиграфического качества.

Договорились, что после утверждения дизайна мне дадут макеты в Иллюстраторе (рисовали дизайн в нём). Я сделаю шаблоны и загружу их в Автокрафт. После этого кто угодно с доступом может скачать все макеты всего проекта со всех планов (6 этажей) одного типа (шаблона) в один zip-файл в один клик в браузере.

О сроках договорились, что у меня будет 2 недели на создание шаблонов и неделя на правки. Там чуть больше 50 шаблонов средней сложности. Некоторые со статичными данными, но всё равно нужна система нумерации, шаблоны и готовые файлы. Сроки вроде комфортные. Решили попробовать.

И конечно, утверждение дизайнов задержался, сроки сдвинулись, что-то там ещё произошло. В общем на создание 50 шаблонов и генерацию макетов осталось... 2 дня (тут должен быть анимированный растровый смайлик с кривой рожицей из аськи).

Когда я это узнал, был за рулём, но не потерял управление и спокойно доехал до дома. Было решено поступить так: все шаблоны, у которых больше 3 носителей, я буду делать в вебе, а единичные будет верстать дизайнер в Иллюстраторе старой доброй копипастой. Начали мы одновременно.

Что должен делать дизайнер, превращаясь в верстальщика: открыть дизайн, скопировать данные из Автокрафта (из расстановки носителей на плане), заменить данные, перевести тексты в кривые, сохранять в PDF с нужным именем файла.

Что должен делать я: открыть дизайн, создать шаблон нужных размеров с нужным форматированием текста, выгрузить статическую часть (фон и неменяющиеся элементы), загрузить шаблон в Автокрафт, проверить бегло все растровые превью в списке носителей и выгрузить все готовые макеты этого типа пачкой PDF-файлов в кривых.

Скорость оказалась такой: пока я делал все макеты одного шаблона, дизайнер (верстальщик) успевал сделать 3 файла. Всего 3 файла! за то время, пока я успевал сделать шаблон и все существующие макеты по нему, и все возможные будущие макеты этого типа.

В нашем чатике это так и выглядело: 3 сообщения от дизайнера, 1 моё сообщение, 3 сообщения от дизайнера, 1 моё сообщение. Причем в моих шаблонах часто был вариативный фон (зависел от переменных), потому что некоторые элементы были с градиентами и переведены в кривые. Но и это текущая версия JP-движка умеет делать прямо из JSON-шаблона.

www.group-telegram.com/vn/adobescript.com/178

691 viewsSergey Turulin, edited  Jul 12, 2024 at 11:28

Про скорость создания шаблонов для генерации PDF в вебе

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

Действительно, генерить макеты по шаблонам — это понятная штука. Есть шаблон и массив данных: заменяем тексты, поправляем стили и генерим PDF. А как делать эти шаблоны? Кто их делает? И что это вообще «шаблон для PDF»?

Проблема шаблонов для PDF в том, что готовые PDF файлы всегда делают из какой-то другой программы: Иллюстратора, Индизайна, Ворда или даже Экселя.

Когда на Yatalks.Yandex рассказывал про генерацию дизайна в вебе, показывал свои шаблоны. Это просто JSON-файлики с описанием макета — цвета, размеры, шрифты, выравнивания и прочее. Первая картинка следующего поста как раз это шаблон. Конечно, пока я их делаю сам. Там ничего сложного, но всё равно их надо делать. Сейчас эти «JSON-файлики» мы уже называем «конфиги», потому что там намного больше информации. Но об этом в следующих постах.

И тут случился показательный кейс про скорость создания макетов, о котором хочу рассказать.

Клиент, который сделал уже всё инфопланирование в вебе на нашем Автокрафте с вёрсткой в Индизайне через плагин, пришёл с новым проектом. Мы посмотрели макеты, которые были средней сложности, и предложили попробовать сгенерить всю навигацию в вебе. Вообще без Индизайна. И чтобы у клиента была возможность самим потом править данные в вебе и генерить PDF полиграфического качества.

Договорились, что после утверждения дизайна мне дадут макеты в Иллюстраторе (рисовали дизайн в нём). Я сделаю шаблоны и загружу их в Автокрафт. После этого кто угодно с доступом может скачать все макеты всего проекта со всех планов (6 этажей) одного типа (шаблона) в один zip-файл в один клик в браузере.

О сроках договорились, что у меня будет 2 недели на создание шаблонов и неделя на правки. Там чуть больше 50 шаблонов средней сложности. Некоторые со статичными данными, но всё равно нужна система нумерации, шаблоны и готовые файлы. Сроки вроде комфортные. Решили попробовать.

И конечно, утверждение дизайнов задержался, сроки сдвинулись, что-то там ещё произошло. В общем на создание 50 шаблонов и генерацию макетов осталось... 2 дня (тут должен быть анимированный растровый смайлик с кривой рожицей из аськи).

Когда я это узнал, был за рулём, но не потерял управление и спокойно доехал до дома. Было решено поступить так: все шаблоны, у которых больше 3 носителей, я буду делать в вебе, а единичные будет верстать дизайнер в Иллюстраторе старой доброй копипастой. Начали мы одновременно.

Что должен делать дизайнер, превращаясь в верстальщика: открыть дизайн, скопировать данные из Автокрафта (из расстановки носителей на плане), заменить данные, перевести тексты в кривые, сохранять в PDF с нужным именем файла.

Что должен делать я: открыть дизайн, создать шаблон нужных размеров с нужным форматированием текста, выгрузить статическую часть (фон и неменяющиеся элементы), загрузить шаблон в Автокрафт, проверить бегло все растровые превью в списке носителей и выгрузить все готовые макеты этого типа пачкой PDF-файлов в кривых.

Скорость оказалась такой: пока я делал все макеты одного шаблона, дизайнер (верстальщик) успевал сделать 3 файла. Всего 3 файла! за то время, пока я успевал сделать шаблон и все существующие макеты по нему, и все возможные будущие макеты этого типа.

В нашем чатике это так и выглядело: 3 сообщения от дизайнера, 1 моё сообщение, 3 сообщения от дизайнера, 1 моё сообщение. Причем в моих шаблонах часто был вариативный фон (зависел от переменных), потому что некоторые элементы были с градиентами и переведены в кривые. Но и это текущая версия JP-движка умеет делать прямо из JSON-шаблона.

BY Сергей Турулин