Сегодня в эфире нашего сайта урок по Photoshop’y, в котором будет рассказано, как нарисовать красивую стильную шапку для сайта. Гранжевый стиль сейчас по-прежнему в моде и вот новая его интерпретация перед вами! Устраивайтесь поудобнее, мы начинаем!

1. Создайте новый документ с размерами 850 x 317 px. Фон залейте черным.

2. Скачайте гранжевые кисти и #014051 цветом   закрасьте фон, чтобы он приобрёл текстуру подвальной стены.

3. Сразу наметьте расположение заголовка для сайта и слогана. Их вы в дальнейшем сможете добавить при верстке, но на PSD макете все должно выглядеть натуралистично.

3. Теперь будем рисовать лампу, которая будет подсвечивать меню справа. Нарисуйте сперва белый овал на новом слое

4. Теперь создайте при помощи Polygon Lasso Tool выделение по форме абажура.

5. Создайте новый слой и расположите его под слоем с белым овалом в палитре слоев. Залейте выделение черным цветом

6. Инструментом Doodge (O) в  нанесите блики на абажуре. Сначала наметьте предварительные блики в режиме Shadows

затем в режиме Highlights еще раз пройдитесь по абажуру

7. Затемните слой с белым овалом.

8. С зажатым Ctrl щелкните на иконке слоя с овалом. Нажмите Shift+Ctrl+I, инвертировав выделение, и сместите его как на картинке

Совет: для перемещения выделения необходимо взять какой-либо инструмент из этой группы в обычном режима, например, волшебную палочку

9. Затемните при помощи кисти серым цветом на новом слоем небольшой участок, создав тень.

10. Изменим немного цвет. Нажмите Ctrl+U и установите следующие настройки:

11. Повторяем шаг #8. Выделение сдвиньте чуть вниз, буквально на 1-2 пикселя

Перейдите на слой с тенью и нажмите Del.

12. Нарисуйте на новом слое белую лампочку, используя стандартный custom shape

13. Добавьте блики и тени на внутренней стороне лампа. Это придаст реалистичности

14. Добавьте лампочке объема с помощью кистей

15. Создайте новый слой, создайте выделение как на рисунке ниже и залейте белым цветом

16. Примените Filter->Blur->Gaussian Blur с диаметром около 22 рх и измените режим наложения слоя на Soft Light. Можно еще поиграть с прозрачностью

17. Напечатайте пункты вертикального меню

18. Вернитесь на слой со свечением и примените фильтр Filter->Render-> Lighting Effect

19. Уже неплохо, но мы пойдем дальше. Создайте такой контур. Для его создания воспользуйтесь Elipse Tool в режиме контура, затем инструментом Direct Selection Tool подправьте опорные точки

20. Создайте новый слой под слоями с лампой, установите для него парметры – режим -Soft Light, 44% прозрачность. Превратите контур в выделение (так же как и слой – в палитре Paths Ctrl+клик на иконке с контуром) и залейте его белым цветом

21. Примените Filter->Blur->Gaussian Blur

22. Создайте корректирующий слой с уровнями. Подробнее о корректирующих слоях можно почитать в моей статье “Корректирующие слои – особенности и приёмы“.

23. Теперь нам понадобится текстура с ржавчиной. Такую можно найти на этом сайте в разделе Rust. Скопируйте с нее вот такую полоску и вставьте внизу шапки

24. Теперь другая текстура нужна нам, на этот раз обычный фотошоповский Pattern. Скачать можно тут. Наносим ее поверх полоски со ржавчиной с соблюдением размеров.Режим наложения слоя с этой текстурой – Darken

25. К слою со ржавчиной примените команду Ctrl+U:

26. Теперь нам понадобится старая приборная доска. Найти такую можно на фотостоках. Например, тут. Выберите понравившуюся и вставьте в документ. К слову, панель на этом сайте я рисовал сам – нарисовал основу ящика, затекстурировал теми же гранжевыми текстурами, добавил приборов и добавил теней

Главное – затемнить, т.к. изображения со стока может быть светлее, чем надо и будет смотреться неестественно.

27. Важный момент – падающая тень. Её я рисовал при помощи Polygon Lasso и черной заливки. Конечно же, на новом слое под слоем с самой доской.

28. Теперь надо добавить еще какой-нибудь предмет. пусть это будет висящая тряпка. Не найдя подходящей фотки на стоках, я поступил очень просто -нашел старую грязную тряпку, повесил на гвоздь, сфотографировал и вставил в документ. Ржавый гвоздь дорисовал кисточкой

29. Нарисуем провода. Вначале металлическую трубку с помощью градиента, потом провода – с помощью контуров.

30. Сделайте обводку серым цветом. Если вы не знаете как, вам поможет статья “Для новичков – контуры в Photoshop“. Не забывайте про падающую тень от проводов – ее можно сделать, продублировав провода и сделав их черными, сместить на задний план

31. Осветлите некоторые участки проводов инструментом Doodge.

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

32. Нарисуем трубы по аналогии с поводами.

Сделайте обводку цветом, которым рисовали фон в первых шагах – #014051.

33. По тому же пути, но на новом слое сделайте обводу белой кистью в 3 рх

34. Примените размытие по Гауссу, чтобы результат был похож на этот:

35. Теперь нам понадобится та же ржавая текстура. вставьте ее в документ, над слоем с трубами так, чобы она их полностью накрывали. Создайте клиппинг маску. Чтобы это сделать, с зажатой клавишей Alt нажмите на границу между этими двумя слоями.

Установите режим наложения слоя  текстурой на Multiply

Дорисовываем детали, добавляем теней, приводим в товарный вид

36. При желании можно скачать набор hand drown кистей (рисунки, сделанные руками) и белой кистью в режиме soft light и с малой прозрачностью добавить их на фон.

Вот и все! Если что-то непонятно – спрашивайте в комментариях, рад буду помочь! Так же приветствуется публикауия своих работ – выкладывайте что у вас получилось, мы покритикуем и дадим советы!