ресурс для начинающих веб-разработчиков
комплексные веб-услуги по созданию сайтов

Справочный материал по основным языкам программирования и верстки сайтов.

Готовая методика создания простых и сложных динамичных сайтов, с использованием PHP и MySQL.

Использование веб-редактора Adobe Dreamweaver в разработке сайтов.

Использование графических редакторов Adobe Flash, Adobe Photoshop, Adobe Fireworks в подготовке веб-графики.

Разработка веб-сайтов под "ключ".

Разработка отдельных фрагментов сайтов, консультации по вопросам верстки веб-страниц и веб-программирования.

Создание аватаров

Создание аватаров

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

Откроем Photoshop и создадим новый документ Файл ⇒ Создать.

Создание документа Аватар

С помощью инструмента Прямоугольник со скругленными углами нарисуем квадрат с параметрами указанными на рисунке.

Параметры прямоугольника

Рисунок прямоугольника с параметрами указанными выше

Выделим слой Фигура 1 и не отпуская левую кнопку мыши нажмем клавишу Ctrl, квадрат будет выделен.

Выделенный квадрат

Создадим новый слой и с помощью инструмента Градиент зальем его градиентной заливкой со следующими параметрами.

Параметры градиента

Редактирование градиента

Квадрат примет вид как на рисунке.

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

Применим к верхнему слою стиль слоя дважды щелкнув левой кнопкой мыши по Слой 1 и установим параметры Внутренняя тень согласно рисунка.

Параметры стиля Внутренняя тень слоя

Рисунок примет следующий вид.

Рисунок после применения стиля Внутренняя тень

Теперь нажмем на клавишу Ctrl и щелкнем левой кнопкой мыши по Слой 1. Квадрат выделится. Создадим новый слой и перейдем в меню Редактирование ⇒Выполнить обводку. Откроется диалоговое окно Выполнить обводку. Установим параметры обводки согласно рисунка.

Диалоговое окно Выполнить обводку

Создадим новый слой. Если у вас не выделен Слой 1 выделите его нажав клавишу Ctrl и щелкнув по слою левой кнопкой мыши.

Выберем инструмент Овальная область и создадим овал как на рисунке.

Создание овальной области

Рисунок примет вот такой вид.

Рисунок после применения овальной области

Выбираем инструмент Градиент с параметами из белого в прозрачный и заливаем выделенную область сверху вниз.

Параметры градиета

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

Рисунок после заливки

Удалим слои Фигура 1 и Фон.

Вставим в получившуюся фигуру какой-нибудь рисунок. Я вставил автомобиль. Обрезал изображение и с помощью инструмента Ластик удалил лишние области с рисунка, применил фильтр Умное размытие. А дальше применил стиль слоя Внешнее свечение.

Холст и изображение

В итоге получился вот такой рисунок. Рядом тот же рисунок с применением новых корректирующих слоев. Для создания корректирующих слоев необходимо объединить все слои в один слой, нажав сочетание клавиш Ctrl+E, предварительно выделив их на панели Слои.

Итоговый рисунок Рисунок после коррекции Рисунок после коррекции