Не всегда можно найти уже готовые текстуры нужных материалов для 3ds max. Часто дизайнерам приходится создавать их самостоятельно. Например, из фотографий, предоставленных заказчиком. В данном уроке рассмотрим, как своими руками сделать бесшовную текстуру в Photoshop.
Открываем исходное изображение в Фотошопе. У нас фотография кусочка кирпичной кладки.
Для 3d текстур нужно брать квадратное изображение. Это облегчит в будущем работу с текстурой при ее наложении на объект. Подогнать исходную картинку можно через редактирование размера холста. Изображение → Размер холста → Новый размер, Ширина, Высота.
Переходим во вкладкуФильтр → Другое → Сдвиг.В появившемся окне вводим значения, равные примерно половине размера картинки. Жмем ОК. Теперь швы находятся посередине изображения, левый и правый край текстуры автоматически сходятся.
Выделяем места стыков. Жмем Shift+F5. В появившемся окне выбираем «С учетом содержимого». Жмем ОК.
Дорабатываем штампом или заплаткой некрасивые участки. Мы будем работать Штампом при помощи Alt+ЛКМ.
Следует кропотливо обработать все места швов. Особое внимание обращаем на ритмично повторяющиеся объекты (пятна, сучки). Чем их больше, тем более искусственно будет выглядеть текстура при наложении. Следовательно, удаляем их по возможности.
Сохраняем нашу квадратную картинку. Проверяем, чтобы стоял правильный цветовой режим (Изображение → Режим → RGB).
Теперь вы знаете как самостоятельно сделать текстуру без швов в программе Фотошоп. Можете еще посмотреть полезный ролик на эту тему:
В этом руководстве мы с вами научимся создавать свои собственные текстуры в программе Adobe Photoshop. Потом их можно использовать для оформления фона веб сайтов, в качестве текстур для 3D графики и т.д.
Но тут есть некоторые "подводные камни", которые делают создание текстур несколько сложным. Дело в том, когда для создания текстур используются фигуры, то тут сложно сгладить места их состыковки друг с другом. А если будет видна нестыковка, то качество текстуры будет не самое лучшее.
В этом руководстве мы попытаемся решить эту проблему.
Для начала создайте в Photoshop"е новый документ размером 100x100px. Выберите кисточку (В) на ваше усмотрение и нарисуйте подобное этому:
А сейчас нарисованную фигуру преобразуем в узор командой Edit > Define Pattern... и назовем ее "texture". Переходим к команде Image > Canvas size и задаем новый размер 400x400px.
Заполним весь наш холст новым узором, используя Edit > Fill...
Получиться должно следующее:
Как видите, узоры между собой не полностью состыковываются. Поэтому и не получается полноценная текстура. А хотелось бы:)
Эта проблема решается использованием фильтра Offset (Сдвиг). Этот фильтр перемещает изображение на указанное количество пикселей. В данном случае изображение перемещается внутри контура, в то время как сам контур остается на своем прежнем месте.
Эффект действия фильтра Offset напоминает вставку изображения в контур с последующим перемещением.
Поэтому переходим к команде Image > Canvas size и опять задаем значение 100x100px. Потом заливаем картинку нашим узором Edit > Fill...
Вызовем фильтр Offset используя Filter > Other > Offset с такими параметрами:
Как видите, горизонтальные и вертикальные пиксели переместились почти на половину рисунка:
Теперь осталось лишь соединить края "оборванных" линий, используя ту же кисточку, которой мы их рисовали. Так что выбирайте инструмент Кисточка (В) и соедините линии в одно целое:
А сейчас снова примените фильтр Offset (Ctrl+F).
Если вы занимаетесь веб-дизайном, 3D моделированием или другим творчеством, связанным с 3D max или Photoshop, то вам периодически требуются качественные бесшовные текстуры и фоны. Найти нужную текстуру или фон в сети порой бывает очень не просто, поэтому решением данной проблемы может послужить вариант сделать бесшовную текстуру (фон) самостоятельно. При этом, вы сами сможете сделать текстуру нужного вам качества и оттенка.
Давайте самостоятельно создадим бесшовную текстуру (фон) в программе фотошоп. И так, главной особенностью бесшовной текстуры (фона) является отсутствие границ, т.е. взяв данную текстуру и соединяя ее с копией с любой стороны мы в итоге получим бесшовное изображение, без каких либо разделений и границ. В качестве примера посмотрите картинку ниже, где справа расположена текстурка камня, а слева несколько данных текстур соединены.
Подобное бесшовное изображение, будь то текстура или фон, можно достаточно легко сделать в программе Photoshop с помощью специального плагина. Сейчас мы все это в подробностях рассмотрим.
Для начала работы нам потребуется сам фон или текстура который(ую) мы и будем “превращать” в бесшовный(ую). Естественно, что качество нашей будущей бесшовной текстуры или фона будет напрямую зависеть от качества исходного изображения или фото. Допустим, вам необходимо сделать бесшовную текстуру асфальта, в таком случае вам потребуется фото данного асфальта и чем качественнее данное фото будет, тем качественнее получится бесшовная текстура. Вы можете найти нужное вам изображение в интернете, либо сделать фото объекта самостоятельно, но фото должно быть качественным.
Возьмем, для примера фото асфальта, найденное в сети, фото специально подберем побольше размерами, чтобы текстура получилась высокого качества. В нашем случае размер фото составляет 1300 x 864px, чего будет достаточно.
Данная картинка (фото) не является бесшовным и это легко проверить состыковав данное изображение с копией. По итогу мы видим, что стыки (швы) на общей картине видны.
Принцип создания бесшовного изображения заключается в отражении краев (стыков), что в результате дает идеальное соединение изображения, тем самым создавая вид единой поверхности, а не разных кусков изображения. Для легкого и быстрого “превращения” фото (изображений) в бесшовные текстуры существует специальный плагин для фотошопа, который автоматически выполняет указанные выше функции (отражение и подгонка швов изображения).
Данный плагин разработан для фотошопа, начиная с CS3 и заканчивая последней на сегодняшний день версией CC. Плагин является бесплатным и скачать его можно с нашего сайта:
Скачайте плагин для вашей версии фотошоп и установите его. После установки плагина у вас в правой боковой панели программы фотошоп появится значок плагина:
Чтобы создать бесшовное изображение (текстуру) с помощью данного плагина необходимо открыть нужное изображение (фото) программой фотошоп и сделать данное изображение квадратным – это обязательное требование данного плагина. Т.е. открываете необходимое изображение фотошопом, выбираете инструмент “Прямоугольная область” в левой панели программы и с его помощью (удерживая левую клавишу мыши) выделяете квадратную область из любой части вашего изображения.
Для того, чтобы область выделялась правильным квадратом, а не прямоугольником, необходимо в ходе выделения нужной области, помимо левой кнопки мыши удерживать клавишу “Shift”.
После того, как нужная область выделена, выбираете в верхнем меню “Изображение” – “Кадрировать” и ваша выделенная область будет вырезана и обращена в квадратное изображение.
Теперь настало время воспользоваться “волшебным” плагином. При выделенном слое нашего квадратного изображения нажимаем на значок плагина и у нас открывается панелька.
В данной панельке мы указываем размер нашего изображения в пикселях (в нашем случае получилось 864px) и ставим галочку напротив “Difine Pattern”, после чего просто выбираем способ создания бесшовного изображения нажатием на кнопку “Tile” или “Mirror”. Если вы выберите способ “Tile”, то ваше бесшовное изображение будет создано именно из вашей картинки в полном ее размере. Если же выберите способ “Mirror”, то бесшовное изображение будет создано из 4-х ваших картинок, зеркально отраженных и уменьшенных под размер вашего квадрата. Вообщем просто попробуйте и все поймете сами.
Мы выбрали способ “Tile” и в результате получили текстуру высокого качества, размером 864 x 864 пикселя:
Бесшовную текстуру (фон) высокого качества, которою можно использовать в 3D max или фотошопе мы сделали, но давайте еще придадим ей необходимый нам оттенок. Допустим нам нужна текстура потрескавшегося асфальта не светло-серого цвета, а темно-красного. Для начала мы объединим получившиеся слои в одну картинку, а первоначальное изображение просто удалим за ненадобностью. В правой панели слоев удаляем самый нижний слой с нашим исходным изображением, чтобы оно не мешалось и преобразуем все получившиеся слои из которых состоит бесшовная текстура в одно изображение.
Для этого правой кнопкой мыши кликаем по папке “tile pattern” и выбираем в появившемся меню “Преобразовать в смарт-объект”. После данных действий все содержимое папки будет преобразовано в один слой изображения, с которым мы в дальнейшем и будем работать (менять ему цветовой тон).
Выделяем наш слой с бесшовным фоном, кликнув в панели слоев по нему левой кнопкой мыши и в нижнем меню, под панелькой слоев кликаем на значок коррекции и в появившемся меню выбираем “Цветовой тон/насыщенность”. После этого над нашим слоем с текстурой появится новый корректирующий слой и откроется окошко с настройками цветового тона и насыщенности. В данном окошке вы уже на свое усмотрение регулируете “ползунки” настроек цвета и тона, после чего применяете данные настройки.
Таким образом у вас получится бесшовная текстура с необходимым цветовым тоном. Остается сохранить данное изображение в высоком качестве, для этого в верхнем меню выбираем “Файл” – “Экспортировать” – “Сохранить для web” и в появившемся окне, в настройках качества выставляем 100%, после чего жмем кнопку “Сохранить”.
После данных манипуляций получилась качественная бесшовная текстура с необходимым нам оттенком. И теперь, если мы приложим копии изображения друг к другу, то убедимся, что получается бесшовный фон, стыков (швов) уже нет.
Создайте новый документ в Фотошопе (Ctrl + N) и сохраните его на компьютер (Ctrl + S). В процессе урока советую периодически сохранять документ, чтобы не потерять изменения.
Откройте панель Info (Window ? Info), чтобы все фигуры были точными. Выберите пиксели в качестве единицы измерения.
Выберите инструмент Rectangle Tool (U) создайте прямоугольник размером 164х235 пикселей цветом #808080 . Назовите слой «Glass upper».
Выберите инструмент Path Selection Tool и выделите прямоугольник. На каждом углу будет стоять якорная точка. Выберите инструмент Pen Tool (P) и одиночными кликом добавьте ещё 8 якорных точек. С их помощью мы изменим форму прямоугольника.
Для изменения формы прямоугольника используйте инструменты Convert Point Tool и Direct Selection Tool. Инструментом Convert Point Tool можно удлинить рычажки якорных точек, а инструментом Direct Selection Tool мы будем их передвигать и вращать.
Удалите две нижние угловые точки. Это поможет создать горлышко.
Создайте копию полученной формы (Ctrl + J), переверните её (Edit ? Transform ? Flip Vertical) и расположите, как показано ниже. Назовите нижнюю часть часов «Glass lower».
Откройте стили слоя «Glass lower» при помощи двойного клика. Примените стиль Gradient Overlay:
Кликните правой кнопкой мыши на слой «Glass lower» и выберите пункт Copy Layer Style, чтобы скопировать стиль. Затем кликните правой кнопкой мыши на слое «Glass upper» и выберите пункт Paste Layer Style. Откройте настройки стиля слоя «Glass upper» и включите инверсию.
Откройте параметры наложения слоя «Glass lower» и настройте всё, как показано на скриншоте. Fill Opacity повлияет только на содержимое слое, но не на стили. Сделайте то же самое для слоя «Glass upper».
Выберите оба слоя и перейдите в меню Layer ? New ? Groups from Layers. Назовите группу «Glass upr + lwr».
Создайте новый слой «Bg grd» над фоновым. Откройте стили нового слоя и настройте так:
Раскройте группу «Glass upr + lwr» и выделите слой «Glass upper» (удерживая Ctrl, кликните на миниатюре слоя). Сверните группу «Glass upr + lwr» и создайте новую над ней. Назовите её «Glass upr highlights + shadows». Внутри этой группы создайте новый слой «Glass upper shadow edge 1». Заполните выделение чёрным цветом.
Сожмите выделение на 2 пикселя (Select ? Modify ? Contract), а затем растушуйте (Select ? Modify ? Feather).
Нажмите Delete, чтобы удалить внутреннюю часть заливки, получив тёмные края. Уменьшите непрозрачность слоя до 30%.
Выделите слой «Glass upper», создайте новый слой «Glass upper shadow edge 2» над слоем «Glass upper shadow edge 1». Сожмите выделение на 6 пикселей.
Перейдите в меню Select ? Transform Selection и удлините выделение.
Заполните выделение чёрным цветом. Затем сожмите его на 4 пикселя и нажмите Delete. Примените фильтр Gaussian Blur (Filter ? Blur ? Gaussian Blur) с радиусом 2 пикселя. Уменьшите непрозрачность до 20%.
Добавьте маску к слою «Glass upper shadow edge 1», выберите мягкую кисть с 50% непрозрачностью и на маске закрасьте верхний край часов и горлышко.
К слою «Glass upper shadow edge 2» тоже добавьте маску и закрасьте её, как показано на скриншоте.
Добавьте маску к слою «Glass upper» и закрасьте узкую часть.
Сделайте то же самое для слоя «Glass lower».
Создайте новый слой «Glass highlight upr sides» над слоем «Glass upper shadow edge 2». Создайте свечения таким же образом, как мы создавали тени. Поэкспериментируйте с контрастностью и размытием. Как закончите, добавьте маску и сотрите свечение с верхнего края и внизу. Уменьшите непрозрачность до 30%.
Над слоем «Glass highlight upr sides» нарисуйте фигуру, показанную ниже, инструментом Pen Tool (P). Растрируйте фигуру через контекстное меню слоя и примените фильтр размытия. Добавьте маску и мягкой кистью с 50% непрозрачностью смягчите правый край. Уменьшите непрозрачность до 70%.
Подобным образом создайте свечение на правой стороне. Уменьшите непрозрачность слоя до 70%.
Выделите слой «Glass upper», создайте новый слой «Glass upr right edge up» над слоем «Glass highlight upr right». Заполните выделение белым цветом. Опустите выделение на несколько пикселей и нажмите Delete.
Добавьте маску и скройте часть свечения сверху. Уменьшите непрозрачность до 70%.
Создайте новый слой «Glass upr highlight mid» над предыдущим, выберите мягкую кисть размером 30 пикселей и нарисуйте белую вертикальную линию. Активируйте режим деформации (Edit ? Transform ? Warp) и сведите нижние точки, чтобы заострить нижнюю часть полоски.
Добавьте маску и уменьшите яркость центрального свечения внизу. Уменьшите непрозрачность слоя до 10%.
Создайте новый слой «Glass upr edge highlight left» и сделайте то же самое, что и на слое «Glass upr right edge up». Непрозрачность слоя - 50%.
Повторите то же самое на правой стороне. Слой «Glass upr left edge up».
Выберите инструмент Pen Tool (P) и нарисуйте две чёрные кривые фигуры. Уменьшите их непрозрачность до 30%. Назовите слои «Glass joint shadow upr right» и «Glass joint shadow upr left».
Далее мы создадим 3 маленькие фигуры в области горлышка. Они должны быть первыми тремя слоями в группе «Glass upr highlights + shadows». Создайте их над последним слоем, который мы создали, а затем опустить вниз.
Инструментом Pen Tool (P) нарисуйте центральную фигуру, показанную ниже. Назовите слой «Glass joint mid shadow» и уменьшите непрозрачность до 40%.
Откройте панель Paths (Window ? Paths). Убедитесь в том, что контур выбран и на верхней панели выберите Combine Shapes.
Добавьте ещё две фигуры на этот же слой. Как закончите рисование, растрируйте слой и примените фильтр Gaussian Blur со значением 2-3 пикселя. Уменьшите непрозрачность слоя до 40%.
Создайте две белые фигуры на горлышке.
Примените фильтр Gaussian Blur и уменьшите непрозрачность слоя до 50%.
Мы закончили с верхней стеклянной частью песочных часов.
Создайте копию группы «Glass upr highlights + shadows» и назовите её «Glass lwr highlights + shadows». Опустите копию под оригинальную группу. Переверните содержимое группы (Edit ? Transform ? Flip Vertical) и расположите, как показано на скриншоте.
Раскройте группу «Glass lwr highlights + shadows» и удалите три фигуры, отмеченные на скриншоте.
Создайте новую группу «Base upr + lwr» под группой «Glass upr + lwr». Создайте изогнутый прямоугольник и узкий овал. Для искривления используйте инструменты Direct Selection Tool и Convert Anchor Point Tool. Назовите слои «Base upr large surface» и «Base upr large side».
Создайте копии обеих фигур и назовите их «Base upr small surface» и «Base upr small side». Опустите копии под оригинальные слои.
К слою «Base upr large side» примените следующие стили:
Градиент для слоя «Base upr large surface»:
Скопируйте стили слоя «Base upr large side» на «Base upr small side" layer», а затем со слоя «Base upr large surface» на «Base upr small surface».
Создайте копии четырёх слоёв, которые мы создали, переверните их и переименуйте. В именах слоёв измените «upr» на «lwr».
Создайте новый слой «Base upr large side highlight» над слоем «Base lwr large side». Выделите слой «Base upr large side» и мягкой кистью белого цвета с 50% непрозрачностью нарисуйте свечения на слое «Base upr large side highlight». Уменьшите непрозрачность слоя до 70%.
Создайте новый слой «Base edge highlight upr large» над предыдущим и создайте свечения на краях. Сделайте это таким же способом, каким мы создавали свечения на краях стекла.
Добавьте маску и скройте часть свечения на краях мягкой кистью с 50% непрозрачностью. Уменьшите непрозрачность слоя до 50%.
Создайте новый слой «Base upr large side shadow» на самом верху. Нарисуйте тени на верхнем крае той же мягкой кистью. Уменьшите непрозрачность слоя до 70%.
Создайте новый слой «Base edge highlight upr small» и нарисуйте свечения на нижнем крае.
Добавьте маску и мягкой кистью с 50% непрозрачностью скройте некоторые участки. Уменьшите непрозрачность слоя до 50%.
Подобным образом добавьте свечения на нижнюю часть часов. Но теперь не нужно будет создавать слои с тенью как «Base upr large side shadow».
Создайте новую группу «Stands» над группой «Base upr + lwr». Внутри новой группы создайте два прямоугольника цветом #4c4c4c размером 17х491 пиксель. Назовите слои «Stand left» и «Stand right».
К слою «Stand left» примените следующие стили:
Скопируйте стили слоя «Stand left» на слой «Stand right» и измените градиент:
Результат:
Над слоем «Stand right» создайте слой «Stands left + right highlights», выберите мягкую кисть с 50% непрозрачностью белого цвета. Выделите слои «Stand» и добавьте свет на них. Уменьшите непрозрачность слоя со светом до 50% и установите режим наложения Overlay.
Теперь мы нарисуем тени. Создайте новый слой «Stand shadows ver» и той же кистью нарисуйте тени чёрным цветом. Уменьшите непрозрачность слоя до 70% и установите режим наложения Multiply.
Создайте ещё один слой для теней - «Stand shadows». Нарисуйте тени, как показано на скриншоте.
Теперь нужно создать песок. Создайте новую группу «Sand» над группой «Stands». Песок будет состоять из 4 слоёв:
Слои «Top», «Upper» и «Lower» были нарисованы при помощи инструмента Pen Tool (P). Падающий песок мы нарисуем при помощи кисти брызг размером 59 пикселей. Выберите её в списке кистей и настройте, как показано на скриншотах:
Создайте новый слой «Sand lower» и залейте его цветом #b7864d . Установите цвета #c79e73 и #b7864d на панели инструментов. Примените фильтр шума (Filter ? Noise ? Add Noise). Создайте три копии слоя «Sand lower» и назовите их «Sand falling», «Sand upper» и «Sand top».
Выделите нижнюю часть песка и к слою «Sand lower» добавьте маску.
Сделайте то же самое для двух верхних слоёв песка.
Добавьте маску к слою «Sand falling» и залейте её чёрным цветом.
Выберите кисть брызг и белым цветом на маске верните падающий песок.
Выделите маску слоя «Sand falling» и создайте корректирующий слой Levels. Переименуйте его в «sand falling bright».
Выделите маску слоя «Sand top», созадйте новый слой «Sand top shadow» и мягкой кистью с 50% непрозрачностью цветом #463f3c затемните песок сверху. Уменьшите непрозрачность слоя до 30%.
Выделите слой «Sand upper», создайте новый слой «Sand shadow side» и той же кистью нарисуйте тень в верхней части песка. Уменьшите непрозрачность слоя до 20%. Не убирайте выделение.
Создайте новый слой «Sand upr highlight» и мягкой кистью с 50% непрозрачностью белым цветом закрасьте часть песка возле горлышка. Уменьшите непрозрачность слоя до 30%.
В завершение, мы создадим деревянную текстуру. Создайте новую группу «Wood texture» над группой «Sand». Внутри создайте новый слой «Base upr + lwr surface fibers». Залейте его цветом #dfbc9c . Установите цвета #724c27 и #dfbc9c и примените фильтр Fibers (Filter ? Render ? Fibers). Затем примените фильтр Unsharp Mask (Filter ? Sharpen ? Unsharp Mask).
Измените размер текстуры, создайте копию и назовите её «Fibers overlay».
В группе «Base upr + lwr» выделите слой «Base upr large surface». Затем добавьте к выделению слои «Base upr small surface» и «Base lwr large surface». Исключите из выделения слои «Stand left» и «Stand right» из группы «Stands».
Вернитесь к слою «Base upr + lwr surface fibers» и добавьте маску к нему. Уменьшите непрозрачность слоя до 10%.
Создайте выделение из слоёв «Base upr large side», «Base upr small side», «Base lwr large side», «Base lwr small side», «Stand left» и «Stand right». Перейдите на слой «Fibers overlay» и добавьте маску. Уменьшите непрозрачность слоя до 10% и установите режим наложения Overlay.
Создайте копию слоя «Fibers Overlay» и назовите её «Fibers Multiply». Измените режим наложения копии на Multiply.
Осталось создать тень от часов, чтобы они не парили в воздухе. Создайте новую группу «Shadow» над группой «Bg grd». Выделите слой «Base lwr large surface» из группы «Base upr + lwr». Создайте новый слой «Base shadow area» внутри группы «Shadow». Залейте выделение чёрным цветом. Создайте копию овала и переименуйте её в «Base shadow contact».
Перейдите на слой «Base shadow area» и примените фильтр Gaussian Blur (Filter ? Blur ? Gaussian Blur). Затем примените фильтр Motion Blur (Filter ? Blur ? Motion Blur).
К слою «Base shadow contact» примените фильтр Gaussian Blur.
Сдвиньте слой «Base shadow contact» на несколько пикселей вниз.
Переведено с сайта www.photoshoptutorials.ws , автор перевода указан в начале урока.
