Как создать шаблон в фотошопе для фото: Как сделать шаблон картинок в Adobe Photoshop

Выберите Photoshop Rectangular Marquee Tool в верхней части панели инструментов или нажмите на клавиатуре букву M , чтобы быстро выбрать ее с помощью сочетания клавиш:

Выберите инструмент «Прямоугольная область».

Если выбран инструмент «Прямоугольная область», панель параметров в верхней части экрана изменится и отобразит параметры для инструмента «Прямоугольная область». Один из вариантов — Style . Измените его значение по умолчанию Нормальный на Фиксированное соотношение , затем введите 4 для Ширина и 6 для Высота . Это приведет к тому, что форма выделения, которую мы собираемся нарисовать, будет иметь соотношение сторон 4×6, что позволит нам позже добавить несколько фотографий 4×6 в документ:

Измените стиль на «Фиксированное соотношение», затем введите «4» для ширины и «6» для высоты.

Шаг 5: нарисуйте прямоугольное выделение на левой стороне документа

Вытяните прямоугольную область выделения в левой части документа. Здесь появится фотография слева. Вы заметите, что когда вы перетаскиваете выделение, его форма ограничивается соотношением сторон 4×6, которое мы установили на панели параметров на предыдущем шаге. Если вам нужно изменить положение выделения при его перетаскивании, просто удерживайте пробел , перетащите мышь, чтобы переместить выделение на место, затем отпустите клавишу пробела и продолжайте перетаскивание.Убедитесь, что в документе достаточно места для размещения еще двух фотографий:

Щелкните и растяните выделение вокруг области, где появится фотография слева.

Шаг 6: Залейте выделение серым

После того, как вы нарисовали выделение, вернитесь в меню Edit и снова выберите команду Fill :

Перейдите в меню «Правка»> «Заливка».

На этот раз, когда появится диалоговое окно Заливка, измените параметр Использовать в разделе Содержимое вверху диалогового окна на 50% Серый :

На этот раз измените параметр «Использовать» на «50% серого».

По завершении нажмите OK, чтобы выйти из диалогового окна. Photoshop заполняет выделение серым цветом. Нет особой причины, по которой мы выбрали серый цвет. Нам просто нужно было заполнить выделение цветом, и, поскольку мы используем его только в качестве заполнителя для изображения, серый цвет казался естественным выбором. Нажмите Ctrl + D (Win) / Command + D (Mac), чтобы удалить контур выделения вокруг формы:

Нажмите Ctrl + D (Win) / Command + D (Mac), чтобы удалить контур выделения после того, как вы залили его серым цветом.

Шаг 7: Добавьте тонкий белый штрих вокруг формы

Давайте добавим тонкую белую рамку вокруг формы. Щелкните значок Layer Styles в нижней части панели Layers и выберите Stroke в нижней части появившегося списка стилей слоя:

Щелкните значок «Стили слоя» и выберите «Обводка» из списка.

Это вызывает диалоговое окно Photoshop Layer Style , для которого в среднем столбце установлены параметры обводки. Сначала измените цвет обводки, щелкнув небольшой образец цвета справа от слова Color и выбрав белый цвет в палитре Color Picker , когда он появится.По завершении нажмите OK, чтобы закрыть палитру цветов. Увеличьте Размер обводки примерно до 10 пикселей (пикселей), затем измените Положение на Внутри :

Измените цвет обводки на белый, затем увеличьте размер примерно до 10 пикселей и измените положение на «Внутри».

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

Стили слоя — это простой способ добавить к изображению простые эффекты, например границы.

Шаг 8: Выберите инструмент «Перемещение»

Выберите Photoshop Move Tool на панели инструментов или нажмите на клавиатуре букву V , чтобы быстро выбрать ее с помощью ярлыка:

Выберите инструмент «Перемещение».

Шаг 9: перетащите копию формы в центр документа

Нажмите Shift + Alt (Win) / Shift + Option (Mac) и, удерживая обе клавиши нажатыми, щелкните свою серую фигуру внутри документа и перетащите ее вправо.Клавиша Alt / Option сообщает Photoshop, что мы хотим создать копию фигуры при перетаскивании вместо перемещения исходной формы, в то время как клавиша Shift ограничивает направление, в котором мы можем перетаскивать, что упрощает перетаскивание по прямой линия вправо.

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

Удерживая Shift + Alt (Win) / Shift + Option (Mac), перетащите копию фигуры в середину документа.

Шаг 10: переименуйте новый слой «Средний заполнитель»

Если мы посмотрим на панель «Слои», мы увидим, что вторая фигура появилась на собственном слое над исходной формой. Photoshop назвал новый слой «левой копией заполнителя». Дважды щелкните имя нового слоя и измените его на средний . Нажмите Введите (Win) / Верните (Mac), когда вы закончите, чтобы принять изменение:

Новая форма появится на отдельном слое над исходной.Переименуйте новый слой в «середину заполнителя».

Шаг 11: перетащите еще одну копию фигуры в правую часть документа

Еще раз зажмите Shift + Alt (Win) / Shift + Option (Mac), щелкните по средней фигуре и перетащите ее копию в правую часть документа. Он станет заполнителем для изображения, которое появится справа. Опять же, белая обводка копируется вместе с формой. Постарайтесь оставить такое же пространство между новой фигурой и правым краем документа, как между левой фигурой и левым краем документа.Пока не беспокойтесь, если сами фигуры не распределены равномерно, как у меня, очевидно, нет:

Постарайтесь оставить такое же пространство между третьей фигурой и правым краем документа, как между исходной формой и левым краем.

Шаг 12: переименуйте новый слой «Заполнитель справа»

Если мы снова посмотрим на панель «Слои», то увидим, что третья фигура появляется на отдельном слое над двумя другими фигурами, и Photoshop автоматически назвал новый слой «средняя копия заполнителя».Дважды щелкните имя слоя и измените его на , заполнитель справа . Нажмите Введите (Win) / Верните (Mac), чтобы принять изменение, когда вы закончите:

Переименуйте новый слой в «заполнитель справа».

Шаг 13: выберите сразу все три слоя-заполнителя

Давайте выровняем три фигуры, чтобы они были равномерно разнесены. С уже выбранным верхним слоем («заполнитель справа»), удерживая нажатой клавишу Shift , щелкните слой исходной формы («заполнитель слева») на панели «Слои».Это выберет все три слоя-заполнителя сразу (вы увидите, что все они выделены синим цветом, что говорит нам, что они выбраны):

Удерживая Shift, щелкните «заполнитель слева», чтобы выбрать все три слоя-заполнителя сразу.

Шаг 14: Щелкните значок «Распределить по центрам по горизонтали»

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

Щелкните значок «Распределить горизонтальные центры» на панели параметров.

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

Теперь заполнители распределены равномерно.

Мы готовы добавить в документ несколько фотографий. Мы сделаем это дальше!

Шаг 15: Откройте первое фото для добавления в рамку

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

Первое фото, которое я добавлю в документ.

Шаг 16. Скопируйте фотографию в буфер обмена

Нажмите Ctrl + A (Win) / Command + A (Mac), чтобы быстро выбрать всю фотографию. Вы увидите контур выделения вокруг изображения. Затем нажмите Ctrl + C (Win) / Command + C (Mac), чтобы скопировать изображение в буфер обмена. Вы можете закрыть окно документа фотографии, как только скопируете изображение в буфер обмена.

Шаг 17: Выберите слой «Заполнитель слева»

Вернитесь к рамке документа, щелкнув в любом месте внутри окна документа, затем щелкните заполнитель слева слоя на панели «Слои», чтобы выбрать его:

Выберите слой «заполнитель слева» в документе фрейма.

Шаг 18. Вставьте фотографию в рамку документа

Нажмите Ctrl + V (Win) / Command + V (Mac), чтобы вставить фотографию в рамку документа.Photoshop поместит фотографию на свой собственный слой прямо над выбранным слоем, и если мы посмотрим на панель «Слои», то увидим, что фотография появляется на собственном слое прямо над слоем «заполнитель слева», который мы выбрано на предыдущем шаге:

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

Единственная проблема в том, что я хочу, чтобы эта фотография отображалась как левое изображение в кадре, но на данный момент она не только появляется в середине, но и скрыта за средней формой из-за того, что слой «средний заполнитель» находится выше фото на панели «Слои».Все, что я вижу на изображении, — это внешние края, выходящие за пределы формы:

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

Шаг 19: перетащите фотографию поверх формы «заполнитель слева»

Не снимая выделения с инструмента «Перемещение», щелкните внутри документа и перетащите фотографию влево, пока она не появится поверх формы «заполнитель слева»:

Щелкните и перетащите фотографию на фигуру «заполнитель слева».

Шаг 20. Создайте обтравочную маску

Как только фотография окажется поверх формы «заполнитель слева», перейдите в меню Layer вверху экрана и выберите Create Clipping Mask :

Перейдите в Layer> Create Clipping Mask.

Photoshop «обрежет» фотографию по фигуре-заполнителю под ней, позволяя оставаться видимой только область фотографии, которая попадает в границы фигуры. Остальная часть фотографии, выходящая за пределы фигуры, скрывается от просмотра.Белая обводка вокруг фигуры снова видна:

Фотография теперь «обрезается» по форме заполнителя под ней.

Шаг 21. Измените размер фотографии с помощью команды свободного преобразования

Давайте изменим размер фотографии так, чтобы мы могли видеть все изображение, а не только ту часть, которая оказывается над формой заполнителя. Нажмите Ctrl + T (Win) / Command + T (Mac), чтобы быстро открыть окно Photoshop Free Transform и обработать изображение.Несмотря на то, что мы можем видеть только область фотографии, которая находится непосредственно над формой, маркеры Free Transform появляются вокруг фактических размеров изображения. Если вы не видите маркеры Free Transform, потому что ваше изображение настолько велико, что края выходят за пределы видимой области окна документа, нажмите Ctrl + 0 (Win) / Command + 0 (Mac), чтобы Photoshop уменьшает масштаб до тех пор, пока все не умещается в окне документа (известное как вид По размеру экрана ). Нажмите еще раз, когда закончите изменять размер изображения.

Перетащите угловые маркеры Free Transform (маленькие квадраты) внутрь, пока они не выровняются с углами формы заполнителя, чтобы форма и фотография были одинакового размера. Конечно, это предполагает, что вы используете фотографию с тем же соотношением сторон 4×6, что и форма заполнителя, как и я. Если ваша фотография использует другое соотношение сторон, просто измените размер изображения до тех пор, пока оно не поместится в форме, насколько это возможно. Удерживайте нажатой клавишу Shift при перетаскивании маркеров, чтобы ограничить соотношение сторон фотографии, чтобы случайно не исказить ее внешний вид при изменении размера.При необходимости вы можете изменить положение фотографии, щелкнув в любом месте внутри поля «Свободное преобразование» и перетащив его мышью:

Перетащите угловые ручки Free Transform внутрь, пока фотография не станет того же размера, что и форма заполнителя.

Когда вы закончите изменение размера изображения, нажмите Enter (Win) / Return (Mac), чтобы принять преобразование и выйти из команды Free Transform:

Размер фотографии теперь соответствует размеру заполнителя под ней.

Шаг 22. Добавьте еще две фотографии в рамку

Выполните те же действия, чтобы добавить еще две фотографии в рамочный документ: одну для средней области и одну для правой. Сначала откройте фотографию, которую хотите использовать. Нажмите Ctrl + A (Win) / Command + A (Mac), чтобы выбрать его, затем Ctrl + C (Win) / Command + C (Mac), чтобы скопировать его в буфер обмена. Закройте окно документа фотографии после копирования изображения в буфер обмена. Вернитесь к рамке документа и щелкните либо заполнитель , средний , либо слой , правый заполнитель на панели «Слои», чтобы выбрать его (в зависимости от того, в какой из них вы добавляете фотографию).

Нажмите Ctrl + V (Win) / Command + V (Mac), чтобы вставить фотографию в документ. Photoshop поместит фотографию на свой собственный слой прямо над выбранным вами слоем-заполнителем. Используйте инструмент Move Tool , чтобы перетащить фотографию поверх формы заполнителя, если необходимо, затем перейдите в меню Layer вверху экрана и выберите Create Clipping Mask . Наконец, нажмите Ctrl + T (Win) / Command + T (Mac), чтобы открыть поле Free Transform и обработать изображение.Удерживая нажатой клавишу Shift , перетащите угловые маркеры, чтобы изменить размер фотографии. Нажмите Enter (Win) / Return (Mac), когда вы закончите, чтобы выйти из Free Transform.

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

Окончательный результат из трех фотографий.

Шаг 23. Преобразование трех фотографий в смарт-объекты

Для оставшихся нескольких шагов вам понадобится Photoshop CS2 или выше. Мы увидим, насколько легко использовать наш окончательный результат в качестве шаблона, заменяя другие фотографии в кадре и вне кадра по мере необходимости, используя смарт-объектов , которые были впервые представлены в Photoshop CS2.

На панели «Слои» щелкните слой, содержащий первую добавленную нами фотографию (тот, который находится непосредственно над слоем «заполнитель слева»), чтобы выбрать его. Он должен быть на слое с именем «Layer 1»:

Щелкните «Слой 1», который содержит первую добавленную нами фотографию.

Выбрав слой, Щелкните правой кнопкой мыши (Win) / Щелкните имя слоя, удерживая клавишу Control, (Mac) и выберите Преобразовать в смарт-объект в появившемся меню:

Выберите в меню «Преобразовать в смарт-объект».

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

На миниатюре предварительного просмотра слоя появляется маленький значок смарт-объекта.

Сделайте то же самое с двумя оставшимися изображениями (которые вы найдете на «Layer 2» и «Layer 3»), сначала щелкнув слой на панели Layers, затем Щелкните правой кнопкой мыши (Win) / Control — щелкнув (Mac) на имени слоя и выбрав в меню Convert to Smart Object .Когда вы закончите, все три фотографии должны иметь значок смарт-объекта в правом нижнем углу эскиза предварительного просмотра их слоя.

Шаг 24. Замените содержимое каждого смарт-объекта, чтобы добавить разные фотографии

Теперь, когда все три слоя с фотографиями преобразованы в смарт-объекты, щелкните еще раз «Слой 1» на панели «Слои», чтобы выбрать фотографию слева, затем Щелкните правой кнопкой мыши (Win) / , удерживая клавишу Control, щелкните (Mac) один раз снова в названии слоев, чтобы открыть то же меню, которое мы видели минуту назад.На этот раз выберите в меню Заменить содержимое :

Снова выберите «Слой 1», затем щелкните правой кнопкой мыши (Win) / щелкните, удерживая нажатой клавишу «Control» (Mac), и выберите в меню «Заменить содержимое».

Откроется диалоговое окно Photoshop Place . Перейдите в папку на жестком диске, содержащую фотографию, которой вы хотите заменить первое изображение. У меня есть три новые фотографии, сохраненные в папке на моем рабочем столе. Щелкните имя фотографии, которую хотите использовать, затем нажмите кнопку Place :

Щелкните имя фотографии, затем щелкните «Поместить».

Как только вы нажимаете кнопку «Поместить», Photoshop заменяет исходную фотографию новой фотографией в документе! Если вам нужно изменить размер нового изображения, нажмите Ctrl + T (Win) / Command + T (Mac), чтобы открыть маркеры Free Transform , затем перетащите угловые маркеры, чтобы изменить его размер, как мы это делали с исходную фотографию, удерживая нажатой клавишу Shift при перетаскивании, чтобы ограничить соотношение сторон. Опять же, если вы не видите маркеры, потому что изображение слишком велико для размещения в окне документа, нажмите Ctrl + 0 (Win) / Command + 0 (Mac), чтобы переключиться на Fit на экране режим просмотра.Нажмите еще раз, когда закончите изменять размер изображения:

Если новое изображение кажется слишком большим, измените его размер с помощью команды «Свободное преобразование».

Нажмите Введите (Win) / Верните (Mac), когда вы закончите, чтобы принять преобразование и выйти из Free Transform:

Левое фото заменено.

Сделайте то же самое с двумя другими фотографиями, чтобы поменять их местами с другими изображениями. Сначала выберите слой фотографии на панели «Слои» («Слой 2» или «Слой 3»), затем Щелкните правой кнопкой мыши (Win) / , удерживая клавишу Control, щелкните имя слоя (Mac) и выберите Заменить содержимое из появившееся меню.Когда появится диалоговое окно «Поместить», выберите новую фотографию, которую хотите использовать, затем нажмите кнопку « Поместить ». Если вам нужно изменить размер нового изображения, нажмите Ctrl + T (Win) / Command + T (Mac) и перетащите угловые маркеры Free Transform, удерживая при перетаскивании Shift . Нажмите Enter (Win) / Return (Mac), когда вы закончите, чтобы выйти из Free Transform.

Вот мой результат после замены среднего и левого фото новыми изображениями:

Заменить исходные изображения на новые стало просто благодаря смарт-объектам!

Убедитесь, что вы сохранили документ как Photoshop.PSD , когда вы закончите, чтобы вы не повредили слои и смарт-объекты, готовые к следующему разу, когда вам нужно будет повторно открыть файл и добавить новые фотографии!

Как создавать шаблоны изображений в Photoshop для Pinterest ~ Elan Creative Co.

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

Посмотрите, как я создаю шаблоны изображений в Photoshop

Пожалуйста, подпишитесь на канал Elan Creative Co, если вы хотите увидеть больше видеоуроков.

Смотрите видео на Youtube.

Макет и размер

Первое, что вам нужно сделать, это определиться с размером и макетом.В своем блоге я люблю использовать изображения размером 800 x 1200 пикселей; 800 пикселей в ширину, потому что это ширина моего блога, и вертикальные изображения, потому что они с большей вероятностью будут закреплены. Это не единственный размер, который я использую, у меня также есть шаблоны для моих списков Etsy и сайтов социальных сетей.

Образцы цвета

Откройте окно «Образцы», перейдя в окно Windows / Образцы . После очистки стандартного образца вы можете добавить цветовую схему, выбранную для своего блога. Вы можете сохранить его из раскрывающегося меню в правой части панели.

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

Работа со слоями и папками

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

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

Мои шаблоны разделены на три папки:

• фон: здесь я храню все фоны, которые использую; вы можете легко сделать фон невидимым, щелкнув значок глаза в левой части слоя
• посередине: здесь я храню все графические элементы, такие как линии или значок PSD, которые вы можете увидеть на избранном изображении
• текст: как следует из названия, это для текстовых файлов; Я использую два шрифта, и шаблон изображения помогает мне запомнить их имена

Совет: Если фоновое изображение слишком темное, вы можете осветлить его, уменьшив непрозрачность.

Подробнее: Работа со слоями в Photoshop

Использование линейок и направляющих

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

Вы можете получить доступ к линейкам из View / Rulers или нажав Ctrl + R . Чтобы построить направляющую, вам просто нужно щелкнуть горизонтальную или вертикальную линейку и перетащить ее в нужное положение.Если у вас установлен флажок «Привязка» ( View / Snap ), направляющая защелкнется, когда окажется в середине вашего холста. Вы также можете почувствовать то же самое с вашим текстом или изображениями.

Единообразная типографика

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

Сохранение шаблона

Вы должны сохранить свой шаблон как PSD. Таким образом, вы можете редактировать его столько раз, сколько захотите. Если изображения, которые вы создаете, предназначены для использования в Интернете, вам следует использовать опцию «Сохранить для Интернета».

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

Если у вас нет Photoshop, существует множество бесплатных альтернатив.

Используете ли вы шаблоны изображений для своего блога или бизнеса?

Загрузите 3 бесплатных шаблона изображений для блога из библиотеки

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

Для создания графики в блоге требуется Adobe Photoshop CS5 или новее и базовые навыки работы с Photoshop.

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

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

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

Как использовать шаблон Photoshop

Опубликовано: 29 января 2021 г. автор Heidi. Этот пост может содержать партнерские ссылки. 9 комментариев

Поскольку в последнее время я делюсь шаблонами, я хочу показать вам, как использовать шаблон Photoshop. Мне жаль, что я не знал, как я впервые начал цифровую ломку. Когда я начинал, я все делал по-своему. Я использовал шаблоны, но создавал свои проекты на их основе — используя их как руководство.Я кропотливо обрезал и изменил размер каждого изображения и бумаги, чтобы они соответствовали формам на шаблоне. Я понятия не имел, как их использовать. Хотел бы я знать, сколько времени они экономят!

Если вы меня вообще знаете, то знаете, что мне нравится все делать по-своему. Я просто не умею что-либо делать. Если я собираюсь делать фартук, я не могу просто следовать выкройке. Придется добавить что-то сложное, например, окантовку лентой. Если я хочу купить Adobe Photoshop Elements и приступить к цифровому редактированию, я не могу просто начать с простого макета.Я должен спланировать всю букварь. Я немного чокнутый. Это неизлечимо. Я ничего не могу поделать.

Выше J-страница моей первой книги. Я создал его по шаблону от PurpleTulipDesigns. Я не правильно сделал. Я сделал это нелегко. К счастью, к тому времени, когда я снова использовал шаблон для букв E, V и W, я уже все понял! Готовы научиться пользоваться шаблоном Photoshop? Я покажу вам, как я должен был создать J-страницу. Вот так!

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

А теперь секрет трюка. Большинство людей создают обтравочную маску, но это быстрый способ сделать то же самое. На панели слоев (это панель, которую вы видите на изображении выше, наведите курсор мыши между слоем рамки и слоем фотографии.Вы увидите значок с указательным пальцем. Теперь нажмите клавишу Alt. Значок изменится на два связанных круга с маленькой стрелкой. Удерживая нажатой клавишу Alt, щелкните мышью (щелкните левой кнопкой мыши). Ваш слой с фотографией переместится вправо на панели слоев. Это показывает, что слой с фотографией привязан к слою рамки.

Теперь вместо того, чтобы перекрывать рамку, ваша фотография будет полностью внутри рамки. (См. Ниже.) Теперь вы можете изменить размер и разместить фотографию внутри рамки. Размер кадра не изменится.Разве это не круто? Разве вы не хотели бы делать то же самое с бумажными отходами?

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

Еще одна подсказка. Если вы переместите рамки, изображения не будут двигаться вместе с ними. Вы можете связать рамку и изображение вместе, выделив оба слоя (используйте cntl + щелчок), а затем щелкнув значок в верхней или нижней части панели слоев (в зависимости от того, используете ли вы Photoshop или Elements), который выглядит как две ссылки в цепь.Это свяжет слои вместе. Чтобы отключить их, просто щелкните значок цепочки еще раз.

Вуаля! Готово! Еще одна замечательная вещь в шаблонах — это то, что вы можете использовать их снова и снова для создания новых дизайнов. Я использовал их для нескольких разных макетов в одной книге. Попробуйте повернуть весь шаблон или изменить отдельные элементы дизайна, чтобы придать новый вид. (На изображении ниже вы увидите две J-страницы. Это потому, что несколько лет спустя я сделала еще одну книгу для своей другой дочери.)

Итак, теперь, когда вы знаете, как использовать шаблон, вы готовы использовать мой бесплатный шаблон Photoshop для Дня отца или мой шаблон обложки для Facebook.

Хотите увидеть фартук, о котором я говорил? Вот!

Я так рада, что вы сегодня зашли на мой сайт. Надеюсь, вы нашли то, что вам понравилось, и скоро вернемся! Не забывай как-нибудь следовать за мной, чтобы ничего не пропустить!

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

Как сделать шаблон коллажа в Photoshop (с изображениями)

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

Обратной стороной является то, что создание коллажа может занять много времени и непостоянно.Вот почему научиться создавать шаблон коллажа в Photoshop — один из лучших способов создать новый коллаж. Вместо того, чтобы каждый раз начинать с нуля, вам просто нужно перетащить изображения на место!

Чтобы сделать шаблон коллажа в Photoshop, вам потребуется:

1. Создайте новый слой и залейте его цветом
2. Измените размер и продублируйте этот слой, чтобы сформировать узор коллажа
3. Добавьте обтравочную маску, чтобы ограничить фото, чтобы оно соответствовало каждой конкретной форме
4. Создайте новую обтравочную маску для каждого изображения, пока все не будет иметь заданную форму
5. Экспорт шаблона коллажа в файл PSD для дальнейшей работы

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

Есть ли в Photoshop шаблоны коллажей?

Прежде чем начать, вам может быть интересно, есть ли в Photoshop какие-либо встроенные шаблоны коллажей. К сожалению, в Photoshop нет шаблонов, но их множество бесплатно в Интернете.

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

Как создать собственные шаблоны коллажей

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

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

Ниже мы рассмотрим, как сделать простой коллаж из сетки 3 × 3 . Вы можете менять эти квадратные формы на другие формы по своему желанию.

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

Шаг 1. Пакетный импорт изображений

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

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

После создания папки изображений коллажа создайте новый документ Photoshop ( Command / Control + N ) с желаемыми размерами вашего коллажа.В этом примере я сделаю квадратный документ размером 2000 × 2000 пикселей с 300PPI .

Использование более высокого разрешения (PPI) улучшит качество изображения, если вы решите распечатать коллаж.

Нажмите , создайте , чтобы открыть новый документ в Photoshop.

Пришло время импортировать фотографии. Вместо того, чтобы выполнять их по отдельности (потому что кто хочет тратить время), давайте импортируем их все вместе. Просто зайдите в File> Scripts> Load Files Into Stack.

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

Дважды проверьте, что ваши файлы перечислены в меню файлов, нажмите ОК, чтобы начать импорт фотографий.

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

Затем создайте группу, нажав Command + G (Mac) или Control + G (ПК). Это упростит перенос ваших изображений в шаблон коллажа позже.

Затем, просматривая каждое изображение в вашей группе индивидуально, щелкните правой кнопкой мыши на слое и перейдите к Преобразовать в смарт-объект.

Превращение каждого слоя в смарт-объект дает вам возможность масштабировать изображения без потери качества.Это будет очень важно, когда вы начнете вставлять фотографии в коллаж! Подробнее об этом позже.

На данный момент мы закончили с изображениями и собираемся приступить к созданию шаблона коллажа.

Щелкните вкладку коллажа, чтобы переключиться на другое окно Photoshop.

Шаг 2. Создайте шаблон сетки для коллажа

Давайте начнем создавать шаблон для коллажа, сначала создав новый слой. Просто щелкните значок нового слоя в нижней части панели слоев.

Выбрав новый слой, установите цвет переднего плана на черный (или любой другой цвет кроме белого ) и нажмите Option + Delete (Mac) или Alt + Delete (ПК), чтобы заполнить слой цветом.

Чтобы изменить масштаб слоя, чтобы он соответствовал сетке коллажа 3 × 3, которую мы создадим, нажмите Command + T (Mac) или Control + T (ПК), чтобы получить доступ к инструменту преобразования.

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

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

Просто разделите 100 на количество фотографий в строке, чтобы получить правильное процентное значение для использования.

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

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

Самый простой способ сделать это — удерживая Alt или Option (ПК / Mac), затем щелкнув и перетащив на фигуру. Это автоматически дублирует и одновременно перемещает слой.

Повторите этот процесс дважды, пока три отдельных квадрата не заполнят весь ряд.

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

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

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

— Организация строки изображений

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

Удерживая нажатой клавишу Shift, щелкнув все три квадратных слоя, чтобы выбрать их, нажмите Command + G (Mac) или Control + G (ПК), чтобы сгруппировать их. Переименуйте эту группу в «Верхний ряд».

Внутри группы я переименую каждый квадрат в Shape 1, 2 и 3 в зависимости от их положения слева направо. Это спасёт вас, когда вы начинаете работать с большим количеством строк в коллаже.

— Дублирование первой строки для заполнения шаблона

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

Выбрав верхнюю группу строк, нажмите Command + J (Mac) или Control + J (ПК), чтобы скопировать группу.

Возьмите инструмент «Перемещение», нажав V , и перетащите строку вниз, пока она не поместится в центре холста.

Переименуйте эту дублированную группу в «Средний ряд».

Повторите этот процесс со средней строкой, нажав Command + J (Mac) или Control + J (ПК), чтобы скопировать их сгруппировать, используя инструмент перемещения, чтобы расположить ее внизу.

Переименуйте эту последнюю группу в «Нижний ряд».

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

Как и в случае со слоями, небольшая разница в размерах не будет заметна в вашем коллаже Photoshop.

Пустое пространство между строками

Пустое пространство, заполненное перемещением строки с помощью клавиш со стрелками.

Шаг 3. Обрежьте изображения по форме каждой строки

Теперь начинается самое интересное, и вы можете добавлять фотографии в свой шаблон коллажа! Переключая окна, чтобы найти изображения, выберите инструмент «Перемещение» ( V ) и щелкните групповой слой.

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

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

Поскольку вы хотите, чтобы ваши фотографии ограничивались размером и местоположением фигуры, вам необходимо создать обтравочную маску. Убедитесь, что слой изображения находится прямо над формой, в которой вы хотите, чтобы он отображался, щелкните правой кнопкой мыши слой изображения и выберите «Создать обтравочную маску».”

Теперь ваша фотография будет видна только внутри той формы, к которой она была вырезана. Вы можете использовать инструмент «Перемещение» ( V ), чтобы изменить масштаб и расположить изображение так, чтобы оно лучше вписывалось в форму. Поскольку слой изображения представляет собой смарт-объект, вы можете увеличивать или уменьшать его масштаб без потери качества!

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

Шаг 4. Добавление линий между изображениями в коллаже

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

Щелкните и удерживайте инструмент «Область» на панели инструментов, чтобы открыть выделение одной строки и одного столбца. Для этого я буду использовать выделение в один столбец.

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

При активном выборе установите белый цвет переднего плана и нажмите Option + Delete (Mac) или Alt + Delete (ПК), чтобы залить выделение белым цветом.

Нажмите Command + D (Mac) или Control + D (ПК), чтобы отменить выбор после того, как закончите.

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

Чтобы ускорить процесс, вы можете продублировать эту строку, чтобы снова использовать ее для дополнительных строк.Выделив линейный слой, возьмите инструмент перемещения ( V ), удерживайте Alt или Option (ПК / Mac), щелкните и перетащите из своей линии, чтобы дублировать ее. Соответственно переместите эту вторую строку в другой столбец.

Создав два новых линейных слоя, щелкните, удерживая клавишу Shift, между верхней и нижней линиями и нажмите Command + G (Mac) или Control + G (ПК), чтобы сгруппировать их. Переименуйте эту группу в «Граница столбца».

Чтобы упростить жизнь строкам, продублируйте группу столбцов, нажав Command + J (Mac) или Control + J (ПК).Выберите инструмент перемещения, нажав V , и поверните границы столбцов, пока они не выровняются со строками вашего коллажа. После этого переименуйте эту группу в «Rows Border».

— Обводка всего коллажа цветной рамкой

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

Создайте новый слой в верхней части стека слоев и установите цвет переднего плана на черный .Залейте этот новый слой черным, нажав Option + Delete (Mac) или Alt + Delete (ПК).

Измените режим наложения слоя с Normal на Screen , чтобы сделать весь черный прозрачный.

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

Теперь у вас будет цветной контур по краям коллажа, который добавит приятный эффект вашему шаблону!

Шаг 5. Сохранение шаблона коллажа в формате PSD

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

Все, что осталось — сохранить шаблон!

Чтобы начать процесс, перейдите к Файл> Сохранить как.

Затем переименуйте файл и выберите место для сохранения на вашем компьютере.

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

Чтобы сохранить коллаж как фотографию, которой можно поделиться, установите формат JPEG.

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

Нажмите «Сохранить», и ваш шаблон коллажа Photoshop готов!

Получите доступ к 5 бесплатным шаблонам коллажей для Photoshop

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

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

Щелкните здесь, чтобы получить доступ к этим 5 бесплатным шаблонам!

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

Счастливого коллажирования!

— Брендан 🙂

Учебное пособие по Photoshop: создание фото шаблона смарт-объекта

Покойный (великий!) Писатель-фантаст Дуглас Адамс однажды сказал: «Я люблю дедлайны. Мне нравится свистящий звук, который они издают, когда проходят мимо ». К сожалению, этот «свистящий шум» слишком знаком, и в сегодняшнем экономически напряженном мире сроки выполнения критически важны.В конце концов, чтобы получить деньги в карман, нужно выпускать проекты на рынок! К сожалению для большинства креативщиков, солнце встает каждый день только для того, чтобы освещать список дел длиной в милю и горы электронных писем. Черт возьми, это чудо, что мы вообще можем встать с постели!
К счастью, смарт-объекты Photoshop позволяют вам работать умнее, а не усерднее, экономя массу времени. Из этого урока вы узнаете, что такое смарт-объект, чем он полезен и как с его помощью можно создавать одни из самых красивых фото шаблонов, которые вы когда-либо видели.Затем используйте то, чему вы научились, для создания собственных безграничных умных эффектов!
Что такое смарт-объект?
Хотя Adobe называет смарт-объект контейнером, «чудо-слой» лучше подходит. Смарт-объекты (которые дебютировали еще в Photoshop CS2) позволяют работать со всеми типами файлов изображений, даже с теми, которые не были созданы в Photoshop (например, Camera Raw и векторные файлы). Когда вы открываете изображение как смарт-объект или помещаете его в существующий документ, Photoshop запоминает все об оригинале, включая его размер и формат файла.Это позволяет:
Изменить размер содержимого без потери качества. Вместо изменения размера экземпляра (копии) содержимого, которое вы вставили в документ, Photoshop запоминает информацию об оригинале, изменяет ее размер, а затем помещает эту информацию обратно в ваше изображение (оставляя фактический исходный файл без изменений). Не имеет значения, находится ли этот оригинал где-нибудь на жестком диске (вектор, файл Camera Raw и т. Д.) Или прямо в документе Photoshop (скажем, на другом слое).В мгновение ока Photoshop обновляет ваш документ содержимым с новым измененным размером. Если это векторное изображение, вы можете сделать его большим, и оно не будет выглядеть блочно. Если это пиксельное изображение, убедитесь, что оно не превышает исходный размер. А если вы используете CS4, вы также можете использовать весь спектр команд преобразования для смарт-объектов.
Неразрушающим образом сожмите группу слоев в один. В отличие от объединения слоев, вы можете преобразовать несколько слоев в один смарт-объект и сохранить исходные слои.Это полезно, если Photoshop задыхается от количества слоев, имеющихся в вашем документе, или если вы хотите редактировать несколько слоев, как если бы они были одним (например, когда вы применяете стили слоев).
Запустите фильтры без разрушения. Когда вы запускаете фильтр для смарт-объекта, фильтрация происходит на новом слое. Таким образом вы можете настроить или отменить эффекты фильтра. У них даже есть собственная маска слоя, позволяющая скрыть эффект фильтра в определенных областях. Дополнительные сведения о смарт-фильтрах см. В следующем руководстве.
Обновление нескольких экземпляров одного и того же содержимого. Если вы разместили одно и то же содержимое в нескольких местах документа — например, большой логотип в одном месте и меньшую версию того же логотипа в другом месте — и вы вносите изменения в исходный файл, Photoshop автоматически обновит его для вас везде. он появляется в вашем документе. Сладкий!
Обмен содержимым. После того, как вы правильно отформатировали смарт-объект, вы можете поменять его содержимое на другое изображение, и новое изображение примет атрибуты оригинала.Это мощная магия, когда дело доходит до создания креативных шаблонов, которые можно использовать снова и снова, но с разными изображениями (фотографы любят такие вещи).
Хотя диапазон эффектов, которые вы можете создать с помощью шаблона смарт-объекта, безграничен, сегодня вы узнаете, как создать такой, который преобразует цветное изображение в черно-белое, придает ему оттенок сепии и виньетку. Вот как это сделать.
Шаг 1
Запустите Photoshop и выберите «Файл»> «Открыть как смарт-объект». Перейдите туда, где находится изображение на жестком диске, и нажмите «Открыть» (вы можете использовать различные форматы файлов, включая Raw, JPEG, TIFF, EPS и т. Д.).). Затем Photoshop создаст новый документ, содержащий изображение как смарт-объект (обратите внимание на маленький значок смарт-объекта на миниатюре слоя, обведенном ниже).

Step 2
Создайте корректирующий слой «Черно-белый» с помощью новой панели «Коррекция» в Photoshop CS4 (показанной внизу слева) или щелкнув половину черного / полубелого круга в нижней части панели «Слои» (как показано ниже) справа).

Step 3
Если вы используете CS4, вы увидите набор ползунков на панели настроек.Если вы используете CS3, откроется диалоговое окно, содержащее тот же набор ползунков. В любом случае вы можете настраивать ползунки цвета, пока не получите высококонтрастное черно-белое изображение. ПРИМЕЧАНИЕ. Если вы работаете в CS3, пока не закрывайте диалоговое окно «Черно-белое»!

Step 4
Затем вы можете добавить оттенок сепия к своему изображению. Если вы работаете в CS4, установите флажок «Оттенок» в верхней части панели «Коррекция» (обведен кружком ниже). Если вы используете CS3, флажок «Оттенок» находится в нижней части диалогового окна «Настройка черно-белого».Если вы хотите изменить цвет оттенка, вы можете щелкнуть небольшой образец цвета справа от флажка «Оттенок» в CS4 или с помощью ползунков радуги в нижней части диалогового окна в CS3. В любом случае откроется палитра цветов, позволяющая выбрать другой цвет для оттенка.

Шаг 5
На панели «Слои» щелкните один раз, чтобы выбрать слой с фотографией смарт-объекта, а затем выберите «Фильтры»> «Искажение»> «Коррекция объектива». В появившемся миниатюрном диалоговом окне (ха!) Снимите флажок сетки в самом низу, чтобы вы могли видеть, что, черт возьми, вы делаете.Затем наведите указатель мыши на правую часть диалогового окна и найдите раздел под названием «Виньетка». Возьмите ползунок «Сумма» и перетащите его до упора влево, и края вашего изображения сразу же потемнеют. Чтобы сделать их еще темнее, перетащите ползунок «Средняя точка» влево. По завершении нажмите ОК.

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

Step 6
Сохраните шаблон, выбрав «Файл»> «Сохранить как», дайте ему умное имя, например «My Way Cool Smart Sepia Template», и нажмите «Сохранить».
Шаг 7
Чтобы поменять местами фотографии, откройте шаблон, наведите указатель мыши на панель «Слои» и, удерживая нажатой клавишу «Ctrl» (щелкните правой кнопкой мыши на ПК), нажмите слой фотографии смарт-объекта. В появившемся меню выберите «Заменить содержимое», перейдите туда, где находится новое изображение, и нажмите «Поместить».

Загляните в панель «Слои», и вы увидите, что фотография действительно изменилась:

И вы также увидите, что новая фотография сделана со всеми эффектами оригинала:

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

Как использовать шаблоны для создания коллажа или монтажа в Photoshop

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

Чтобы помочь нашим читателям GIMP, я создал новый набор шаблонов, и когда я их делал, мне показалось хорошей идеей включить инструкции для Photoshop и Photoshop Elements, а также для GIMP. Вот как использовать загружаемый шаблон для создания монтажа изображений:

Начните с посещения этого сайта и загрузите zip-файл шаблона.

Затем разархивируйте шаблоны, сохраните их там, где вы сможете найти их, когда вам понадобится их использовать, и откройте один из них.Я использовал шаблон triptych.psd.

Когда вы откроете его, вы обнаружите, что есть ряд слоев. На этом этапе верхний слой можно отключить или удалить. Следующие два слоя — это инструкции для пользователей GIMP и Photoshop. Опять же, вы можете отказаться от этих двух слоев.

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

В шаблоне щелкните слой A, затем щелкните первое изображение и перетащите слой фона из первого изображения в основное изображение.

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

Вы можете точно настроить размещение и размер, перемещая содержимое нового слоя.

Теперь щелкните слой B и снова перетащите фоновый слой со второго изображения в этот шаблон. Опять же, разместите интересную часть изображения над нижележащим фоном, при желании изменив размер изображения. Создайте обтравочную маску для этого слоя, выделив изображение и выбрав «Слой»> «Создать обтравочную маску».

Повторите это для слоя C, используя третье изображение.

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

Этот же процесс можно использовать в Photoshop Elements.

Обзор создания шаблонов в Photoshop

Customer’s Canvas может импортировать шаблоны из файлов PSD. В результате он преобразует их во внутренний формат .st на основе JSON. В большинстве случаев вам не следует иметь дело с .st напрямую, поэтому, вероятно, проще думать об этом как о «открытии» файлов PSD в веб-дизайнере для печати.

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

Действительные шаблоны PSD

Вы не можете передать произвольный файл PSD на холст клиента. Однако какие файлы PSD вы можете открывать?

Customer’s Canvas работает с многослойными файлами PSD, содержащими изображения, текст, фигуры и интеллектуальные слои. Цветовой формат должен быть RGB, CMYK или Grayscale. Он не должен содержать эффектов причудливых слоев — вы должны по возможности сгладить их.

Текстовые слои могут содержать следующие настройки шрифта:

• Название и размер шрифта
• Стиль: полужирный, курсив, искусственный жирный, искусственный курсив и т. Д.
• Цвет
• Отслеживание (интервал между символами) и интерлиньяж (интервал между базовыми линиями)

И следующий параграф настроек:

• Выравнивание
• Отступ первой строки, отступ слева и отступ справа
• Пробел до и пробел после

Остальные параметры игнорируются.

Customer’s Canvas поддерживает как текстовые слои «Точка», так и «Абзац». Эти текстовые слои могут быть ориентированы вертикально или горизонтально.В Point Text у вас всегда есть одна позиция, которая указывает, где находится текст (в зависимости от выбранного режима выравнивания, который определяет левую, центральную или правую позицию слоя), а Paragraph Text определяет границы. Если текст превышает это поле, он обрезается.

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

В дополнение к текстовым слоям вы можете добавлять пути для изогнутых текстов.

Теперь давайте попробуем создать шаблон PSD, совместимый с Customer’s Canvas.

Учебное пособие: первый шаблон

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

Если мы собираемся печатать наши визитки с разрешением 300 DPI, а размер визитки 3×5 дюймов, давайте воспользуемся фоновым изображением размером 900×1500 пикселей. Откройте это изображение в Photoshop.

Теперь давайте создадим текстовый слой. Чтобы создать слой «Точечный текст», щелкните инструмент «Текст» на панели «Инструменты » , а затем щелкните то место, куда вы хотите поместить текст. Введите образец текста, чтобы пользователи знали, какие данные они должны вводить.

Чтобы вставить логотип, просто найдите образец логотипа и вставьте его как слой изображения.

В результате должно получиться примерно так:

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

Вы можете захотеть управлять поведением шаблона в дизайнере web-to-print, например, заблокировав положение слоя (не допустив его перемещения пользователем), но разрешив редактировать текстовую строку.Форматирование в Photoshop для этого недостаточно гибкое. Вот почему мы создали систему так называемых маркеров — специальных символов, которые вы добавляете к имени слоя, которые используются холстом клиента для управления разрешениями для каждого элемента. Вы можете найти подробную информацию о синтаксисе маркеров и их полный список в теме Поддерживаемые маркеры.

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

Чтобы пометить фон как нередактируемое изображение, дважды щелкните имя соответствующего слоя в Photoshop и добавьте к нему . Нет разницы, в каком месте вы ставите маркер — в начале имени, в конце или где-то внутри строки. Более того, вы можете оставить только маркер, если хотите.

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

В результате список названий слоев выглядит следующим образом:

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

Подготовка шаблонов холста заказчика из существующих файлов PSD

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

Вот список наиболее частых взаимодействий с файлами PSD и рекомендации по их устранению.

Сбой при визуализации пробных изображений с исключением

Photoshop CC 2020 появился инструмент Enhanced Warp Tool. Если вы разработали макет для предварительного просмотра в 3D, вы, скорее всего, применили преобразование деформации к смарт-объектам.Однако холст клиента не может читать преобразования, созданные этим инструментом.

Решение : Избегайте использования преобразования деформации в Photoshop CC 2020.

PSD-файл не открывается

Для этого может быть несколько причин, но, скорее всего, это связано с необычным цветовым пространством или дополнительными каналами. Пользовательский холст работает с изображениями RGB, CMYK или оттенками серого, а глубина цвета должна составлять 8 бит на канал.

Решение : Преобразуйте изображение в формат RGB или CMYK и удалите все лишние каналы.Если у вас по-прежнему возникают проблемы с загрузкой этого файла, отправьте его нашей технической команде.

Невидимые слои видны

«Холст клиента» игнорирует флаг «Видимость» слоя.

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

Параметры слоя игнорируются

«Холст клиента» игнорирует такие параметры слоя, как «Блокировка», «Заливка», «Непрозрачность» и т. Д.

Решение : Вам следует избегать использования этих параметров. Попробуйте объединить слои с такими параметрами в слой изображения. Также вы можете создать альфа-канал, используя маску слоя. Для этого щелкните правой кнопкой мыши маску на вкладке Layers , а затем нажмите Apply Layer Mask .

Без визуальных эффектов

Холст клиента не может считывать информацию о визуальных эффектах (свечение, атлас и т. Д.).

Решение для фиксированных слоев: превратите визуальные эффекты в отдельные слои изображения. Для этого щелкните правой кнопкой мыши в представлении «Слои» и выберите Создать слой .

Слои корректировки, эффекта и заливки игнорируются

Customer’s Canvas поддерживает растровые (изображения) слои, векторные фигуры, смарт-объекты и текстовые слои.

Решение : примените или сгладьте все эти слои перед открытием шаблона на холсте клиента.

Некоторые настройки шрифта / абзаца не применяются

Холст клиента считывает только следующие параметры шрифта:

• Название и размер шрифта
• Стиль: полужирный, курсив, искусственный жирный, искусственный курсив и т. Д.
• Цвет
• Отслеживание (интервал между символами) и интерлиньяж (интервал между базовыми линиями)

И следующий параграф настроек:

• Выравнивание
• Отступ первой строки, отступ слева и отступ справа
• Пробел до и пробел после

Шаблон загружается слишком медленно

Это происходит, если в шаблоне много слоев, особенно слоев изображений.