Рассмотрим создание шапки для сайта в фотошопе в виде ленты.  Вот таким должен быть наш конечный результат (см. рис.)

 

шапка для сайта в фотошопе


Для реализации данного урока шапка для сайта в фотошопе нам потребуются гранжевые кисти(скачать):


И так начнём с инструмента Перо


Создаём  новый документ (Ctrl+N) размером примерно 1000х450 пикселей. Но  прежде чем мы приступим к прорисовке  данного урока шапка для сайта в фотошопе, Давайте выясним кое-что о ленточке. Ленточка  будет состоять из 3 частей: это конец  ленточки, сгиб и основная  часть.

 

шапка для сайта в фотошопе

 

 

Выбираем е инструментПеро  и установливаем  значение фигуры в настройках инструмента:

 

шапка для сайта в фотошопе


Нарисуем  левую сторону края у  ленточки. Край ленточки шапки для сайта в фотошопе должен быть искривлённым

 

 

 

шапка для сайта в фотошопе

 

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

 

шапка для сайта в фотошопе

 

Используя тот же инструмент нарисуйте сгиб треугольной формы:

 

 

шапка для сайта в фотошопе

 

шапка для сайта в фотошопе


У вас должно быть три части ленточки на трёх отдельных слоях.
Завершение рисования ленточки
Для того чтобы  завершить рисование ленточки, нужно сделать копию всех трёх слоёв и применить к ним отражение по горизонтали. Но перед этим нужно сделать основную часть ленточки длиннее. Выберите инструмент Перо  и кликните на иконке векторной маске в палитре слоёв и вокруг фигуры появится контур.

шапка для сайта в фотошопе


Удерживая Ctrl, выделяем  все якорные точки. Должен  получится  такой же контур (см. рис.)

 

шапка для сайта в фотошопе


Далее перейдём  в меню редактирование - скопировать (Edit > Copy), потом Редактирование»Вставить (Edit > Paste) и в завершении Редактирование - Свободное трансформирование контура (Edit > Free Transform Pat) (Ctrl+T). Теперь нужно применяем отражение по горизонтали. Перейдим  в менюРедактирование - Трансформирование - Отразить по горизонтали (Edit > Transform > Flip Horizontally). Сдвигаем  копию вправо до тех пор, пока не получим  нужную длину.

 

шапка для сайта в фотошопе


Сделаем  копию двух других слоёв с частями ленточки и отразим их по горизонтали. Расположим  их на другом конце ленточки.
Добавляем  стили к слоям
Применим  следующие стили для двух слоёв с концами ленточки:
Отбрасывание тени (Слой - Стиль слоя -Тень) (Layer > Layer Style > Drop Shadow):

шапка для сайта в фотошопе


Далее наложение градиента:

шапка для сайта в фотошопе

 

шапка для сайта в фотошопе



К слоям со сгибами применяем  стиль наложение градиента:

шапка для сайта в фотошопе

 

шапка для сайта в фотошопе



В завершении к основным частям ленточки применяем стиль наложение градиента:

 

шапка для сайта в фотошопе

 

шапка для сайта в фотошопе


Добавляем узор  на ленточку
Создаём новый документ (Ctrl+N) размером 4х4 пикселя с прозрачным фоном. Используя инструмент Карандаш  (B) нарисуем  узор, показанный ниже. Удобнее рисовать, если приблизить  холст.

шапка для сайта в фотошопе

 

Далее, перейдим в меню Редактирование - Определить узор (Edit > Define Pattern), сохраняем узор и вернёмся к нашему первому документу. Сделаем выделение слоя с концами линий (удерживая Ctrl, кликните на иконке слоя в палитре слоёв).

 

шапка для сайта в фотошопе


Нам нужно немного сжать выделение. Перейдём в меню Выделение - Модификация - Сжать (Select > Modify > Contract) и введём значение 5 пикселей. Выбераем  инструмент Заливка (Paint Bucket Tool) (G), в настройках инструмента выбераем сохранённый узор.

 

шапка для сайта в фотошопе


Заливаем  выделение на новом слое. Потом перейдём в меню Выделение – Модификация - Сжать(Select > Modify > Contract) и сожмите выделение ещё на 5 пикселей, нажмите Delete. К слою с узором применяем стиль Наложение цвета (Слой»Стиль слоя»Наложение цвета) (Layer > Layer Style > Color Overlay): цвет – белый.

 

шапка для сайта в фотошопе


Повторяем  эти шаги с заливкой узором для других слоёв, кроме слоёв со сгибами.

 

шапка для сайта в фотошопе


Добавляем  гранжевую текстуру
В начале урока шапки для сайта в фотошопе Вы загрузили гранжевые кисти. Создаём новый слой и обрисуем основную часть ленточки гранжевыми кистями. Установим непрозрачность слоя – 43% и Режим наложенияМягкий свет (Soft Light).

 

шапка для сайта в фотошопе


Заключительная  часть 
Сделаем выделение слоя с левым или правым концом ленточки и выберем инструмент Градиент http://www.photoshop-master.ru/tools/gradient.png(Gradient Tool) (G). Выберите градиент, показанный ниже.

 

шапка для сайта в фотошопе

 

шапка для сайта в фотошопе


Сделаем заливку градиентом с конца средней части ленточки к её концу. Установите непрозрачность слоя – 40%.

 

шапка для сайта в фотошопе

 

Повторим этот шаг для другого конца ленточки. В завершении добавим элементы навигации и заголовок.

шапка для сайта в фотошопе

 

шапка для сайта в фотошопе



Автор урока: Richard Carpenter (материал взят с сайта фотошоп-мастер).

 Скачать урок «шапка для сайта в фотошопе »

 

 

Добавить комментарий


Защитный код
Обновить