Реклама AdSense





Про то, как создать бесшовную текстуру в Photoshop

Июл 30, 2017 ~ 1 комментарий ~ Написал Влад

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

Этот вариант лучше всего подходит для бесшовной текстуры с повторяющимся текстом или картинкой.

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

Изначально я взял уже готовый логотип, который я создал для сайт. Файл в формате PSD, белый фон, три слоя с тестом. Т.к. слои не понадобятся, то сразу растрируем тест и объединяем слои (выделяем слои, правая кнопка мыши, выбираем «Растрировать» в выпадающем меню, точно так же объединяем слои (либо выделяем слои курсором при нажатой клавише Alt и затем нажимаем Ctrl+E)).

создать бесшовную текстуру

Исходный файл для создания текстуры

Теперь сдвигаем текстуру. Для этого заходим в меню «Фильтр/Другое/Сдвиг…». В появившемся окне выставляем значения равные половине стороны картинки. В моем случае картинка 400х400 пикселей, значит выставляем 200 и 200 пикселей (плюс или минус значения не имеет). И отмечаем «Вставить отсеченные фрагменты».

Сдвиг

создать бесшовную текстуру

Текстура в готовом виде

И это все! У вас готовая бесшовная текстура. Два варианта использования для моего случая:

  • Создать в Photoshop документ необходимого размера и вручную замостить его текстурами
  • Залить одну готовую текстуру непосредственно на сайт и замостить ей шапку с помощью css

Второй вариант предпочтительней.

создать бесшовную текстуру

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

Точно так же можно создать текстуру из картинки:

создать бесшовную текстуру

Исходный файл

создать бесшовную текстуру

Созданная текстура

создать бесшовную текстуру

Добавил к предыдущей картинке

Если созданная бесшовная текстура нужна для постоянного применения, то можно создать «узор». Для этого заходим в меню «Редактирование» и выбираем «Определить узор…».

В ближайшее время результат моей работы появится на сайте http://buyandtell.net.

Так что создать бесшовную текстуру в Photoshop не просто, а очень просто. Буду рад, если моя статья кому-нибудь поможет!

Опубликовано в Софт - Помечено Photoshop, бесшовная текстура
Twitter • Facebook • Delicious • StumbleUpon • E-Mail
←
→

1 комментарий

  1. Николай's Gravatar Николай
    31.07.2017 at 09:22 | Permalink

    Спасибо, пригодилось. )

    Reply
  •  

Добавить комментарий Отменить ответ

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Решите пример, чтобы ваш комментарий был отправлен на модерацию: * Лимит времени истёк. Пожалуйста, перезагрузите CAPTCHA.

Мета

  • Войти
  • RSS записей
  • RSS комментариев
  • WordPress.org

Архивы

  • Декабрь 2017
  • Октябрь 2017
  • Август 2017
  • Июль 2017
  • Июнь 2016
  • Февраль 2016
  • Январь 2016
  • Декабрь 2015
  • Ноябрь 2015
  • Сентябрь 2015
  • Август 2015
  • Июнь 2015
  • Апрель 2015
  • Март 2015
  • Февраль 2015
  • Декабрь 2014
  • Октябрь 2014
  • Сентябрь 2014
  • Август 2014
  • Июль 2014
  • Июнь 2014
  • Апрель 2014
  • Март 2014
  • Январь 2014
  • Декабрь 2013
  • Ноябрь 2013
  • Сентябрь 2013
  • Июль 2013
  • Июнь 2013
  • Май 2013
  • Март 2013
  • Февраль 2013
  • Январь 2013
  • Декабрь 2012
  • Ноябрь 2012
  • Октябрь 2012

Ссылки

  • BuyAndTell Обзоры Товаров из Интернет Магазинов
  • CtrlZeta — Белый шум
  • PixelBrush — лучший сайт, повященный графике и дизайну
  • Блог Юджина Кучерявого или как взять себя в руки и остановить понос лени

Метки

action Activision AliExpress Android Black Ops II Call of Duty Fonts Google AdSense LG Electronics Logitech microSD Montain Nikon Opera Orico Photoshop Samsung SSD Windows Алиэкспресс Андроид Заморский SALE Коврик для мыши Приват24 Приватбанк Терминатор Фотошоп Харьков апгрейд граффити железо игры кабель кино комплектующие компьютер мышка ноутбук обналичка чеков охлаждение распродажа скидки скидочные купоны смартфон юмор

Свежие комментарии

  • Влад к записи Граффити в Харькове. Часть 1
  • Константин к записи Граффити в Харькове. Часть 1
  • Isa к записи The Bat! — «Невозможно сохранить письмо»
  • faetonets к записи Кабель питания для подключения 4 жестких дисков SATA от фирмы Orico
  • Борис к записи The Bat! — «Невозможно сохранить письмо»

Свежие записи

  • С Новым 2018 годом!
  • The Bat! — «Невозможно сохранить письмо»
  • Cube Talk 9X (U65GT) — переразметка памяти с 2 до 8 Gb
  • Про то, как создать бесшовную текстуру в Photoshop
  • m545 — новая мышка от Logitech
  • KingDian SSD S200 Series 60Gb
  • Две карты microSD Suntrsi на 32 Gb
  • Замена разбитого корпуса Lenovo G570/575
  • С Новым годом!
  • Граффити в Харькове. Часть 5

Pure Line theme by Theme4Press  •  Powered by WordPress Nipponist  Ещё один словарный понос на WordPress