Стильная шапка сайта

Дизайн элегентной и стильной шапки для сайта в Фотошопе

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

Мы так же будем много использовать такие иснтрументы Photoshop, как Pen Tool, другие способы выделения, свободную трансформацию и различные режими смешивания.

Финальный вариант автора:

Давайте начинать!

Шаг 1

Создайте новый документ в фотошоп с размерами 1200 x 600 px и залейте фон черным цветом.

Создайте новый слой и зановите его “Radial Gradient Fill”, возьмите инструмент Gradient Tool (G), выберите Radial Fill и залейте слой, как показано ниже:

Затем создайте новый слой с названием “Angle Gradient Fill” и измените его режим смешивания на Overlay.

Используем инструмент Rectangular Marquee Tool для создания выделения, как показано ниже. Затем выбираем градиентную заливку Gradient Tool (Цвета белый и прозрачный) и заливаем выделение, как показано ниже:

Шаг 2

Продулбируйте слой “Angle Gradient Fill” и оставьте режим смешивания слоя Overlay, зетам идём в Edit > Transform > Flip Horizontal и переворачивам слой. Слейте эти два слоя и оставьте режим смешивания нолучившегося слоя на Overlay:

Примените стиль “Drop Shadow” к слою, как показано ниже:

Затем уменьшите прозрачность у предыдущего слоя “Radial Gradient Fill” до 60% и у вас получится такой эффект, это основа шапки в фотошоп, на ней будут располагаться кнопки меню.

Затем создайте новый слой между предыдущими двумя и назовите его “centre light”. Возьмите большую мягкую кисть (примерно 600 px), установите цвет на белый и нарисуйте засвет, как показано ниже:

Режим смешивания поставьте на Overlay:

Шаг 3

Автор пытался придать картинке немного 3d. На слое “Angle gradient fill” нажимаем Ctrl + T, включается инструмент свободной трансформации, затем выбираем “perspective”, как показано ниже:

Вот результат:

Шаг 4

Создайте новый слой и назовите его "shineline", используйте Pen Tool для создания пути path, как на картинке ниже. Если вы затрудняетесь использовать этот инструмент, вот здесь есть парочка уроков по фотошопу, в ближайшем времени я их обязательно переведу и выложу у себя на Theduve.ru

Затем правый клик по холсту и выбираем “stroke path”. Перед этим вы должны выбрать маленькую жесткую кисть белого цвета и обязательно проверьте что стоит галочка на опции "simulate pressure".

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

Шаг 5

Продублируйте слой “Shineline” несколько раз, используйте тот же инструмент свободной трансформации Free Transformation Tool для вращения, маштабирования и перемещения линий:

Слейте все слои с линиями вместе и продублируйте получившийся слой ещё несколько раз, так же используя на каждом дубликате инстурмент свободной трансформации:

Продублируйте соединённые слои, точнее слой и примените к нему Gaussian Blur с такими настройками:

У вас должно получиться примерно так, наша шапка в фотошопе смотрится уже довольно хорошо:

Шаг 6

Создайте новый слой и назовите его “shining dots”, загрузите выделения слоя “shineline” (Ctrl + клик по слою), затем выберите из списка “Make Work Path”:

Выберите 0.5 pixel для параметра tolerance. Теперь берём жесткую кисть с диаметром в 3 px, нажимаем F5 и настраиваем ксить, как показано ниже:

Так же включите опцию “Smoothing”.

На слое “shining dots” кликните правой кнопкой по холсту и выберите "stroke path", как мы делали ранее:

Шаг 7

Теперь можно добваить немного дыма или облаков. Для этого создайте новый слой и инструментом Лассо Lasso Tool с 40px feather создайте выделение, как показано ниже. Теперь идём в Filter > Render > Cloud и создаёт облака внутри нашего выделения (используйте черный и белый цвета в палитре)

Автор использовал немного фильтра Len Flare с такими настройками на новом слое с облаками:

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

Ну и в конце можете написать имя сайта:

Вот и всё, мы создали шапку в фотошопе надеюсь у всех получилось даже лучше.

Вот финальный вариант автора в голубом цвете:

Альтернативные версии:

Автор: psdvault.com
Перевод: DuvE

Ссылка на источник урока