Beauty – ретушь для начинающих при помощи Photoshop.

Beauty – ретушь для начинающих при помощи Photoshop.

Эффект голограммы на фотографии.

Эффект голограммы на фотографии.

Создание портрета при помощи шрифтов.

Создание портрета при помощи шрифтов.

Создаем красивую оригинальную шапку для блога.

Создаем красивую оригинальную шапку для блога.

Необычный эффект глаз при помощи Photoshop.

Необычный эффект глаз при помощи Photoshop.

Создаем макет сайта о звездах и знаменитостях.

Создаем макет сайта о звездах и знаменитостях.

Создание текстового логотипа в стиле Ретро при помощи фотошоп.

Создание текстового логотипа в стиле Ретро при помощи фотошоп.

Урок ретуши фото. Создаем потрясающий портрет в Photoshop.

Урок ретуши фото. Создаем потрясающий портрет в Photoshop.

Урок по созданию летнего водного макета сайта в Photoshop.

Урок по созданию летнего водного макета сайта в Photoshop.

Урок по созданию футуристического логотипа в фотошоп.

Урок по созданию футуристического логотипа в фотошоп.

Создаем дизайн телефона на Android в Photoshop.

Создаем дизайн телефона на Android в Photoshop.

Создание макета сайта в стиле минимализма.

Создание макета сайта в стиле минимализма.

Как создать пиксельную кнопку в фотошопе

Как создать пиксельную кнопку в фотошопе

Создаем макет сайта для службы знакомств.

Создаем макет сайта для службы знакомств.

Создание RSS иконки.

Создание RSS иконки.

Урок по созданию простого  и современного  макета для сайта.

Урок по созданию простого и современного макета для сайта.

Графика для сайта.  Рисуем иконку на сайт.

Графика для сайта. Рисуем иконку на сайт.

Урок по созданию зимнего текста.

Урок по созданию зимнего текста.

Урок по созданию красивого новогоднего макета в фотошоп.

Урок по созданию красивого новогоднего макета в фотошоп.

Псевдо HDR.

Псевдо HDR.

Как создать основу для рекламы профессиональной косметики для волос.

Как создать основу для рекламы профессиональной косметики для волос.

Создание эффекта рисунка на фотографии.

Создание эффекта рисунка на фотографии.

Создаем макет сайта, продающий програмное обеспечение.

Создаем макет сайта, продающий програмное обеспечение.

Урок по созданию макета сайта-портфолио при помощи текстуры "джинс".

Урок по созданию макета сайта-портфолио при помощи текстуры "джинс".

Урок по созданию макета сайта для гостиниц и ресторанов.

Урок по созданию макета сайта для гостиниц и ресторанов.

Создаем креативный макет для продажи косметических средств с помошью Photoshop.

Создаем креативный макет для продажи косметических средств с помошью Photoshop.

Урок по созданию фотореалистичного макета сайта для его дальнейшей верстки CSS/XTML.

Урок по созданию фотореалистичного макета сайта для его дальнейшей верстки CSS/XTML.

Урок по созданию яркого красочного дизайна сайта.

Урок по созданию яркого красочного дизайна сайта.

Создание простого и стильного макета сайта.

Создание простого и стильного макета сайта.

Создаем макет блога в фотошоп.

Создаем макет блога в фотошоп.

Создаем оригинальный чистый стиль для сайта.

Создаем оригинальный чистый стиль для сайта.

Создаем профессиональную панель навигации для сайта.

Создаем профессиональную панель навигации для сайта.

Рисуем милую девчушку-смайл.

Рисуем милую девчушку-смайл.

Урок по рисованию прохлаждающегося солнца.

Урок по рисованию прохлаждающегося солнца.

Фантастический эффект фотографии.

Фантастический эффект фотографии.

Создание приятного макета сайта портфолио.

Создание приятного макета сайта портфолио.

Создание макета сайта для портфолио в стиле Веб 2.0

Создание макета сайта для портфолио в стиле Веб 2.0

Урок по созданию стильного рекламного банера с помошью Photoshop.

Урок по созданию стильного рекламного банера с помошью Photoshop.

Урок по созданию профессионального бизнес-шаблона сайта с помощью фотошоп.

Урок по созданию профессионального бизнес-шаблона сайта с помощью фотошоп.

Урок рисования реалистичного динамика.

Урок рисования реалистичного динамика.

Создаем стильный коллаж.

Создаем стильный коллаж.

Урок по созданию макета дизайна сайта в стиле Веб 2.0

Урок по созданию макета дизайна сайта в стиле Веб 2.0

Урок создание эффекта металлического текста

Урок создание эффекта металлического текста

Небесный коллаж

Небесный коллаж

Создаем красивую оригинальную шапку для блога.

Tags: Графика для сайта | Уроки Photoshop | уроки web дизайна | уроки веб дизайна

43-26

 

 

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

 

 

Вот какого результата мы попробуем добиться:

43-22

Начинаем работу над шапкой с построения ленты. Она будет у нас состоять из трех частей. Создадим новый документ размером 1000*450 пикселей. Для Начала создадим конец ленты, затем ее основную часть.

При помощи инструмента Перо создадим край ленты.

43-3

Продублируем слой и раположим его с другой стороны.

43-4

Далее при помощи того же инструмента рисуем основную часть ленты.

43-5

Затем рисуем внутренние края ленты, как показано на рисунке.

43-6

Для того, чтобы лента была полной скопируйте нарисованные части ленты, при помощи инструмента свободная трансформация расположите необходимые части ленты по другую сторону .

43-7

Концам ленты  добавляем следующие стили :

43-8

43-9

 

У вас должно получиться что-то вроде этого:

43-10

К слою изнаночной стороны ленты добавим Наложение градиента с настройками, показанными ниже:

43-9

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

43-11

К основной части ленты добавляем Наложение градиента, используя настройки , указанные ниже: pong.uwstout.edu

43-9

Вот так должна выглядеть лента:

43-12

Для того чтобы немного красить ленту создадим простой узор. Создайте новый документ размером 4*4 пикселя, при помощи инструмента Карандаш повторите то что показано на рисунке ниже.

43-13

Когда выполните все зайдите в меню Редактирование-Определить узор. Сохраните шаблон узора и перейдите на основное рабочее окно.

Загрузите выделение края ленты, нажав по эскизу слоя в палитре, зажав клавишу Ctl.

Далее создайте новый слой, перейдите по меню Выделение- Модификация- Сжать и установите значение равное 5 пикселям. Выполните заливку содержимого выделенной области.

Далее еще раз пройдите в меню Выделение-Модификация-Сжать, и еще раз уменьшите выделенную область на 5 пикселей и нажмите кнопку удалить. Повторите это действие для каждой части ленты, вот что должно получиться в итоге:

43-14

43-14-1

Добавим на ленту несколько случайных отпечатков кистями в  стиле Гранж .Установите непрозрачность слоя 43% и режим наложения Мягкий свет.

43-18

Для крайних частей ленты загрузите выделение и на новом слое выполните заливку градиентом с настройками, показанными на картинке.

43-19

43-27

После этого уменьшите непрозрачность слоя до 40%. Вот что должно получиться.

43-20

Далее добавим логотип и проставим меню, добавим изображение – и в итоге у вас должен получиться простой в исполнении  и оригинальный макет в шапку сайта.

43-22

Если вам понравился урок, подписывайтесь и читайте нас через RSS.

AddThis Social Bookmark Button
 

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


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

поиск
RSS
Контент. Как сделать материал читаемым.

    Как известно контент - это хозяин сайта, то зачем приходит посетитель на ваш сайт. От того насколько хорошо вы...

кол-во просмотров9104
Подробнее...

Что такое карта сайта?

  Карта сайта представляет собой некое подобие содержания книги. Иными словами карта сайта это страница, на которой размещены все ссылки, разделы...

кол-во просмотров10854
Подробнее...

В чем сила блогов? Или для чего нужны онлайн-дневники.

    Блоги , или как раньше назывались они онлайн-дневники были изначально местом, где большое количество людей могло выразить свое мнение или...

кол-во просмотров8759
Подробнее...

Стили сайтов. Стиль минимализма

Стиль минимализма берет свое начало в первой половине 60-х г.г. Суть минимализма - это простота, минимум графических материалов. Минимализм это...

кол-во просмотров20647
Подробнее...

Как создать эффективный заголовок.

  Заголовок, как правило, главная часть всего поста по которому посетитель выбирает читать ему далее информацию, либо уйти с сайта. Хороший...

кол-во просмотров10278
Подробнее...