Как сделать паттерн в Фотошопе
Паттерн, регулярный узор, бесшовный фон… Называйте, как хотите, но смысл один – заполнение фона (сайта, документа) повторяющимися элементами, между которыми нет видимой границы или перехода.
В этом уроке будет рассказано о том, как сделать узор в Фотошопе.
Здесь рассказывать особенно нечего, поэтому сразу приступаем к практике.
Создаем документ с размерами 512х512 пикселей.
Далее необходимо разыскать (нарисовать?) однотипные элементы для нашего паттерна. Тематика нашего сайта компьютерная, поэтому я подобрал такие:
Берем один из элементов и помещаем в рабочую область Фотошопа на наш документ.
Затем перемещаем элемент на границу холста и дублируем его (СTRL+J).
Теперь идем в меню «Фильтр – Другое – Сдвиг».
Смещаем объект на 512 пикселей вправо.
Для удобства выделим оба слоя с зажатой клавишей
Помещаем новый объект на холст и перемещаем к верхней границе документа. Дублируем.
Снова идем в меню «Фильтр – Другое – Сдвиг» и перемещаем объект на 512 пикселей вниз.
Таким же способом помещаем и обрабатываем другие объекты.
Осталось лишь заполнить центральную область холста. Я мудрить не буду, а помещу один большой объект.
Паттерн готов. Если требуется его использование в качестве фона веб страницы, то просто сохраняем в формате JPEG или PNG.
Если же планируется заливать паттерном фон документа в Фотошопе, то нужно сделать еще пару шагов.
Шаг первый – уменьшаем размер изображения (если требуется) до 100х100 пикселей.
Затем идем в меню «Редактирование – Определить узор».
Даем имя узору и нажимаем ОК.
Давайте посмотрим, как будет выглядеть наш паттерн на холсте.
Создаем новый документ с любыми размерами. Затем нажимаем сочетание клавиш SHIFT+F5. В настройках выбираем «Регулярный» и ищем в списке созданный паттерн.
Нажимаем ОК и любуемся…
Вот такой несложный прием для создания паттернов в Фотошопе. У меня получился симметричный узор, Вы же можете располагать объекты на холсте хаотично, добиваясь более интересных эффектов.
Опишите, что у вас не получилось. Наши специалисты постараются ответить максимально быстро.
Помогла ли вам эта статья?
ДА НЕТПаттерны в Фотошопе с помощью смарт-объектов
На днях Летта написала Как сделать растровый паттерн в Adobe Illustrator и признаюсь это суперское решение делающее все легко и изящно. Спасибо тебе Летточка что поделилась:) Вот только одно но, у меня Иллюстратор 5-тый, а посему паттерноделки у меня просто нету:(Еще не найдя этой статьи от Летты я попробовала делать паттерны в Фотошопе с помощью смарт-объектов. Вот хочу поделится что у меня получилось, может кому ни будь будет полезно.
1. Создаю файл размером скажем 5000х5000. Поцентру задаю фигуру квадрат на 4000х4000 это мой будущий паттерн. Дальше к краям квадрата ставлю направляющие (при включенной привязке к обектам). Фон выключаю — теперь фон у меня прозрачний. Это файл — заготовка который послужит основой для всех будущих моих паттернов. Называю файл скажем pattern_1 и сохраняю.
2. В меню файл выбираю — открыть как смарт-объект — открываю этот же файл и сохраняю, называя скажем pattern_1_3х3. Название условно, я назвала так, просто чтобы было понятно, что этот файл состоит как бы из 9 квадратов первоначального паттерна. В палитре слои будет находится смарт-объект файла pattern_1.
4. На данном этапе у меня в Фотошопе открыты два файла pattern_1 и pattern_1_3х3 с которыми мне нужно работать одновременно. Для удобства я иду в панель окно — упорядочить- расположить две вертикально. Оба файла я открываю себе так, чтобы было видно белый квадрат, направляющие и чуть-чуть пространства вокруг.
6. Дальше открытый рядом файл pattern_1_3х3 обновляется и мы получаем полностью составленный паттерн.
Пока что он с прозрачным фоном поэтому нужно в файле pattern_1_3х3 ниже всех слоев разместить квадрат 4000х4000 нужного цвета — наш фон.
7. Когда паттерн готов в файле pattern_1_3х3 делаю обрезку по направляющим, и — сохранить как JPG указывая теперь уже финишное название паттерна, у меня это branches_1.Он помучится размером 4000х4000 как и планировалось.
8. После сохранения паттерна как JPG возвращаюсь в файл pattern_1_3х3 и отменяю действие обрезки. Сохраняю.
Итак файл pattern_1_3х3 я храню как шаблон для построения паттернов и чтобы сделать новый паттерн я просто открываю этот файл и нахожу среди слоев мой центральный смарт-объект. Двойной клик по нем открывает его как отдельный документ в котором проводиться вся работа с новым паттерном, а финишный результат сохраняется как JPG с файла pattern_1_3х3.
Для меня этот способ оказался довольно удобным. Может и кому то из вас пригодится. 🙂
Создаем четкий, иллюстрированный бесшовный паттерн в Adobe Photoshop
Над чем сегодня работаем
Одно из моих любимых занятий – создавать привлекательные бесшовные паттерны, но я не люблю процесс создания постоянно повторяющихся фонов для шаблона. Именно это подстегнуло меня на разработку удобного метода создания бесшовных моделей.
Сделайте примерный набросок шаблона, поместите на него все необходимые элементы. Ветки и листва – это всегда прекрасно, так как создает ощущение естественности. Но этот метод можно применять и для других объектов:
Развивайте идею паттерна. Пусть это будет грубая черновая работа, она вовсе не должна быть красивой, так как лишь помогает вам задать «ритм». Можно сделать один крупный фрагмент или множество мелких, и потом скомпоновать их так, как захочется:
Как только эскиз станет хоть немного похожим на иллюстрацию, из него нужно будет создать фрагмент бесшовного паттерна. Если вы работали на бумаге, то отсканируйте рисунок при 300dpi.
Создайте новый Photoshop-документ достаточного размера. Я рекомендую использовать размер не менее 5000 на 5000 пикселей. При необходимости его всегда можно уменьшить, а вот увеличить изображение маленького размера без потери качества уже не получится:
Если вам удалось достаточно четко набросать эскиз и отсканировать его, то его можно взять за основу паттерна. Нужно удалить фактуру бумаги, и оставить на слое только контур иллюстрации.
Это легче всего сделать при помощи меню Изображение > Коррекция > Уровни (Image > Adjustments > Levels). Передвиньте левый ползунок внутрь окна, чтобы сделать черные элементы еще темнее, а затем передвиньте правый ползунок левее, чтобы сделать белые фрагменты еще светлее. Затем поэкспериментируйте со средним ползунком до тех пор, пока не найдете подходящий баланс.
Затем выделите белые фрагменты инструментом «Волшебная палочка» (Magic Wand) и нажмите Delete. Если вам не удалось добиться четкости на эскизе или хорошо отсканировать документ, то можно воспользоваться иллюстрацией для создания нового изображения на отдельном слое. Разместите слой с эскизом на самый верх в панели слоев, немного уменьшите уровень его непрозрачности. После этого продублируйте его кистью или другим инструментом на новом слое:
Нет каких-то строгих правил относительно того, какой должна быть иллюстрация, но чем больше уникальных элементов будет на ней, тем интересней будет смотреться шаблон. Но слишком много элементов могут визуально перегрузить его.
Одни и те же элементы можно использовать несколько раз, немного видоизменив их при помощи поворота, зеркального отражения и прочих средств. Гораздо удобнее наносить элементы на новый слой, используя другой цвет кисти. Так вы будете видеть, какие фрагменты еще нужно зарисовать:
Немного поэкспериментируйте с разными элементами, а затем свяжите их в единый фрагмент мозаики шаблона. Форма фрагмента не так важна, но будет лучше, если он будет равномерно разбросан по холсту.
На данном этапе лучше работать одним цветом, а все остальное можно добавить позже, уже после того, как мы убедимся, что наш паттерн идеально выстраивается в мозаику. Если начать раскрашивать его до верстки, то позже придется вносить корректировки в каждый слой. Но это вовсе не касается цвета фона и основного контура:
Когда фрагмент будет готов, сделайте копию слоя с шаблоном (Ctrl+J), и переместите копию в одну из сторон по прямой линии (для этого можно зажать клавишу Shift).
Поместите новый слой на минимальном расстоянии от слоя с исходным паттерном, оставив место, которое позволит вам соединить два элемента вместе, закрасив пространство между ними:
Вернитесь к слою с шаблоном и дорисуйте его так, чтобы он соприкасался с только что созданной копией.
Если вам кажется, что элементы наезжают друг на друга, то отодвиньте слой с копией на большее расстояние, чтобы у вас получились плавные соединительные линии. Если места слишком много, то придвиньте слой ближе. Важно добиться незаметного перехода между двумя фрагментами мозаики:
После окончания предыдущего этапа удалите слой с копией и создайте новую копию оригинального фрагмента, так как он слегка обновился. На этот раз перемещайте слой с копией в другую сторону.
Помните, что нам важны только края контрольного слоя (слоя с копией), но если вам не хватает места для работы, можно увеличить размер холста через меню Изображение > Размер холста (Image > Canvas Size):
Вернитесь к слою с исходным паттерном, и продолжите зарисовывать расстояние между частями шаблона, как делали это в прошлый раз. При этом нужно добиться незаметного перехода между двумя фрагментами.
После этого этапа ваш бесшовный паттерн будет практически завершен. Снова удалите копию, и приступим к тестированию:
Скопируйте получившийся фрагмент в новый файл (Ctrl-A > Ctrl -C > Ctrl -N > Ctrl-V).
Если он получился слишком большим, уменьшите размер примерно до 1000 пикселей. Конечно, потеряется немного качества, но на тестировании это никак не отразится. Проводите эти манипуляции над копией, а не над исходным файлом.
Активируйте инструмент «Прямоугольная область» (Rectangular Marquee Tool), и протяните квадрат, отступив примерно 1/5 от краев фрагмента.
Не снимайте выделение до тех пор, пока не останетесь довольны результатом (выбранным фрагментом). Можно воспользоваться стрелками на клавиатуре для точного перемещения выделенной области.
Снимите выделение (Ctrl-D), и проделайте то же самое с верхним и нижним краями. У нас получился красивый фрагмент мозаики:
Теперь выделите полностью весь фрагмент. Здесь нужно быть предельно точным, поэтому лучше воспользоваться направляющими (Guides). Затем перейдите в меню Редактирование > Определить узор (Edit > Define Pattern). Укажите название нового узора и затем сохраните его:
Создайте новый пустой файл, по размеру раза в три больше вашего паттерна, и залейте его только что созданным узором при помощи инструмента «Заливка» (Paint Bucket Tool), предварительно изменив стандартную опцию «Основной цвет» (Foreground) на «Узор» (Regular) с указанием нашего нового узора. Новые узоры всегда показываются в самом конце перечня. Теперь внимательно рассмотрите все «швы»:
Если все-таки выявились какие-либо неровности, то просто пометьте для себя их расположение. Затем возвратитесь к исходному паттерну и исправьте их.
Также нужно поработать над общей картиной. Хотя на отдельном узоре это может быть незаметно, при повторяющемся рисунке некоторые объекты могут казаться недостаточно или чрезмерно выразительными. Иногда нужно будет заострить внимание на каком-то определенном участке узора:
Теперь пришло время раскрасить нашу иллюстрацию. Легче всего это делается при помощи «Наложения цвета» (Color Overlay).
Для каждого цвета, который вы хотите добавить, создайте новый слой, и выставите наложение необходимого цвета. Для этого можно нажать кнопку Fx в самом низу панели слоев, а затем выбрав «Наложение цвета» из меню. Работая таким образом, вы всегда будете видеть, с каким цветом имеете дело.
В узоре можно использовать сколько угодно цветов, но следует учесть, что если шаблон предназначается для печати, то лучше всего использовать не более 4-8 цветов.
Если вы работаете с цельным изображением, то поместите основной слой в самый низ, а цветные слои сверху. Если же вы с контурным изображением, то лучше поместить основной слой в самом верху, а цветные слои выстраивать уже под ним:
Перед тем как начать раскраску, зажмите Ctrl и кликните по слою с основным паттерном, а затем нажмите Ctrl-H, чтобы скрыть выделение. Теперь цвет будет наноситься только в рамках выделенной области.
Конечно, такой метод сработает только в том случае, если ваш узор состоит из цельных фигур, а не из контуров. Если вы работаете с контурами, как показано ниже, то можно для начала залить их (для создания копии слоя с контурами нажмите Ctrl-J). Это позволит создать заготовку, и затем использовать ее для нанесения цветов на другие элементы паттерна:
Теперь нужно проверить, не заходит ли фоновый цвет на передний план. Это просто исправляется: нужно выбрать фрагменты иллюстрации, вокруг которых виден небольшой контур базового цвета при помощи зажатия клавиши Ctrl на клавиатуре и клика левой кнопкой мыши по миниатюре этого изображения на нужном слое. Затем нужно перейти в меню Выделение > Модификация > Сжать (Select > Modify > Contract) и ввести значение 1, после чего нажимаем ОК.
Это сожмет все выделение на 1 пиксель. Теперь инвертируйте выделение (Ctrl-Shift-I), а затем нажмите «Удалить» (Delete). Это приведет к удалению контура толщиной в 1 пиксель по всему фрагменту:
Наша иллюстрация уже завершена, и мы видим, что она прекрасно складывается в красивую мозаику. Теперь нужно превратить ее в готовый фрагмент, который можно будет использовать как шаблон.
Это легче всего делается при помощи направляющих. Установите одну горизонтальную и одну вертикальную направляющую рядом с краями документа. Если вы не видите линейки по краям рабочей области, то нужно включить их при помощи меню Просмотр > Линейки (View > Rulers).
Здесь нет какого-то конкретного обязательного фрагмента. Как бы вы ни разрезали эту мозаику, любая ее составная часть будет легко выстраиваться в такое изображение. Начните тянуть выделение от точки соприкосновения направляющих, предварительно зажав клавишу Shift:
Когда выберете нужный фрагмент, воспользуйтесь инструментом «Масштаб» (Zoom), и сильно увеличьте документ. Установите следующую направляющую точно по краю выделения.
Теперь повторите эту операцию с каждым слоем цвета, и выделение всегда установлено в нужном месте.
После того как закончите, снова отдалите документ и внимательно проверьте его. Малейшие погрешности на данном этапе могут создать большие проблемы в дальнейшем. Если все в порядке, проделайте то же самое с вертикальными краями:
Документ, который мы только что создали, полностью разделен на слои, поэтому мы можем без труда модифицировать его, меняя цветовое наложение на каждом отдельном слое:
Стоит отметить, что если вы планируете загружать этот файл на какие-нибудь сервисы, или отдавать на печать, то его нужно будет сохранить в форматах PNG, JPG или TIFF, но я рекомендую вам всегда сохранять оригинальный PSD-документ. Этот документ уже готов к модификациям и экспорту в любые форматы.
Надеюсь, вам понравилось это руководство, и теперь вы умеете создавать собственные качественные бесшовные паттерны в Photoshop!
В комментариях хотелось бы увидеть примеры ваших работ, созданных на основе этого руководства!
Данная публикация является переводом статьи «Create a Detailed, Illustrative, Seamless Pattern in Adobe Photoshop» , подготовленная редакцией проекта.
Как создать паттерн в фотошопе
Как сделать паттерн
Что такое паттерн и с чем его едят. Как его создать в фотошопе и чем паттерн отличается от текстуры? В этой статье я расскажу не только об их отличиях, но и покажу простейшие приемы создания паттернов и текстур для фотошопа. Постоянно встречаются уроки, в рамках которых нужно создать из куска графики рабочий паттерн. Но, невозможно во всех уроках писать главу о том, что это такое и как его создавать. Чтобы разом ответить на все эти вопросы, я решил написать этот краткий урок, на который буду всегда ссылаться.
Чем паттерн отличается от текстуры
Что такое текстура, думаю объяснять не нужно. Википедия отвечает на этот вопрос так:
Текстура — изображение, состоящее из более или менее близких по восприятию элементов.
Беспроигрышный вариант создания текстуры — это сфотографировать её самому, или найти/купить изображение в Интернете. Подробнее этот вопрос я освещал в статье Как подобрать текстуру в Фотошопе.
Термины «текстура» и «паттерн» между собой постоянно путаются. Паттерн называют текстурой, а текстуру паттерном. Но разобраться в разнице между ними очень просто. Паттерн тоже является в некоторой степени текстурой. Но в отличии от текстуры, паттерн может повторяться, и повторяясь он складывается в единые неделимые текстурные «обои».
Изображение текстуры всегда имеет определенный размер. Паттерн же чаще всего является небольшим кусочком графики, который дублируясь «натягивается» на изображение или объект любого размера.
Как это происходит?
Предположим у вас есть изображение текстуры и Объект, определенного размера, на который надо эту текстуру натянуть. Изображение текстуры меньше объекта, и единственный способ натянуть её на объект — увеличить в размере, потеряв в качестве.
Использовать текстуру как паттерн не получится, так как её швы не сходятся друг с другом. Придется такую текстуру либо увеличивать, либо вручную работать с масками и слоями, чтобы полностью натянуть на объект.
Паттерн, в отличии от куска текстуры, устроен так, что его края сходятся друг с другом, образуя непрерывное полотно.
Как сделать паттерн?
Паттерн делается очень просто. Достаточно выделить инструментами выделения любой участок изображения и открыть Edit > Define Pattern.
После этого выделенный кусок будет преобразован в паттерн и появится в стилях слоя во вкладке Pattens. Так же его можно будет найти в менеджере настроек Presets Manager.
Определить кусок графики как паттерн, не значит сделать настоящий повторяющийся паттерн.
Виды паттернов
Паттерн паттерну рознь. Паттерны бывают как простыми, так и сложными. Самый простой паттерн — это паттерн из находящихся на расстоянии друг от друга элементов. Сделать такой паттерн не трудно. Создайте новый фаил с размерами 10 на 10 пикселей. По левому краю нарисуйте полоску в 1 пиксель. Сделайте выделение и определите графику как паттерн Edit > Define Pattern
Паттерны из гламурных узоров не представляют из себя геометрической сложности. Достаточно один такой узор нарисовать, сделать отступы по бокам и определить графику как паттерн.
Другие паттерны представляют из себя геометрические головоломки, и собрать их с нуля не так то просто.
Но мы не будем посвящать эту простую статью созданию такой головоломки, она заслуживает отдельного рассмотрения. Вместо этого я покажу простой способ по созданию паттерна из обрывка текстуры.
Как сделать паттерн из текстуры
Для примера мы возьмем текстуру травы, которая представляет из себя обычную фотографию. Не паттерн. Её края друг с другом никак не соединяются, и если нам вздумается из такой текстуры сделать паттерн, мы отчетливо получим швы на соединении.
Вместо того чтобы делать такой кривой паттерн, я применю эффект Filter > Other > Offset суть которого заключается в том, что он сдвигает края внутрь рабочей области.
Теперь когда мы соединили края графики внутри, заретушируем швы их обычными инструментами ретуши вроде Clone Stamp или Spot Healing Brush. Но вместо того чтобы орудовать этими инструментами я поступлю ещё проще. Я сделаю выделение краев инструментом Lasso Tool. Криво и неровно, чтобы при заливке области смотрелись неправильно в хорошем смысле.
И выберу Edit > Fill с настройкой Content-Aware.
Если на ваш взгляд соединения скрыты успешно, выделяйте графику и применяйте Edit > Define Patten. Паттерн из текстуры готов к использованию.
Понравился урок? Подписывайся на Вконтакт, Фэисбук или твиттер, чтобы следить за новыми статьям.
Как сделать паттерны в фотошопе и где брать готовые
Отдохнул от фотошопа и теперь снова он. Истертая тема – паттерны в фотошопе. Создание паттернов – это один из самых простых фотошопских навыков. Все что нужно сделать – это создать картинку, которую вы хотите периодически повторять – то есть собственно паттерн, и затем, сохранить эту картинку в набор паттернов.
Обычно паттерн рисуют небольшого размера – не более 50 – 200 px на сторону. Чтобы его сохранить, заходим в меню “Редактирование” → “определить узор”, после чего вам предложат дать имя паттерну. Далее узор попадает в библиотеку и станет доступен для последующих заливок.
Чтобы сделать заливку с использованием вашего паттерна идем в “Редактирование” → “Выполнить заливку” → “Использовать: → регулярный” → в выпадающем меню “Заказной узор” выбрать свой созданный паттерн и – вуаля!
Все подробности смотрите в видеоуроке и не будьте какахами, которые не делятся понравившимся видео и не ставят лайки.
Там же, в видеоролике, можно узнать о хорошем месте (если вы еще о нем не знаете), где много бесплатных готовых паттернов на самые разные темы.
Метки паттерны, узоры, фотошоп. Закладка постоянная ссылка.
Photoshop за 60 Секунд: Как Создать Простой Геометрический Паттерн.
What You’ll Be CreatingДобро пожаловать на нашу серию Photoshop за 60 секунд, в которой вы научитесь навыкам работы в Photoshop, узнаете особенности программы, и техники работы в ней всего за минуту!
Photoshop за 60 Секунд: Геометрический Паттрен
Геометрические паттерны — это потрясающий дизайн элемент, созданный из простых фигур. И вы можете использовать эти паттерны как фон, наклейку на ноутбук, или в любых других проектах графического дизайна. Узнайте как создать простой геометрический паттерн используя Adobe Photoshop и инструменты фигур в этом коротком видео.
Хотите добавить паттерны к вашему рабочему набору? Попробуйте набор паттернов из видео, которые вы можете найти на Envato Elements.
Как Создать Простой Геометрический Паттерн в Phototshop
Создайте рабочий холст любого размера. Выберите ваши любимые Образцы Цвета (Color Swatches) для ваших паттернов. Я использую здесь следующие цвета: #eb9c4d, #bac9a9, #f3ffcf и #f2d680
Выберите инструмент Многоугольник (Polygon Tool) или инструмент Произвольная Фигура (Custom Shape Tool) (U) что бы создать треугольник размером 100 x 100 пикс.(px). Используйте сперва оранжевый цвет для треугольника и поместите его в верхний левый угол.
Нажмите Control-J что бы Дублировать фигуру еще три раза. Измените цвета треугольников в соответствии с вашей темой, и добавьте копию первого треугольника в конец вашей строки. Используйте инструмент Кадрирование (CropTool) (C) что бы откадрировать холст, обрезав крайние стороны первого и последнего треугольников.
Выберите все фигуры и Дублируйте их. Создайте второй ряд треугольников ниже, и расположите его левее первого ряда. Затем используйте инструмент Прямоугольная область (Rectangular Marquee Tool) (M) чтобы выделить ваш паттерн и зайдите в меню Редактировать>Задать Паттерн (Edit > Define Pattern) чтобы создать новый паттерн.
Используйте инструмент Заливка (Paint Bucket Tool) (G) с вашим Паттерном, что бы испробовать ваш новый дизайн в деле.
Хотите увидеть как это делается? Посмотрите видео выше, что бы увидеть как это работает!
Немного Информации
Хотите узнать больше советов и приемов для создания крутых паттернов? Тогда посмотрите уроки по ссылкам ниже:
Паттерны
Photoshop за 60 Секунд: Бесшовные Паттерны
Kirk Nelson
Паттерны
Как Создать и Применить Тропический Бесшовный Паттерн в Adobe Photoshop
Yulia Sokolova
Паттерны
Создайте Бесшовный Цветочный Паттерн в Стиле Фэнтези в Adobe Photoshop
Lidija Paradinovic Nagulov
Adobe Photoshop
Создайте Houndstooth Паттерн в Adobe Illustrator и Photoshop
Mary Winkler
60 Секунд?!
Это часть из серии коротких видеоуроков на Envato Tuts+ в которых мы представляем вам различные темы за 60 секунд — ровно столько, чтобы вас заинтересовать. Оставляйте свои комментарии об этом видео, а также, пишите чему бы вы еще хотели научиться за 60 секунд!
Как я делаю бесшовный узор в Фотошопе
Много раз меня спрашивали, и вот я решила выделить время и сделать таки урок по созданию бесшовного узора в Фотошопе. Возможно есть методы намного проще и удобней, но я изобрела вот такой велосипед, на нем и катаюсь.Итак, приготовьтесь, сейчас я буду очень подробно показывать, как я сделала такой цветочный фон. Картинки большие и их больше десяти штук, хотя по правде сказать можно было бы уложиться и в две, зафиксировав лишь основные моменты. Но раз я пообещала пошаговый процесс, то его и буду демонстрировать. Если что, я предупредила))
Создаем документ 4500х4500 пикселей, с разрешением 300.
Вставляем в наш документ заранее приготовленные элементы. В моем случае, это 3 вот таких цветочных заготовки (все они аккуратно вырезаны по контуру и размещены в разных слоях).
Дублируем наши цветочки и в произвольном порядке заполняем ими верх и левую сторону холста. Как видите элементы в разной степени выступают за край. Теперь выделяем все цветы, что пересекают левую границу холста и дублируем их. *не забываем периодически сохранять документ
Выделив наши дубли, щелкаем по маркеру трансформационной области. Теперь у нас стала активной панелька сверху под главным меню. Выбираем точку отсчета левый верхний угол в «Reference point location». Сейчас мы видим координаты нашей группы объектов относительно верхнего левого угла. Их мы и будем менять.
Поскольку мы работаем с левой стороной, то соответственно и двигать объекты будем относительно оси Х. Сейчас у меня там -1018. Итак, достаем калькулятор и додаем до этой цифры 4500 (ширину нашей рабочей области). В итоге у нас получается 3482, это число мы и вводим в графу Х. Наши цветочки переместились, готово.
Аналогично дублируем весь верхний ряд вниз, вычислив координаты нашей группы объектов по оси Y.*не забываем периодически сохранять документ
Если нужно подвигать наши элементы, то не забываем, что теперь противоположные стороны взаимосвязаны. Так что, для перемещений выделяем объект и его дубль и тогда смещаем.
Всю пустую область заполняем цветочками так, чтобы это было гармонично и красиво. Следим за тем чтобы наши объекты не пересекали границ рабочей области. Вот в принципе, наш бесшовный узор и готов. Но поскольку я параноик, которому надо все перепроверить, то у меня есть еще несколько шагов))
Помещаем все наши слои в папку и дублируем ее. Объекты из дубля сливаем все в один слой. В принципе, дубль мне нужен для того чтобы иметь запасную папку с послойными элементами. Еще я добавила фон. Кадрируем наше изображение по контуру рабочей области.
Дублируем наш слой с цветочным узором. Перемещаем его на 4500 пикселей вправо. Выделяем узор и его дубль и двигаем так чтобы было видно шов, где они соединяются. Для чего я это делаю? Проверяю все ли сошлось)) Иногда, когда слоев очень много, то можно напутать с верхними нижними дублями и какой-то листик в одной части паттерна уйдет под цветочек, а с другой стороны уже будет сверху. Но в нашем случае все замечательно. *не забываем периодически сохранять документ
Если бы было не замечательно. то мы бы не растерялись и вернулись в Истории до момента, когда мы все слили в один слой и обрезали. И исправили бы ошибку.
Сохраняем наш фон в формате джипег. Все, можно грузить на сток))
Еще в процессе проверки бесшовности, всегда можно наделать симиларов. Фон ведь бесшовный, немного передвинул его — узор изменился, а бесшовность осталась)) Плюс можно добавить разных элементов на фон с разной степенью прозрачности.
Вот и весь мой процесс создания узоров.
Надеюсь мне удалось понятно все обьяснить и мой опыт окажется кому-то полезным. Удачных вам творческих экспериментов!
Бесшовный узор в Фотошоп / Creativo.one
В этом уроке я собираюсь показать вам несколько способов, создания интересных узоров для рабочего стола.
Хорошо, начнем с создания нового документа, размером 300 × 300 пикселей. Залейте его любым цветом, например черный.
После этого начнем создавать нашу картину. С помощью Custom Shape Tool (произвольная фигура) выберите одну из стандартных фигур в галерее Photoshop.
Используйте белый цвет для создания фигуры.
Растрируйте эту фигуру Layer> Rasterize> Shape (слои> растрировать> фигуру). После этого возьмите инструмент Rectangular Marquee Tool (прямоугольная область), чтобы создать выделение как на картинке ниже. Вы должны выбрать четвёртую часть фигуры, это имеет важное значение для нашей будущей картины.
Затем инвертируйте выделение Select> Inverse (выделение> инверсия) и нажмите Удалить, чтобы очистить выделенную область.
Ладно, теперь снимаем выделение: выделение>отменить выделение (CTRL+D). Выберите Custom Shape Tool (произвольная фигура), добавьте еще одну пользовательскую фигуру, которую вы видите ниже:
Добавьте фигуру к нашему документу.
Нажмите Ctrl + T и поверните эту фигуру примерно на 45 градусов и переместите его немного ниже. Удерживайте кнопку Shift при повороте фигуры, чтобы получить точный угол вращения объекта.
Слейте слои с фигурами в один с пощью Ctrl + E и дублируйте полученный слой с помощью Ctrl + J. Используя Edit> Transform> Flip Horizontal (редактирование> трансформирование> отразить по горизонтали), отразите новый слой по горизонтали и переместите его в право.
Хорошо, слейте текущий слой с предыдущим и дублируйте новый слой. Используя Edit> Transform> Flip Vertical (редактирование> трансформирование> отразить по вертикали),переверните дублированный слой по вертикали и переместите его ниже. Слейте этот слой с предыдущим.
Нажмите Ctrl + T и уменьшите размер в два раза.
Хорошо, теперь у нас готов фрагмент картины. Сейчас я вам покажу два способа создания картины, используя этот фрагмент.
ПЕРВЫЙ СПОСОБ
Нажмите Ctrl + A, чтобы выделить наш документ и нажмите Ctrl + C, чтобы скопировать выделенную область. Ладно, теперь используя Ctrl + N, создайте новый документ, но, прежде чем нажать Enter, вы должны добавить два пикселя по ширине и высоте.
Залейте созданный документ цветом # 003e16 и после этого нажмите Ctrl + V, чтобы вставить скопированный фрагмент в этот документ.
Измените непрозрачность этому слою на 40% и измените режим слоя на Overlay (перекрытие). Затем примените стиль слоя Outer Glow (слой> стиль слоя> внешнее свечение) к этому слою.
Вы можете увидеть результат ниже:
Примените Edit> Define Pattern (редактирование> определить узор), чтобы сохранить это изображение как узор и закройте текущий документ без сохранения. После этого вы можете создать документ любого размера и залить его нашими узором с помощью Paint Bucket Tool (заливка).
ВТОРОЙ СПОСОБ
Вернитесь на основной документ и скопируйте текущую фигуру три раза. Расположите фигуры как показано ниже:
Объедините все слои с фигурами в один слой. Затем с помощью Rectangular Marquee Tool (прямоугольная область), создайте выделение как на картинке ниже. Обратите внимание, что границы вашего выделения должны быть расположены непосредственно по центру фигур.
Нажмите Ctrl + C, чтобы скопировать выделенную область. Затем создайте новый документ и залейте его этим цветом # 003e16. Нажмите Ctrl + V, чтобы вставить скопированный фрагмент.
Установите прозрачность на 40% и измените режим слоя на Overlay (перекрытие). После этого примените стиль слоя Outer Glow (внешнее свечение) для этого слоя.
Результат вы видите ниже:
Хорошо.Примените Edit> Define Pattern (редактирование> определить узор), чтобы сохранить это изображение как узор и закройте текущий документ без сохранения. После этого вы можете создать документ любого размера и залить его нашими узором с помощью Paint Bucket Tool (заливка). Результат должен выглядеть так:
Отлично, мы справились с этим уроком. Теперь у нас есть интересная картинка. Не стесняйтесь экспериментировать и у вас будет больше творческих узоров для рабочего стола! Удачи в экспериментах!
Переводчик: Пихтелькова Анна
Ссылка на источник
Как сделать бесшовный паттерн в фотошопе
Доброго времени суток. Встречайте новый урок по 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
Узоры от простых точек до декоративных тигров всегда добавляют декоративности. Мы подготовили пошаговое руководство по созданию бесшовных и полутоновых узоров в Photoshop.
Многие вещи выглядят намного лучше с повторяющимся узором на них — подумайте о подарках на день рождения, красиво покрытых праздничной подарочной упаковкой, или о геометрической керамической плитке, которая сделает вашу кухню еще более уютной. Есть что-то утешительное в иллюстрации, которая повторяется бесконечное количество раз, поэтому мы так любим паттерны.
Для художников-фрилансеров и креативщиков приведенное ниже руководство представляет собой пошаговое руководство по созданию двух типов узоров в Adobe Photoshop — бесшовного узора и полутонового узора.
Как создать бесшовный узор
Когда бесшовный узор действительно хорош, трудно понять, где начинается и где заканчивается цифровая иллюстрация, даже после серьезного изучения. Такой узор, кажется, размывает границы плиток, позволяя им волшебным образом повторяться в прекрасной гармонии.Чтобы добиться этого вида, сначала нужно нарисовать все компоненты, которые вы хотите включить в отдельный файл Photoshop. Затем вам нужно будет переставить их так, чтобы казалось бесконечным. Как? Хитрость здесь в том, чтобы добавить элементы по углам и вокруг границы, чтобы скрыть и почти устранить квадратную форму плитки. Вот как это сделать правильно:
Начните с рисования всех элементов, которые вы хотите включить в узор, в отдельном файле.1. Откройте новый квадратный файл Photoshop с высоким разрешением.Мы рекомендуем 2000 x 2000 пикселей и 300 точек на дюйм.
2. Поместите один из созданных вами элементов в центр файла.
3. Выберите «Фильтр»> «Другое»> «Смещение». Затем сместите свой дизайн на половину размера файла,
как по горизонтали, так и по вертикали (это означает, что если размер вашего холста составляет 2000 x 2000 пикселей, вы должны сместить изображение на 1000 пикселей по горизонтали и еще на 1000 пикселей по вертикали). в результате ваше изображение появится во всех четырех углах вашего холста, разделенных на четыре.
4. Добавьте еще один элемент и поместите его в середину холста. На этот раз перейдите в Фильтр> Другое> Смещение. Но со смещением всего 1000 пикселей по горизонтали и 0 пикселей по вертикали. В результате одно изображение разделится на два.
5. Поместите третий элемент в центр. Затем снова перейдите в Фильтр> Другое> Смещение и сместите его наоборот — на этот раз на 1000 пикселей по вертикали и 0 пикселей по горизонтали.
6. При желании повторите шаги четвертый и пятый с дополнительными изображениями.Но пока не используйте все элементы — оставьте некоторые и для середины плитки.
7. Теперь, когда вы так хорошо позаботились о границах и углах, добавьте оставшиеся элементы в центральную часть дизайна плитки. Расположите их так, чтобы они хорошо сочетались с формами вокруг границы. Помните о расстоянии между элементами, а также о негативном пространстве.
Узоры состоят из квадратной плитки, которая повторяется много раз. Добавьте элементы вокруг границы, чтобы размыть квадратную форму плитки и сделать узор бесшовным.8. Теперь ваша плитка готова к установке! Чтобы он стал узором, сначала удалите цвет фона, чтобы он стал прозрачным.
9. Затем перейдите в Edit> Define Pattern. Вы можете назвать созданный узор и нажать «ОК».
10. Перейдите в Слой> Новый слой заливки> Узор или щелкните значок «Создать новый слой заливки или корректирующего слоя» (черно-белый кружок). в нижней части панели «Слои». Выберите только что созданный узор. Вы также можете настроить его масштаб, то есть размер повторяющейся панели.
Вот и все! Вы создали бесшовную иллюстрацию. Хотя вам может потребоваться вернуться и отрегулировать размеры, композицию и интервал в зависимости от результата, чтобы в конечном итоге добиться того, что вас устраивает.
Как создать полутоновый узор
Разработанный для печати в 19 веке и применяемый в современной коммерческой печати, полутоновое изображение — это метод, который разделяет сложные изображения на сетку из мелких точек для упрощения процедуры печати.Мы настолько привыкли к визуальным эффектам полутонового или растрового изображения, что воспроизведение этого эффекта в цифровом виде по чисто эстетическим причинам может вызвать прекрасную ностальгическую атмосферу. Вы можете создать полутоновый узор из традиционных точек, но это также можно сделать со знаками плюс, крестиками или любой другой формой по вашему вкусу.
Создать полутоновый узор в Photoshop очень просто. Вот как это сделать за шесть простых шагов:
Полутоновых узоров можно создать любой формы, от традиционных точек до знаков плюса или креста.1. Откройте новый квадратный файл Photoshop с высоким разрешением. Мы рекомендуем 400 x 400 пикселей и 300 точек на дюйм.
2. Разделите холст на четыре части, опустив две направляющие, одну посередине оси X и одну посередине оси Y.
3. На новом слое нарисуйте два круга — или любую другую форму, которую вы придумали — на двух противоположных четвертях холста. Мы рекомендуем нарисовать две фигуры вручную, чтобы рисунок получился более рыхлым. Вы также можете поиграть с размерами ваших фигур, чтобы сделать узор более плотным или более пространственным.
Нарисуйте две фигуры на противоположных сторонах холста.4. Удалите цвет фона, чтобы он стал прозрачным.
5. Выберите слой, на котором вы создали две формы, и выберите Edit> Define Pattern. Вы можете дать своему шаблону имя и нажать «ОК». И вуаля — готово!
6. Чтобы применить узор, выберите «Слой»> «Новый слой заливки»> «Узор» или щелкните значок «Создать новый слой заливки или корректирующего слоя» (черно-белый кружок) в нижней части панели «Слои» и выберите значок шаблон, который вы только что создали.
Текст и изображения Or Yogev
Как создать образец повторяющегося узора из изображения
Как создать образец повторяющегося узора из изображения — курсы и бесплатные учебные пособия по Adobe Illustrator, технические пакеты и фриланс для модельеров: курсы & Бесплатные учебные пособия по Adobe Illustrator, Tech Packs и фриланс для модельеровКак создать повторяющийся образец узора из изображения
Это краткое руководство покажет вам, как взять любое изображение (из Интернета, фотографию или отсканированное изображение), обрезать его в Photoshop и превратить в образец повторяющегося узора в Adobe Illustrator.
Вы узнаете:
- 00:29 Как обрезать изображение в Photoshop, чтобы создать повторяющуюся плитку
- 03:07 Как быстро скопировать свою работу из Photoshop в Illustrator
- 04:00 Как перенести изображение с компьютера в Illustrator
- 04:35 Как отличить встроенные изображения от связанных изображений в Illustrator и почему одно из них не помогает создать повторяющийся узор
- 06:40 Как превратить изображение в образец узора в Illustrator
Внимание: мы используем файлы cookie, чтобы персонализировать ваш опыт и отслеживать, как вы взаимодействуете с нашим сайтом, чтобы лучше обслуживать вас. ОК подробнее
Получите бесплатное руководство по созданию профессионального портфолио всего за ОДИН выходнойХОЧУ МГНОВЕННЫЙ ДОСТУП 👇
Зарегистрировавшись, вы получите доступ к еженедельным электронным письмам с бесплатными учебными материалами, шаблонами и случайными предложениями.
Меняйте одежду с помощью рисунка с заливкой в Photoshop
Photoshop позволяет создавать собственные шаблоны (или использовать уже существующие) и применять их к изображению в качестве слоя заливки. Это означает, что вы можете масштабировать узор, а также изменять режимы непрозрачности и наложения, чтобы он выглядел так, как будто узор всегда был частью изображения.
В этом примере мы собираемся изменить текстуру женского костюма на этом изображении, используя существующий узор.Вы можете бесплатно скачать изображение здесь. Спасибо Plethr. Примечание. Я использую CS5 для захвата экрана, но метод такой же для старых версий Photoshop.
1. Откройте фотографию в Photoshop.
2. Прежде чем применить узорную заливку, нам нужно выбрать только те части изображения, к которым мы хотим применить ее. В этом случае подобрать синий костюм довольно просто, и есть несколько способов сделать это. Я использую команду «Цветовой диапазон». Выберите Select> Color Range .Откроется диалоговое окно «Цветовой диапазон». Используйте пипетку, чтобы выделить часть костюма. В диалоговом окне «Цветовой диапазон» вы увидите черно-белый предварительный просмотр выбранных частей изображения. Перетащите ползунок «Нечеткость» влево и вправо, чтобы уточнить, какая часть синего цвета выбрана.
Чтобы добавить к выделению, используя похожие цвета, используйте пипетку с символом +, чтобы удалить цвет из выделения, используйте пипетку с символом -. Когда вы будете довольны выбором, нажмите ОК.
3. Если вы обнаружите, что этот метод не захватил весь костюм, выберите инструмент «Волшебная палочка» на панели инструментов и нажмите Shift + щелчок по любым областям, которые не были выделены. Удерживая нажатой клавишу Shift, вы добавляете выделение и не теряете то, что уже было выделено. Удерживайте Shift + щелчок, пока не выделите все части костюма.
4. Теперь, когда у вас есть активный выбор женского костюма, нажмите и удерживайте кнопку «Создать новую заливку или корректирующий слой» в нижней части панели «Слои» и выберите «Узор».
Появится диалоговое окно «Заливка узором», и в палитре слоев вы увидите новую маску слоя узора над текущим слоем. Вы также заметите, что внезапно женский костюм заполняется стандартным узором.
5. Чтобы применить другой узор (потому что этот узор по умолчанию довольно ужасен), щелкните маленький треугольник рядом с образцом узора в диалоговом окне «Заливка узором». Затем щелкните маленький треугольник в правом верхнем углу раскрывающегося списка.Внизу появившегося меню вы увидите множество шаблонов, доступных в группах, таких как Artist Surfaces, Nature Patterns и Rock Patterns. Выберите Artist Surfaces. Скорее всего, вы увидите диалоговое окно с вопросом, хотите ли вы заменить текущие шаблоны, просто выберите «Добавить», чтобы добавить к существующим шаблонам.
6. Выберите узор, который вам нравится, из эскизов. Я выбрал марлю и установил масштаб на 150%. Вы увидите, как узор мгновенно нанесен на костюм. Нажмите «ОК», если вам нравится этот шаблон, в противном случае выберите другой.
Результат покажется немного неестественным и совершенно неестественным, но именно здесь на помощь приходят наши режимы наложения.
7. Не снимая выделения с нового слоя заливки, нажмите и удерживайте кнопку «Нормальный» в раскрывающемся меню режима наложения на панели «Слои» и выберите «Умножить». Выбрав Умножение, белая часть узора будет выбита, и мы просто увидим эффект Марли. Но что немаловажно, мы видим складки и швы на костюме.
Вы также можете уменьшить непрозрачность заливки узором, если она слишком большая.
8. Вы можете поэкспериментировать с другими режимами наложения, чтобы увидеть, как они влияют на окончательную визуализацию узора. Оверлей тоже работает очень хорошо.
Самое лучшее в этом методе — это то, насколько легко изменить узор. Просто дважды щелкните миниатюру Pattern Fill (слева от слоя), чтобы быстро выбрать и применить другие узоры. Вот еще несколько примеров с тем же изображением и узорами Red Fleck, Blue Daisy и Wood, которые поставляются с Photoshop.
Как создавать узоры калейдоскопа из ваших фотографий
Если вы похожи на меня, в детстве у вас был калейдоскоп. Вы бы посмотрели через один конец и повернули циферблат, и мир отобразился бы в виде зеркальной изломанной формы. Благодаря Photoshop вы можете создавать калейдоскопы из ваших фотографий. Подойдет любое изображение интересного цвета и формы.
Шаг 1
Преобразуйте фоновый слой в обычный слой, дважды щелкнув по нему и нажав ОК.
Шаг 2
Выберите слой и с помощью инструмента «Перемещение» поверните его на 60 градусов и разместите его над одним углом холста изображения, убедившись, что одна сторона изображения пересекает две стороны холста.
Шаг 3
Используйте инструмент «Волшебная палочка», чтобы выбрать пустой фон, выберите «Выделение»> «Инверсия», чтобы выделить фигуру, затем выберите «Выделение»> «Изменить»> «Сжать» и сожмите фигуру на один пиксель. Теперь выберите
Image> Crop, чтобы обрезать изображение до самой формы.Это важно сделать, чтобы удалить сглаживание, которое Photoshop применяет к краю изображения при его повороте.
Шаг 4
Дублируйте слой изображения.
Выберите «Изображение»> «Размер холста», нажмите «Относительная» и установите ширину, примерно в 3 раза превышающую текущую высоту изображения (НЕ ее ширину), а высоту в 2 раза превышающую текущую высоту. Выберите средний верх из девяти полей позиционирования и нажмите ОК.
Шаг 5
Выберите «Просмотр»> «Привязать к»> «Все» и убедитесь, что выбран «Просмотр»> «Привязать».Щелкните инструмент «Перемещение» и верхний слой изображения и перетащите левый край на правый, пока значение W: не станет -100%. Убедитесь, что деталь выровнена по краю детали на нижнем слое.
Шаг 6
Объедините эти два слоя, выбрав верхний и нажав Control + E (Command + E на Mac).
Дублируйте этот объединенный слой, выберите верхний слой и выберите «Правка»> «Свободное преобразование» и в области параметров инструмента выберите середину нижней части 9-точечной сетки, чтобы зафиксировать точку, вокруг которой вращается фигура.Установите поворот на 30 градусов.
Шаг 7
Нажмите Control + J (Command + J на Mac), а затем Control + Shift + T (Command + Shift + T на Mac). Это дублирует текущий слой и повторяет преобразование на нем.
Повторяйте это, пока калейдоскоп не будет готов — всего четыре раза.
Шаг 8
Объедините все слои. Используйте инструмент кадрирования, чтобы выделить холст. При необходимости вы можете перетащить наружу, чтобы добавить обратно любое изображение, выходящее за пределы холста изображения.
Шаг 9a
Теперь вы можете проявить творческий подход к форме. Например, вы можете сделать дубликат фигуры и поместить его в середину исходной фигуры, уменьшив размер второй версии до небольшого размера, а затем обрезать окончательное изображение до квадратной формы. Используйте клавиши Alt и Shift (Option и Shift на Mac), чтобы уменьшить размер фигуры, оставляя середину на том же месте и пропорционально.
Шаг 9b
При желании можно заполнить середину другим калейдоскопом.Здесь я использовал корректирующий слой Hue / Saturation, чтобы лучше сопоставить цвета двух калейдоскопов.
Шаг 9c
Вы можете выбрать фигуру и выбрать «Правка»> «Определить узор», чтобы сделать из нее узор. Затем вы можете заполнить им более крупное изображение, чтобы оно отображалось в виде повторяющейся формы.
Есть много творческих способов использования калейдоскопа.
Как превратить фотографию в бесшовную мозаичную текстуру в Photoshop
Существуют буквально миллионы удивительных текстур и узоров, ожидающих загрузки.Проблема в том, что иногда они не совсем соответствуют размерам вашего документа. Не бойся!
Из этого туториала Вы узнаете, как преобразовать изображение, которое плохо повторяется, в бесшовную мозаичную структуру всего за несколько минут, так что вы больше не ограничены использованием текстур «как есть».
Шаг 1
Откройте вашу текстуру в Photoshop. У нас 1920 x 1080 пикселей, что важно знать по мере продвижения вперед.
Щелкните «Фильтр»> «Другое»> «Смещение» и установите значения, равные половине общих размеров изображения.Убедитесь, что у вас установлен переключатель Wrap Around, и нажмите OK.
Шаг 2
Есть несколько способов смешать швы, но для этого изображения мы будем использовать инструмент patch, потому что он будет брать образцы из других областей нашего изображения, чтобы сохранить вид крошенной бумаги, а не чрезмерное сглаживание чего-либо.
Создайте новый пустой слой, затем выберите инструмент Patch Tool (J).
Убедитесь, что на верхней панели инструментов для режима исправления установлено значение Content-Aware и установлен флажок «Образец всех слоев».Возможно, вам придется поиграть с настройками адаптации для разных изображений, но средний обычно подходит.
Шаг 3
Щелкните свой выбор и перетащите его вправо или влево, удерживая Shift.
Когда вы отпустите кнопку мыши, Photoshop заменит исходное выделение содержимым, взятым из области, в которую вы перетащили.
Поскольку мы создали новый слой, переход между швами будет отделен от исходного изображения и при необходимости может быть удален.
Шаг 4
Повторите тот же процесс, чтобы удалить горизонтальный шов.
Шаг 5
Нажмите CTRL + ALT + E, чтобы создать новый плоский слой в документе. Нажмите Edit> Define Pattern и дайте вашему паттерну имя.
Создайте новый документ с теми же размерами, что и исходное изображение, в нашем случае 1920 x 1080 пикселей.
Создайте новый слой и залейте его белым цветом. Дважды щелкните слой на панели «Слои», чтобы открыть диалоговое окно «Стиль слоя», и включите «Наложение узора».
Выберите только что созданный узор и вуаля!
В диалоговом окне «Стили слоя» вы можете уменьшить масштаб рисунка и даже щелкнуть и перетащить холст, чтобы переместить его. Вы заметите, что теперь нет твердых швов.
Каждая текстура уникальна и может потребовать дополнительной настройки, но процесс всегда будет одинаковым.
Помог ли этот метод создать бесшовный мозаичный узор? Покажи нам в комментариях.
Как создать бесшовный узор в Photoshop
Следуйте этому руководству, чтобы узнать, как быстро и легко превратить вашу графику в бесшовный узор в Photoshop.
Я собираюсь использовать рисованные иллюстрации из моей коллекции «Волшебные единороги», но вы можете использовать клип-арт, рисунки, акварельные иллюстрации или даже кисти Photoshop.
Photoshop против Illustrator
Я обычно использую Illustrator для создания бесшовных узоров. Photoshop так же прост в использовании, но векторные узоры, которые вы можете создавать в Illustrator, легко масштабировать и перекрашивать. Вы также можете редактировать их после сохранения рисунка. Этого нельзя сделать в Photoshop, поэтому я рекомендую использовать Illustrator.
Я использую Photoshop для создания бесшовных текстур и считаю, что он отлично подходит для акварельной и рисованной графики.
Посмотрите, как я создаю бесшовный узор в Photoshop на YouTube
Недавно я открыл новый канал на YouTube, где я покажу вам, как использовать Photoshop и Illustrator для создания бесшовных узоров и графики для вашего блога, бизнеса или социальных сетей. . Подпишитесь на канал Elan Creative Co, если хотите увидеть больше видеоуроков.
Вот как создать бесшовный узор в Photoshop:
Как создать бесшовный узор в Photoshop
Сначала откройте Photoshop и создайте новый документ.Мой холст имеет размер 400×400 пикселей при 72 пикселях на дюйм. Если вы хотите распечатать изображение, используйте более высокое разрешение и цветовой режим CMYK.
Используйте инструмент «Заливка», чтобы перекрасить фон, а затем заблокируйте слой, щелкнув значок замка на панели «Слои».
Перетащите иллюстрации, которые вы хотите использовать, в центр холста.
Используйте ограничивающую рамку, чтобы изменить размер изображения. Вы также можете повернуть его. Нажмите Enter, чтобы сохранить изменения.Добавьте другую графику и попробуйте заполнить холст.Убедитесь, что изображения находятся внутри рабочего пространства.
Когда дизайн вас устраивает, перейдите на панель «Слои», выберите все слои, щелкните их правой кнопкой мыши и выберите в меню «Объединить». Теперь у вас должен быть фоновый слой и один слой со всей графикой.
Мы собираемся использовать фильтр Offset , чтобы создать повторяющийся узор.
Выберите верхний слой и перейдите в Filter> Other> Offset .
Убедитесь, что выбрано Обтекание вокруг , и введите половину ширины холста для горизонтального значения и половину высоты холста для вертикального значения.
Вы можете использовать другую графику, чтобы заполнить пустые области, которые теперь находятся посередине.
Когда узор готов, перейдите на панель Layers и объедините все слои.
Чтобы сохранить узор, перейдите в Edit> Define Pattern и дайте вашему паттерну новое имя.
Чтобы проверить свой узор, откройте новый документ и создайте холст, который больше, чем плитка вашего узора.
Перейдите в меню Edit> Fill , установите Contents на Pattern и выберите новый узор из списка Custom Pattern .Нажмите OK , чтобы использовать его.
Вы также можете использовать бесшовные узоры с помощью инструмента заливки или инструмента формы .
Вы создаете и используете бесшовные шаблоны в Photoshop?
Учебное пособие по Photoshop: как получить повторяющееся изображение из готового шаблона
В Photoshop есть множество предустановленных шаблонов.Этот пост первый появился на www.vickiwenderlich.com.
Допустим, вы создали макет своего веб-сайта или приложения с помощью Photoshop, и в нем используются один или несколько шаблонов.Может быть, вы получили эти узоры из встроенных узоров Photoshop, или, может быть, вы загрузили коллекцию узоров (.pat) в Интернете.Но что, если вы хотите сохранить шаблоны Photoshop как отдельные файлы .PNG или .JPG, чтобы ваш программист мог мозаично размещать изображения в качестве фонового изображения?
Вы не поверите, но решить эту проблему непросто. Вздох.
Вот мой макет; Теперь я извлечу фоновый узор.Эта проблема долго ставила меня в тупик, заставляя избегать шаблонов, которые я не создавал сам или не создавал из jpeg.
Оказывается, получить исходное изображение легко, хотя и не интуитивно.
Между прочим, файл .pat от Subtle Patterns отличный. Загрузите его, затем в следующий раз, когда будете применять узор, щелкните стрелку вверху вправо и выберите «Загрузить узоры». Перейдите туда, где вы его сохранили, и нажмите «Загрузить».
Шаг 1. Откройте Photoshop
.Нет, пока не открывайте документ.
Шаг 2: Выберите инструмент Paint Bucket Tool
Инструмент «Заливка»Он находится на панели «Инструменты».
Если вы его не видите, щелкните правой кнопкой мыши инструмент градиента и выберите его во всплывающем меню.
Шаг 3: Выберите свой узор
Наведите указатель мыши на узор, чтобы увидеть размеры.Поднимитесь на панель «Параметры» и выберите «Узор» в первом раскрывающемся меню.
Затем щелкните второе раскрывающееся меню и наведите указатель мыши на шаблон, который вы использовали.
Название и размер вашего рисунка должны появиться через секунду.
Обратите внимание на размер (здесь я считаю, что он составляет 200 на 200 пикселей).
Щелкните узор, чтобы выбрать его.
Шаг 4. Создайте новый документ
Теперь вы можете открыть новый документ. Дайте ему размеры вашего образца узора — у меня было 200 x 200 пикселей.
Или, если вы раньше не слушали, измените размер холста (Изображение> Редактировать холст) в соответствии с размерами образца узора.
Шаг 5. Щелкните холст
Это было легко, правда? Хорошо.
Шаг 6. Сохраните изображение
Ваш узор!Выберите «Файл»> «Сохранить для Интернета и устройств».Если вы сохраняете для Интернета, сохраните его как JPEG. Если вы сохраняете для iPhone или iPad, сохраните его как PNG.
Теперь вы можете использовать узор как повторяющееся изображение на веб-сайте или в приложении!
Наконечник Pro
Я редко использую узор в качестве фона без предварительной настройки.
