Рисуем шапку сайта для галереи

2

Рубрика : Немного о дизайне сайта

Здравствуйте уважаемые читатели моего персонального блога «Что нам стоит блог построить». Совсем недавно мне довелось делать сайт одному своему знакомому, сайт представляет из себя,  галерею рисунков выполненных в стиле карандашной графики. Собственно в данном посте я бы хотел описать, заодно пополнив рубрику «Немного о дизайне», то как я рисовал шапку для него, делал я её основываясь на другом уроке с Photoshop Мастер.ru, однако походу я всё равно делал по своему. А в данном уроке я её ещё раз переделаю

В общем если интересно читаем дальше.

*www.blo*g.web-you.ru*

Для начала я создал новый документ (File-New) размерами 755 на 245 пикселей, но вы выбирайте свои размеры так как на итоговый вариант это не влияет, и в основном зависит от шаблона.  Так или иначе я сделал прозрачный слой величиной 755 -245 пикс. Далее создаём новый слой (Layer – New – Layer)  или Ctrl-Shift-N, и заливаем его радиальным градиентом. Т.е. выбираем инструмент Gradient Tool и выбираем вот такой градиент

Настройки цвета градиента выглядят у меня следующим образом

Заливаем сверху вниз, результат должен выглядеть следующим образом

Далее создаём новый прозрачный слой, для которого выставляем параметр Fill – 18%. После *www.blo*g.web*-you.ru чего инструментом Elliptical Marquee Tool выделяем центральную область

Заливаем её белым цветом, после чего ищем в верхнем меню Filter переходим (Filter – Blur – Gaussian Blur) и настраивая параметр Radius добейтесь как бы мягкого высвечивая центральной области.

Следующим шагом мы вновь создадим новый слой с параметром Fill – 85%. После чего берём инструмент Rectangular Marquee Tool и выделяем область нужной вам высоты (потом в этом месте будет название сайта) и… вновь воспользуемся градиентом (краеугльоный камень нашего урока :) ) правда на этот раз обычным.

Вот его настройки цвета

Теперь вновь двигаемся в верхнюю панель и переходим по пунктам *www.bl*og.w*eb-you.ru (Edit – Transform – Distort). «Наклоняем» наш градиент. После чего в свойствах слоя (Blending Options) включаем параметр «Внешней тени» (Drop Shadow). Ну вроде бы с этим слоем закончили. На данном этапе результат выглядит следующим образом

И вновь закинул старик свой невод, а я создал ещё один слой. Кстати с фоном закончили так что слои, все кроме последнего с полоской градиента, можно объединить, дабы не запутаться потом, к тому же работа с большим количеством слоёв может значительно нагрузить систему, всё конечно зависит от того какая у вас сборка компьютера, но всё таки лучше перестраховаться. И ещё, можно слой с полоской *www.blog.web-you*.*ru который мы не склеили сделать пока невидимым, и рисовать линии как бы из под него, потом снова его включим и разместим поверх остальных. Ну так вот, на новом прозрачном слое мы будем рисовать красатулишные светящиеся ниточки. Для этого мы воспользуемся инструментом под названием Pen Tool. Рисуем нечто похожее на рисунок ниже

Нарисовали? Теперь берём инструмент кисть (Brush Tool) толщину выберете сами, у меня это 6 пикс, заодно настройте мягкость как вам угодно. Теперь берём инструмент Direct Selection Tool кликаем им (правой кнопкой) по нашей линии и выбираем пункт Stroke Path, и выбираем кисть, далее в опции имитировать нажим (Simulate *www.*blo*g.web-you.ru Pressure) ставим галочку и жмём «ОК».

В свойствах слоя (Blending Options) настраиваем свечение, цвет, обводку по вашему вскусу.

Теперь делаем новый слой опять рисуем какую нить нитку и обводим. Сразу скажу что лучше каждую ниточку делать на своём отдельном слое и потом поэкспериментировав с настройками этих слоёв, получить красивые, разноцветные, с разной интенсивностью свечения нитки. В общем фантазию вам в помощь. В самом конце добавляем нужный текст. И всё. Надеюсь урок вам понравился, если я что то упустил, напомните мне об этом в комментариях. Вы так же можете первыми получать мои статьи если подпишитесь по RSS, а так *ww*w.blog.web-*you.ru же читать меня в twitter и friendfeed. В общем успехов вам удачи и пока.

защищено INVITEXT

Похожие статьи

  1. Эмблема, иконка кнопка для сайта (очень быстро и просто рисуем в Photoshop)
  2. Создаём красивый логотип на сайт

Комментариев оставлено (2)

Когда же я научусь в фотошопе рисовать красиво :)

Ну научиться можно всему, было бы желанье

Оставить отзыв или вопрос

This site is using OpenAvatar based on