Бесшовный паттерн как сделать в фотошопе
Главная » Разное » Бесшовный паттерн как сделать в фотошопе
Как создать бесшовный паттерн: в Photoshop, в Gimp и вручную
Легкомысленные цветочные мотивы на обоях, уютная и основательная клетка на пледе, яркий узор на упаковочной бумаге… согласитесь, без принтов и орнаментов наш быт был бы намного скучнее. Мы часто рассказываем вам, как использовать их в интерьере, а на этот раз решили поделиться секретом создания.
Бесшовные паттерны — это узоры, состоящие из повторяющихся элементов, граница между которыми не очевидна. Конечно, это весьма условное определение: даже на принтах, которые называют бесшовными, найти границу может быть проще или сложнее. Посмотрите на примеры ниже. В первом мы легко находим «элементарную частицу» и понимаем, что это просто нарисованные на квадратном холсте четыре арбузные дольки. А вот как сделать паттерн наподобие второго, не настолько очевидно. Что ж, этим мы сегодня и займемся!
Фото
Вручную
Написать этот материал нас вдохновил мастер-класс иллюстратора Джулии Ротман, в котором она показала, что паттерны можно создавать и без компьютера под рукой.
Бумага, фломастер, ножницы и скотч — вот все, что вам понадобится, чтобы понять основной принцип.
1. Берем лист бумаги (любого формата) и рисуем на нем часть будущего принта. Постарайтесь заполнить большую его часть, при этом не касаясь краев.
2.Теперь лист нужно очень аккуратно разрезать на четыре части. Сдвиньте фрагменты по диагонали (так, чтобы левый нижний оказался вверху справа, левый верхний — внизу справа и т.д.) и очень аккуратно соедините с изнанки скотчем. Чем незаметнее будут швы, тем меньше времени придется тратить потом на доработку изображения.
3.Заполните изображением образовавшуюся пустоту.
На этом бумажная часть работы заканчивается. На основе этого паттерна уже можно сделать, например, трафарет. Впрочем, практика показывает, что идеально разрезать и склеить фрагменты не получается, так что лучше довести рисунок до ума в графическом редакторе.
4. Отсканируйте изображение и попробуйте вручную соединить несколько копий, оставляя между ними зазор в один пиксель.
Вы наверняка обнаружите, что во многих местах стыки заметны. Исправьте недостатки, работая только с основным, центральным фрагментом, и после этого удалите все лишние копии.
5. Все готово к тому, чтобы использовать ваш рисунок для создания паттерна. Переходите к пункту № 5 в инструкциях ниже!
Photoshop
Совсем не обязательно уметь рисовать — тем более на бумаге.— чтобы создать паттерн. Вполне можно обойтись красивыми кистями для графического редактора. Показываем, как это сделать, и рассказываем о всех этапах создания цифрового паттерна.
1. Создайте пустой документ небольшого размера с длиной сторон, пропорциональной двум.
Файл → Создать
2. Заполните любым узором пространство в центре листа. Важно оставить пространство по краям листа; в любом случае нужно следить, чтобы узор не касался его краев.
3. В эксперименте с бумагой нам пришлось вручную разрезать лист и склеивать его снова. В Photoshop это делается одним нажатием кнопки, с помощью инструмента Сдвиг/Offset.
Фильтры → Другое → Сдвиг
Go to Filter → Other → Offset
Значение сдвига сделайте равным половине ширины/высоты вашего изображения. Отметьте пункт «Вставить отсеченные фрагменты».
4. Заполните пустоту, продолжая следить, чтобы рисунок не выходил за края изображения.
5. Сохраните изображение как паттерн.
Редактирование → Определить узор.
Edit → Define Pattern
6. Теперь паттерном можно заполнять любую выбранную область, просто используйте инструмент Заливка (G) и в его настройках вместо «Основной цвет» выберите «Узор».
Заливка, Узор
Paint Bucket Tool, Pattern
Gimp
Gimp — открытый аналог Photoshop, который можно скачать совершенно бесплатно. Для профессиональных нужд его используют не часто, но он вполне заменит продукт Adobe, если вам нужно подкрутить резкость на фотографии или — создать паттерн.
1. Создайте новое изображение. Мы уже знаем, что длина и ширина его должны быть пропорциональны двум.
2. Создайте в центре листа рисунок.
3. Для того, чтобы разрезать и склеить изображение, воспользуемся инструментом Смещение.
Слои → Преобразования → Сместить
Layer → Transform → Offset
В отличие от Photoshop, здесь не обязательно в уме делить размеры изображения на два, достаточно нажать на кнопку под полями ввода значений. Не забудьте отметить пункт «Залить изображением»/Wrap around.
4. Дорисуйте недостающие фрагменты паттерна.
5. Сохраните изображение как паттерн.
Правка → Вставить как → Новая текстура
Edit → Paste as → New pattern
6. Заполните паттерном лист любого размера, используя инструмент Плоская заливка/Busket fill (Shift + B) и выбрав в меню Цвет заливки/Fill type опцию Текстурой/Pattern fill.
P. S. Для чего мне уметь создавать паттерны, можете спросить вы? Для того, чтобы создать уникальный трафарет для декора стен, упаковать рождественские подарки в бумагу с именами одариваемых, сделать на заказ подушку с принтом мечты, которую все не удавалось найти в продаже.![]()
Создаем паттерн в Фотошопе
Паттерн, регулярный узор, бесшовный фон… Называйте, как хотите, но смысл один – заполнение фона (сайта, документа) повторяющимися элементами, между которыми нет видимой границы или перехода.
В этом уроке будет рассказано о том, как сделать узор в Фотошопе.
Скачать последнюю версию Photoshop
Здесь рассказывать особенно нечего, поэтому сразу приступаем к практике.
Создаем документ с размерами 512х512 пикселей.
Далее необходимо разыскать (нарисовать?) однотипные элементы для нашего паттерна. Тематика нашего сайта компьютерная, поэтому я подобрал такие:
Берем один из элементов и помещаем в рабочую область Фотошопа на наш документ.
Затем перемещаем элемент на границу холста и дублируем его (СTRL+J).
Теперь идем в меню «Фильтр – Другое – Сдвиг».![]()
Смещаем объект на 512 пикселей вправо.
Для удобства выделим оба слоя с зажатой клавишей CTRL и поместим их в группу (CTRL+G).
Помещаем новый объект на холст и перемещаем к верхней границе документа. Дублируем.
Снова идем в меню «Фильтр – Другое – Сдвиг» и перемещаем объект на 512 пикселей вниз.
Таким же способом помещаем и обрабатываем другие объекты.
Осталось лишь заполнить центральную область холста. Я мудрить не буду, а помещу один большой объект.
Паттерн готов. Если требуется его использование в качестве фона веб страницы, то просто сохраняем в формате JPEG или PNG.
Если же планируется заливать паттерном фон документа в Фотошопе, то нужно сделать еще пару шагов.
Шаг первый – уменьшаем размер изображения (если требуется) до 100х100 пикселей.
Затем идем в меню «Редактирование – Определить узор».
Даем имя узору и нажимаем ОК.
Давайте посмотрим, как будет выглядеть наш паттерн на холсте.
Создаем новый документ с любыми размерами. Затем нажимаем сочетание клавиш SHIFT+F5. В настройках выбираем «Регулярный» и ищем в списке созданный паттерн.
Нажимаем ОК и любуемся…
Вот такой несложный прием для создания паттернов в Фотошопе. У меня получился симметричный узор, Вы же можете располагать объекты на холсте хаотично, добиваясь более интересных эффектов. Мы рады, что смогли помочь Вам в решении проблемы. Опишите, что у вас не получилось. Наши специалисты постараются ответить максимально быстро.
Помогла ли вам эта статья?
ДА НЕТ
Бесшовный узор в Фотошоп
В этом уроке я собираюсь показать вам несколько способов, создания интересных узоров для рабочего стола.
Хорошо, начнем с создания нового документа, размером 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 Illustrator и признаюсь это суперское решение делающее все легко и изящно.
Спасибо тебе Летточка что поделилась:) Вот только одно но, у меня Иллюстратор 5-тый, а посему паттерноделки у меня просто нету:( Еще не найдя этой статьи от Летты я попробовала делать паттерны в Фотошопе с помощью смарт-объектов. Вот хочу поделится что у меня получилось, может кому ни будь будет полезно. Итак по порядку: 1. Создаю файл размером скажем 5000х5000. Поцентру задаю фигуру квадрат на 4000х4000 это мой будущий паттерн. Дальше к краям квадрата ставлю направляющие (при включенной привязке к обектам). Фон выключаю — теперь фон у меня прозрачний. Это файл — заготовка который послужит основой для всех будущих моих паттернов. Называю файл скажем pattern_1 и сохраняю. 2. В меню файл выбираю — открыть как смарт-объект — открываю этот же файл и сохраняю, называя скажем pattern_1_3х3. Название условно, я назвала так, просто чтобы было понятно, что этот файл состоит как бы из 9 квадратов первоначального паттерна. В палитре слои будет находится смарт-объект файла pattern_1. 3. Теперь файл pattern_1_3х3 расширяю по размерам с помощью инструмента рамка (crop) до размера 12000х12000 (мне нужно уместить в него те 9 квадратов первоначального паттерна).
Первый у меня уже есть, он по центру — остальные копирую и выравниваю для точного совпадения — это важно для того чтоб паттерн был бесшовным. Слой с первым смарт-объектом — первым белим квадратом — перемещаю поверх всех слоев.
4. На данном этапе у меня в Фотошопе открыты два файла pattern_1 и pattern_1_3х3 с которыми мне нужно работать одновременно. Для удобства я иду в панель окно — упорядочить- расположить две вертикально. Оба файла я открываю себе так, чтобы было видно белый квадрат, направляющие и чуть-чуть пространства вокруг.
5. Дальше первым делом в файле pattern_1 выключаю слой с белим квадратом — дальше мне он будет только мешать — и на прозрачное пространство между направляющими вставляю элементы будущего паттерна (они у меня все в PNG а в настройках Фотошопа стоит галка вставлять как смарт-объекты (это чтобы все элементы не теряли качества при роботе с ними) Теперь размещаю элементы как мне нравится и сохраняю файл pattern_1. 6. Дальше открытый рядом файл pattern_1_3х3 обновляется и мы получаем полностью составленный паттерн.
Пока что он с прозрачным фоном поэтому нужно в файле pattern_1_3х3 ниже всех слоев разместить квадрат 4000х4000 нужного цвета — наш фон. Корректируйте ваш pattern_1 пока это нужно и каждий раз сохраняйте после коррекции, и не забывайте сохранять файл pattern_1_3х3 после каждого обновления(на всякий случай). 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.
Прелесть работы со смарт-объектами в том, что все погрешности паттерна вы изменяете в файле pattern_1 и сохранив вы увидите как это выглядит в залитом паттерне в pattern_1_3х3 по сути в режиме реального времени.
Для меня этот способ оказался довольно удобным. Может и кому то из вас пригодится. 🙂
Как создать паттерн в фотошопе
Главная » Разное » Как создать паттерн в фотошопе
Как сделать паттерн
Что такое паттерн и с чем его едят.
Как его создать в фотошопе и чем паттерн отличается от текстуры? В этой статье я расскажу не только об их отличиях, но и покажу простейшие приемы создания паттернов и текстур для фотошопа. Постоянно встречаются уроки, в рамках которых нужно создать из куска графики рабочий паттерн. Но, невозможно во всех уроках писать главу о том, что это такое и как его создавать. Чтобы разом ответить на все эти вопросы, я решил написать этот краткий урок, на который буду всегда ссылаться.
Чем паттерн отличается от текстуры
Что такое текстура, думаю объяснять не нужно. Википедия отвечает на этот вопрос так:
Текстура — изображение, состоящее из более или менее близких по восприятию элементов.
Беспроигрышный вариант создания текстуры — это сфотографировать её самому, или найти/купить изображение в Интернете. Подробнее этот вопрос я освещал в статье Как подобрать текстуру в Фотошопе.
Термины «текстура» и «паттерн» между собой постоянно путаются. Паттерн называют текстурой, а текстуру паттерном.
Но разобраться в разнице между ними очень просто. Паттерн тоже является в некоторой степени текстурой. Но в отличии от текстуры, паттерн может повторяться, и повторяясь он складывается в единые неделимые текстурные «обои».
Изображение текстуры всегда имеет определенный размер. Паттерн же чаще всего является небольшим кусочком графики, который дублируясь «натягивается» на изображение или объект любого размера.
Как это происходит?
Предположим у вас есть изображение текстуры и Объект, определенного размера, на который надо эту текстуру натянуть. Изображение текстуры меньше объекта, и единственный способ натянуть её на объект — увеличить в размере, потеряв в качестве.
Использовать текстуру как паттерн не получится, так как её швы не сходятся друг с другом. Придется такую текстуру либо увеличивать, либо вручную работать с масками и слоями, чтобы полностью натянуть на объект.
Паттерн, в отличии от куска текстуры, устроен так, что его края сходятся друг с другом, образуя непрерывное полотно.
Как сделать паттерн?
Паттерн делается очень просто. Достаточно выделить инструментами выделения любой участок изображения и открыть 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 секунд!
Создаем детальный бесшовный паттерн в Adobe Photoshop
Большего всего я люблю делать современные бесшовные паттерны, но я как раз являюсь тем человеком, который совсем не силен в математике и всяческих точных расчетах, которые нужны при создании паттерна. Поэтому я придумала довольно безболезненный способ, который не потребует каких-то сложных шагов.
1.Набросок паттерна
Шаг 1.
Для начала сделайте немного зарисовок, чтобы решить, какие именно элементы будут располагаться на рисунке. Веточки и цветы, кстати, это всегда хорошая идея для паттерна, так как они имеют естественную витиеватую форму, которая позволит заполнить пустующее пространство. Они будут в тему почти в любой иллюстрации.
Шаг 2.
Начните рисовать паттерн спонтанно. Серьезно, просто «отпустите» себя, ведь нам сгодится даже сырой черновик, совсем не обязательно чтобы работа выглядела круто — сейчас мы пытаемся задать ритм для маленькой части иллюстрации. Вы можете сделать наброски, которые перерастут в цельный большой рисунок, либо мелкие скетчи – это не важно. В дальнейшем мы все равно их объединим.
Шаг 3.
Если ваш скетч уже доведен до ума и вы хотите приступить непосредственно к созданию паттерна, то отсканируйте ваш рисунок с разрешением примерно 300 dpi.
Чтобы дать самому себе пространство для творчества, создайте новый файл в AdobePhotoshop размера как минимум 5 000 х 5 000 px.
Вы всегда сможете изменить размер в настройках, если чувствуете что пространства слишком много. Но вы не сможете масштабировать растровое изображение, а это как раз самая худшая вещь в мире – сделать красивый аккуратный паттерн и понять, что он слишком мал для использования.
Шаг 4.
Если ваш скетч после сканирования вычищен, то его уже можно использовать как отправную точку для создания паттерна. Все что нужно – удалить задний белый фон и оставить на слое лишь ваш скетч.
Можно улучшить набросок, используя настройки Image > Adjustments > Levels. Передвиньте левый ползунок, чтобы выделить черный цвет, правый ползунок для регулировки белого, и напоследок поиграйте со средним ползунком, чтобы выровнять баланс рисунка.
После этого просто выделите белый фон с помощью инструмента MagicWandToolи удалите его. Если ваш скетч нарисован «грубо» и задний фон плохо удаляете, вы всегда можете использовать его как подложку и на новом чистом слое перерисовать контуры.
Просто поместите скетч на верхний слой и уменьшите значение Opacity, чтобы получился результат как на рисунке ниже.
2.Создание слоя с паттерном
Шаг 1.
Нет четкого правила о том, сколько иллюстраций вы должны нарисовать для создания паттерна, но чем больше уникальных элементов вы внесете в рисунок, тем богаче и насыщеннее будет смотреться ваш паттерн. Но не перестарайтесь – дикое разнообразие объектов перегрузит работу и сделает ее беспорядочной.
Помните, что один и тот же элемент в паттерне можно использовать несколько раз, всего лишь модифицировав его с помощью функций Edit>Transform>Rotate,Scale, илиFlip. Когда вы добавляете новый фрагмент скетча для своего будущего паттерна, удобнее всего делать его другим цветом, чтобы при финальной обработке было легче рисовать.
Шаг 2.
Поиграйте с различными элементами и свяжите их вместе, чтобы сделать один сплошной участок рисунка.
Форма этого участка не важна, но будет лучше, если совместить элемента компактнее.
На данном этапе лучше работать с одним цветов – больше цветов и оттенков мы добавим позднее, когда убедимся что паттерн дублируется правильно. Если мы начнем покраску до того, как сделаем состыковку, мы вынуждены будем вернуться на исходную позицию и перекрашивать буквально каждый слой с неправильным цветом (поверьте моему горькому болезненному опыту!). Зато вы можете установить цвет фона и контура вашей работы как вам больше нравится, это совсем ни на что не влияет.
Шаг 3.
Когда участок рисунка для паттерна продуман до конца и дорисован, вам нужно сделать его копию. Для этого нужно использовать клавиши Ctrl+J и перенести рисунок с одной стороны на другую. Здесь очень важным моментом является то, что копировать наш участок на новый слой нужно строго по прямой линии, без смещений, а сделать это можно зажав клавишу Shift перед началом горизонтального переноса.
Поместите новый слой на маленьком расстоянии от оригинального слоя с паттерном и оставьте достаточно расстояния, чтобы дорисовать связывающие элементы между двумя участками.
Шаг 4.
Вернитесь к слою с первоначальным паттерном и продолжите прорисовку своей иллюстрации к новым границам. Будьте осторожны и не делайте края рисунка слишком плотно прилегающими друг к другу – поддерживайте равномерный поток.
Если вы чувствуете, что вам не хватает пространства между частями паттерна или наоборот, его слишком много, переместите части вперед или назад, пользуясь все той же зажатой клавишей Shift.
Шаг 5.
Когда вы завершите дорисовку между частями паттерна, деактивируйте главный слой и сделайте новую копию оригинального паттерна используя клавиши Ctrl+J. На этот раз используйте Shift для перетягивания нового слоя вверх или вниз.
Если вы чувствуете, что размер будущего паттерна превышает размер холста – изменить его можно в настройках Image>CanvasSize.
Шаг 6.
Вернитесь к слою с оригинальным паттерном и теперь наращивайте рисунок уже к верхним границам. Стремиться надо к бесшовному стыку обоих частей.![]()
И после этого, ура! Мы почти закончили! Основная работа проделана, общий вид паттерна уже ясен и хорошо проглядывается. Удалите второй главный набросок и приступайте к тестированию паттерна.
3.Тестируем повторение рисунка
Шаг 1.
Скопируйте весь паттерн в новый файл (Control-A> Control-C > Control-N>Control-V), чтобы без помех протестировать его там. Размер файла и рисунка нужно выставить в районе 1 000 мегапикселей. При этом пострадает качество изображения, но сейчас это не важно, ведь мы просто тестируем нашу работу. Убедитесь еще раз, что используете копию иллюстрации, а не часть основного файла.
Далее с помощью инструмента выделения выберите справа участок, занимающий примерно 1/5 рисунка, а затем с помощью удержанного Shift перетащите его на крайнюю левую сторону.
Будьте осторожны и не отпускайте выделенный участок, пока не будете удовлетворены результатом. Также вы можете использовать клавиши со стрелками, что перемещать его влево и вправо до тех пор, пока не будут удовлетворены результатом.
С помощью клавиш Ctrl+D повторите тоже самое, но уже с вертикальной частью рисунка – выберите часть снизу и переместите на верхний край иллюстрации. И все! Теперь у вас красивый паттерн!
Шаг 2.
Перетащите вспомогательные линейки Guides, чтобы они располагались вокруг всего нашего паттерна, и нам было легко выделить его полностью с помощью RectangularMarqueeTool. Затем нажмите на Edit>DefinePattern, назовите новый паттерн и сохраните его.
Шаг 3.
Создайте новый файл, который будет больше вашего паттерна как минимум в три или четыре раза. Заполните его нажав PaintBucketTool и заменив заливку на ваш паттерн в выпадающего меню (поменяйте ‘Foreground’ на ‘Pattern’ и в конце будет как раз наш шаблон). Посмотрите на результат, есть ли там нечеткие края, довольны ли вы внешним видом своей работы.
Шаг 4.
Если вы заметили неточности (а они бывают почти всегда), то запомните на каком участке они находились и вернитесь к нашему самому первому файлу, чтобы исправить их.
Вполне возможно, что вы будете еще не раз возвращаться к изменениям, ведь всегда хочется достичь наилучшего результата.
То, что вы пытаетесь достичь, это своего рода «упорядоченное разнообразие» — проследите за тем, чтобы отдельные элементы паттерна не выделялись слишком сильно, не были огромными или наоборот, еле заметными. Возможно на маленьком кусочке все смотрится гармонично, но при повторении нашего образца ошибки становятся очень заметными. Уделите больше времени не деталям, а текущей форме рисунка.
4.Добавление цвета
Шаг 1.
Теперь вы готовы добавить цвет к паттерну! Самый простой способ – воспользоваться функцией ColorOverlays.
Для каждого цвета, который вы захотите использовать, придется создавать новый слой и уже на нем устанавливать нужный нам эффект (внизу панели слоев выберите FX, затем ColorOverlay и установите свой цвет). Если пользоваться таким методом, то всегда будет понятно на каком слое работаешь, а также не нужно будет перекрашивать паттерн кистью вручную, так как настройки слоя сделают это автоматически.![]()
Вы можете использовать столько цветов, сколько захочется, но стоит помнить, что при размножении паттерна буйство красок будет только мешать глазам, поэтому я всегда советую брать от 4 до 8 цветов для иллюстрации. Если вы работаете с «твердыми» формами, то ваш основной слой будет внизу, а цветовой над ним. Если вы работаете с контурами, то цветовой слой будет находиться снизу.
Шаг 2.
До того как перейдете к покраске вашего паттерна, кликните по нему зажав клавишу Ctrlи затем нажмите Ctrl-H, чтобы спрятать мигающую прерывистую линию – так при покраске она не будет вам отвлекать. Также можно не волноваться о том, что вы зайдете на контуры рисунка при покраске, так как цвет все равно будет находится под выбранной областью.
Правда, такой способ хорош, если вы работаете с формами, а не с контурами. При использовании последних, как это сделала я, вы можете заполнить их цветом сразу же, создав прочную базу (Ctrl-J, чтобы сделать копию слоя контуров для последующей заливки).
Шаг 3.
Когда вы закончите с добавлением цвета, вы заметите, что цвет контуров в некоторых частях рисунка мог потеряться или ослабеть. К счастью, это легко можно исправить на основном слое ( Ctrl-клик по миниатюре слоя на панели слоев), нажав Select>Modify>Contract, поставив значение «1» и далее ОК.
Данный процесс выделяет рисунок в окружности 1 пикселя. Теперь остается только нажать Ctrl+Shift+Iчтобы инвентировать нашу выделенную область и Delete. Получится к итоге, что по краям контура исчезнет раздражающий неровный край.
5.Последние штрихи
Шаг 1.
Теперь ваша работа действительно закончена, и вы можете протестировать ее, снова сложив в повторяющийся узор, а затем загрузить на определенные сайты для продажи или выслать вашим клиентам.
Как уже говорилось ранее, самый простой способ это сделать – воспользоваться направляющими Guides и линейками (их можно активировать в настройках View>Rulers).
Точное их расположение не важно, на моем рисунке вы видите, где примерно я их поставила. Выберите часть паттерна, которая находится слева от направляющей и перенесите ее на правую часть рисунка с помощью зажатой клавиши Shift.
Шаг 2.
После того, как вы достигли ожидаемого результата, воспользуйтесь Zoom, чтобы приблизить рисунок действительно очень близко и выставить направляющие вплотную к краям паттерна, вплоть до пикселя.
Повторите это действие на всех слоях с цветом, и выбранные для перемещения области будут ровно передвигаться по направляющим в нужное место.
После этого воспользуйтесь Zoom рисунок еще раз, чтобы убедиться, что не осталось маленьких ошибок или неровностей на краях, которые впоследствии принесут лишь головную боль. Если все хорошо, то повторите действия и для вертикальной части рисунка.
И в конце мы должны провести финальный тест, который покажет что паттерн повторяется идеально.
Шаг 3.
Кстати, в таком многослойном файле как мы сделали, легко менять цветовую палитру паттерна.
Нужно нажать на эффект Overlay и выбрать любой другой цвет из ColorPalette– можно наблюдать в режиме реального времени как меняется рисунок с новым выбранным оттенком!
Мы закончили!
Разве не получилось легче, чем вы думали?
Если мы хотите отправит свой паттерн для печати или загрузить на оплачиваемые сайты, то лучше сохранить его в форматах PNG,JPGилиTIFF. Но убедитесь, что вы также сохранили PSD файлы, с которыми работали все это время. Созданный файл должен быть закончен и уже готов к трафаретной печати, что, безусловно, является большим плюсом для покупателей. Но вы все равно можете вернуться к своим наработкам и легко что-то подправить.
Что же, надеюсь, вам понравился весь процесс создания бесшовного паттерна. Как видите, здесь бояться совершенно нечего! Большинство молодых энтузиастов быстро отказываются от идеи паттернов, так как их легче всего делать, но сколько же веселья в этом процессе! Особенно когда в результате получаешь шикарный бесшовный оригинальный паттерн.
Не могу дождаться ваших работ! Что вышло у вас?
Как сделать бесшовный узор в Photoshop — Brendan Williams Creative
В Photoshop вы можете создать бесшовный узор, чтобы использовать его в качестве границы изображения, заполнить форму или просто использовать отдельно. В первый раз, когда я подумал о создании повторяющегося узора, я вообразил, что это будет намного сложнее, чем было на самом деле. Однако с помощью нескольких основных параметров фильтра и правильного размера холста вы можете создать повторяющийся узор в Photoshop всего за несколько минут!
Чтобы создать новый узор в Photoshop, выберите «Правка» > «Определить узор» и дайте узору имя в появившемся диалоговом окне. Затем нажмите OK, чтобы сохранить новый узор, который можно найти в настройках заливки узором или в стилях слоя.
Теперь с помощью этих шагов будет создан базовый шаблон, но он не будет иметь плавного перехода, поскольку шаблон повторяется. Чтобы это произошло, вам нужно использовать определенный размер холста и использовать некоторые основные фильтры, чтобы выполнить работу.
Позвольте мне показать вам, что именно вам нужно сделать!
Видеоруководство
Оптимальный размер и разрешение холста для узоров
Чтобы создать узор, вы должны сначала сделать его основу, состоящую из простых элементов и форм, которые можно повторять для создания полного узора.
Для достижения наилучших результатов вам нужно начать с холста нужного размера. В конечном итоге вы будете повторять шаблон и перемещать элементы с помощью функции смещения, для простоты которой требуется холст квадратной формы. Квадратная форма позволит повторяющемуся узору плавно стыковаться друг с другом, не обрезая узор неуклюже. Использование прямоугольного холста не позволит правильно совместить рисунок и создаст перекрывающиеся формы.
По этой причине я рекомендую холст размером 400x400px или 500x500px с разрешением, достаточно высоким для ваших нужд (если вы печатаете, вам понадобится более высокое разрешение, чем если бы вы отображали конечный результат в цифровом виде). я бы предложил 300PPI (пикселей на дюйм), если вы не уверены, какое разрешение выбрать.
Чтобы задать правильные размеры документа, нажмите Создать новый после открытия Photoshop, выберите Файл > Новый или нажмите Control + N (Win) или Command + N (Mac).
В появившемся окне вы можете редактировать размер и разрешение вашего документа в панели справа. Введите необходимые размеры, главное, чтобы ширина и высота были одинаковыми, а размер холста позволял вам достаточно места для создания выкройки. Вы также можете настроить разрешение здесь, если это необходимо.
Как создать бесшовный узор в Photoshop
Во-первых, вам нужно создать формы и элементы, из которых должен состоять ваш узор.
Это область, которая будет повторяться, чтобы сформировать полный шаблон. Для этого вы можете использовать различные элементы, включая различные формы, мазки и цвета. Ниже вы увидите шаблон, который я создал.
Сделайте все, что вы чувствуете в этот момент, но убедитесь, что каждый элемент имеет свой собственный слой, чтобы вы могли легко вернуться и отредактировать различные элементы вашего шаблона, если это необходимо. Например, если вы посмотрите на мою панель «Слои», вы увидите множество эллипсов, так как каждый элемент находится на своем слое.
Как сделать бесшовный узор
Теперь, когда вы дважды проверили, что все различные элементы вашего узора — фон, формы и т. д. — соответствуют вашим требованиям, мы собираемся продублировать и объединить их всех в один.
Исходные слои останутся на случай, если понадобится их отредактировать, но мы добавим еще один слой, состоящий из всех объединенных элементов. Это слой, который мы будем повторять, чтобы составить общий узор.![]()
Чтобы объединить слои, перейдите на Layers и Shift + щелкните все слои, чтобы они все были выбраны. При выборе они станут светло-серыми.
Теперь щелкните правой кнопкой мыши (Win) или щелкните, удерживая клавишу Control (Mac), на выбранных слоях и выберите «Дублировать слои» из доступных вариантов. Нажмите OK в появившемся окне.
Копии слоев появятся на панели Layers и будут выбраны автоматически. Не щелкая, чтобы отменить их выбор, щелкните правой кнопкой мыши (Win) или Control + клик (Mac) копирует выбранный слой и выбирает Merge Layers .
После объединения слоев вы заметите, что на панели Layers появился новый слой, содержащий все элементы и слои вашего проекта.
Другой способ объединить слои — использовать сочетание клавиш Control + Alt + Shift + E (Win) или Command + Option + Shift + E (Mac) после того, как вы выбрали все слои.
Этот ярлык одновременно дублирует и объединяет все различные элементы в один слой.
Очень важно продублировать все слои перед их объединением, так как это позволит вам вернуться и внести любые коррективы в отдельные элементы вашего проекта. В противном случае все слои сольются в один, и вы больше не сможете получать доступ к различным элементам и редактировать их.
Теперь пришло время сделать узор бесшовным. Выбрав этот объединенный слой, перейдите к Filter > Other > Offset.
Величина смещения должна составлять половину размеров холста. Например, поскольку размер моего холста составляет 400 × 400, моя величина смещения будет равна 9.0005 +200 для настроек по горизонтали и по вертикали.
Затем в разделе Undefined Areas обязательно выберите Wrap Around . После выбора настроек нажмите OK .
Вы заметите, что это приведет к смещению различных элементов узора. Это гарантирует, что после повторения основы вашего узора различные элементы будут сочетаться друг с другом таким образом, что они будут выглядеть бесшовно.
Это может привести к тому, что созданный вами шаблон будет выглядеть немного по-другому, но как только шаблон повторится, он снова будет выглядеть как ваш первоначальный дизайн шаблона.
Имейте в виду, что этот процесс может оставить некоторые пробелы в вашем шаблоне (часто в центре квадрата). Наличие больших пустых пространств может выглядеть странно, если шаблон повторяется. На этом этапе вы можете захотеть добавить элементы в те области вашего шаблона, в которых ничего не происходит, чтобы шаблон выглядел лучше после его сборки.
Как создать новый пресет шаблона в Photoshop
Когда вы будете довольны тем, как выглядит ваш шаблон, вы можете сохранить его, чтобы иметь доступ к шаблону на более позднем этапе и использовать его в качестве элемента дизайна. Для этого убедитесь, что шаблон выбран, перейдя к пункту 9.0005 Выбрать > Все .
Затем перейдите к Edit > Define Pattern.
Когда откроется окно, назовите свой шаблон и нажмите OK.
Теперь у вас есть полный шаблон, к которому вы можете получить доступ, когда захотите использовать его для заполнения элемента проекта. Далее мы рассмотрим несколько различных способов использования нового шаблона при работе в Photoshop.
Использование пользовательского шаблона
Существует несколько способов использования шаблона: от заполнения фигур до использования в качестве рамки для фигуры или изображения. Давайте посмотрим на наш паттерн в действии, заполнив фигуру паттерном.
Заливка фигуры узором
Сначала я создал новый документ и добавил новую фигуру, выбрав инструмент Shape .
Чтобы заполнить эту форму созданным вами узором, перейдите на панель Options , щелкните область Fill и на появившейся панели щелкните значок Patterns в крайнем правом углу.
Здесь вы увидите шаблон, который вы сделали, под категориями форм по умолчанию.
Нажмите на узор, чтобы заполнить им фигуру.
Поначалу ваш узор может выглядеть не так, как вы думали. Выше мой узор кажется настолько увеличенным, что вы не можете увидеть настоящий узор. К счастью, вы можете изменить способ отображения узора на фигуре, используя настройки Масштаб и Угол в нижней части панели.
Опция масштабирования определяет, сколько раз узор повторяется в фигуре. Изменение масштаба паттерна со 100% до 23% приведет к более частому повторению паттерна. Поскольку шаблон был создан бесшовным, не имеет значения, какой масштаб вы используете.
Вы также можете настроить параметр Angle , чтобы повернуть рисунок. Играйте с этими настройками, пока не будете довольны тем, как выглядит ваш узор.
Добавить узор в виде контура
Вы также можете добавить узор к обводке фигуры, чтобы создать границу. Для этого добавьте нужную форму в новый документ. После того, как вы добавили фигуру, вы сможете найти настройки обводки на панели параметров .
Сначала я бы посоветовал увеличить ширину обводки, хотя бы временно, чтобы вы могли увидеть узор в действии. Для этого щелкните стрелку раскрывающегося списка рядом с настройкой ширины и сдвиньте вправо, чтобы увеличить ширину.
Затем вы можете добавить узор к обводке, щелкнув поле рядом с Обводка .
В появившейся панели щелкните значок узоров справа. Здесь вы увидите свой шаблон под различными категориями шаблонов.
После выбора узора он будет применен к обводке в качестве границы.
Опять же, вы можете отредактировать Масштаб и Угол узора в нижней части панели, чтобы изменить внешний вид формы внутри обводки.
Другой способ использования вашего нового пресета шаблона — в стилях слоя в качестве наложения шаблона. Это полезно, когда вы хотите заполнить текст, слои или выделения узором, а не редактируемым слоем формы. Чтобы получить доступ к стилям слоя, просто дважды щелкните слой и примените нужные эффекты!
Удачного редактирования!
Как быстро создать узор в Photoshop
Photoshop поставляется с множеством готовых узоров, которые можно использовать в качестве свойства заливки.
Также нет недостатка в шаблонах, доступных для скачивания в Интернете. Что, если вы хотите сделать свой собственный шаблон? В сегодняшнем уроке мы рассмотрим, как создать шаблон в Photoshop, используя свой собственный дизайн или другой объект по вашему выбору.
Чтобы создать шаблон в Photoshop, нам сначала нужно определить наш дизайн как шаблон. Затем мы сможем использовать его как свойство заполнения.
Что еще более важно, нам понадобится дизайн, который мы сможем превратить в узор. И его нужно будет спроектировать таким образом, чтобы его можно было повторять плавно и бесконечно — все это мы рассмотрим в этом уроке. Давайте начнем!
Создание узора в Photoshop
Следующее видеоруководство проведет вас через весь процесс создания цветного узора в горошек в Photoshop, а затем его использования в качестве плитки бесшовного узора:
Ниже приводится краткий обзор предпринятых шагов. в обучающем видео. Пожалуйста, посмотрите видео для полных инструкций.
СодержаниеСоздание шаблона
Работа с узорами
|
Создание узора
Давайте сначала посмотрим, как сделать узор в Photoshop, а затем мы рассмотрим все детали работы с вашим узором дальше.
Шаг 1: Создайте новый документ размером 600×600
В этом уроке мы будем создавать наш собственный узор.
Для этого рекомендуется открыть новый документ и установить его размер 600 x 600 пикселей :
Мы также хотим убедиться, что у нас включена привязка к .
Наконец, добавьте на холст вертикальную и горизонтальную направляющую — обе на 50% .
Если вы не знаете, как это сделать, обратитесь к видеоинструкции выше.
Шаг 2: Создание узора
В этой части урока мы будем создавать узор. Дизайн будет представлять собой единую квадратную плитку с узором, которую можно повторять бесконечно, и она будет состоять из разноцветных точек в горошек. Для этого нам нужно будет тщательно расположить элементы дизайна.
Для фона рисунка выбран фиолетовый цвет, а большой желтый круг расположен прямо в центре страницы:Следуйте видеоруководству, чтобы узнать, как сделать этот узор в горошек.
Включив привязку и направляющие на холсте, вы сможете разместить круг прямо в центре.![]()
Затем в каждом углу документа будут размещены четыре одинаковых четверти круга. Это делает так, что вы можете складывать копии этого квадратного дизайна сверху, снизу и по бокам друг от друга, и это создаст бесшовный, повторяющийся узор.
Обратитесь к видеоруководству, чтобы получить пошаговые инструкции по созданию этого дизайна.
Шаг 3: Сведите изображение и выберите параметр «Определить узор».
Нам потребуется свести все изображение, чтобы создать узор в Photoshop из этого рисунка. Сведение возьмет все отдельные слои и объединит их в один.
Причина, по которой нам необходимо это сделать, заключается в том, как работает функция Define Pattern . При выборе узор будет определяться либо включенным выделением, либо текущим активным слоем, если выделения нет.
Мы хотим, чтобы все слоев были включены в узор, поэтому мы должны сгладить изображение. Для этого просто щелкните правой кнопкой мыши любой слой и выберите Flatten Image , но делайте это только после того, как закончите с дизайном и будете готовы определить его как шаблон.
Теперь, когда изображение сведено, все, что нам нужно сделать, чтобы превратить его в узор, — это просто перейти к:
Правка > Определить узор
Затем вам будет предложено указать имя для узора: Выберите имя для вашего узора.
Введите любое имя и нажмите OK .
Забавный факт: это также можно использовать для установки сторонних шаблонов в Photoshop! Так, например, если у вас есть плитка узора, которую вы загрузили из другого места, все, что вам нужно сделать, чтобы использовать ее в качестве узора в Photoshop, — это вставить ее как новое изображение и использовать функцию Определить узор .
Шаг 4. Проверьте новый узор, применив его в качестве свойства заливки
Теперь пришло время протестировать только что созданный узор!
Всякий раз, когда вы создаете шаблон в Photoshop, он будет проиндексирован в меню Patterns : В меню Patterns будет ваш вновь созданный шаблон, готовый к использованию.
Все, что вам нужно сделать сейчас, чтобы использовать его, это просто щелкнуть и перетащить его на выделение, и он будет применен в качестве заливки: Как выглядит шаблон после использования в качестве свойства заливки.
Если у вас в данный момент не включено выделение, весь слой будет заполнен, как в моем примере выше.
Работа с узорами
Теперь, когда мы рассмотрели, как создать узор в Photoshop, давайте рассмотрим некоторые способы управления этим узором (а также другими узорами).
Как сделать Переименуйте свой шаблон
Создавая свой шаблон, возможно, вы в спешке оставили имя по умолчанию и теперь хотите его изменить. Без проблем!
Чтобы изменить имя вашего шаблона, найдите его в меню Patterns , щелкните его правой кнопкой мыши и выберите Переименовать . Затем вам будет предложено выбрать новое имя для вашего шаблона.
Как удалить шаблон
Не нравится созданный шаблон? Хотите избавиться от него, чтобы навести порядок в индексе и освободить место для более красивых шаблонов? Тоже не проблема!
Чтобы удалить узор в Photoshop, найдите его в меню Patterns , щелкните его правой кнопкой мыши и выберите Удалить .
Вас спросят, уверены ли вы, что хотите удалить его, и после подтверждения он исчезнет из вашей жизни навсегда.
Создание новых групп узоров
При просмотре меню «Узоры» вы можете заметить, что все стандартные узоры аккуратно организованы в папки или группы.
Всякий раз, когда вы создаете узор в Photoshop, он как бы парит в пространстве. Чтобы создать новую группу/подпапку для своего шаблона, щелкните значок маленькой папки в левом нижнем углу меню Patterns . Затем вам будет предложено выбрать имя для вашей новой группы. Назовите это как хотите.
Теперь группа станет активной, и все, что вам нужно сделать, чтобы добавить в нее свой узор, — это просто щелкнуть и перетащить его поверх папки группы: Для этого дизайна узора была создана группа узоров под названием «Пользовательский».
Как и в случае с отдельными паттернами, вы можете переименовывать и удалять группы паттернов так же, как и отдельные паттерны.
Заключение
Не позволяйте сложности программного обеспечения пугать вас — знание того, как создать шаблон в Photoshop, — это относительно простой процесс, который можно выполнить за несколько кликов.
Как мы уже говорили в этом уроке, самой сложной частью является создание самого дизайна узора. Однако, когда это не так, это всего лишь вопрос нескольких кликов.
Независимо от того, разрабатываете ли вы свои собственные шаблоны или импортируете сторонний элемент дизайна для использования в качестве шаблона, рабочий процесс, который мы рассмотрели в этом уроке, должен подойти.
Если у вас есть какие-либо вопросы или вам нужны разъяснения по поводу того, что мы рассмотрели в этом уроке, просто оставьте комментарий ниже.
Станьте мастером Adobe Illustrator! Хотите узнать больше о том, как работает Adobe Illustrator? посмотри мой Серия объяснений Illustrator — обширная коллекция из более чем 100 видеороликов , в которых я рассказываю о каждом инструменте, функции и функции и объясняю, что это такое, как оно работает и почему оно полезно. |
Этот пост может содержать партнерские ссылки. Прочитайте информацию об аффилированных лицах здесь.
Как создать бесшовный узор в Photoshop с предварительным просмотром узора — CatCoq
В этом уроке вы узнаете, как создать бесшовный или повторяющийся узор в Photoshop с помощью инструмента предварительного просмотра узора. Инструмент предварительного просмотра узоров полностью изменил правила создания узоров в Photoshop, поэтому я очень рад поделиться им с вами!
Во-первых, позвольте мне дать вам краткое изложение того, как работают бесшовные шаблоны. Бесшовный узор — это блок художественного произведения, который можно повторять бесконечно без каких-либо видимых швов или разрывов. Золотое правило повторяющихся шаблонов заключается в том, что все, что обрезается на одной стороне блока шаблона, должно быть повторено на другой стороне, чтобы шаблон можно было повторить бесшовно.
До предварительного просмотра шаблона вам приходилось вручную вычислять это каждый раз, когда вы перемещали элемент за пределы холста.
Теперь Photoshop позволяет нам упорядочить наш блок паттерна и посмотреть, как будет выглядеть полный паттерн в режиме реального времени.
Прежде чем погрузиться в этот урок, убедитесь, что вы оцифровали элементы, которые хотите превратить в узор, и подготовили их так, чтобы они находились каждый на своем слое. Если вы не знаете, как это сделать, ознакомьтесь с этими полезными записями в блоге, которые помогут вам начать работу:
Как оцифровать аналоговое изображение
Удаление бумажного фона в Photoshop
Есть много , которые идут на создание бесшовного узора. Я хочу максимально упростить процесс, но я понимаю, что это может показаться сложным, когда вы впервые учитесь этому. Если вы больше визуальный ученик и хотите увидеть, как процесс работает шаг за шагом, ознакомьтесь с моим курсом «Акварель и бесшовный узор: дизайн поверхности в Adobe Photoshop ».![]()
Этот курс представляет собой подробное руководство по всему процессу создания бесшовных моделей, который я использую как профессиональный дизайнер поверхностей. Я настоятельно рекомендую ознакомиться с ним, чтобы получить более глубокое представление о бесшовных узорах в Photoshop. И если вы новичок в Skillshare, вы можете использовать эту ссылку , чтобы получить бесплатную пробную версию, чтобы вы могли проверить этот класс и тысячи других!
Смотреть класс
Для начала вам понадобятся несколько элементов, из которых вы сможете составить узор. В моем примере я буду использовать некоторые акварельные элементы цитрусовых, которые я нарисовал, отсканировал и оцифровал. Если вы собираетесь работать с окрашенными элементами, важно сначала удалить фон из белой бумаги. Если вы хотите узнать, как это сделать, перейдите к этому руководству 9.0005 , прежде чем начать свой бесшовный шаблон.
Учебное пособие проведет вас через мой пошаговый процесс удаления фона на ваших иллюстрациях в Photoshop.
Теперь давайте углубимся в изучение того, как использовать инструмент предварительного просмотра узора!
Начните с открытия квадратного холста в Photoshop. Я всегда использую холст размером 12 000 x 12 000 пикселей для своих блоков шаблонов, потому что мне нужна гибкость для их использования на больших продуктах. Но это действительно огромный размер холста, поэтому, если вы просто практикуетесь или не хотите использовать свои шаблоны на крупномасштабных продуктах, вы можете использовать меньший размер. Просто убедитесь, что это идеальный квадрат!
Теперь вы можете объединить элементы, которые вы будете располагать, в бесшовный узор. Убедитесь, что фон белой бумаги удален и что все элементы находятся на своем собственном слое.
Если вы не изолировали каждый элемент на отдельном слое, вы можете сделать это, выбрав инструмент «Лассо» (сочетание клавиш : L ).
Мне нравится использовать для этого Polygonal Lasso . Выберите каждый элемент своим лассо, вырежьте его с помощью сочетания клавиш cmd + X и вставьте его на место с помощью сочетания клавиш cmd + shift + V . Это вставит элемент точно туда, где он был раньше, но на своем собственном слое!
Последнее, что вам нужно сделать для подготовки ваших элементов, это сделать каждый из них смарт-объектом. Смарт-объект — это, по сути, расширенная версия того, что находится на этом слое. Это дает вам больше гибкости с неразрушающим редактированием. Но все, что вам действительно нужно знать, это то, что Pattern Preview работает только со смарт-объектами.
Чтобы превратить каждый элемент в смарт-объект, выберите слой, щелкните меню слоя, наведите указатель мыши на смарт-объект и нажмите «Преобразовать в смарт-объект».
Вы сможете подтвердить, что это смарт-объект, проверив наличие небольшого прямоугольника на миниатюре слоя.
Это способ Photoshop указать, что это смарт-объект.
После того, как вы превратили все свои элементы в смарт-объекты, не забудьте нажать «Сохранить», прежде чем переходить к следующему шагу!
Теперь, когда все ваши элементы находятся на отдельном слое и превращены в смарт-объекты, ваш квадратный холст должен выглядеть примерно так.
В моем примере все элементы узора уложены друг на друга в углу, но пока это совершенно нормально. Мы собираемся сложить их в узор!
Затем убедитесь, что автовыбор включен. Это позволит вам автоматически выбирать элемент при нажатии на него. Используйте сочетание клавиш : v , чтобы выбрать инструмент перемещения. Оттуда проверьте в верхнем левом углу и убедитесь, что установлен флажок рядом с «Автоматический выбор».
Теперь пора начинать аранжировку! Включите предварительный просмотр узора, щелкнув меню «Вид» и выбрав «Предварительный просмотр узора».
Если вы уменьшите масштаб, вы увидите, что он уже дублирует элементы и показывает, как будет выглядеть узор.
Чтобы начать размещение блока шаблона, убедитесь, что выбран инструмент перемещения, и начните перемещать элементы один за другим!
В моем примере вы можете видеть, что часть цветка, срезанная в верхней части блока, автоматически повторяется внизу. Это магия предварительного просмотра шаблонов!
Вот несколько быстрых советов по расположению элементов. Когда я работаю над бесшовными узорами, я всегда начинаю с размещения самых больших элементов, затем перехожу к средним элементам и заканчиваю добавлением меньших элементов в промежуточных областях.
Цель бесшовного узора состоит в том, чтобы все изображение выглядело плавным. Вы не должны видеть, где он начинается и заканчивается, и вы не хотите, чтобы ваши элементы выглядели слишком повторяющимися.
Чтобы бороться с этим, я использую одни и те же элементы несколько раз, но поворачиваю их, переворачиваю или изменяю их размер, чтобы они не были слишком похожи.
Выберите элемент, который вы хотите дублировать, и используйте сочетание клавиш : cmd + j , чтобы скопировать элемент и вставить его на новый слой. Это не будет выглядеть так, как будто что-то произошло, но вы сможете увидеть на панели слоев, что у вас есть дубликат этого слоя.
Новый элемент находится прямо поверх старого, поэтому разделите их, выбрав инструмент перемещения, щелкнув элемент и перетащив его на новое место в блоке шаблона.
Поворот и изменение размера Если вы хотите повернуть или изменить размер элемента, используйте сочетание клавиш : t , чтобы получить инструмент преобразования.
Это выталкивает ограничивающую рамку вокруг элемента. Отсюда вы поворачиваете элемент или захватываете углы ограничивающей рамки, чтобы изменить ее размер.
Отразив элементы, можно немного разнообразить узор. Чтобы перевернуть элемент, убедитесь, что он выбран, затем щелкните его правой кнопкой мыши и выберите «отразить по горизонтали» или «отразить по вертикали» в зависимости от того, как вы хотите его преобразовать.
Когда у вас есть блок шаблона в хорошем месте, я рекомендую уменьшить масштаб, чтобы получить более крупное изображение и посмотреть, есть ли какие-либо части шаблона, которые могли бы быть немного более плавными. В моем примере было несколько пробелов в шаблоне, которые я увидел, когда уменьшил масштаб. Я закончил тем, что заполнил их другими элементами, чтобы узор казался более сплоченным.
Если вы когда-нибудь отключите предварительный просмотр узора, вы увидите, что некоторые «обрезанные» элементы отсутствуют.
Не волнуйся! Вы не потеряли ни одной своей работы. Повторяющиеся элементы видны только в режиме просмотра узора. Когда вы снова включите его, эти элементы снова появятся.
Надеюсь, вам понравилось это пошаговое руководство по инструменту просмотра шаблонов! Этот инструмент изменил правила игры в моем рабочем процессе, и я надеюсь, что он изменится и для вас!
Этот урок лишь поверхностно описывает процесс создания выкройки. Если вы хотите научиться создавать профессиональные бесшовные узоры из нарисованных вручную рисунков, я бы хотел, чтобы вы присоединились ко мне на моем курсе «Акварель и бесшовный узор: дизайн поверхности в Adobe Photoshop 9».0006 .
На этом занятии вы узнаете:
Как рисовать элементы с учетом бесшовного узора
Как оцифровывать окрашенные элементы
Советы по созданию узоров, которые будут хорошо продаваться
3
3
3 Как настроить цвет узоров в Photoshop
Как добавить металлические акценты к узорам в Photoshop
Загрузка узоров для печати на таких сайтах, как Society6, Spoonflower и Redbubble
И еще множество советов и хитростей!
И самое приятное? Новые участники Skillshare могут получить бесплатную пробную версию, чтобы посмотреть этот класс и тысячи других на Skillshare с по этой ссылке ! Надеюсь увидеть вас на уроке!
Записаться в класс
Ресурсы для художников, Учебники по искусству, Учебники по PhotoshopCatCoq
