Делаем шапку блога на blogger в photoshop: часть 2

В своём предыдущем посте о шапке блога на blogger мы познакомились с тем, как загрузить собственную шапку в блог, как получить нужный размер изображения для шапки, а также мы научились закруглять края прямоугольного изображения. По такому же принципу, как мы закругляли края, сегодня мы научимся, как вырезать в Photoshop более сложные объекты и накладывать их на фон, задавая разные эффекты. Кроме того, мы научимся работать с текстами, которые также нужны в шапке блога.
Для примера я решила сделать шапку блога на сайт о гаданиях (не пинайте ногами, уважаемые дизайнеры, я только учусь, и передаю знания моим читателям):

Вот такая интересная штука получается. Следуйте шагам, которые описаны ниже, и я уверена, у вас получится ничуть не хуже, и даже лучше. На самом деле, всё довольно просто.
А пока вы не перешли к чтению, предлагаю прочесть ещё один очень полезный материал: «Как привязать домен к Blogger» (откроется в новом окне).

Содержание

Как вырезать в Photoshop сложные объекты для шапки блога на blogger
Красивый текст в Photoshop для шапки блога на blogger
Эффекты Photoshop для шапки блога на Blogger

Как вырезать в Photoshop сложные объекты для шапки блога на blogger

Принцип всё тот же, как при закруглении углов прямоугольника, только вместо инструмента «прямоугольник» мы будем создавать произвольный контур, преобразовывать его в выделенную область и вырезать нужный нам объект. Кстати, если у вас не установлен фотошоп, то можно воспользоваться онлайн фотошопом сервиса Webmasta. Он компактный и быстро подгружается. Найти его можно на левой панели сайта в блоке «Другие инструменты». Итак, начнём.

Выбираем изображение, из которого нужно вырезать какой-то объект. В нашем случае — это кошачья мордочка и девушка.
Ctrl+O (или меню файл — открыть), и открываем нужное изображение + фон, который мы сделали в предыдущем уроке.
Подгоняем размеры нашего изображения под сделанный нами фон. Для этого: Alt+ctrl+I, выбираем в открывшемся окне (в блоке «размерность») пикселы и задаём нужные размеры. Смотрите, чтобы высота и ширина не превышала аналогичные размеры шапки. О том, как их определить, я рассказывала в предыдущем посте.
Если справа не отображается панель слоёв, нажимаем F7 на клавиатуре.
Разблокируем слой, чтобы производить над ним изменения:
Делаем активным инструмент
Небольшими шажками начинаем обводить контур нашего кота:
Полностью замкните контур, кликнув по начальной точке курсором.
После того как контур замкнётся, все маркеры исчезнут и появится сплошная замкнутая линия. Внутри контура кликнем правой кнопкой мыши и выберем в контекстном меню «Образовать выделенную область».
Выберем в окне «Радиус растушевки» равным 2 пикс. ОК.
Скопируем котёнка Ctrl+c, затем перенесём его на наш фон, сделав активным файл с этим фоном (он у нас уже открыт, нужно только кликнуть по вкладке вверху) и кликаем ctrl+v.
Наш первый герой перемещён. Чтобы поместить его в нужном месте фона, нужно сделать активным новый слой, который появился в файле с фоном. Для этого кликнем по нужному слою. Затем выберем инструмент и, кликнув правой кнопкой по коту (удерживая её), перетащим его в нужное место.

То же самое было проделано и с девушкой (которая слева на шапке блога). Теперь вы знаете, как вырезать в Photoshop. Ближе к концу поста я расскажу, какие эффекты были применены к вырезанным изображениям. А сейчас перейдём к тексту.

Красивый текст в Photoshop для шапки блога на blogger

В том же файле, где и фон, напечатайте нужный текст. Для этого нужно выбрать инструмент «Текст» и в панели, появившейся сверху, задать нужные параметры (цвет шрифта, шрифт, начертание, величина и т.п.)
Затем кликните в нужном месте левой кнопкой мыши и напечатайте текст.
Обратите внимание, что появился новый слой на панели слоёв: текстовый. Дважды кликнем по нему на панели слоёв. В появившемся окне поставим галочку «Внешнее свечение» и зададим нужные параметры с помощью бегунков. То, как изменяется текст, можно увидеть в процессе редактирования. Поэтому сдвиньте окно так, чтобы был виден написанный вами текст. Я, к примеру, выбрала такие значения (но вы слепо не делайте так, как у меня, экспериментируйте):
Чтобы придать тексту объём, я использовала вот эти параметры:
Кликнем правой кнопкой мыши по слою с текстом на панели слоёв и выберем в контекстном меню «Растрировать текст».
Чтобы сделать эффект удаления (см. рисунок шапки блога на Blogger вверху), меню Редактирование — Трансформирование — Искажение:
В итоге вокруг текста появятся маркеры. Перетаскивая каждый из них, можно создать эффект удаления нашей надписи. Выберем какой нибудь инструмент на панели слева и в появившемся окне кликнем «Применить». Вот уже шапка блога на blogger обретает интересный вид. Идём далее.
Применим ещё один эффект — называется «Наложение градиента». Для этого дважды кликнем по слою на панели слоёв и в появившемся окне поставим галочку «Наложение градиента» и поэкспериментируем с разными настройками в этом окне.
Я не буду приводить фотографию текста, который уже есть в моей шапке. Приведу лучше другое изображение. Так вот что получилось после всех нехитрых махинаций:

Эффекты Photoshop для шапки блога на Blogger

Как и обещала, вернусь к тем эффектам, которые были применены к слоям (текстовому, и тем слоям, где находятся вырезанные изображения). Чтобы их применить, нужно дважды кликнуть по нужному слою, находящемуся в панели слоёв справа. Итак, все эффекты:

Внешнее свечение;
Тиснение (кстати, его можно использовать и непосредственно для нашего фона, чтобы придать ему некоторый объём);
Градиент
Тень (её мы не использовали, однако такая функция имеется)

Для эффекта отдаления : Редактирование — Трансформирование — Искажение. Причём можно использовать не только для текста.

На этом пока всё. Основные принципы мы с вами разобрали, теперь можете сделать лицо вашего блога на blogger краше с помощью Photoshop.

P.S. Подучите Фотошоп: в голодные времена пригодится 🙂 Нужно совсем немного навыков, чтобы начать зарабатывать, делая тизеры.