Из любопытства поискала по форуму уроки о том, как создавать бесшовные фоны для веб-страниц и... Была крайне удивлена: предлагается много способов, но все они намного сложнее и более трудоёмкие, чем тот, которым я сама давно пользуюсь и теперь хочу предложить вам.
Суть этого способа заключается в использовании фильтра «Сдвиг».
Этот фильтр находится в подменю фильтров «Другие». Перед тем, как мы начнём урок, советую ознакомиться с работой фильтра: откройте в фотошопе любую картинку и выберите Фильтр-Другие-Сдвиг. Поиграйте с ползунками. Посмотрите, что станет с картинкой, если в настройках фильтра выбран пункт «Вставить отсечённые фрагменты»! Это — именно то, что нам нужно. Фотошоп сам «достраивает» куски картинки, которые «выползают» за границы документа! тем самым проявляются такие ненавистные для нас стыки, когда картинка заполняет пространство веб-документа. вот от этих стыков мы и будем избавляться, причём просто и легко.
Этим способом вы можете сделать бесшовный фон из ЛЮБОЙ картинки, абсолютно из любой. Основное действие будет одно — применение фильтра сдвиг. Это действие я уже не буду подробно описывать, так что далее в уроке будет просто указано «примените фильтр Сдвиг».
Мы рассмотрим создание четырёх разных бесшовных фонов: 1) из любой картинки или фотки, которая вам нравится; 2) из картинки, похожей на бесшовную, но не бесшовной; 3) бесшовника с наклонными полосками; 4) текстового наклонного бесшовника.
Итак, начнём!
Первый фон у нас будет из фотографии.
Откройте в ФШ любую фотку, из которой вы хотите сделать бесшовный фон. Я взяла сделанную мной фотографию ландышей у меня в саду. Обязательно делаем копию слоя — нам понадобятся оба слоя, и исходный, и копия. И делаем невидимым верхнюю копию, будем пока работать с нижним. Вот что должно получиться у вас:
Переходим на фоновый слой и применяем фильтр Сдвиг так, чтобы стыки у нас вылезли примерно на середине картинки (настройки фильтра будут зависеть от размера выбранной вами картинки). Должно выглядеть приблизительно так:
А теперь избавляемся от стыков. Делайте это с помощью Штампа , Восстанавливающей кисти и Заплатки . Кое-где вам понадобится один инструмент, где-то все три, а может, два из указанных — комбинируйте. они дают неодинаковый результат, пробуйте разные. Для каждой фотки будут свои варианты. и не забывайте о настройках каждого инструмента! регулируйте прозрачность — это даст плавность переходов. Вот что получилось у меня.
Возвращаем видимость верхнему слою. У нас появится прежняя фотка, которая полностью закроет сдвинутое изображение. Добавим к слою маску и на этой маске чёрной мягкой кистью сотрём края. Вот что вышло у меня:
А теперь выполните сведение слоёв и вызовите окно настроек фильтра сдвиг. Подвигайте ползунки. Это делается для того, чтобы выявить, не осталось ли где стыков. Если да — подправьте их Штампом, Восстанавливающей или чем захотите. если нет — сохраняем картинку в jpg и в качестве проверки ставим ее на десктоп в режиме «замостить». Всё! Бесшовник готов! Можете проверить мои ландыши, поставить их как обои на ваш рабстол — эта картинка бесшовна. Так же она будет смотреться и на фоне любого вашего сайта. Вот она:
Поехали дальше. По списку второй фон мы сделаем из картинки однородной, но не бесшовной. Я взяла вот такую:
Проделываем почти те же самые операции, но - внимание - теперь копию слоя делать не нужно. Вы можете работать прямо на фоновом слое. Ну или сделайте копию, только чтобы сохранить исходник. Итак, применяем фильтр Сдвиг и проявляем стыки.
А теперь берём Восстанавливающую кисть и "заделываем" ею стыки!)) Будьте осторожны: у вас могут получиться "замазанные швы" на месте стыков, где явно будет видно - здесь что-то фотошопили. Доработайте эти места Штампом.
Бесшовник готов! (Я, правда, не очень старалась с этой картинкой, побрызгала крупным Штампом, получилось грубовато. Но вы, конечно, доработаете аккуратнее.)
Третьим по списку у нас идёт фон с полосками под наклоном. Это самый коварный фон, т.к. наклонные полоски так и норовят не совпасть, когда мы ставим фон на веб-страницу.
Создаём новый документ в фотошоп. Внимание: он должен быть строго КВАДРАТНЫЙ! Размер вы можете взять любой, 200х200, 500х500, какой захотите, главное -- квадрат. Цвета вы можете взять любые, я взяла белый фон и чёрный основной цвет (им мы будем рисовать). Итак, фон у нас белый.
Создаём новый слой. на этом слое делаем прямоугольное выделение любой ширины. И заливаем выделение чёрным.
Снимаем выделение и включаем Ctrl+T -- свободную трансформацию. Поворачиваем нашу чёрную полосу РОВНО на 45 градусов.
Растягиваем полосу так, чтобы углы тоже стали чёрными, и нажимаем Enter.
Теперь самая важная операция. Идём в Фильтр - Другие - Сдвиг и там выставляем ровно половинные значения от того, какой у вас ширины и высоты картинка. У меня была 300х300, поэтому получилось 150 и 150. Получаем вот что:
Копируем слой и нажимаем Ctrl+F (применяем последний фильтр с теми же значениями). Получаем вот что:
Сливаем все слои, сохраняем картинку в любой удобный для вас формат и... наслаждаемся!))) Мы только что создали бесшовный полосатый фон![/MORE]
Пояснение: цвета и ширина полос могут быть любыми. Единственное условие -- КВАДРАТНАЯ картинка и 45 ГРАДУСОВ наклона полосок.
И последним мы создадим фон с наклонным текстом (бродя по форуму, я нашла довольно-таки много просьб об уроках, как создать такие фоны).
Создаём документ любой ширины и высоты. Цвета у меня опять-таки чёрный и белый. Заливаем фон белым цветом, создаём новый слой и печатаем любой текст. Растрируем слой и поворачиваем текст на 45 градусов через Свободную Трансформацию. Текст передвигаем так, чтобы он был прямиком в углу картинки. Обрезаем документ инструментом Рамка прямо по краям текста (должна быть включена Привязка в меню Просмотр). Получается вот что:
А теперь дублируем слой и на дубликате применяем фильтр, где сдвигаем только ОДИН ползунок. Подберите такое значение, чтобы текст расположился более-менее равномерно. Вот и всё, бесшовный текстовый наклонный фон готов)))) Осталось только выполнить сведение слоёв и сохранить в любой удобный формат.
Вот мой результат.
Большое спасибо за внимание. Буду рада, если покажете свои результаты
Вроде бы как-бы и получилось. Не так классно. как у вас, но всё же. Одна проблема: вес новосохранённой картинки оказался в два раза больше и блог не хочет его принимать. Как избавиться от этого недостатка? Спасибо!
Дорогая Светлана, перед тем как сохранить картинку в изображении уменьшите размер картинки, и напишите пожалуйста какой вес картинки и размер на данный момент, и закиньте пожалуйста сюда вашу картинку, отвечу подробней.
Добавлять комментарии могут только зарегистрированные пользователи. [ Регистрация | Вход ]
