Конструктор шаблонов

Элементы конструктора шаблонов

Основное окно Конструктора шаблонов:

1. Меню "Файл" позволяет производить основные манипуляции с проектом шаблона.
2. Меню "Вставка" позволяет вставлять слои, стикеры, ориентации шаблона и т.п.
3. Меню "Слой" позволяет перечитывать слой, включать/выключать режим деформации, работать с фильтрами, динамическими масками, динамической позицией, изменять тип области вписывания с сохранением всех настроек.
4. Меню "Шаблон" позволяет управлять объединением/разделением ориентаций относительно PSD-документа. Также позволяет работать с кадрами при включенном режиме анимации.
5. Меню "Настройки" позволяет включать\отключать режим локальной обработки и обращаться к диалогу редактирования настроек.
6. Меню "Справка" позволяет открыть сайт Конструктора шаблонов, скачать дополнительный набор тестовых фотографий и посмотреть информацию о версии Конструктора шаблонов.
7. Меню "Язык" предоставляет возможность переключения между русской и английской локализациями.
8. Кнопка "Перечитать PSD" позволяет перечитать PSD-документ/PSD-документы, связанные с данным проектом.
9. Группа кнопок Просмотр слоев шаблона и тестовых фото/Просмотр результата/Просмотр предыдущего результата позволяет переключаться между отображением слоев шаблона, результатом последней обработки и результатом предыдущей обработки для сравнения результатов.

   Переключаться между результатами обработки можно также с помощью комбинации Ctrl + клик на обработанном изображении

10. Чекбокс "Фильтровать фото" позволяет фильтровать тестовые фото по ориентациям и/или подразмерам. Для управления фильтрацией обратитесь к выпадающему меню, нажав на кнопку со стрелкой вниз.
11. Кнопки "Добавить"/"Удалить" позволяют редактировать список доступных тестовых фотографий.
12. Кнопки "Вертикаль"/"Горизонталь"/"Квадрат"/"Универсал" необходимы для просмотра слоев выбранной ориентации шаблона.
13. Тестовая фотография
    1. Подсказка с указанием физических размеров фотографии и подразмера, который будет использован при обработке этой фотографии (если в шаблоне используются подразмеры).
14. Слой шаблона (в данном случае, область вписывания типа "рамка").
15. Контекстное меню слоя. Может изменяться в зависимости от назначения слоя, для которого оно вызвано.
16. Превью выбранного слоя/тестовой фотографии/результата обработки шаблоном.
    1. Черная пунктирная рамка указывает на границы холста шаблона.
    2. Красная пунктирная рамка указывает на границы области вписывания.
17. Параметры выбранного слоя.
18. Шкала масштабирования превью:
    1. Готовые настройки для масштабирования превью: вписать— вписать превью по большей стороне, 1:1 — масштабировать превью до его реальных размеров (100%), телефон — масштабировать превью до размеров отображения на мобильном телефоне.
19. Выгрузить результаты — Выгрузка результатов обработки данным шаблоном в указанный каталог.
20. "Обработать все" / "Обработать выделенные" — группа кнопок, отвечающая за выборочную/полную обработку тестовых фотографий.

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

Далее, для каждого слоя появляется возможность перечитать его как для текущего кадра, так и для всех. Это можно сделать:

• вызвав контекстное меню для слоя;
• с помощью меню "Слой -> Перечитать слой (...)".

Через контекстное меню слоя	С помощью меню "Слой -> ..."

Окно проверки шаблонов с несколькими юзерфото:

Окно настроек Конструктора шаблонов:

Окно настроек состоит из нескольких блоков, группирующих настройки по месту их применения

• Основные:
  • Включить zoom-оптимизацию — опция, ускоряющая на некоторых компьютерах перечитывание PSD-документа. При ее включении, Конструктор шаблонов уменьшает на время перечитывания масштаб PSD-документа до наименьшего, а после перечитывания автоматически возвращает масштаб до исходного.
  • Фиксировать режим увеличения — опция, позволяющая при переключении любых превью (будь то слой шаблона, тестовая фотография или результат обработки) автоматически масштабировать его до тех размеров, чтобы превью соответствовало масштабу отображения в мобильном телефоне или же просто полностью умещалось в области просмотра превью Конструктора шаблонов. Чтобы воспользоваться всеми преимуществами фиксированного режима увеличения, следует поставить галочку напротив этой опции, далее, в основном окне Конструктора шаблонов, в области просмотра превью установить пресет масштаба "Вписать" или "Телефон".
    

    Фиксирование режима увеличения в диалоге настроек	Установка пресета масштаба

• Максимальное количество одновременных обработок:
  • По количеству ядер CPU
  • Задать вручную
  Данный блок настроек отвечает за количество одновременных обработок тестовых фотографий шаблоном. Количество одновременных обработок, в свою очередь, может повлиять на скорость обработки большого количество тестовых фото.
  Для мощных компьютеров можно выбрать опцию "Задать вручную" и попробовать увеличить установленное там значение (которое по умолчанию равняется количеству ядер CPU). Для компьютеров с невысокой производительностью можно, наоборот, выбрав данную опцию, уменьшить значение по умолчанию. Для большинства компьютеров оптимально подходит опция "По количеству ядер CPU". Она выбрана по умолчанию.
• Серверная обработка:
  • Таймаут загрузки шаблона
  • Таймаут загрузки тестового фото
  • Таймаут обработки
  Блок настроек серверной обработки позволяет настроить таймауты для различных операций.
  Под таймаутом в данном случае понимается время, отведенное на совершение той или иной операции. Если по истечении указанного времени операция не завершена, она прерывается в принудительном порядке. Если скорость доступа в интернет невысокая, можно попробовать увеличить таймауты для данных операций.
  Параметр "Таймаут загрузки тестового фото" используется в двух случаях:
  1. При серверной обработке - это таймаут отправки тестового фото
  2. При локальной обработке - это таймаут отправки какого-либо промежуточного результата на S3 для работы с нейрофильтрами / выделением фигур / построением динамических масок и т.п.
  Так, если вы получаете часто ошибку вида "Не удалось выгрузить файл на S3" , может быть целесообразно поменять данный параметр.
  По умолчанию таймаут для каждой операции установлен на 7 минут, что является достаточным в подавляющем количестве случаев.
• Диалоги:
  • Не показывать диалог на старте приложения
  Не показывать диалог "Начало работы", который появляется сразу после запуска Конструктора шаблонов и позволяет создать/открыть проект или сразу перечитать psd-документ, если в Photoshop уже имеется открытый.
• Сервер обработки:
  • Использовать сервер обработки по умолчанию (production)
  • Использовать указанный тестовый сервер обработки
  Данный пункт необходим для переключения между рабочим сервером и тестовым. Тестовый сервер предназначен для beta-тестирования функций, находящихся в разработке. Шаблоны, созданные на рабочем сервере и обработанные на тестовом, могут выдавать результат отличный от ожидаемого, равно как и наоборот: следует избегать обработки на рабочем сервере шаблонов, созданных на тестовом сервере. Получить URL тестового сервера можно непосредственно у разработчиков.

Создание проекта

Проект шаблона состоит из файла проекта в формате .pttp2 и PSD-файла. Конструктор шаблонов позволяет создать файл проекта вместе с PSD.

С помощью Конструктора шаблонов можно создавать заготовки под шаблоны различных типов. Конструктор генерирует набор групп и подгрупп с валидными названиями, тем самым сводя к минимуму вероятность ошибки при ручном конструировании структуры шаблона в Photoshop.

При запуске Конструктора шаблонов следом автоматически запустится Photoshop (если он не был до этого запущен). Конструктор шаблонов откроется с дополнительным диалогом - “Начало работы”. С помощью него можно создать\открыть проект или перечитать открытый в Photoshop PSD-файл.

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

Новый проект можно также создать, выбрав в главном окне Конструктора шаблонов в меню “Файл” пункт “Создать проект”.

В открывшемся диалоге заполняем форму с параметрами будущего шаблона и сохраняем его в выбранной директории.

Диалог создания нового проекта позволяет:

1. Выбрать тип проекта. От типа проекта будут зависеть, в частности, доступные выразительные средства и то, какая заготовка будет создана в PSD-документе.
2. Задать ориентации шаблона:
   • Универсальная ориентация.
   • Несколько ориентаций в рамках одного psd-документа (подробнее здесь).
   • Несколько ориентаций, каждая из которых будет храниться в отдельном psd-документе.
3. Создать проект на основе уже существующих и открытых в Photoshop PSD-документов
4. Задать подразмеры.
5. Настроить заготовку шаблона так, чтобы она не увеличивала пользовательские фотографии (авторесайз шаблонов)
6. Использовать анимацию в шаблоне

Если был выбран переключатель “Новый PSD-документ”, то после создания проекта в Photoshop откроется новый psd-файл, созданный для нового проекта и имеющий необходимую структуру групп и подгрупп в соответствии с выбранными настройками проекта:

Если в Photoshop уже есть открытые документы, то в диалоге создания проекта Конструктор предложит создать проект на их основе:

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

Привязку psd-документа к файлам проекта в любой момент можно поменять, нажав на "Файл > Изменить проект" (CTRL + E).

Помимо изменения привязки psd-документа можно скорректировать и тип проекта и дополнительные параметры. Тип проекта при прочих равных может повлиять на итоговый результат.

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

Сохранение проекта подразумевает только сохранение файла проекта и не сохраняет автоматически изменения в PSD-документе. При необходимости PSD-документ необходимо сохранять вручную.

Также в Конструкторе шаблонов доступна функция "Сохранить проект и PSD как", которая позволяет сохранить файл проекта и связанные с ним PSD-документы под новым именем.

Список проектов с которыми вы недавно работали доступен из меню “Файл -> Недавние проекты”.

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

Одновременная работа над несколькими проектами

Вы можете запустить несколько экземпляров Конструктора шаблонов и работать в них параллельно. Это может быть очень удобно, например, при работе над похожими шаблонами или когда какой-либо прием из одного шаблона необходимо повторить в другом. Так, например, вы можете копировать фильтры области вписывания из одного проекта и вставить их в другой, запущенный в другом Конструкторе шаблонов.

Существует ряд ограничений, которые следует учитывать при работе сразу в нескольких Конструкторах шаблонов:

• Нельзя открывать один и тот же проект в нескольких Конструкторах шаблонов
• Нельзя одновременно выполнять операции, которые требуют взаимодействия с Photoshop*, например:
  • Создание документа
  • Перечитывание чего-либо
  • Включение режима деформации
  • Вставка ориентаций/слоев/областей вписывания

*Одновременное выполнение операции предполагает, что в одном Конструкторе шаблонов была запущена операция, которая продолжается на момент запуска операции в другом экземпляре Конструктора шаблонов. Образуется "очередь" и новая операция в Photoshop может быть выполнена только тогда, когда закончится предыдущая. Конструктор шаблонов сообщит о том, что Photoshop занят, показав соответсвующее сообщение об ошибке.

Работа с фильтрами

Для доступа к списку фильтров, в Конструкторе шаблонов необходимо обратиться к диалогу "Настройки фильтров для области вписывания". Открыть диалог можно любым из следующих способов:

• Двойным щелчком левой кнопкой мыши по слою области вписывания;
• Через контекстное меню области вписывания, вызываемое кликом правой кнопкой мыши на ней;
• На панели информации о выбранном слое;
• И через меню "Слой", находящееся в верхней части окна Конструктора шаблонов;

Открывшееся диалоговое окно состоит из следующих блоков:

1. Элементы управления фильтрами
2. Список добавленных фильтров
3. Список параметров
4. Область предпросмотра

Добавить фильтр можно двумя способами:

• Кликнув на "тело" кнопки "Добавить...", вызвав диалоговое окно "Добавить новый фильтр"
• Кликнув на стрелку вниз, находящуюся правее кнопки "Добавить..." и выбрав в появившемся контекстном меню необходимый фильтр (контекстное меню также вызывается и кликом правой кнопки мыши на самой кнопке "Добавить")

Диалоговое окно "Добавить новый фильтр" представлено двумя колонками, где слева - список фильтров, а справа - документация по выбранному фильтру.

Фильтры можно искать по названию, вводя его частично или целиком в соответствующее поле в левой колонке. Для добавления фильтра к данной области вписывания, достаточно выделить фильтр в левой колонке и нажать на кнопку "OK" в правой нижней части окна.

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

Манипуляции над добавленными в список фильтрами можно производить с помощью:

• кнопок со стрелками, расположенных справа от списка добавленных фильтров (поднять/опустить фильтр выше относительно других в списке);
• текстовых кнопок, расположенных над списком фильтров (удалить, копировать, вырезать, вставить);
• с помощью мыши (перетаскивание, а также копирование, вставка и удаление с помощью контекстного меню);
• с помощью контекстного меню "Добавить" (добавление фильтров);
• с помощью чекбоксов в списке добавленных фильтров (временное отключение выбранного фильтра\фильтров);

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

В средней колонке можно менять настройки выбранного фильтра. В нижней части колонки для выделенного параметра приводится краткая контекстная справка.

При указании в свойстве фильтра дробного значения параметра, следует использовать десятичные дроби. В качестве разделителя используется запятая или точка, в зависимости от региональных настроек системы. При указании некорректного разделителя, Конструктор шаблонов предупредит об этом с помощью соответствующего сообщения. Так, если у вас не получается установить в качестве разделителя точку, попробуйте использовать запятую и наоборот.

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

В работе области предпросмотра имеются следующие ограничения:

• Область предпросмотра показывает не весь шаблон, а только фото с примененными фильтрами из списка. Никакие другие настройки области вписывания, кроме списка фильтров, не используются.
• Область предпросмотра поддерживает только локальную обработку фотографий из разрешенного списка.
• Переключатель "Использовать для предпросмотра" в верхней части окна позволяет переключаться между отображением всех фильтров из списка и только одного выделенного в списке фильтра.
• Некоторые фильтры для обработки требуют подключения к интернету.

Также по нажатию на кнопку "Справка" (или же клавиши F1) в браузере откроется страница с документацией по фильтрам на сайте Конструктора шаблонов.

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

Работа со стикерами

Для того, чтобы добавить стикер в проект, необходимо обратиться к меню "Вставка" > "Стикер".

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

• Вызвав контекстное меню стикера, кликнув по нему правой кнопкой мыши, далее: "Изменить растеризацию" -> "Область вписывания" -> "Растеризация".
• Выделив необходимый стикер и выбрав меню "Слой", далее: "Изменить растеризацию" > "Область вписывания" > "Растеризация".
• В настройках фильтров Области вписывания выбрав фильтр "Растеризация" и далее кликнув по параметру "Позиция (Нажать для редактирования)".
• Через менеджер растеризаций.

Ниже представлено окно редактора позиции стикеров и групп стикеров:

Иногда при работе с группами стикеров могут возникать ситуации, когда позиции стикеров конфликтуют, что сказывается на конечном позиционировании группы стикеров. Ниже представлено окно редактора позиции стикеров и групп стикеров с активным блоком разрешения конфликтов:

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

• Вызвав контекстное меню любого стикера и выбрав пункт Управление растеризациями...
• Выделив любой стикер и в меню Слой выбрав пункт Управление растеризациями...

Окно Редактора растеризаций визуально разделено на три секции:

• Области вписывания - список областей вписывания, имеющихся в проекте. Отсюда же можно обратиться к редактору фильтров какой-либо из областей вписывания.
• Фильтры растеризации - список фильтров растеризации, примененных к данной области вписывания. (Помните, что количество стикеров и количество фильтров "Растеризация" может быть неодинаковым, ведь один и тот же стикер можно применить к одной области вписывания несколько раз). У каждого фильтра растеризации в скобках указано имя стикера, к которому он относится. Фильтры растеризации, не относящиеся к текущему стикеру, выделены серым цветом и неактивны. Также в данной секции можно добавлять и удалять фильтры Растеризации, которые относятся к данному стикеру.
• Свойства - свойства конкретного выбранного фильтра "Растеризация". Здесь же можно открыть диалог редактирования позиции стикера\группы стикеров.

Проверка шаблона

• Откройте в Photoshop вкладку со своим шаблоном.
• Запустите Конструктор через меню "Пуск". Создайте или откройте проект, ассоциированный с шаблоном, через меню "Файл".
• Нажмите на кнопку "Перечитать PSD". Через некоторое время конструктор шаблонов загрузит все слои: графику и области вписывания.
• Далее, щелкните на одно из тестовых изображений в правой части окна конструктора (или загрузите свои тестовые изображения) , нажмите на кнопку "Обработать выделенные" и ожидайте результата, который появится в центральном блоке.
• Также можно нажать кнопку "Обработать все", тогда обработаются все загруженные тестовые фотографии. Время обработки при этом увеличится. В данном случае на результат обработки отдельных фотографий можно переключиться, кликнув на соответствующую тестовую фотографию.
• Кнопки "Просмотр результата" и "Просмотр слоёв шаблона и тестовых фото" позволяет переключаться между результатом и исходными файлами.
• Если результат получился не похожим на ожидаемый, вам следует вернуться в Photoshop и внести правки, проверив потом результат.
  

  Важно: 

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

  Для того чтобы перечитать какой-либо конкретный слой, кликните правой кнопкой мыши по выгруженному в конструкторе слою и выберите пункт "Перечитать слой (растр, блендинг, маску)", как это показано на картинке слева.

Серверная и локальная обработка тестовых фотографий

В конструкторе шаблонов есть возможность выбирать между серверной и локальной обработкой тестовых фотографий.

Это сделано для ускорения процесса обработки - локальная обработка происходит значительно быстрее серверной, т.к. в ней не надо ожидать ответа сервера, который может быть перегружен / не отвечать или даже вернуть ошибку.

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

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

Важно: после перезапуска Конструктора шаблонов, он всегда запускается в режиме локальной обработки.

Ограничения тестовых фотографий

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

Дополнительный архив фотографий

Для дизайнеров, работающих с нами на постоянной основе, мы предлагаем расширенный архив фотографий для тестирования шаблонов. Фотографии в этом архиве предназначаются только для внутреннего использования / тестирования. Это означает, что вы не можете использовать их в превью своих шаблонов.

Скачайте архив и получите от него пароль у руководителя, с которым вы работаете. Распакуйте архив и добавьте необходимые фотографии, нажав на кнопку "добавить", расположенную в правом верхнем углу окна Конструктора (см. Элементы конструктора шаблонов).

Напомним, что вы не можете никак модифицировать тестовые фотографии из белого списка (в т.ч. редактировать, конвертировать, пересохранять). Локальная обработка не будет работать с измененными фотографиями из белого списка.

Скачать дополнительный архив фотографий