Как рисовать повторяющиеся узоры в Фотошоп / Creativo.one
В этом уроке мы изучим основы рисования и применения простых повторяющихся узоров в программе Photoshop. Мы рассмотрим только азы работы с узорами, но как только вы поймете принцип действия повторяющихся узоров, вы быстро откроете для себя практически неограниченные возможности применения узоров в своих дизайнах от создания простого фона для альбома или веб страницы до рисования более сложных эффектов.
Мы разделим наш урок по изучению повторяющихся узоров на три части. Сначала мы создадим единый элемент (мотив), который впоследствии станет нашим повторяющимся узором. Далее мы научимся сохранять этот элемент как действительный узор в программе Photoshop. И, наконец, создав новый узор, мы рассмотрим, как выбирать узор и применять его ко всему слою. В следующих уроках по этой теме мы научимся добавлять к узорам цвета и градиенты, воспользуемся режимами наложения, чтобы соединить отдельные узоры вместе, создадим узоры из произвольных фигур и многое другое!
В этом уроке я буду работать в версии программы Photoshop CS5, но данные шаги можно применить к любой недавней версии программы.
Шаг 1. Создаем новый документ
Давайте начнем с создания отдельного мотива для узора. Для этого нам нужен новый пустой документ, поэтому я перейду в раздел «Файл» (File) в строке меню в верхней части экрана и выберу пункт «Новый» (New):
Выбираем «Файл» > «Новый»
В результате, откроется диалоговое окно «Новый» (New). Для параметров 
Параметр
Введите значения ширины и высоты для своего документа и убедитесь, что для параметра «Содержимое заднего фона» выбран вариант «Прозрачный»
Нажмите ОК, когда вы закончите ввод значений, для закрытия диалогового окна, и новый документ появится у вас на экране. Узор в виде шахматной доски в окне заливки свидетельствует о том, что задний фон документа прозрачный. Поскольку документ достаточно мал – всего лишь 100 х 100 пикселей, я приближу его, удержав клавишу 
Теперь, масштаб изображения равен 500%.
Новый пустой документ с масштабом изображения, равным 500%
Шаг 2. Добавляем направляющие через центр документа
Выбираем «Просмотр» > «Новая направляющая»
В результате этого действия откроется диалоговое окно «Новая направляющая». В разделе «Ориентация» (Orientation) выберите «Горизонтальная» (Horizontal), а для параметра «Положение» (Position) введите 50%. Нажмите ОК для закрытия диалогового окна, и в документе появится горизонтальная направляющая, проходящая через центр:
Выбираем «Горизонтальная» и вводим 50% для параметра «Положение»
Вернитесь в меню «Просмотр» (View) и снова выберите пункт «Новая направляющая» (New Guide).
На этот раз в диалоговом окне в разделе «Ориентация» (Orientation) выберите «Вертикальная» (Vertical), а для параметра «Положение» (Position) введите 50%.
Выбираем «Вертикальная» и вводим 50% для параметра «Положение»
Нажмите ОК для закрытия диалогового окна, и теперь у вас появятся две направляющие (вертикальная и горизонтальная), проходящие через центр документа. Точка их пересечения — как раз самый центр документа. По умолчанию, цвет направляющей голубой, поэтому, возможно, на скриншоте направляющие увидеть немного затруднительно:
Вертикальная и горизонтальная направляющие, проходящие через центр документа
Изменяем цвет направляющей (Дополнительный шаг)
Если Вам трудно увидеть направляющие из-за их светлого цвета, вы можете изменить цвет в разделе «Установки».
На компьютере РС перейдите в раздел меню «Редактирование»
Выбираем «Направляющие, сетка и фрагменты» в разделе «Установки»
В результате откроется диалоговое окно раздела «Установки» с опциями направляющих, сетки и фрагментов. Самая верхняя опция «Цвет» (Color) отвечает за цвет направляющей. Как я уже упоминал, по умолчанию цвет направляющей – голубой. Кликните по слову
Выбираем светло-красный в качестве нового цвета для направляющих
Нажмите ОК, когда вы закончите, чтобы закрыть диалоговое окно «Установки».
Цвет направляющих в окне документа изменится (обратите внимание, что программа будет отображать направляющие с новым цветом до тех пор, пока вы снова не зайдете в раздел «Установки» и не измените цвет обратно на голубой или на какой-либо другой):
Направляющие изменили свой цвет и стали заметнее
Шаг 3. Рисуем фигуру в центре документа
Вы можете создать очень сложные узоры в программе Photoshop, или узоры могут быть достаточно простыми и состоять всего лишь из точек или кругов. Давайте нарисуем в центре документа круг. Сначала на панели инструментов выберите инструмент «Овальная область» (Elliptical Marquee Tool). По умолчанию, он находится под инструментом «Прямоугольная область» (Rectangular Marquee Tool), поэтому кликните по инструменту «Прямоугольная область» и удержите кнопку мышки нажатой несколько секунд до тех пор, пока не появится всплывающее меню, где вы сможете выбрать инструмент «Овальная область»:
Кликните по инструменту Прямоугольная область», удержите нажатой кнопку мышки и затем выберите инструмент «Овальная область»
Выбрав инструмент «Овальная область», переместите курсор мышки в точку пересечения направляющих в центре документа.
Нажмите и удержите клавиши Shift+Alt (Win) / Shift+Option (Mac), кликните в центре документа и, удерживая кнопку мыши нажатой, переместите курсор, нарисовав круглое выделение. Нажатие клавиши Shift позволит вам нарисовать выделение идеально круглой формы, в то время как клавиша Alt (Win) / Option (Mac) key отвечает за рисование контура выделения от центра. Когда вы закончите рисовать, ваш контур выделения будет выглядеть примерно так (не переживайте, если не угадали точно с размером, в данном случае это не столь важно):
Удержите нажатыми клавиши Shift+Alt (Win) / Shift+Option (Mac) и нарисуйте от центра выделение круглой формы
Шаг 4. Заполняем выделение черным цветом
Перейдите в раздел меню «Редактирование»
Выбираем «Редактирование» > «Выполнить заливку»
В результате откроется диалоговое окно «Заполнить» (Fill), где мы сможем выбрать цвет, которым заполним наше выделение.
Установите параметр «Использовать» (Use) в верхней части диалогового окна на «Черный» (Black):
Устанавливаем параметр «Использовать» на «Черный»
Нажмите ОК, чтобы закрыть диалоговое окно. Программа заполнит наше выделение круглой формы черным цветом. Нажмите сочетание клавиш Ctrl+D (Win) /Command+D (Mac), чтобы быстро убрать контур вокруг фигуры (вы также можете перейти в раздел меню «Выделение» (Select) и выбрать пункт «Отменить выделение» (Deselect), но нажатие клавиш – более быстрый вариант). Помните, что масштаб изображения все еще равен 500%, поэтому края круга выглядят угловатыми:
Выделение заполнилось черным цветом
Шаг 5.
Дублируем слой
Добавив всего лишь один круг в центр нашего мотива, мы уже можем сохранить его как узор. Однако прежде чем мы это сделаем, давайте придадим мотиву более интересный вид. Для начала, сделайте копию слоя, перейдя в раздел меню «Слои» (Layer) в верхней части экрана, выбрав «Новый» (New) и далее «Скопировать на новый слой» (Layer via Copy). Или, если вы предпочитаете работать с клавишными комбинациями, нажмите Ctrl+J (Win) /Command+J (Mac):
Выбираем «Слои» > «Новый» > «Скопировать на новый слой»
В окне документа ничего не изменится, однако на панели слоев выше исходного слоя появится копия слоя под названием «Слой 1 копия» (Layer 1 copy):
На панели слоев выше исходного слоя появится копия слоя 1
Шаг 6.
Применяем фильтр «Сдвиг»
При рисовании мотивов, которые впоследствии будут использоваться как повторяющиеся узоры, практически всегда желательно применять фильтр «Сдвиг» (Offset). Его можно найти, выбрав раздел «Фильтр» (Filter) в строке меню в верхней части экрана, перейдя в пункт «Другое» (Other) и далее «Сдвиг» (Offset):
Выбираем Фильтр > Другое > Сдвиг
В результате откроется диалоговое окно фильтра «Сдвиг». Данный фильтр перемещает или сдвигает содержимое слоя на определенное число пикселей по горизонтали, по вертикали или в обоих направлениях. При создании простых повторяющихся узоров, как в нашем случае, вам нужно ввести значение, равное половине ширины документа в окошко ввода данных «По горизонтали» и значение, равное половине высоты документа в окошко ввода данных «По вертикали».
Поскольку наш документ имеет размеры 100 x 100 пикселей, установите значение 50 пикселей для параметра «По горизонтали» (Horizontal) и «По вертикали» (Vertical). В нижней части диалогового окна в разделе «Неопределенные области» (Undefined Area) выберите пункт «Вставить отсеченные фрагменты» (Wrap Around):
Установите для параметров «По горизонтали» и «По вертикали» значения, равные половине размеров документа и убедитесь, что выбран пункт «Вставить отсеченные фрагменты»
Нажмите ОК для закрытия диалогового окна. На экране документа нам станет видно, что фильтр «Сдвиг» взял копию круга, которую мы создали в предыдущем шаге, и разделил ее на четыре равных части, разместив их по углам документа. Круг, который остался в центре, — это исходный круг, нарисованный на Слое 1:
Изображение после применения фильтра «Сдвиг»
Шаг 7.
Определяем мотив в качестве узора
Нарисовав мотив, давайте сохраним его в качестве узора. Это действие в программе Photoshop называется «Определение узора». Перейдите в раздел меню «Редактирование» (Edit) в верхней части экрана и выберите пункт «Определить узор» (Define Pattern):
Выбираем «Редактирование» > «Определить узор»
В результате этого действия откроется диалоговое окно, где вам будет предложено дать название новому узору. Хорошей идей является включение в название узора размеров мотива, в случае если вы разрабатываете несколько похожих мотивов разного размера. Таким образом, я назову свой узор «Круги 100х100». Нажмите ОК, когда вы дадите своему узору название, чтобы закрыть диалоговое окно. И теперь наш мотив сохранен как узор!
Назовите узор «Круги 100х100»
Шаг 8.
Создаем новый документ
Мы создали наш мотив и сохранили его как узор, теперь мы можем воспользоваться им, чтобы заполнить целый слой! Давайте создадим новый документ, в котором будем работать. Так же как мы делали в Шаге 1, перейдите в раздел «Файл» (File) в строке меню в верхней части экрана и выберите пункт «Новый» (New). Когда откроется диалоговое окно нового документа, введите значение 1000 рх для параметров «Ширина» (Width) и «Высота» (Height). Параметр «Разрешение» (Resolution) оставьте без изменения по умолчанию – 72 пикселя на дюйм (pixels/inch), а параметр «Содержимое заднего фона» (Background Contents) в этот раз измените на «Белый» (Transparent), чтобы задний фон нового документа был заполнен белым цветом. Нажмите ОК, когда вы закончите вводить значения, для закрытия диалогового окна.
Новый документ появится на вашем экране:
Создаем новый документ с белым задним фоном размером1000 x 1000 px
Шаг 9. Добавляем новый слой
Теперь мы могли бы просто заполнить слой с задним фоном созданным узором, но тогда возможности работы с узором будут сильно ограничены. Как мы с Вами рассмотрим далее, в следующем уроке, когда будем добавлять к узору цвета и градиентную заливку, лучше всего для работы с повторяющимся узором размещать его на отдельном слое. Кликните по значку «Создать новый слой» (New Layer) в нижней части панели слоев:
Нажимаем на значок «Создать новый слой»
Новый пустой слой под названием «Слой 1» (Layer 1) появится выше слоя с задним фоном:
Появится новый слой
Шаг 10. Заполняем новый слой узором
Добавив новый слой, давайте заполним его нашим узором! Для этого перейдите в раздел меню «Редактирование» (Edit) и выберите «Выполнить заливку» (Fill):
Выбираем «Редактирование» > «Выполнить заливку»
Обычно команда «Выполнить заливку» используется для заливки слоя или выделения чистым цветом, как мы делали в Шаге 4, когда заполняли выделение черным цветом.
Но также мы можем воспользоваться командой «Выполнить заливку», чтобы заполнить какую-либо область узором. Для этого сначала измените значение параметра «Использовать» (Use) на «Узор» (Pattern):
Изменяем параметр «Использовать» на «Узор»
После выбора параметра «Узор» (Pattern), еще один параметр «Заказной узор» (Custom Pattern) появится прямо под ним. Здесь мы сможем выбрать узор, который будем использовать. Кликните по миниатюре предварительного просмотра узора:
Кликните по миниатюре заказного узора
В результате откроется Палитра узоров (Pattern Picker), где будут отображены маленькие миниатюры всех доступных узоров. Узор в виде кругов, который мы только что создали, будет в самом конце перечня. Если опция «Показывать подсказки» (Tool Tips) в разделе «Установки» (Preferences) у вас включена (по умолчанию, она включена), то по мере наведения курсора на миниатюру будет появляться название узора.
Дважды кликните по миниатюре узора, чтобы его выбрать и закрыть Палитру узоров.
В Палитре узоров выбираем узор «Круги 100х100»
Как только вы выбрали узор, все, что вам остается – нажать ОК для выхода из диалогового окна «Заполнить» (Fill). Программа заполнит пустой слой узором в виде кругов, повторив его столько раз, сколько требуется для заполнения всего слоя:
Слой 1 теперь заполнен повторяющимся узором в виде кругов
И вот мы закончили! Конечно, наш черно-белый узор вряд ли можно назвать необычным и запоминающимся, однако наиболее важные моменты на примере этого узора мы с вами в данном уроке рассмотрели: мы создали отдельный мотив, определили его как узор, а затем воспользовались командой «Выполнить заливку» и заполнили целый слой нашим новым узором. Далее, мы продолжим работу с узорами и научимся добавлять к ним цвета и градиенты!
Автор: Steve Patterson
Источник:
www.
photoshopessentials.com
Как создать бесшовный узор в Photoshop
На первый взгяд, может показаться, что бесшовные узоры достаточно сложные в создании, так как часть узора с одной стороны должна продолжаться на другой. Таким узором можно заполнить область любого размера, просто дублируя его. Хорошо, что в Фотошоп есть удобный инструмент, который позволяет упростить процесс создания бесшовных узоров. В этом уроке я покажу вам, как создать повторяющийся узор в стиле рустик с помощью фильтра Offset (Сдвиг).
Картинки, которые выбрали, соединяем в образец узора, который будет бесшовно соединяться, не образуя при этом просветы.
Поскольку во время работы, мы будем использовать много отдельных картинок, удобнее открыть их в в программе с помощью скрипта File – Scripts – Load Files Into Stack (Файл – Сценарии – Загрузить файлы в стек), который автоматически разместит каждый рисунок на отдельном слое в рамках одного документа.
Итак, выбираем все картинки, которые будем использовать в узоре. Но обратите внимание, чтобы параметр Attempt to Automatically Align Source Images (Попытаться автоматически выровнять исходные изображения) был тоже выключен.
Исходники этих изображений довольно большие. Поэтому уменьшаем их с помощью меню Image – Image Size (Изображение – Размер изображения).
Потом переходим Image – Canvas Size (Изображение – Размер изображения) и просто увеличиваем размер самого рабочего полотна. Он будет зависить от того, насколько большой узор вы хотите получить. При необходимости, вы всегда сможете его уменьшить. Однако, увеличить растровое изображение нельзя, так как ухудшиться качество картинки.
Далее выбираем фон для нашего узора и в самом низу панели слоев создаем новый слой. Используя комбинацию клавиш Alt+Backspace заливаем его цветом.
Расположите все картинки по полотну, чтобы они не выходили за границы полотна. Приведите инструмент Move Tool в активацию (V) (Перемещение) и на верхней панели поставьте галочку напротив Auto-Select (Автовыбор), чтобы было удобнее перемещать каждый объект.
С помощью комбинации клавиш Ctrl+T активируем режим свободной трансформации и корректируем масштаб и поворот каждой картинки. Распределяем их по полотну, чтобы сформировать основу будущего узора.
При помощи комбинации Ctrl+Shift+Alt+E объединяем все видимые слои на отдельном новом. Или с зажатой клавишей Alt переходим в меню Layer – Merge Visible (Слой – Объединить видимые).
Сейчас мы видим, что все картинки расположены равномерно по центру полотна. Переходим Filter – Other – Offset (Фильтр – Другое – Сдвиг), настраиваем горизонтальное и вертикальное смещение, чтобы изменить положение элементов узора. Теперь картинка, которая выйдет за границы полотна, сразу же продолжится на противоположной стороне. Именно так и работают бесшовные узоры.
Теперь в центре появились видимые зазоры между картинками. Выбираем слой, который находится ниже объединенной копии видимых слоев, и перемещаем ее в самый верх панели слоев. Корректируем его положение, чтобы заполнить пустое пространство.
С помощью свободной трансформации (Ctrl+T) настраиваем размер, затем кликаем правой кнопкой внутри рамки трансформации и выбираем Flip Horizontal (Отразить по горизонтали), чтобы эта картинка не выглядела идентично той, которая уже есть на объединенном слое.
Повторяем эти действия, пока пространство не будет заполнено другими картинками.
Далее переходим по Edit – Define Pattern (Редактирование – Определить узор) и сохраняем узор в библиотеку Фотошоп.
На панеле слоев сверху, добавляем новый слой и делаем заливку белым. Теперь мы протестируем наш новый узор с помощью стиля слоя.
Нужно дважды кликнуть по этому слою с белой заливкой и выбрать Pattern Overlay (Наложение узора). Теперь находим в списке узоров новый, который мы сохранили выше. При масштабе 100% он будет выглядеть точно так же, как оригинальный документ с узором, то есть в данном случае мы не увидим бесшовность в действии. Чтобы увидеть результат уменьшаем масштаб и узор склеивается в одно сплошное полотно.
Вот и все, бесшовный узор готов! Его можно в любой момент найти в наборах Фотошоп и применить с помощью инструмента заливки или стиля слоя Pattern Overlay (Наложение узора). Фильтр Offset (Сдвиг) позволяет с легкостью создавать бесшовные узоры, автоматически дублируя картинки по мере их смещения за пределы рабочего полотна. Вам останется только заполнить пустые области и узор готов.
Как создать бесшовный узор в Photoshop | Creativo
С первого взгляда кажется, что бесшовные узоры сложно создать, так как часть узора с одной стороны должна продолжаться на другой. Таким узором можно заполнить область любого размера, просто дублируя его. К счастью, в Фотошоп есть удобный инструмент, который позволяет упростить процесс создания бесшовных узоров. В этом уроке я покажу вам, как создать повторяющийся узор в стиле рустик с помощью фильтра Offset (Сдвиг).
СохранитьСохранить
Скачать архив с материалами к уроку
Примечание: Автор использовал платные материалы.
В архиве вы найдёте ссылки на альтернативный вариант изображений для выполнения урока.
Выбранные картинки мы соединим в образец узора, который будет бесшовно соединяться, не образуя при этом просветы.
Так как в работе мы будем использовать много отдельных картинок, будет проще открыть их в программе с помощью скрипта File – Scripts – Load Files Into Stack (Файл – Сценарии – Загрузить файлы в стек), который автоматически разместит каждый рисунок на отдельном слое в рамках одного документа.
Выбираем все картинки, которые будем использовать в узоре. Проверьте, чтобы параметр Attempt to Automatically Align Source Images (Попытаться автоматически выровнять исходные изображения) был выключен.
Оригинальные иллюстрации довольно большие. Поэтому уменьшаем их с помощью меню Image – Image Size (Изображение – Размер изображения).
Затем переходим Image – Canvas Size (Изображение – Размер изображения) и значительно увеличиваем размер рабочего полотна.
Размер зависит от того, насколько большой вам нужен узор. При необходимости, вы всегда сможете его уменьшить. Однако, увеличить растровое изображение нельзя, так как ухудшиться качество картинки.
Выбираем фоновый цвет для узора, затем в самом низу панели слоев создаем новый слой и комбинацией клавиш Alt+Backspace заливаем его цветом.
Распределяем картинки по полотну, но так, чтобы они не выходили за границы полотна. Активируем Move Tool (V) (Перемещение) и на верхней панели ставим галочку напротив Auto-Select (Автовыбор), чтобы было удобнее перемещать каждый объект.
С помощью комбинации клавиш Ctrl+T активируем режим свободной трансформации и корректируем масштаб и поворот каждой картинки. Распределяем их по полотну, чтобы сформировать основу будущего узора.
Комбинацией клавиш Ctrl+Shift+Alt+E объединяем все видимые слои на отдельном новом. Или с зажатой клавишей Alt переходим в меню Layer – Merge Visible (Слой – Объединить видимые).
На данный момент все картинки расположены равномерно по центру полотна. Переходим Filter – Other – Offset (Фильтр – Другое – Сдвиг), настраиваем горизонтальное и вертикальное смещение, чтобы изменить положение элементов узора. Любая картинка, которая выйдет за границы полотна, автоматически продолжится на противоположной стороне. Именно так и работают бесшовные узоры.
Теперь в центре появились видимые зазоры между картинками. Выбираем слой, который находится ниже объединенной копии видимых слоев, и перемещаем ее в самый верх панели слоев. Корректируем его положение, чтобы заполнить пустое пространство. С помощью свободной трансформации (Ctrl+T) настраиваем размер, затем кликаем правой кнопкой внутри рамки трансформации и выбираем Flip Horizontal (Отразить по горизонтали), чтобы эта картинка не выглядела идентично той, которая уже есть на объединенном слое.
Продолжаем заполнять пустые пространства другими картинками, пока они не будут равномерно заполнены графикой.
После этого переходим Edit – Define Pattern (Редактирование – Определить узор) и сохраняем узор в библиотеку Фотошоп.
В самом верху панели слоев добавляем новый слой и заливаем его белым цветом. Теперь мы протестируем наш новый узор с помощью стиля слоя.
Дважды кликаем по слою с белой заливкой и выбираем Pattern Overlay (Наложение узора). Находим в списке узоров новый, который мы сохранили выше. При масштабе 100% он будет выглядеть точно так же, как оригинальный документ с узором, то есть в данном случае мы не увидим бесшовность в действии. Поэтому уменьшаем масштаб, чтобы проверить, как узор склеивается в одно сплошное полотно.
Теперь у нас готов бесшовный узор, который можно найти в наборах Фотошоп и применить с помощью инструмента заливки или стиля слоя Pattern Overlay (Наложение узора). Фильтр Offset (Сдвиг) позволяет с легкостью создавать бесшовные узоры, автоматически дублируя картинки по мере их смещения за пределы рабочего полотна. Вам останется только заполнить пустые области и узор готов.
Попробуйте создать свой бесшовный узор, используя коллекцию графики «Abstract Shapes Print Graphics» из подборки с бесплатными материалами.
Автор: Chris Spooner
Перевод: Максим Енин
Поделиться своей работой и задать вопрос можно на странице урока сайта photoshop-master.ru
Подписывайтесь на наши Яндекс Коллекции
Наложение узора в фотошопе фильтром смещение. Режимы наложения слоев в фотошопе. Применение паттернов в Фотошоп
Одним из новых фильтров последней версии программы Adobe Photoshop является Фильтр смещения (Displace Filter), который и поможет нам раздвинуть кирпичную стену как занавеску. Техника эта довольно-таки простая, поэтому выполнение урока не займет у вас более 30 минут, по истечении которых вы получите вот такое изображение:
Шаг 1. Запустите программу Adobe Photoshop CS5 и создайте новый документ размером 2560 х 1440 пикселей (Ctrl + N ). Затем скачайте по этой ссылке изображение кирпичной стены и добавьте его в созданный ранее документ.
Шаг 2. Теперь нам необходимо импортировать в наш документ изображение девушки, открывающей занавески, скачать которое Вы сможете по этой ссылке .
Шаг 3. Теперь, выберите инструмент Pen Tool (Перо ) или инструмент Lasso Tool (Лассо ), и выделите белые области на изображении с девушкой. Далее в главном меню пройдите Select — Refine Edges (Выделение — Уточнить край ). В появившемся окне настроек, активируйте опцию Smart Radius (Умный радиус ), после чего в этом же окне настроек выберите инструмент Refine Edges Tool и пройдитесь им по границе выделения, для того чтобы оно было сделано максимально качественно. Теперь в главном меню пройдите Layer — Layer Mask — Hide Selection (Слои — Слой-маска — Скрыть выделенную область ).
Шаг 5. После того как занавески будут выделены, расположите слой с изображением кирпичной стены над слоем с девушкой.
Шаг 6. Затем инверсируйте существующее выделение (Chift + Ctrl + I ) и в меню программы пройдите Layer — Layer Mask — Hide Selection (Слои — Слой-маска — Скрыть выделенную область ). Теперь на месте занавесок должна появится кирпичная стена.
Шаг 7. Создайте дубликат слоя с девушкой (Ctrl +J ) и поместите его выше слоя с кирпичной стеной. Теперь необходимо с дубликата слоя удалить изображение девушки. Сделать это можно несколькими способами: отредактировать маску слоя, замаскировав девушку или при помощи инструмента Eraser Tool (Ластик). После того как девушка на верхнем слое будет удалена, в главном меню пройдите Image — Adjustment — Desaturate (Изображение — Коррекция — Обесцветить ), а затем пройдите Image — Adjustment — Levels (Изображение — Коррекция — Уровни ) и немного поиграйте с настройками, чтобы получить результат, максимально приближенный к изображению на скрине:
Шаг 8. Измените режим наложения верхнего слоя с занавесками на Overlay (Перекрытие ). Если вы хотите сделать более выразительный и темный вариант, дублируйте слой с занавесками еще раз.
Шаг 9. Еще раз откройте изображение девушки с занавесками (Ctrl + O ). Затем пройдите главном в меню Image — Adjustment — Desaturate (Изображение — Коррекция — Обесцветить ), после обесцвечивания изображения пройдите Image — Adjustment — Levels (Изображение — Коррекция — Уровни ) и добейтесь эффекта насыщенного черно-белого изображения, как показано на рисунке ниже. Сохраните полученный файл в формате psd.
Шаг 10. Выберите слой с кирпичной стеной. Затем в главном меню пройдите Filter — Distort — Displace (Фильтр — Искажение — Смещение ) и задайте такие же настройки, как на скрине (Масштаб по горизонтали — 10, Масштаб по вертикали — 30, Растянуть (Stretch to Fit), Повторить граничные пикселы (Repeat Edge Pixels)), нажмите кнопку ОK и в появившемся диалоговом окне выберите изображение, которое в предыдущем шаге было сохраненно в формате PSD.
Шаг 11. Выберите верхий слой, после чего пройдите в главном меню программы Layer — New Adjustment Layer — Gradient Map (Слой — Новый корректирующий слой — Карта градиента ). В окне настроек выберите градиентный переход от черного к белому и нажмите кнопку OK. В результате этого должен появиться корректирующий слой, режим наложения которого необходимо изменить на Soft Light (Мягкий свет).
Шаг 12. Обратите внимание на то, чтобы у Вас был выбран верхний слой, после чего в главном меню пройдите Layer — New Adjustment Layer — Photo Filter (Слой — Новый корректирующий слой — Фотофильтр ). В появившихся настройках выберите оранжевый цвет, установите значение Плотности (Density ) равное 60% и активируйте опцию Сохранить свечение .
Шаг 13. Давайте добавим еще однин корректирующий слой, для этого в главном меню пройдите Layer — New Adjustment Layer — Hue/Saturation (Слой — Новый корректирующий слой — Цветовой тон/Насыщенность ) и задайте следующие настройки: Насыщенность -20 и Яркость +5
Шаг 14. После всех этих шагов должен получиться примерно такой результат.
Шаг 15. Скачайте по этой ссылке изображение пейзажа, после чего откройте его в Фотошопе. Перетащите изображение с пейзажем на рабочий документ и расположите слой с пейзажем, выше фонового слоя. У Вас должен получиться следующий результат:
Шаг 16. Теперь давайте пройзведем незначительную цветокоррекцию пейзажа, для этого в главном меню пройдите Image — Adjustment — Hue/Saturation (Изображение — Коррекция — Цветовой фон/Насыщенность ) и установите следующие настройки: Цветовой тон -35 и Насыщенность -50.
Шаг 17. Создайте новый слой и расположите его поверх остальных слоев.При помощи инструмента Paint Bucket Tool (Заливка ), заполните данный слой черным цветом. Далее при помощи инструмента Brush Tool (Кисть ) с жесткостью 0%, оставьте в центре большой отпечаток белого цвета. Измените режим наложения для этого слоя на Multiply (Умножение ).
Шаг 18. Создайте слой, объединяющий в себе все существующие слои, для этого нажмите Ctrl + Alt + Shift + E . В результате этого у Вас должен появиться новый слой, расположенный поверх всех остальных. Теперь данному слою следует добавить незначительное размытие, для этого в главном меню пройдите Filter — Blur — Gaussian Blur (Фильтр — Размытие — Размытие по Гауссу ) и установите значение радиуса равное 10. Измените режим наложения данного слоя на Screen (Экран ) и установите для него Непрозрачность 60%.
Вот, что у Вас должно получиться в конечном результате:
Оригинал урока находится .
Немногие начинающие пользователи Adobe Photoshop знают о том, какие потенциальные возможности скрыты в недрах этой программы.
Я расскажу Вам (а кое-что даже покажу) что такое узоры в Photoshop, зачем они нужны, как ими пользоваться, а в следующей статье Вы узнаете,
Эти знания помогут Вам научиться использовать в своей работе приемы узорной заливки, наложения узора в стилях стоя и рисования с использованием инструмента «Узорный штамп».
Ну что ж, приступим.
1. Что такое узоры в Фотошоп и зачем они нужны.Узоры в Photoshop это фоновые изображения, которые можно использовать для заливки областей, содержимого слоев и масок.
Вся прелесть их использования заключается в том, что это фоновое изображение тиражируется (повторяется) до тех пор, пока не заполнит весь элемент, на который оно накладывается.
Этот инструмент очень хорошо подходит для создания фонов.
Простой пример: нужно закрасить фон кнопки диагональными параллельными линиями. Что будем делать? Рисовать отдельно линию, потом ее копировать и размножать? А потом обрезать получившееся изображение по контуру кнопки? Это слишком сложно и главное — долго.
Можно просто применить к изображению кнопки узор, состоящий из нескольких пикселей. И этот узор размножится и закрасит всю Вашу кнопку четко по контуру.
Или же нужно, например, наложить на какой-нибудь элемент текстуру какого-нибудь материала. Ткани, например. Применяем к изображению элемента узор текстуры ткани — и все!
2. Как использовать узоры в Фотошоп?В Photoshop есть три основных способа применения узора к элементу.
Первый способ — заливка узором.Наверняка каждый уже пробовал заливать содержимое слоя или выделения каким-нибудь цветом. А ведь можно заливать не только цветом, а и узором.
Смотрим коротенький видеоурок:
Вся прелесть использования заливки узором в том, что мы можем делать каждую заливку в новом слое. А это в дальнейшем дает возможность применения к каждому слою своих дополнительных стилей.
Второй способ — применение стиля слоя «Наложение узора».При использовании этого способа у нас нет возможности в дальнейшем применить к заливке другие стили (так как узор сам и есть элемент стиля слоя), но зато появляются дополнительные параметры наложения узора.
Смотрим урок:
Как видите, этот способ тоже очень интересен, особенно своими возможностями по перемещению фрагментов узора и масштабированием. Но самое главное, что в любой момент мы можем вернуться и переделать, если нам что-нибудь не понравилось.
Третий способ применения узоров — использование инструмента «Узорный штамп».Принцип использования узорного штампа очень прост. Рисовать кистью каждый умеет. Так вот, узорный штамп — это та же самая кисть, только рисует она не цветом, а выбранным узором.
Смотрим, как это происходит:
Итак, мы с Вами разобрались в том, что такое узоры для Фотошопа и как их использовать.
Применение фильтра очень простое. Допустим, у нас имеется документ, состоящий из двух слоёв, это фоновый рисунок размером 500 на 400 пикселей, а на другом слое находится квадрат размером 50 на 50 пикселей. Задача: дублировать квадрат и сдвинуть его вправо на 100 пикс.
Становимся на слой с квадратом, и дублируем его, нажав комбинацию клавиш Ctrl+J. Затем идём по вкладке Фильтры —> Другие —> Сдвиг (Filter —> Other —> Offset) и задаём нужные параметры смещения, т.е +50 пикселей по горизонтали, по вертикали 0.
Как видно на рисунке, смещение квадрата можно увидеть сразу, до окончательного применения фильтра (т.е. клика по ОК).
Если же надо получить несколько копий квадрата на таком же расстоянии, то дублируем его, нажав Ctrl+J, а затем применяем последний фильтр, т.е. «Сдвиг», нажав Ctrl+F. И эти действия нужно повторить столько раз, сколько копий объекта нам требуется.
Перемещение объектов на указанное расстояние с помощью инструмента «Свободное трансформирование «
Используя свободное трансформирование, можно задать не только расстояние, но и изменение размеров объекта. Дублируем квадрат. Нажимаем комбинацию клавиш Ctrl+T и видим, что вокруг квадрата появилась габаритная рамка, но для наших задач она не нужна.
Нам понадобятся настройки вверху рабочего окна Photoshop`а, в панели параметров. По умолчанию в параметрах X и Y будет указано расстояние центра объекта от начала координат, как показано на рисунке.
А нам понадобится расстояние от центра объекта, для чего надо кликнуть по треугольнику, на который указывает стрелка на рисунке, при этом он подсветится серым цветом. Тогда и появится возможность указать значение перемещения относительно начальной позиции квадрата.
На рисунке видно, что для смещения квадрата введены значения X и Y, равные 100 пикселям, а также задан поворот объекта в 45 градусов. Можно изменить и размер объекта, если поставить свои значения вместо ширины и высоты 100%.
Для завершения трансформации надо нажать клавишу Enter.
Чтобы ещё раз сместить и дублировать объект, надо, как в первом примере, клонировать квадрат, нажав Ctrl+J, а затем повторить трансформацию, нажав комбинацию Ctrl+Shift+T.
Теперь попробуем всё это дело автоматизировать, т.к. постоянно тыркать по клавишам грустно.
Для примера с автоматизацией я взял объект поинтереснее квадрата, исключительно ради наглядности.
Автоматизация перемещения с дублированием слоёв в Photoshop
В палитре слоёв выбираем слой, который хотим дублировать.
Открываем палитру Операций, или, как её называют по другому, палитру Действий или Экшенов. Я открываю её комбинацией Alt+F9.
В этой палитре кликаем по расположенной внизу иконке «Создать новый набор» (Create new Set), даём ему какое-нибудь имя. Далее кликаем по иконке «Создать новую операцию» (Create new Action), опять задаём имя. На палитре слоёв кнопка «Начать запись» (Begin Recording) подсветилась красным цветом. Дублируем слой (Ctrl+J), затем применяем фильтр «Сдвиг» или свободное трансформирование, как описано выше. Кликаем по кнопке Остановить «воспроизведение/запись» (stop playing/recording). Всё, действие создано. Палитра операций будет иметь следующий вид (набор я назвал «Сдвиг», а операцию -«Сдвиг на 50 пх) .
В этом уроке я покажу вам как создавать эффект смещения для портретов. Вы научитесь создавать свои собственные карты смещения и искажать изображения так, как вам нравится, а также использовать кисти для создания одного интересного эффекта. Давайте приступим.
Конечный результат:
Шаг 1
Создайте новый документ размером 700*700 пикселей и залейте его белым цветом. Откройте изображение текстуры и перетащите ее в наш вновь созданный документ, используя инструмент Перемещение (Move Tool) (V).
Шаг 2
Создайте корректирующий слой Кривые (Curves), чтобы затемнить нашу фоновую текстуру. Для этого идем в Слои — Новый корректирующий слой — Кривые (Layer > New Adjustment Layer > Curves).
Шаг 3
На этой маске слоя используйте мягкую черную кисть, чтобы проявить светлые участки в средней области изображения.
Шаг 4
Создайте новый корректирующий слой Цветовой Баланс (Color Balance) и измените настройки во вкладках Средние тона (Midtones) и Света (Highlights).
Шаг 5
Откройте изображение мужчины. Отделите его от фона, используя Инструмент Прямолинейное лассо (Polygonal Lasso Tool) (L), ну, или любой другой инструмент, которым владеете лучше.
Теперь конвертируйте слой с выделенным мужчиной в Смарт-объект (Smart Object). Продублируйте данный слой, а затем перейдите в Фильтр — Оформление — Кристаллизация (Filter > Pixelate > Crystallize).
На данный момент мы имеем вот такой результат, и мы используем его в дальнейшем в качестве нашей первой заказной карты смещения. Сохраните этот файл в формате.PSD и назовите его «смещение 1» (“displace 1”) или как вам хочется.
Шаг 6
Переместите изначальное изображение мужчины (изображение без обработки фильтром Кристаллизация) на наш темный фон. Продублируйте данный слой три раза и в качестве названий слоев пронумеруйте их цифрами по порядку от 1 до 4.
Отключите на время дублированные слои (2,3,4). Добавьте маску слою 1. Выбирая различные кисти для рисования, замаскируйте края изображения мужчины.
Шаг 7
Включите слой 2. Масштабируйте изображение мужчины и поверните его так, как показано ниже:
Добавьте маску этому слою и воспользуйтесь мазковыми кистями, чтобы добиться такого же результата, как показано ниже.
Шаг 8
Включите слой 3 и немного увеличьте изображение мужчины, используя Свободное трансформирование (Ctrl+T):
Используйте маску слоя и кисти для рисования, чтобы получить такой результат, как на скриншотах ниже.
Шаг 9
Теперь мы создадим новую заказную карту смещения. Откройте изображение с абстакциями. Используйте инструмент Рамка (Crop Tool (C)), чтобы выбрать только нужную нам абстракцию, а остальное удалить:
Сохраните этот файл в формате.PSD и назовите его «смещение 2» (“displace 2”).
Шаг 10
Теперь давайте вернемся к нашему основному файлу и включим слой 4.Подвиньте изображение мужчины влево и сделайте его немного больше:
Примените фильтр Смещение (Displace) к нашему файлу «смещение 2» (“displace 2”) с настройками, как показано ниже.
Добавьте маску этому слою и, используя несколько кистей для рисования, замаскируйте изображение мужчины. Создайте легкий гранжевый эффект для лица и тела мужчины, а также фона:
Шаг 11
Продублируйте данный слой и передвиньте изображение мужчины вверх и вправо (без маски слоя)
Теперь добавьте маску данному слою и попробуйте поэкспериментировать с мазковыми кистями.
Шаг 12
Продублируйте этот слой еще раз и отразите его по горизонтали Редактирование — Трансформирование — Отразить по горизонтали (Edit > Transform > Flip Horizontal)
Шаг 13
Создайте новый слой и установите цветом переднего плана черный. Воспользуйтесь мазковой кисточкой и нарисуйте на слое так, как показано на нижнем скриншоте:
Удерживая клавишу Ctrl, кликните по миниатюре этого слоя, чтобы загрузить его выделение:
Далее выберите слой 3, кликните правой кнопкой мыши по выделению и в выпадающем меню выберите Скопировать на новый слой (Layer via Copy). Сейчас у нас имеется выделенная часть на новом прозрачном слое. Переместите данный слой в палитре слоев выше всех существующих.
Шаг 14
Передвиньте эту часть над головой мужчины и уменьшите размер этой части.
Добейтесь схожего результата в нижней части с помощью кисточек.
Шаг 15
Примените этот же самый метод, чтобы усилить эффекты гранжа и распада.
Шаг 16
Выделите все слои с изображением мужчины и те, что были обработаны кистями. Нажмите комбинацию клавиш Ctrl+G, чтобы сгруппировать их, и измените режим для этой группы с Пропустить (Pass Through) на Нормальный (Normal) 100%. Далее создайте корректирующий слой Цветовой тон/Насыщенность (Hue/Saturation) внутри этой группы, чтобы слегка обесцветить изображение мужчины и созданного эффекта:
Шаг 17
Теперь создадим корректирующий слой Цветовой баланс (Color Balance), и подкорректируем настройки Средних тонов (Midtones):
Шаг 18
На этой маске слоя применяем мягкую черную кисточку, чтобы сделать видимым свет в области лица.
Шаг 19
Теперь отключите фоновые слои (белый фон и слой с текстурой). Нажмите сочетание клавиш Ctrl+Shift+Alt+E, чтобы слить воедино все видимые слои (имеется в виду группа слоев с изображением мужчины) в один новый слой. Назовите этот слой «Эффект 1» (“effect 1”).
Включите фоновые слои. На слое «Эффект 1» (“effect 1”), используя инструмент Лассо (Lasso Tool), выделите небольшой фрагмент щеки:
Кликните правой кнопкой мыши по этому слою и выберите Копировать на новый слой (Layer via Copy). Чтобы сделать эту часть более видимой и создать эффект отшелушивания, создайте новый слой под существующим, но над слоем «Эффект 1» (“effect 1”). Воспользуйтесь мягкой черной кисточкой с уровнем непрозрачности (Opacity) порядка 40%, чтобы нарисовать тень под ним.
Шаг 20
Примените тот же метод для создания на лице еще больше областей с отшелушеванием кожи.
Шаг 21
Сгруппируйте слой «Эффект 1» (“effect 1”) и все слои, на которых мы воспроизводили пилинговый эффект. Слейте слои этой группы воедино таким же образом, как мы это делали в шаге 19. Увеличьте то, что получилось, как показано на скриншоте ниже:
Шаг 22
Примените корректирующий слой Микширование каналов (Channel Mixer) и переведите его в режим Обтравочной маски. Измените настройки красного канала (значение: -67)
Шаг 23
Измените цвет, применив корректирующий слой Цветовой тон/Насыщенность (Hue/Saturation):
Шаг 24
Вернемся к слою с эффектом и используем маску слоя с мазковыми кистями, чтобы удалить часть, покрывающую мужчину на изображении, и оставить эффект видимым только вокруг него.
Шаг 25
Теперь мы создадим еще больше заказных карт смещения. Создайте новый документ в Фотошоп с прозрачным фоном. Используйте инструмент Прямоугольная область (Rectangular Marquee Tool), чтобы создать несколько прямоугольных выделений и залейте их черным цветом:
Затем, применяем Фильтр — Искажение — Волна (Filter > Distort > Wave)
«смещение 3» (“displace 3).
Шаг 26
Создайте еще один документ в Фотошопе. Создайте новый слой и нажмите D чтобы выставить цвета переднего плана и фона по умолчанию (т.е. черный и белый соответственно). Далее переходим в Фильтры — Рендеринг — Облака (Filter > Render > Clouds)
Затем, переходим в Фильтры — Рендеринг — Волокна (Filter > Render > Fiber)
Теперь применим фильтр Кристаллизация (Crystallize)
Сохраните данный файл в формате.PSD и назовите его «смещение 4» (“displace 4”).
Шаг 27
Добавьте слой с изначальным изображением мужчины поверх всех слоев. Продублируйте этот слой дважды. Скройте эти два дублированные слоя. Переименуйте слои по порядку цифрами от 1 до 3.
На слое 1 поработайте мазковыми кистями, чтобы частично закрыть тело.
Шаг 28
Включите слой 2 и примените фильтр Смещение (Displace), используя файл «смещение 3» (“displace 3).
Добавьте маску этому слою и с помощью мазковых кисточек визуализируйте эффект вокруг изображения мужчины, в особенности его лица.
Шаг 29
Сделайте видимым слой 3. Примените фильтр Смещение (Displace), используя файл «смещение 4» (“displace 4”).
Шаг 31
Создайте отдельную группу для всех слоев, созданных в шагах с 27 по 30. Нажмите комбинацию клавиш Ctrl+Shift+Alt+E, чтобы объединить все эти слои в один. Замаскируйте кисточкой изображение таким образом, чтобы это выглядело как на нижних скриншотах:
Шаг 32
Шаг 33
Теперь, создайте корректирующий слой Цветовой баланс (Color Balance) и измените настройки Средних тонов (Midtones):
Шаг 34
Используем корректирующий слой Кривые (Curves) и понижаем яркость:
Шаг 35
Далее создаем корректирующий слой Карта градиента (Gradient Map) поверх всех слоев и выбираем для градиента следующие цвета #64649f и #85f982. Теперь, измените режим для данного слоя на Мягкий свет (Soft Light) 100%.
Шаг 36
Создаем корректирующий слой Фотофильтр (Photo Filter) и выбираем цвет #ec8a00:
Шаг 37
Шаг 38
Создаем корректирующий слой Кривые (Curves) и увеличиваем уровень яркости:
На данной маске слоя используйте мягкую черную кисть, чтобы замаскировать края и сохранить там тень, и позаботьтесь о том, чтобы свет был сфокусирован на лице мужчины.
Шаг 39
Создайте новый слой и, используя мягкую кисточку с цветом #020b2d, поработайте ею в области уха мужчины.
Измените режим для этого слоя на Линейный осветлитель (Linear Dodge) 100%:
Шаг 40
Создайте новый слой, измените цвет кисти на #8df0f6 и прокрасьте область уха еще раз. Для этого слоя выберите режим Перекрытие (Overlay) 100%.
Ваше изображение наконец готово! Если вы успешно выполнили все шаги, вы, скорее всего, приобрели по-настоящему полезные навыки на этом пути!
Применение узоров в Adobe Photoshop является необходимым процессом творчества для добавления различных интересных элементов в дизайне.
Узоры просты в использовании, но они могут значительно влиять на восприятие ваших композиций и гармонично дополнять их. В этом уроке Фотошоп вы узнаете, как создавать, использовать узоры и управлять ими на практике.
Образцы узоров в Фотошоп необходимы для неоднократного их использования в последующих работах. Применение шаблонов значительно ускоряет рабочий процесс, придавая сложным объектам текстуру выбранного узора. Вы значительно экономите время и добавляете некоторую изюминку вашей работе.
Вы можете создавать свои собственные узоры, использовать содержащиеся в программе паттерны и устанавливать образцы, скачанные из различных ресурсов интернета. В этом уроке мы рассмотрим следующие разделы:
1. Обзор узоров программы с функцией «Управление наборами» (Preset Manager) .
2. Три различных способа применения паттернов в Фотошоп .
3. Как создать собственный узор.
4. Создание и применение линейного диагонального узора на практике.
5. Установка Фотошоп-паттерна в библиотеке программы.
6. Создание библиотеки узоров.
Изучение узоров программы с функцией «Управление наборами» (Preset Manager) .
Вы можете найти узоры программы, заданные по умолчанию через функцию «Управление наборами». Доступ к наборам осуществляется через верхнее меню программы во вкладке Редактирование-Управление наборами (Edit > Preset Manager) . По умолчанию, окно Управления (Preset Manager) отображает палитру кистей (Brushes).
В открывшемся диалоговом окне найдите опцию «Тип набора» (Preset Type) и нажмите на стрелочку вниз. Из выпадающего подменю выберите параметр «Узоры» (Patterns) и вы увидите появившийся по умолчанию программы набор.
Это не все узоры, которые есть в программе. Для того, чтобы увидеть их все, нужно перейти к наборам библиотек. Библиотека узора представляет собой набор из 1 или более образцов, имеющих расширение файла PAT.
Для загрузки шаблонов библиотек программы Фотошоп нажмите на стрелку справа в окне «Управление наборами». В выпадающем подменю вы увидите список наборов различные узоров.
Выберите любой набор из списка и нажмите на него. После этого, появится диалоговое окно, где у вас спросят, заменить ли текущие узоры выбранными.
Нажмите опцию «Добавить» (Append) , если не хотите изменять предыдущие узоры, а просто хотите добавить выбранные сейчас.
Применение паттернов в Фотошоп.
Теперь, когда выбранный набор узоров загружен, посмотрим как его применять на практике. Существует несколько способов использования узоров и мы рассмотрим каждый.
Наложение узора при помощи команды «Заливка» (Fill).
Самый простой способ наложения паттерна заключается в заполнении им выделенной области. Например, активируйте инструмент «Прямоугольное выделение» и выделите участок любого размера на холсте. Затем, перейдите в меню Редактирование-Выполнить заливку (Edit> Fill (Shift + F5)) и в диалоговом окне заливки в опции «Использовать» (Use) укажите параметр Регулярный/Шаблон (Pattern).
Заливка узором позволяет использовать опцию «Заказной узор» (Custom Pattern) . Нажмите на стрелку параметра и вызовите подменю с библиотеками паттернов, нажав стрелочку справа. Выбрав нужный набор или узор, кликните по нему и нажмите ОК, чтобы заполнить им ваше выделение.
Важным преимуществом наложения узора способом Заливки является и то, что данный узор может использоваться на отдельном слое, не затрагивая остальные слои документа.
Наложение узора в «Стилях слоя».
Если вы хотите применить узор для любого выбранного слоя, двойным кликом по миниатюре этого слоя откройте окно «Стили слоя» (Layer Style) . Почти в самом низу найдите параметр «Наложение узора» (Pattern Overlay) и активируйте его. Откроется диалоговое окно опции, где вы можете так же, как и в предыдущем примере, выбрать необходимый паттерн и применить его к слою.
Этот способ требует от вас большей гибкости в использовании: вы можете скрывать, отображать, настраивать и удалять узор слоя, не затрагивая сам слой.
Совет: Чтобы отрегулировать положение узора на холсте, в параметре «Наложение узора» активируйте флажок Просмотр (Preview) , а затем поместите курсор мыши на холст и, удерживая ее нажатой, передвигайте ваш паттерн в основном окне программы в любом направлении.
Рисование узором при помощи инструментов «Заливка» (Paint Bucket Tool) и «Узорный штамп» (Pattern Stamp Tool) .
Если вы хотите применить узор, рисуя им по холсту, используйте инструменты Заливка и Узорный штамп. Активируйте их и настройте на применение узоров, а не цвета в верхней панели программы.
Использование инструментов рисования при наложении узора удобно в том случае, если вы применяете узор нерегулярно. Такой способ дает вам больше контроля за процессом, особенно при наличии графического планшета.
Но рисование узором займет у вас значительно больше времени, чем способ наложения узора при помощи команды «Заливка» или «Стилей слоя».
Посмотрите на сводную таблицу преимуществ и недостатков разных способов при наложении узора.
Создание собственного узора в Фотошоп.
Создание своего узора является несложным процессом. Имейте в виду, что создаваемый вами узор должен состоять из фигур только прямоугольной формы. Если вы захотите использовать круг, то программа будет рассматривать эту фигуру, как прямоугольник.
Чтобы создать узор, используйте инструмент «Прямоугольное выделение» (Rectangular Marquee Tool (M)) и выделите область, которую хотите поместить в узор. Затем перейдите во вкладку Редактирование-Определить узор (Edit> Define Pattern) , чтобы определить выделенную область как паттерн и присвойте ему имя в диалоговом окне.
Совет: Многие предпочитают создавать узор для своей работы за пределами рабочего документа. Это хорошая практика. Создавая Новый документ (Ctrl+N) для своего узора, вы тем самым, концентрируетесь на данной работе, не отвлекаясь ни на что более.
Создание и применение диагонального линейного узора.
Давайте попробуем сделать один из моих любимых паттернов в фотошоп: диагональный узор, который был применен для дизайна сайта «Design Instruct».
Создаем новый документ (Ctrl+N) в Фотошоп размером 600х600 рх и разрешением 72 рх/ дюйм c белым фоном.
Активируем инструмент «Горизонтальный текст» (Horizontal Text Tool (T)) и пишем фразу Design Instruct в верхней части холста. Выберите темный цвет для текста (#000000) , чтобы ясно видеть нашу работу. В данном варианте использован шрифт Helvetica Neue Medium размером 30 pt, но можно выбрать любой другой шрифт программы (например, Arial).
Теперь переходим к созданию узора для нашего основного документа. Его мы будем рисовать в отдельном документе Фотошоп . Создаем новый документ (Ctrl+N) размером 3х3 рх и разрешением 72 рх/дюйм. Цвет фона Прозрачный (Transparent) .
При сохранении узора в программе позже будет выбран белый цвет фона по умолчанию.
Так как холст довольно маленького размера, увеличим его инструментом Zoom Tool (Z) (лупа), приблизив. Я увеличил холст до 3200% от основного размера, что является максимальным увеличением.
Теперь будем рисовать белые диагональные линии по направлению из верхнего левого угла к нижнему правому. Для этого активируем инструмент Карандаш (Pencil Tool (B)) .
Установим цвет переднего плана (Foreground) на белый (#ffffff) и настроим размер карандаша на 1 рх с жесткостью (Hardness) 100%. Убедитесь, что опции Непрозрачность (Opacity) и Нажим (Flow) равны 100%.
Я в своем примере специально переключился на другой цвет, чтобы вы могли ясно видеть весь процесс создания узора. Удерживая Shift, нажмите Карандашом (Pencil Tool) в левом верхнем углу холста, а, затем в правом нижнем. Получилось ровное диагональное соединение из квадратов.
Вот как должен выглядеть получившийся узор у вас (я переключился на исходный белый цвет):
После создания диагональной линии, перейдите в Выделение – Все (Select> All (Ctrl+A)) , чтобы выделить весь холст.
Теперь перейдите во вкладку Редактирование-Определить узор (Edit> Define Pattern) и в диалоговом окне присвойте имя вашей линии, т.е введите любое название для вашего узора. После нажмите ОК.
Теперь закройте документ с узором (его не нужно сохранять) и вернитесь в исходный рабочий документ.
Применим наш выполненный узор к документу тремя вышеописанными способами.
Команда «Заливка» (Fill).
Создаем новый слой выше слоя с текстом (Ctrl+Shift+N) . Выделим текст, удерживая Ctrl и кликнув по иконке этого слоя.
Переходим в Редактирование-Выполнить заливку (Shift+F5) . В диалоговом окне в опции Использовать (Use) выбираем Узор (Pattern) , а в опции Заказной узор (Custom Shape) находим наш нарисованный паттерн с диагональными линиями.
Нажимаем Ок, чтобы применить узор с помощью команды Заливка (Fill).
Положительным моментом данной техники является то, что заливка узором находится на отдельном слое, что позволяет добавлять к паттерну разные стили слоя, которые не влияют на текстовой слой под ним. Давайте попробуем так сделать. Уменьшим непрозрачность (Opacity) слоя с узором до 80%.
Совет: Хорошей практикой является использование узора на отдельном от объекта слое. Но, чтобы объект перемещался по холсту вместе с примененным к нему узором, используйте функцию Связать слои (Link Layers) . Иконка этой функции имеет форму скрепки и находится внизу панели слоев. Выделите нужные слои ( Ctrl +клик по миниатюре слоя) и нажмите на значок скрепки, или правой кнопкой мыши кликните по выделенным слоям и выберите опцию — Связать слои.
Применение диагонального узора в «Стилях слоя».
Теперь скройте верхний слой с узором (глазик напротив иконки слоя) или удалите его, перетянув слой на иконку корзины внизу панели слоев.
Дважды щелкните по текстовому слою, чтобы вызвать окно «Стилей слоя» (Layer Style) и выберите параметр «Наложение узора» (Pattern Overlay) . В окне параметра нажмите на стрелку с узором и из набора выберите ваш созданный диагональный паттерн. Включите функцию Предварительного просмотра (Preview) , чтобы контролировать процесс наложения узора и, если необходимо, изменить что-либо.
Вот вкратце разъяснение опций окна «Наложение узора» (Pattern Overlay) :
1. Изменение режима смешивания в узоре (Умножение, Перекрытие, Осветление основы и т.д.)
2. Управление непрозрачностью узора. Чем ниже уровень непрозрачности, тем прозрачнее узор.
3. Окно узора. Открыв его, можно выбрать любой узор для наложения на объект.
4. Создание нового имени для данного узора.
Нажав на окно узора, а затем на стрелку справа, вы можете выбрать функцию из выпадающего меню – Сохранить узор (Save Pattern) и сохранить его под другим именем в наборе. Если вы сделали с узором какие-либо изменения (масштаб, режим смешивания или непрозрачность), то они также будут сохранены вместе с выбранным образцом.
5. Масштаб (Scale) регулирует масштаб и разрешение узора.
6. Связать со слоем (Link with Layer)
При активации данной опции узор будет перемещаться по холсту вместе с объектом, относящимся к нему. Данная опция уже активирована по умолчанию программы.
Наложение узора при помощи инструмента «Узорный штамп» (Pattern Stamp Tool (S)) .
Теперь попробуем использовать в работе наш диагональный узор при помощи «Узорного штампа». По своему стилю данный инструмент похож на использование Кисти (Brush Tool (B)) , только рисуем мы не цветом, а узором по холсту.
Для начала, скройте видимость слой-эффекта «Наложение узора» на текстовом слое или удалите его, нажав правой кнопкой мыши по строке слоя и выбрав опцию – Очистить стили слоя.
В верхнем меню настроек нажмите на окно палитры узоров и найдите наш диагональный узор. Активируйте его и настройте дополнительные параметры: размер кисти штампа, непрозрачность или нажим.
На Новом слое (Ctrl+Shift+N) начните рисовать поверх текста узором. Вы можете видеть, что я использовал штамп лишь в некоторых местах текста и менял непрозрачность (Opacity) инструмента для уникального эффекта.
В отличие от предыдущих двух способов наложения узора (Заливки и Стилей слоя) этот прием немного сложнее и требует определенного навыка.
Установка узоров в Фотошоп.
Если вы хотите использовать узоры, скачанные с других сайтов, то загрузить их в программу довольно просто. Перейдите в Редактирование-Управление наборами (Edit> Preset Manager) и в диалоговом окне нажмите на функцию «Загрузить» (Load) справа. Помните, что ваш скачанный узор должен иметь расширение РАТ, чтобы программа установила его. В открывшемся окне загрузки укажите место нахождения вашего файла с узором и нажмите «Загрузить».
Обычно узоры устанавливаются программой в папку по такому пути: Adobe Photoshop > Presets > Patterns .
Вот несколько бесплатных ресурсов, которыми вы можете воспользоваться при поиске нужных узоров:
Создание библиотеки узоров.
Чтобы создать шаблоны узоров в библиотеке программы, перейдите во вкладку Редактирование-Управление наборами (Edit > Preset Manager) . Выберите в списке образцы, которые вы хотите добавить в библиотеку, удерживая Ctrl и делая клик по нужным узорам, выделяя их. Далее нажмите кнопку «Сохранить» (Save Set) . Сохраните набор выбранных узоров в любом месте вашего компьютера.
Теперь этот файл можно установить и на других компьютерах. Успехов в освоении программы!
Как я делаю бесшовный узор в Фотошопе
Много раз меня спрашивали, и вот я решила выделить время и сделать таки урок по созданию бесшовного узора в Фотошопе. Возможно есть методы намного проще и удобней, но я изобрела вот такой велосипед, на нем и катаюсь.Итак, приготовьтесь, сейчас я буду очень подробно показывать, как я сделала такой цветочный фон. Картинки большие и их больше десяти штук, хотя по правде сказать можно было бы уложиться и в две, зафиксировав лишь основные моменты. Но раз я пообещала пошаговый процесс, то его и буду демонстрировать. Если что, я предупредила))
Создаем документ 4500х4500 пикселей, с разрешением 300.
Вставляем в наш документ заранее приготовленные элементы. В моем случае, это 3 вот таких цветочных заготовки (все они аккуратно вырезаны по контуру и размещены в разных слоях).
Дублируем наши цветочки и в произвольном порядке заполняем ими верх и левую сторону холста. Как видите элементы в разной степени выступают за край. Теперь выделяем все цветы, что пересекают левую границу холста и дублируем их. *не забываем периодически сохранять документ
Выделив наши дубли, щелкаем по маркеру трансформационной области. Теперь у нас стала активной панелька сверху под главным меню. Выбираем точку отсчета левый верхний угол в «Reference point location». Сейчас мы видим координаты нашей группы объектов относительно верхнего левого угла. Их мы и будем менять.
Поскольку мы работаем с левой стороной, то соответственно и двигать объекты будем относительно оси Х. Сейчас у меня там -1018. Итак, достаем калькулятор и додаем до этой цифры 4500 (ширину нашей рабочей области). В итоге у нас получается 3482, это число мы и вводим в графу Х. Наши цветочки переместились, готово.
Аналогично дублируем весь верхний ряд вниз, вычислив координаты нашей группы объектов по оси Y.*не забываем периодически сохранять документ
Если нужно подвигать наши элементы, то не забываем, что теперь противоположные стороны взаимосвязаны. Так что, для перемещений выделяем объект и его дубль и тогда смещаем.
Всю пустую область заполняем цветочками так, чтобы это было гармонично и красиво. Следим за тем чтобы наши объекты не пересекали границ рабочей области. Вот в принципе, наш бесшовный узор и готов. Но поскольку я параноик, которому надо все перепроверить, то у меня есть еще несколько шагов))
Помещаем все наши слои в папку и дублируем ее. Объекты из дубля сливаем все в один слой. В принципе, дубль мне нужен для того чтобы иметь запасную папку с послойными элементами. Еще я добавила фон. Кадрируем наше изображение по контуру рабочей области.
Дублируем наш слой с цветочным узором. Перемещаем его на 4500 пикселей вправо. Выделяем узор и его дубль и двигаем так чтобы было видно шов, где они соединяются. Для чего я это делаю? Проверяю все ли сошлось)) Иногда, когда слоев очень много, то можно напутать с верхними нижними дублями и какой-то листик в одной части паттерна уйдет под цветочек, а с другой стороны уже будет сверху. Но в нашем случае все замечательно. *не забываем периодически сохранять документ
Если бы было не замечательно. то мы бы не растерялись и вернулись в Истории до момента, когда мы все слили в один слой и обрезали. И исправили бы ошибку.
Сохраняем наш фон в формате джипег. Все, можно грузить на сток))
Еще в процессе проверки бесшовности, всегда можно наделать симиларов. Фон ведь бесшовный, немного передвинул его — узор изменился, а бесшовность осталась)) Плюс можно добавить разных элементов на фон с разной степенью прозрачности.
Вот и весь мой процесс создания узоров.
Надеюсь мне удалось понятно все обьяснить и мой опыт окажется кому-то полезным. Удачных вам творческих экспериментов!
Как создать узор в фотошопе самостоятельно из картинки и наложить его
Adobe Photoshop имеет множество интересных и полезных инструментов. Некоторые могут существенно облегчить жизнь веб-дизайнеру. Потому как экономят ваше драгоценное время. Одним из таких инструментов является узор. Незаменимая штука при создании фона дня сайта или баннера. Откровенно говоря, используется этот инструмент нередко. Порой проще создать нужный узор, нежели искать его в интернете.
Давайте попробуем создать яркую полосатую текстуру при помощи инструмента «узор» самостоятельно. Для изучения этого урока потребуются простейшие инструменты.
Для начала создаем новый документ размером 120 на 60 пикселей.
Теперь выбираем инструмент «прямоугольник».
И на нашем документе рисуем прямоугольник нужного цвета. У меня будет # bbbed1.
Не забывайте, что узор выстроится из полосок. Их ширина – ширина ваших прямоугольников. Потому, рассчитывайте сразу.
И рядышком выставляю еще несколько прямоугольников цветов: # dce2ee, #e2dcea, #6c95c8, # 2b579e.
Вот такая симпатичная картинка у меня получилась. Ей-то и уготована учесть стать будущим узором для фона.
Сводим слои.
И во вкладке «редактирование» ищем команду «определить узор».
Даем ему поэтичное и уникальное имя.
И все! Готово! Мы выяснили, как сделать узор. Теперь нам остается только узнать, как наложить его и проверить все это в действии.
Создаем новый документ. А на нем любую геометрическую фигуру. Она должна находиться на новом слое. Это важно!
У меня это выглядит так.
И в окне слоев ищем «параметры наложения. Для этого кликаем по слою с прямоугольников левой клавишей мыши.
Наш узор найдется именно здесь. Выбираем его и применяем.
Вот такой узор мы создали. На мой взгляд, получилось просто волшебно.
Думаю, вы уже догадались, что вы можете создавать разные узоры множеством способов. Все, что придет в голову. Это могут быть точки, линии, кружки, звезды. Любые геометрические фигуры могут стать вашей заготовкой. Более того, можно особо не мучиться и взять кусочек готовой картинки. Допустим, какое-нибудь дерево или листочек. Определяем картинку как узор и вуаля! Мы можем замостить ею все, что душе угодно. И не придется страдать над выставлением линеек, наложением цветов и сдвиганием фигур. Казалось бы, прием элементарный, а экономия времени колоссальная.
Ну и дабы не быть голословной, покажу, что можно получить с помощью узора для фотошопа.Как сделать бесшовный паттерн в фотошопе
Доброго времени суток. Встречайте новый урок по Adobe Photoshop. Все уже привыкли, что у нас уроки в основном по Adobe Illustrator, но сейчас мы решили расширить кругозор. А поможет нам в этом Veremeya со своей гостевой статьёй «Как сделать бесшовный паттерн в фотошопе с помощью плагина Kaleidoscope».В этом уроке я расскажу о плагине для фотошопа, который за считанные секунды поможет вам сделать узоры, не прикладывая почти никаких усилий 😊
Для начала работы вам нужно скачать и установить плагин Калейдоскоп:
СКАЧАТЬ ПЛАГИН
Распакуйте архив, файл kaleidoscope2-1.8bf нужно поместить в папку для плагинов Adobe Photoshop. У меня плагин стоит в следующей директории:
C:\Program Files\Adobe\Adobe Photoshop CS5\Plug-ins\Filters
Если плагин установился, вы сможете найти его в фотошопе в меню: Фильтр-Mehdi
Если вы не увидели в этом месте плагина, то либо плагин установлен не в ту папку (тогда следует поискать папку, в которой установлены файлы с расширением *.8bf), или он не поддерживает работу в вашей версии фотошопа (такое тоже может быть).
Теперь начинаем наше волшебство 😊
Для создания узора вы можете выбрать любое фото или иллюстрацию. Вот мой исходный файл:
Как видите, я обрезала фото, чтобы сделать квадратным. Вы можете работать с любыми размерами (в том числе прямоугольными) и выбрать тот, который вам больше понравится.
Теперь откроем плагин и установим настройки, как на рисунке:
Petals – количество углов, которые образуются в нашем узоре.
Rotate – угол наклона узора. Если вы хотите получить бесшовный узор, оставляйте 0.
Zoom out – эта функция дублирует и мельчит узор, как если бы вы хотели сделать паттерн из одного повторяющегося сегмента. Таким сегментом выступает исходный файл.
Random – некий набор случайных настроек, с которыми очень интересно играться. Благодаря этой кнопке можно получить бесчисленное количество вариантов из одного исходника. Под этой кнопкой расположены 3 параметра, которые можно настраивать вручную. Кнопка Random является сочетанием всех трех параметров и я рекомендую использовать именно ее. Случайные настройки, заложенные в программе всегда дают интересные варианты, чего не всегда можно достичь, настраивая параметры вручную.
В окошке превью вы можете видеть результат в реальном времени, что очень удобно.
Под превью находится окошко с процентами. Это позволяет приблизить узор, сделать его крупнее.
Если вы со всем согласны, нажимаем «ок» и смотрим результат.
После нажатия кнопки получаем первый вариант.
В этом узоре угадывается исходное фото. Это достаточно грубое преобразование и явно не годится ни для личного, ни для коммерческого применения. Поэтому продолжаем применять плагин, не меняя настроек.
После третьего применения мы можем увидеть удовлетворительный результат. Узор уже не напоминает исходный файл. Приятным бонусом полученной текстуры является ее бесшовность. Не останавливаемся на достигнутом и продолжаем применять плагин столько раз, сколько потребуется до получения паттерна, который нас устроит.
Вот какая галерея получилась у меня:
Как вы видите, после нескольких раз применения плагина мы получаем уже довольно интересные узоры и при каждом новом применении плагина узор меняется и становится все более мелким. Иногда интересный результат можно получить сразу после первых настроек, если хорошо с ними поиграться.
Возьмем одну из картинок и проверим паттерн на бесшовность:
Хочу отметить, что плагин запоминает настройки, которые вы применили и автоматически применяет их в следующий раз. Кнопка «Reset» сбрасывает все изменения до первоначальных настроек.
Я не упоминала о параметре Spinning Effect. В предыдущих преобразованиях мы использовали значение кнопки «Mirror». Посмотрим, что будет, если применить значение «Copy».
Как видим, мы получили спирально закрученный узор.
Применим параметр «Blend».
Я показала свои варианты настроек. Попробуйте поэкспериментировать и получить другие схемы создания узоров.
Если вам интересны другие способы создания паттернов, то у меня есть ещё один урок — Создание бесшовных паттернов с помощью шаблонов Mad Pattern.
Спасибо за внимание! Если у вас получились интересные результаты, показывайте в комментариях.
P.S: Ещё один урок Adobe Photoshop с нашего блога — Как подготавливать дизайн продукты на Creative Market.
Veremeya специально для блога Записки микростокового иллюстратораЧитать дальше…
Подпишитесь на нашу рассылку, чтобы не пропустить ничего нового:
Предлагаю ознакомиться с аналогичными статьями:
НАЙДИТЕ недостающие узоры, формы и градиенты!
Не можете найти недостающие узоры, формы и градиенты в Photoshop?
В этом 90-секундном совете вы узнаете, как получить свои любимые пресеты Photoshop, чтобы продолжить непрерывный рабочий процесс!
Объяснение отсутствующих позиций
В Photoshop 2020 вы можете столкнуться с проблемой поиска любимых узоров и форм, которые больше не доступны.
Чтобы уточнить, если вы, , дважды щелкните сбоку от слоя, чтобы открыть окно Layer Style , и щелкните Pattern Overlay .
При нажатии на Узор раскрывающееся меню откроет новый набор узоров, с которыми вы, возможно, не знакомы, особенно если вы использовали более старые версии Photoshop.
Если вы нажмете на значок шестеренки, вы также не найдете возможности импортировать или загрузить старые шаблоны.
Найдите недостающие узоры в Photoshop
Возможно, вы не сможете найти его в окне Layer Style. , но вы можете найти его на другой панели.
Чтобы начать поиск недостающих узоров, форм и градиентов в Photoshop, выберите Window > Patterns .
Щелкните раскрывающееся меню.
В списке выберите Legacy Patterns и More , это добавит Group к доступным узорам в Layer Styles в качестве параметров Pattern!
Найдите недостающие формы в Photoshop
Если вы больше не можете найти свои любимые фигуры, вы можете применить тот же шаг, выбрав Окно > Фигуры .
Щелкните раскрывающееся меню .
В списке щелкните Legacy Shapes and More , чтобы добавить его к параметрам формы, которые вы можете выбрать.
Найдите недостающие градиенты в Photoshop
Тот же шаг можно применить, если вы хотите найти градиентов , выберите Window > Gradients .
Щелкните раскрывающееся меню .
В списке щелкните Legacy Gradients and More .
Вот как вы можете легко найти недостающие узоры, формы и градиенты в Photoshop и начать работать со своими давними фаворитами!
Если вам понравилось это руководство, обязательно подпишитесь на PTC на YouTube! А если вы создадите что-то с помощью этого руководства, поделитесь им в социальных сетях с хэштегом #PTCvids, чтобы получить шанс стать участником!
Сила узоров в PhotoshopЛинда Саттгаст Чтобы продолжить, загрузите шаблон DS Journaling Lines.После скачивания вам нужно будет разархивировать его. На Mac дважды щелкните zip-файл. В Windows щелкните файл правой кнопкой мыши и выберите «Извлечь все». Шаблоны Photoshop могут быть довольно мощными, если вы знаете, как их использовать. Вот все основы, включая некоторые малоизвестные факты о паттернах. Создание корректирующего слоя узора
Загрузить другие шаблоны по умолчанию
Загрузить сторонние шаблоны
Настройте слой с узором на панели слоев
Удалить часть шаблона
Параметры узора: объединить или растрироватьСлияние:
Растрировать:
Установка набора шаблоновЕсли вы думаете, что вы будете часто использовать набор шаблонов, было бы целесообразно загрузить его в программу, чтобы он отображался во всплывающем меню как один из вариантов шаблонов, которые вы можете быстро загрузить.Вот пути к файлам: Windows: C:> Program Files> Adobe> Adobe Photoshop (ваша версия)> Presets> Patterns Mac: Приложение> Adobe Photoshop (ваша версия)> Шаблоны> Узоры. |
Мастер повторяющихся узоров в Photoshop
В недавнем посте я показал вам, как создать калейдоскоп с помощью Photoshop. В качестве одной из техник использования калейдоскопа я предложил создать из него повторяющийся узор.Один читатель задал вопрос, как можно создать повторяющийся узор, учитывая, что вокруг исходной формы есть пробелы. Сегодня я покажу вам, как решить эту проблему, и по ходу дела научусь создавать повторяющиеся узоры в Photoshop.
Шаг 1
Начните с готового документа с изображением калейдоскопа. Если вы не видели исходную статью, вот ссылка на нее.
Шаг 2
Сохраните копию этого изображения и на этот раз сгладьте слои изображения — не сплошной цвет или белый фоновый слой, который вы можете использовать.
Для этого выберите все слои, содержащие контент, нажав на них Control или Command, и выберите «Слой»> «Объединить слои».
Создайте дубликат слоя изображения, чтобы у вас было две его копии.
Скройте пока верхний слой и выберите второй из слоев изображения.
Выберите «Изображение»> «Размер изображения» и прочтите ширину и высоту изображения. Разделите каждую на два и запишите полученные значения. Нажмите Отмена, чтобы выйти из этого диалогового окна.
Шаг 3
Выберите «Фильтр»> «Другое»> «Смещение» и введите значения для половины ширины и высоты изображения.Выберите опцию Wrap Around и нажмите Ok. Эта команда смещения создает повторяющуюся часть узора и позволяет сэкономить немного ручной работы по разделению изображения.
Шаг 4
Снова откройте верхний слой, и ваш холст будет готов. Сгладьте это изображение и используйте его для создания своего узора. Если это большой дизайн, вы можете уменьшить его размер до 25% или меньше, прежде чем превращать его в узор, выбрав «Правка»> «Определить узор». Введите имя для шаблона, и все готово.
Шаг 5
Создайте новый пустой документ, во много раз превышающий размер вашего изображения узора, и заполните его своим узором, используя «Правка»> «Заливка»> «Узор», и выберите узор в самом конце палитры узоров.
Шаг 6
Если вы начнете с обычного прямоугольного или квадратного изображения, вы можете создать его как повторяющийся узор аналогичным образом. Однако вместо того, чтобы получить большую пустую область в середине изображения, у вас будут швы.Используйте инструмент клонирования или другой инструмент по выбору, чтобы удалить швы, не касаясь краевых пикселей. Затем создайте свой узор, и он будет идеально повторяться!
Как использовать узоры Adobe Illustrator в Photoshop
Я предпочитаю создавать узоры, с которыми работаю, в Adobe Illustrator. Мне нравится сохранять их как векторные элементы, что означает, что графику можно увеличивать или уменьшать без потери качества изображения, это дает мне или пользователям моих рисунков большую гибкость в возможных приложениях рисунка.
Однако я встречал много людей, которым удобнее использовать шаблоны в Adobe Photoshop. Если вы один из этих людей, этот урок представляет собой руководство о том, как вы можете использовать образец узора Illustrator с вашими проектами Photoshop.
Итак, что вам нужно сделать, это выполнить следующие шаги:
1. Извлечь одну плитку Pattern
После того, как у вас есть файл .ai (который содержит узор, с которым вы хотите работать), открытый в Adobe Illustrator, Узор можно получить доступ из панели Swatches, чтобы открыть это, перейдите в Window> Swatches .
Теперь выполните действия, описанные в этом подробном посте об извлечении одной плитки узора из образца узора.
После этого урока у вас должна быть плитка с узором на артбораде.
Плитка узораТаким образом вы изолировали часть узора, которую можно повторить, чтобы воссоздать узор узора.
2. Экспортируйте плитку как файл .psd
Файл> Экспортировать как
Теперь, когда у вас есть плитка с узором, перейдите в Файл> Экспорт как
В появившемся окне введите File назовите (назовите плитку), затем Сохранить как Тип выберите Photoshop (.PSD) и не забудьте проверить Use Artboards, , затем нажмите Export.
Экспортируйте плитку как .PSDВ следующем всплывающем окне я предлагаю вам выбрать высокое разрешение (300 пикселей на дюйм) для получения наилучшего качества вывода.
Щелкните OK , чтобы сохранить плитку .psd.
3. Определите узор в Photoshop
Откройте (в Photoshop) сохраненную плитку .psd, которую вы создали.
Щелкните Select> All (Ctrl A), а затем в меню выберите Edit> Define Pattern
Теперь вы можете назвать узор и нажать OK
Назовите свой узор4.Применить узор
Вы сохранили узор и можете применить его к любому слою или элементу файлов Photoshop!
Итак, выберите слой, который вы хотите заполнить (на панели «Слои»), а затем перейдите к Слой> Стиль слоя> Наложение узора
Из миниатюрных изображений узора выберите узор, который вы создали. Вы также можете отредактировать Scale%, чтобы применить свой узор к размеру вашего предпочтения.
Вот и все! Теперь вы можете работать с узором Adobe Illustrator в ваших файлах Photoshop 🙂
Как создать узор в Photoshop
Ранее мы писали о том, как создать узор с помощью значков Noun Project с помощью Adobe Illustrator, который дает вам гибкость мгновенного изменения расположения и изменения цвета векторных фигур в различных конфигурациях.Для тех, кто более знаком с Adobe Photoshop, вы можете найти этот инструмент более простым в использовании для создания повторяющегося узора с использованием значков PNG — идеально подходит для персонализированных и привлекательных обложек, плиток социальных сетей, фонов Zoom и многого другого.
Лучше всего, когда вы используете надстройку Noun Project для Adobe, вы можете наслаждаться поиском и мгновенно вставлять любой значок из нашей обширной библиотеки, не покидая рабочего процесса.
В этом уроке мы расскажем, как создать повторяющийся узор в Photoshop с помощью значков.
Надстройка Adobe Noun Project — ваш новый лучший друг, который позволит вам использовать обширную библиотеку Noun Project, насчитывающую более 3 миллионов значков, прямо в ваш рабочий процесс. Как и наше приложение для Mac, это расширение позволяет выполнять поиск в нашей безграничной базе данных и мгновенно перетаскивать значки прямо на монтажную область. Загрузите надстройку и запустите ее в Photoshop при следующем открытии приложения.
Это расширение поставляется со 100 бесплатными начальными значками, но учетная запись NounPro позволит вам искать и мгновенно загружать любой значок, который вы хотите, без лицензионных отчислений, и пользоваться дополнительными параметрами настройки, чтобы вы могли настроить цвет значка, форму фона и цвет, и даже поворот перед добавлением на монтажную область.
Шаг 1. Создайте новый документЗагрузите надстройку Adobe, откройте Photoshop и щелкните « Create New », чтобы создать новый документ. Создание узора в Photoshop работает немного иначе, чем в Illustrator, и вы будете использовать простую прямоугольную или квадратную плитку в качестве основы, поэтому проще всего начать с квадратного документа размером 1000 x 1000 пикселей. Убедитесь, что в документе Color Mode используется RGB для Интернета, или выберите CMYK, если вы в конечном итоге будете печатать свое произведение.
В разделе « Содержимое фона » выберите « Прозрачный ». Хотя вы можете создать повторяющийся узор со сплошным цветом фона, лучше всего отделить основные элементы (значки) от фона на тот случай, если вы хотите настроить каждый отдельно. Щелкните « Create ».
Photoshop 2021: новая функция рисунка
Это руководство по фотошопу представлено в виде скринкаста, мы проведем вас через замечательную новую функциональную часть Photoshop 2021, которая представляет собой новую функцию рисунка.Это руководство позволяет вам создавать бесшовные модели с помощью Photoshop. Это отличное новое дополнение к Photoshop и функция, которую вы обязательно будете использовать в своих дизайнерских проектах.
Подробности руководства
- Программа: Photoshop 2021
- Оценка времени: менее 3 минут
- Сложность: Easy
Предварительный просмотр
Стенограмма видео для Hello, and Welcome . В этом уроке Photoshop мы поделимся с вами, как вы можете использовать новый тур предварительного просмотра узоров, доступный в Photoshop 2021.Это отличное новое дополнение к Photoshop. Так что давайте сразу приступим к делу. Итак, вы хотите начать с просмотра. И мы хотим выбрать предварительный просмотр паттерна. И затем мы хотим выбрать ОК. И затем, что вы хотите сделать отсюда, это то, что мы хотим, мы можем … Например, мы можем взять инструмент формы. Итак, голова инструмента формы. Например, предположим, что по совпадению вы просто начертили круг. Затем он будет повторять круг как бесшовный узор. Итак, вы могли просто создавать, продолжать создавать формы в этом граничном блоке.
Просто заполните все пробелы, или вы можете выйти за пределы рамки. И они начнут заполнять за нас все эти пробелы, что действительно здорово. И за считанные секунды вы создаете уникальный круговой узор за считанные секунды. И тогда это бесшовные модели, которые вы можете использовать с перекрестными рисунками. Итак, что вы хотите сделать, так это установить Windows и шаблоны. И это откроет панель с узором. И оттуда мы можем выбрать новый узор и дать ему имя.Так что вы могли бы назвать это Круговым узором, а затем установить все в порядке.
А потом, если бы мы открыли новый документ. Итак, мы просто сделаем это с размером 750 на 750. А затем, если вы перейдете к инструменту прямоугольника. Я просто нарисую прямоугольник посередине холста. Я собираюсь щелкнуть правой кнопкой мыши по этому слою и установить параметры наложения. А затем я установлю наложение узора. И я просто установлю новый шаблон, который мы только что создали. Итак, приступим к этому. Вот оно. И если вы увеличите его, вы увидите, что узор теперь представляет собой пару, которую мы только что создали, и это действительно здорово.
И если вы перейдете к параметрам смешивания, мы также можем изучить узор. Так что вы можете увидеть больше. Так что если вы уменьшите масштаб, то готово. Вы создали крутой круглый бесшовный узор за считанные секунды. И тот же эффект можно применить практически к любой форме или кисти, чтобы создать крутой, уникальный, бесшовный узор за считанные секунды. Это отличное новое дополнение к Photoshop. И я буду использовать его снова и снова в своих дизайн-проектах. Я надеюсь, ты сможешь сделать то же самое.Надеюсь, это был полезный урок. И спасибо за просмотр. Следите за новостями Creative Nerds, чтобы получить быстрые советы и узнать, как использовать Photoshop.
Публикация тегов
Популярные инструменты Photoshop: создание узоров в Photoshop
Как создавать узоры в Photoshop — пошаговые инструкции по созданию узоров в горошек, фотографий и многого другого!
Photoshop предлагает множество способов работы с узорами и их использования.
Узоры можно наносить кистью с помощью инструмента Pattern Stamp Tool, использовать для заливки выбранных областей с помощью инструмента Paint Bucket Tool, использовать в качестве общей заливки (Edit / Fill / Pattern) или применять как часть стиля слоя (Pattern Overlay).
Узоры используются для создания декоративной бумаги и для нанесения общей текстуры или текстуры определенной области.
Применяется к слоям, пользователи могут искажать, складывать и использовать режимы наложения для дальнейшего расширения диапазона возможных визуальных результатов.
Photoshop поставляется с библиотекой наборов шаблонов.
Не все шаблоны находятся в активной библиотеке, но их легко выбрать из раскрывающегося меню, просто щелкнув коллекции, которые вы хотите использовать.
Кроме того, из этого всплывающего меню также можно получить доступ к Менеджеру предустановок для узоров (или выбрав Редактировать / Предустановки / Менеджер предустановок в строке главного меню — он открывается для отображения кистей, но вы можете выбрать Узоры из выпадающего списка. вниз меню там).
Менеджер предустановок позволяет удалять паттерны, которые вам не нравятся, перетаскивать отдельные паттерны, чтобы организовать их по своему вкусу, сохранять собственный набор предустановок паттернов, экспортировать их в места назначения за пределами Photoshop, делиться ими с другими или загружать свои собственные коллекции в ваш Photoshop.
Еще из нашей серии «Популярные инструменты в Photoshop»:
Photoshop также позволяет пользователям создавать свои собственные узоры, что я считаю ценным, потому что мне нравится, что моя работа отличается от всех остальных, а текстуры, бумага и узоры являются одними из моих «Секретные приемы» я храню в своем творческом ящике.
Как и все мои сообщения, этот доступен для скачивания в виде PDF по , щелкнув здесь . Надеюсь, это поможет некоторым из вас, кто хотел бы вернуться к этому руководству позже или распечатать его!
Выкройки делать легко и весело! Давайте начнем с простого: горошек.
Создание пользовательского узора
Это базовая установка для создания общего узора в горошек. Я создал новый холст (Файл / Новый).
Узоры повторяются мозаичным способом. Это означает, что края должны точно совпадать по форме, цвету и стоимости. Если это не точно, Узор заполняется шахматными досками, а не обеспечивает бесшовную текстуру.
Идеального горошка можно добиться, разместив точку точно в центре холста (мы можем назвать это плиткой).
Я принес несколько линейок, чтобы отметить центр Нового холста. (Просмотр / Линейки, нажмите внутри линейки и перетащите одну сверху, а также с левой стороны. Точно выровняйте их; не бойтесь увеличивать масштаб.)
Эллиптическая область использовалась для создания круга, ровно по центру плитки.
СОВЕТ: Удерживайте клавиши Shift и Option (Alt), чтобы создать круг. Клавиша Shift ограничивает эллиптическую область идеальным кругом. Клавиша Option (Alt) позволяет рисовать круг от центра к краю.Поместите перекрестие эллиптической области над центром плитки, нажмите и перетащите круг из центра.
Выберите Edit / Fill и залейте выделенный круг черным цветом.
СОВЕТ: При создании узоров черный цвет заполняется на 100%. Различные оттенки серого будут заполнены соответствующими различными тонами прозрачности. Например, черные круги будут сплошным черным, 50% серых кругов покажут 50% изображения, на которое они нанесены.
Следующим шагом будет захват паттерна.
Если вы хотите, чтобы узор был заполнен черными точками в горошек, включая белый фон, все, что вам нужно сделать, это выбрать Edit / Define Pattern и дать узору имя.
Однако, если вы хотите, чтобы узор был заполнен черными точками в горошек и прозрачным фоном, отключите видимость фонового слоя перед тем, как выбрать «Редактировать / Определить узор».
Конечный результат на новом холсте с использованием Edit / Fill / Pattern на новом слое представляет собой разницу, показанную ниже:
Pattern, определенный с видимым белым фоном, использует как белый цвет фона, так и точки.Другой, где видимость фона была отключена, использует точки на прозрачности, открывая новый фон вокруг точек.
Теперь давайте рассмотрим несколько различных способов применения паттернов. Самый простой — тот, который я использовал в предыдущем примере.
Применение узоров в вашей работе
Я создал новый холст, создал новый слой поверх фона, а затем выбрал Edit / Fill / Pattern, выбрав новый узор, который мы только что создали.
Когда узоры применяются таким образом, Photoshop применяет узор с размером и разрешением узора по отношению к размеру файла, в котором он используется.
Другими словами, калибровка выполняется автоматически; вы не можете выбрать, насколько большим или маленьким будет узор.
То же самое верно и при нанесении рисунка кистью с помощью инструмента Pattern Stamp Tool. Тем не менее, инструмент Pattern Stamp Tool позволяет наносить узор на узор с использованием различных кистей и непрозрачности для получения более художественных эффектов.
В этом примере я выбрал инструмент Pattern Stamp Tool (вложенный в инструмент Clone Stamp Tool на вертикальной панели инструментов).
Я использовал одну из художественных кистей по умолчанию и разную степень непрозрачности, чтобы создать органично выглядящие шары, используя только что созданный круг Pattern.
Я применил узор, обведенный кистью, на новый слой, чтобы позже иметь возможность изменить цвет.
Узоры — это базовая графика, и, если исходный узор не окрашен, цвета должны быть добавлены после приложения с использованием фильтров, градиентов, заливок или рисования вручную.
Поскольку я нарисовал круги на новом слое, я смог заблокировать прозрачность слоя и использовать разные цвета и непрозрачность, чтобы раскрасить круги так, как я хотел бы их видеть.
Фильтры, градиентные заливки и режимы наложения слоев также могут использоваться для изменения внешнего вида узора.
Мой любимый способ управления масштабом, непрозрачностью и режимом наложения узора — это применить его с помощью параметров стиля слоя.
Здесь я продублировал фоновое изображение кота и выбрал Layer / Layer Style / Pattern Overlay.
Здесь можно выбрать желаемый узор (я выбрал одну из текстур бумаги по умолчанию в Photoshop), масштабировать его, чтобы он хорошо смотрелся на изображении, и настроить режим наложения и непрозрачность текстуры.
Отсюда можно использовать маски слоя и дополнительные режимы наложения, чтобы изменить общий узор на одну из различных степеней интенсивности, возможно, удалив часть его с морды кошки и сделав текстуру более тяжелой по краям.
Вот расширение нашего простого круга, которое показывает, как создать узор по всей бумаге, например оберточную бумагу. Плитка идеального квадрата. Центральный круг был скопирован четыре раза (ПОДСКАЗКА: сначала нарисуйте крошечную белую точку в центре, чтобы у каждого нового круга была центральная точка).
Каждый дополнительный круг был размещен так, чтобы центр находился точно в углу файла (после того, как он станет идеальным, используйте инструмент «Кисть», закрасьте черным цветом с непрозрачностью 100% и закрасьте белые центральные точки).
Была внесена нестандартная форма, похожая на ленту, и красиво расположенная внутри плитки. Обратите внимание, что края ленты исчезают в угловых кругах.
Горизонтальное или вертикальное размещение в примере требует, чтобы верхняя и нижняя, левая и правая графика также идеально выстраивались друг с другом для бесшовной мозаики.
Изменить / определить форму. Обратите внимание, что видимость фона была отключена. Создан новый холст. Фон был заполнен от переднего плана к варианту цвета фона. Фон был продублирован.
Слой / Стиль слоя / Наложение узора. Новый узор был выбран и масштабирован, чтобы соответствовать холсту желаемым образом. Узор был черным.
Оттуда был использован Select / Color Range (из строки главного меню) для выбора черного при полной нечеткости. Создан новый слой; выделение было заполнено средним оттенком синего.
Пока выделение было активным, с помощью значка настройки в нижней части окна слоев была выбрана настройка «Насыщенность оттенка».
Слой был создан с использованием выделения в качестве маски, поэтому любые окончательные корректировки будут происходить только внутри точек и лент, а цвет фона останется неизменным.
Создание узоров с использованием фотографий
Узоры можно создавать и с использованием фотографий. Вот тот, который был создан с использованием головы Шермана; один из цветного изображения и один, преобразованный в черно-белое:
Здесь легко увидеть, насколько важно совместить края файлов, если кто-то ищет бесшовную мозаику!
Для тех из вас, кто может захотеть это сделать, выберите изображение с ровными краями, как это, и предварительно отретушируйте его, чтобы все края были одного цвета и цвета.
Вы можете вырезать и приклеить один край со всех четырех сторон, а затем размыть все варианты краев, используя Кисть и один из цветов, выбранных для ковра.
Этот пример — лучший эффект плитки.
Использование шаблонов при ретушировании изображений
Шаблоны также можно использовать для коррекции при ретушировании изображений. Можно создать узор из одной области изображения и применить его в другом месте.
Художники-ретушеры портретов часто создают текстуру из «хорошего» тона кожи, чтобы передать ее на участки, которые стали слишком гладкими из-за чрезмерного ретуширования или которые были размыты жирной кожей или плохой экспозицией.
На этой иллюстрации фотограф по ошибке применил свет для волос на лысой голове джентльмена. Это быстрое решение, позволяющее комбинировать краску и узор, если есть какая-нибудь приятная текстура кожи, которую можно использовать в качестве основы для узора.
Важно, чтобы узор выстраивался прилично, чтобы избежать явной мозаики, поэтому выбор был сделан из области лба мужчины, которая была довольно равномерно освещена.
Я скопировал этот раздел на новый слой, чтобы выполнить дополнительное предварительное ретуширование, касающееся цвета края и значения.Затем я определил выделение как узор.
Оттуда был создан новый слой, на который была нанесена краска с помощью инструмента «Кисть» с непрозрачностью 30% и потоком 100%, выбирая цвета из других областей на голове джентльмена.
Яркий свет быстро скрылся, но область получилась слишком гладкой. Был создан еще один новый слой, и инструмент Pattern Stamp Tool использовался с новым Pattern для наложения текстуры на гладкую область. Последние штрихи были добавлены с помощью штампа Clone Stamp и небольшой кисти.
Узоры универсальны, их легко создавать и использовать для декоративных, художественных и корректирующих работ в Photoshop.
Сохранение пользовательских шаблонов
Я экспортирую свои пользовательские шаблоны в папку на моем жестком диске за пределами Photoshop, поэтому я могу получить к ним доступ, когда они мне понадобятся, не заполняя Диспетчер предустановок шаблонов сотнями шаблонов, которые не будут часто использоваться .
Также неплохо было бы редактировать коллекции паттернов, чтобы организовать их так, как вам нравится, и сохранить свои избранные как свою собственную коллекцию.
Для этого просто выделите те, которые вы хотите добавить в свою коллекцию, в Менеджере предустановок (нажмите и удерживайте клавишу Shift, пока вы нажимаете другие, которые хотите) и выберите «Сохранить набор».
Чтобы загрузить новые наборы паттернов, выберите «Загрузить» в Менеджере предустановок и перейдите к нужным.
Шаблоны Photoshop по умолчанию доступны в раскрывающемся меню справа в Диспетчере предустановок или в любом из меню шаблонов, доступ к которым осуществляется с помощью инструментов, которые их используют.
Заключительные мысли
Я надеюсь, что это небольшое исследование Паттернов было интересным и легким для понимания.
Моя цель — сделать Photoshop максимально загадочным, чтобы любой, даже новичок, мог начать экспериментировать и пользоваться мощными инструментами для творчества, которые предлагает это программное обеспечение.