Уроки фотошопа Скачать Показуха Вопросы & Ответы О нас
Урок про рисование аватара в фотошопе
абстракции кисти для фотошопа аватар Windows Vista мусор грандж дизайн сайта анимация скин новый год пена уроки фотошопа DesignArts.RU обработка фото логотип для сайта трава наши новости афиша кнопка для сайта растения вода брызги верстка Ron Deviney грязь день Святого Валентина обои 3D иконка портфолио
3

Аватар в фотошопе

Guljay S.V.
Уроки фотошопа
3 июня 2007

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

Рисуем аватар

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

1. Создаём новое изображение размером 100x100 пикселей:

как нарисовать аватар

2. Свойства фонового слоя изменить нельзя (рядом с названием слоя вы можете увидеть замочек), чтобы это сделать, кликнем два раза по этому замочку и в появившемся окне нажмём OK. Теперь слой Background автоматически переименовался в Layer 0 и стал полностью доступен для редактирования. Кликаем правой кнопкой на этом слое, заходим в Blending Options, открываем вкладку Gradient Overlay и выставляем следующие значения:

как нарисовать уникальный аватар

Чтобы изменить градиент, кликаем по полоске справа от надписи Gradient. Откроется такое окошко:

как нарисовать уникальный аватар в фотошопе

Кликаем по квадратикам снизу и выбираем цвета как на те, что на примере, жмём OK и снова OK.

3. Затем переходим на вкладку Inner Shadow и выставляем такие значения параметров:

как в фотошопе нарисовать аватар

4. Создаём новый слой. Он автоматически назовётся как Layer 1. Зальём этот слой любым цветом с помощью Paint Bucket Tool, значение прозрачности Fill этого слоя выставим в 0%. Затем заходим в Blending Options этого слоя, выбираем вкладку Pattern Overlay и в качестве текстуры выбираем штриховку (эта текстура там просто так не появится, но я рассказывал как её сделать в уроке по созданию UserBar’ов (пункты 5-7)) и жмём OK:

как нарисовать в фотошопе аватар

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

как нарисовать в фотошопе аватар

5. Теперь создайте новый слой, выберите понравившуюся вам кисточку (Brush Tool) и нарисуйте ей что-нибудь белым цветом, затем выставьте прозрачность слоя по вкусу (я в данном случае выставил значение прозрачности Opacity в 50%, а кисточку, которую я использовал, можно скачать в конце урока). Вот что получилось у меня:

как нарисовать в фотошопе аватарку

6. Теперь выбираем инструмент Horizontal Type Tool, выбираем цвет и понравившийся нам шрифт и пишем любой текст (Так как мы делаем именную аватарку, то напишем на ней свой ник. Я написал свой ник — Serg оранжевым цветом, шрифтом Segoe UI (ссылка на шрифт в конце урока), жирным, размером 30pt):

как нарисовать в фотошопе аватара

7. Сейчас заходим в Blending Options слоя с надписью, выбираем вкладку Outer Glow и выставляем всё как показано ниже:

как нарисовать в PhotoShop аватар

Переходим на вкладку Drop Shadow и там делаем так:

как нарисовать аватар

Теперь жмём OK и переходим к следующему пункту...

8. Сейчас нам нужно создать копию слоя с надписью. Для этого жмём на слое правой кнопкой, выбираем Duplicate Layer и в открывшемся окне кликаем кнопку OK. Так же можно это сделать быстрее — просто перетащить слой на иконку создания нового слоя:

как нарисовать в фотошопе именной аватар

9. На только что созданной копии слоя кликаем правой клавишей, выбираем Group into New Smart Object, выставляем прозрачность Opacity данного слоя в 46% (по вкусу, конечно же). Ну а сейчас перевернём этот слой — идём на вкладку Edit —> Transform —> Flip Vertical и сдвигаем слой немного ниже:

как нарисовать в фотошопе красивый именной аватар

10. Сейчас добавим к этому слою маску (жмём кнопку Add layer mask), рядом с изображением слоя появится ещё один квадрат белого цвета — кликаем на него, затем на панели инструментов выбираем градиентную заливку Gradient Tool и заливаем ей копию нашего слоя с текстом так, чтобы квадратик с маской выглядел как показано ниже:

как нарисовать в фотошопе красивый именной аватар

11. Не мешало бы разделить верхнюю и нижнюю часть изображения белой полосой (с помощью инструмента Line Tool):

как нарисовать в фотошопе красивый именной аватар

12. Сейчас добавляем к этому слою (к слою с полосой) маску и эту маску по бокам заливаем градиентом:

как нарисовать в фотошопе красивый именной аватар

Результат будет выглядеть вот так:

как нарисовать в фотошопе красивый именной аватар

13. Теперь выделяем слой с надписью (для этого зажимаем клавишу Ctrl и кликаем по слою), потом выбираем инструмент Rectangular Marquee Tool, зажимаем Alt и выделяем следующим образом:

как нарисовать в фотошопе уникальный аватар

14. Создаём новый слой Layer 3 и заливаем выделение белым цветом:

как нарисовать в фотошопе уникальный аватар

15. Добавляем к этому слою маску и заливаем градиентом снизу вверх:

как нарисовать в фотошопе уникальный аватар

16. Создадим новый слой Layer 4 и нарисуем на нём кисточкой свечение:

как нарисовать в фотошопе уникальный аватар

17. Создаём новый слой, выделяем его нижнюю часть виде прямоугольника и заливаем чёрным цветом, прозрачность слоя Fil Opacuty выставим равной 30%:

как нарисовать аватар со своим ником

18. Добавим к этому слою тень:

как нарисовать аватар со своим именем

19. Добавим бордюр:

как нарисовать аватар в фотошопе

Вот что мы сейчас получили:

нарисовать аватар в фотошопе

20. Напишем в полученном прямоугольнике какой-нибудь текст белым шрифтом (можно написать название сайта, e-mail, icq или ещё что-нибудь):

нарисовать аватар в фотошопе

21. Добавим к данному тексту бордюр:

нарисовать аватар в фотошопе

Вот что мы имеем в результате:

нарисовать аватар в фотошопе

22. Создадим новый слой, с помощью инструмента Elliptical Marquee Tool выделим примерно половину картинки, инвертируем выделение (Select —> Inverse). Получим следующее выделение:

нарисовать аватар в фотошопе

23. Зальём выделение белым цветом:

нарисовать аватар в фотошопе

24. Добавим к этому слою маску (Add vector mask) и зальём её градиентом начиная с правого нижнего угла:

нарисовать аватар в фотошопе

25. Создадим ещё один слой, зальём его любым цветом, выставим прозрачность Fill Opacity в 0%, добавим бордюр:

как нарисовать красивый аватар в фотошопе

Вот мы и сделали свою именную аватарку:

как нарисовать красивый аватар в фотошопе

26. Можно её ещё как-нибудь приукрасить. Для этого я создал новый слой и кисточкой серого цвета (ссылка на неё в конце урока) нарисовал следующий рисунок:

как нарисовать красивый аватар в фотошопе

Поздравляю! Ваш именной аватар готов!

Ну а если подключить свою фантазию и попробовать что-нибудь изменить, то у вас может получится совершенно другая аватарка, ещё красивее, чем та, которую я сделал для примера.

А вот ещё несколько аватарок, сделанных мною по такому же принципу:

как нарисовать красивый аватар в фотошопе

Если у Вас возникли вопросы по данному уроку, или Вы заметили неточность/ошибку - пишите об этом в комментариях. Ни один комментарий не останется незамеченным нами!

• Скачать шрифт « Segoe UI » | ZIP, 276 КБ • Скачать кисточку №1 (пункт 5 этого урока) | ZIP, 885 КБ • Скачать кисточку №2 (пункт 26 этого урока) | ZIP, 416 КБ
Информация, которая должна быть на этом месте, доступна только авторизировавшимся посетителям!
8345 просмотров
посты с похожей тематикой
2
#12Красивая Юля: Классно! Так легко! Я бы таких аватарок миллионы наделала! = )
Вот мои аватарки:
Bloomik 2- это мой логин на одном сайте.
27 декабря 2011 в 18:32:21
0
#11Pogojev Ярик: Прекрасная коллекция уроков по таким аватаркам.Мне очень нравится.
3 апреля 2011 в 16:56:56
17
#10Dmitriy Kilishek: Внимательность рулит :))
22 марта 2011 в 18:13:49
158
#9Гуляй Сергей: Для [Dmitriy Kilishek]: а еще бы шрифт уменьшить, а то буквы слишком вытянуты (по высоте).
22 марта 2011 в 16:41:54
17
#8Dmitriy Kilishek: Да, действительно так текст стал намного четче!
22 марта 2011 в 15:09:44
17
#7Dmitriy Kilishek: Надо будет попробовать, приеду домой посмотрю что там делал со шрифтом.
20 марта 2011 в 19:49:52
158
#6Гуляй Сергей: Для [Dimm Kil]: все хорошо, кроме нижней надписи - она получилась коряво. Нужно отключить сглаживание шрифта.
19 марта 2011 в 20:00:53
17
#5Dmitriy Kilishek: По результатам урока вышло чтото вроде этого :))
16 марта 2011 в 23:14:33
158
#4Гуляй Сергей: Для [Кулиш Иван]: значит выбираешь тип градиента не тот, что нужно. Нужно выбрать градиент, переходящий из основного цвета (черный) в полностью прозрачный. Смотри скриншот:
31 января 2011 в 00:01:08
0
#3Кулиш Иван: Не получается сделать чтобы с двух сторон был градиент.
30 января 2011 в 23:57:04