Понедельник, 21.09.2026, 09:44
Приветствую Вас Гость | RSS
Главная | Статьи | Регистрация | Вход
Меню сайта
Категории каталога
Серверные технологии [6]
Скрипты [6]
Web дизайн [5]
SEO [8]
Наш опрос
У Вас есть свой сайт?
Всего ответов: 25
Форма входа
Счетчик материалов
Форум: 22/53
Галерея: 451
Файлы: 52
Статей: 29
Поиск
Друзья сайта
Статистика

Онлайн всего: 2
Гостей: 2
Пользователей: 0
Главная » Статьи » Web технологии » Web дизайн

Создание шапки для сайта в Adobe Photoshop
Отличный урок создания шапки для сайта на Adobe Photoshop CS. За несколько шагов мы создаём уникальный и красивый элемент сайта!
Рассмотрим с Вами как можно быстро сделать несложную шапку для сайта на AdobePhotoshop. Шапка на самом деле несложная, но если вы подключите свою фантазию, то может получиться очень даже хорошо.

И так, вооружаемся "фотошопом" и приступайте.

1. Первое, что нужно сделать, это создать новый холст, пусть он будет размером 800x150px:
 
шапка сайтов

2. Заходим в Layer Style (кликните правой клавишей по слою, выберите Blending Options) вкладка Gradient Overlay. Следующим образом настраиваем градиент (красным цветом на картинке отмечены шестнадцатеричные значения цветов):
 
скачать шапку сайта

Жмём везде «Ok» и получается фон:
 
сделать шапку сайта

3. После этого выбираем инструмент Pen Tool и рисуем фигуру. Подключайте свою фантазию. Возьмём цвет #313e5a:
 
размер шапки сайта

4. Заходим в Layer Style на вкладку Drop Shadow и выставляем следующие параметры:
 
шаблон шапки сайта

После этого должно получиться примерно как на картинке:
 
шапки сайтов cs

5. Теперь выбираем кисточку с пятнами краски (если у Вас в наборе нет подобной кисточки, поищите в Интернете), создайте новый слой и что-нибудь «наляпайте» примерно как на картинке:
 
создание шапки сайта

6. Создаём новый слой ещё раз, смешивание (Blend Mode) измените с Normal на Overlay и снова нарисуем что-нибудь:
 
красивые шапки сайтов

7. Создайте новый слой и залейте его любым цветом (с помощью Paint Bucket Tool), затем непрозрачность заливки Fill уменьшите до 0%.
 
photoshop шапка сайта

Зайдите в Layer Style на вкладку Inner Shadow и настройте следующие параметры:

8. А на вкладке Pattern Overlay настройте заливку текстурой. В качестве текстуры выберите какую-нибудь штриховку (как создавать подобную текстуру сказано, например, в начале урока №21):
 
шапка сайта разрешение

Получиться должно вот так:
 
картинка шапка сайта

9. А сейчас давайте напишем название для сайта. Самый ответственный момент.
 
шапки для сайтов бесплатно

10. Раскрасьте его по следующему принципу:
 
все для создания сайта

11. Нарисуйте ещё что-нибудь и напишите слоган вашего сайта:
 
шаблоны сайтов

12. А сейчас создайте копию слоя с названием сайта (для этого перетащите слой на иконку создания нового слоя или кликните по слою правой клавишей и там выберите Duplicate Layer).

Отразите по вертикали копию слоя с названием сайта (Edit —> Transform —> Flip Vertical) и разместите её (надпись) ниже:
 
бесплатно шапки для сайта

13. Добавьте маску слоя (на панели слоёв кликните по кнопке Add layer mask):
 
сделать шапку для сайта

14. Выберите инструмент Gradient Tool (градиент) и чёрно-белым градиентом залейте маску сверху вниз:
 
сделать шапку

15. Снизу напишите названия основных разделов сайта:
 
уроки adobe photoshop

16. Создайте новый слой. С помощью инструмента Rectangular Marque Tool выделите верхнюю часть изображения и залейте её белым цветом (с помощью Paint Bucket Tool):
 
уроки photoshop фото

17. Добавьте к данному слою маску, как это мы делали ранее, и залейте её чёрно-белым градиентом сверху вниз:
 
уроки рисования photoshop

Вот мы и нарисовали в шапку для сайта на Photoshop. Получилось симпотично.
 
уроки работы photoshop

И, на последок, хотелось бы дать небольшой совет: экспериментируйте, творите, делаёте что-то новое и оригинальное. Удачных экспериментов!
 
Оригинальная статья DesignArts.ru 
Категория: Web дизайн | Добавил: Крестный  отец (02.11.2008)
Просмотров: 1601 | Рейтинг: 4.0/1 |
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Хостинг от uCozCopyright script.ucoz.de © 2026