Оформление профиля: «от и до» #Аватарка(1)

---

Статья предназначена для помощи в создании своего неповторимого профиля: как своими руками, так и руками аваделов. Статья будет состоять из нескольких частей, первая из которых не будет затрагивать программу «Adobe Photoshop», с помощью которой мы и будем в дальнейшем редактировать изображения. Если у вас нет фотошопа и нет желания его устанавливать (опустим способ добычи сей программы), тогда вы хотя бы будете представлять, что требовать от авадела при очередном заказе и как упростить ему задачу. И, так как я учился методом тыка, то и подача информации будет методом тыка: «сделай то, сделай так и получиться вот так».

---

Примечание:
В тексте могут быть незначительные отклонения от того, что вы видите на скриншотах. Это связанно с тем, что сначала пишется текст, а уже потом делается все то, о чем говориться в уроке. Таким образом, составляя урок по памяти, я могу проверить достоверность своих слов на практике и в большинстве случаев что-то подкорректировать.

---

Полезные темы:

●Основная тема для заказов на оформление вашего профиля.
●Любые другие графические заказы можно оставить в этой теме.
●Уроки Adobe Photoshop
●Так же для вас всегда доступен весь творческий раздел с его полезной информацией.

---

Аватарка – основной элемент профиля и хочется, чтобы во всех уголках сайта картинка была различима глазу и не смешивалась с соседними элементами сайта. Вот вы выбрали нужные картинки и тут же возникает вопрос: «с чего начать?». А начать следует с выбора типа аватарки. Лично я различаю для себя три основных вида: без фона, с рамкой и с анимацией. В этой части я и буду говорить о создании всех трех типов аватарок.

Обсуждаемые темы предыдущих статей:
1 – поиск изображений.
2 – подготовка к заказу/редактированию.
3 – поиск и установка дополнительных элементов.
4 – способы применения и своего рода хитрости.

Обсуждаемые темы этой статьи:
1 - создаем аватару без фона.

В следующих статьях:
2 - добавляем рамку.
3 - анимируем.

---

1 – создаем аватарку без фона.

Итак, аватарка без фона будет сохраняться в формате png. В противном случае у вас вместо пустого фона будет белый цвет. Прежде всего, открытое изображение необходимо сохранить в формате psd., что позволяет вам буквально заморозить работу и вернуться к ней когда угодно. Слои в таком формате останутся на своих местах, как и различные настройки. Возьмем сразу самый сложный вариант, который по ходу поможет объяснить всевозможные нюансы. Вот и наш пример, который я буду беспощадно кромсать.
 

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

Дальнейшая задача будет похожа на принцип работы скульптора, который выбивает нечто прекрасное, из цельного куска камня. Самый долгий и трудоемкий вариант – ластик. Ставим ластику размер «от 3 до 30» и приближаем наше изображение до тех пор, пока ластик не будет занимать значимую часть рисунка. Таким образом, получится максимально точно удалить все лишнее.
 

 

Но к ластику лучше прибегать в последнюю очередь, ведь каждому дорого его время. А значит, мы переходим к самому волшебному инструменту фотошопа - «волшебная палочка». Принцип ее работы заключается в том, чтобы выделять пространства в указанной области по цвету. Если на картинке ниже вы нажмете на белое, то у вас выделится только эта часть, не затрагивая черные круги. Получится что-то похожее на кусок сыра. Но в случае, если вы нажмете на черный круг, у вас выделиться только один черный круг, ибо в данном случае возникает препятствие – белый цвет.
 

 

 

Чем больше цветов на картинке, тем сложнее выделить какую-то нужную часть. Однако, у волшебной палочки можно изменить точность выбираемого цвета. Что дает вам возможность, выбрать не только какой-то определенный цвет, но и близкие к нему оттенки. Таким образом, можно выделить красно-розовый круг, выставив большее значение.
 

 

Но как быть с картинкой, которую я выбрал. Там слишком много разных оттенков, и выбрав что-то одно помимо ненужной части выделится и будущая аватарка. Тут нам все же понадобится скопировать получившуюся заготовку, ибо нам нужно что-то, что можно испортить. Добавляя различные эффекты и изменяя уровни яркости/контраста получаем что-то ужасное, что лишь очертаниями похоже на нашу аватарку. Вот именно эти очертания нам и нужны. На данном примере я применил следующее:
1)Фильтр -> Оформление -> Фасет
2)Изображение -> Коррекция -> Яркость(+45)/Контрастность(+100)
3)Усиление резкости -> Умная резкость(100)
 

Как можно заметить количество сложных цветов сократилось и тут вновь в дело вступает волшебная палочка. Мы видим очертания нашей будущей аватары, пределы которой будут удаляться по уже знакомому принципу. Получаем сие творение.
 

«Что же с этим делать?» - спросите вы. Дальше все очень просто. Необходимо лишь полностью выделить получившийся ужас и, перебравшись на наш нетронутый прямоугольник, при этом, не снимая выделения, проделать следующее: «Выделение -> Инверсия -> Удалить». Немного магии и нам удалось удалить ненужные части без использования ластика.
 

Но, все же, что-то не то. Края все равно неровные и сама картинка скучная какая-то. Думаю, стоит навести марафет. И начнем с краев. Прежде всего, чтобы точно понимать как аватарка будет выглядеть на форуме, нужно заполучить такой же цвет, как и там. Вам ничего делать не нужно, я обо всем позаботился. Все, что надо сделать, так это создать новый слой и залить его вот этим цветом
«# 464646».
 

Как видно, с краями нужно поработать основательно. Сперва нужно попробовать самое простое. Ну, в общем-то, как обычно. Заходим в настройки… Стоп! Не забываем сохранить промежуточный результат, как я уже говорил и, собственно, сам файл. Хорошо. Заходим в настройки слоя и пробуем крутить внутренние/внешние тени. Таким образом, внешняя тень создает расплывчатую обводку, что помогает сгладить края. А внутренняя тень затемняет светлые края, которые остались от перехода двух разных цветов. Аналогично работает и осветление, только противоположно – осветляя все. К слову, тенями тоже можно осветлять, только лишь изменив цвет на более яркий. Ну и получаем мы вот что-то уже более-менее.
 

Если уж совсем не получается расправиться с краями, тогда поможет растушевка. Для этого необходимо выделить нашу картинку и далее: «Выделение -> Модификация -> Растушевка(ставим от 3 до 5)». После чего проделываем уже знакомую операцию: «Выделение -> Инверсия -> Удалить». После каждого нажатия на кнопку «Delete» края будут все сильнее растворяться в небытие. В случае, если вы заметно переборщили и края уж совсем уплыли, надо продублировать слой и объединить с предыдущим. Так до тех пор пока не добьетесь нужного результата.
 

Так или иначе, вы наверное уже заметили мой косячный пистолет и внезапное исчезновение лишних кусков картинки, которые я удалил ластиком. С подобным методом можно подходить далеко не к каждому изображению. В данном случае, как вариант, можно просто удалить большую часть ненужной части картинки и далее воспользоваться ластиком, чтобы удалить оставшиеся детали. Но, я бы посоветовал воспользоваться и таки воспользуюсь инструментом - «Прямолинейное лассо». Суть в том, что если вы достаточно приблизите картинку, как на примере с ластиком, вам будет гораздо удобней делать выделение этим инструментом, чем каким либо еще. Удобство обеспечивает возможность "зацепиться" на определенной точке, каждую из которых связывает прямая линия. Таким образом, выделение прямыми линиями значительно ускоряет процесс, а вернувшись на прежние масштабы, вы заметите, что даже круг без проблем выделяется таким способом, без явных углов. Есть еще и два других вида лассо, принцип работы с которыми аналогичен. Если вдруг у вас появились неровности, то тени или растушевка, прекрасно доделают работу.
 

Завершая первый пункт, поговорим о красивостях. Чтобы придать картинке некую пышность и добавить красок, можно по обычной схеме лезть в сторону настроек насыщенности/контраста. Но есть также множество других, более интересных способов. Самый простой вариант – это поиграть с наложением. Для этого создаем дубликат слоя и начинаем экспериментировать. Как правило, почти для всех картинок можно по стандарту использовать наложение двух видов: «перекрытие» или «мягкое наложение». Оба выполняют одну и ту же функцию, просто от первого картинка может стать хуже, ибо эффект от такого наложения гораздо мощнее. Вдобавок для этого слоя можно поставить насыщенность на -100. Основной же слой, с дубликатом которого мы только что проделали нехитрую операцию, можно также подкрасить. Добавив яркости и насыщенности.
 

Под конец, никто не мешает вам поиграть с тенями и прочими настройками. После того как ваше детище будет завершено, обязательно незабываем сохраниться. Далее, ничего не трогая, отключив все ненужные слои, сохраняем файл в png. формате. Открываем этот сохраненный файл в отдельном окне и видим, что у нас все слои слепились воедино, и получилась единая картинка. Все отлично. Теперь выделяем нашу аватару и, не снимая выделения, проделываем следующие два шага: «Изображение -> Кадрировать». Все пустые и ненужные части удалились, и картинка теперь плотно сидит на холсте. Для завершения остается только лишь зайти в настройки изображения и поменять максимальное число на 140 пикселей, меньшее число подстроится под выбранный формат.
Вуаля!
п.с. На скриншотах вы можете заметить сильное перенасыщение, что как я понимаю, вызвано как раз таки тем, что это скриншот, а не оригинал рисунка. Корректировать скриншоты по насыщенности я посчитал лишним.

---

Совет от фуфа:
Если у вас возникнут вопросы по тому, где именно находится та или иная функция, сначала вбейте ее название в гугл картинки.

---

Вот пока и все. В следующей статье я расскажу про способы создания рамки и о применении сторонних рамок.