1


"Помощь в развитии Сайта "


"Торрент- трекер от Наших сайтов"


"Архив сайта"


"Народная Солянка за 17 декабря 2010 - утечка билда!!!!!"


Выбрать дизайн:
Страница 1 из 11
Форум » Для вебмастеров » Мастерская Photoshop » Создаем аватарку без фона
Создаем аватарку без фона
LENA_D Дата: Пт, 07.11.2014, 14:05:27 | Сообщение # 1

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



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

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


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



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



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

1)Фильтр -> Оформление -> Фасет

2)Изображение -> Коррекция -> Яркость(+45)/Контрастность(+100)

3)Усиление резкости -> Умная резкость(100)



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

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

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

«# 464646».

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

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

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

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


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

Вуаля!



п.с. На скриншотах вы можете заметить сильное перенасыщение, что как я понимаю, вызвано как раз таки тем, что это скриншот, а не оригинал рисунка. Корректировать скриншоты по насыщенности я посчитал лишним.

Совет от фуфа:

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


 
Weles17 Дата: Пт, 07.11.2014, 14:35:27 | Сообщение # 2

Призрак Зоны
Страна: Российская Федерация
Твой город: Алтай
Сталкер
В Зоне Реактора с 19.11.2011
Сообщений: 395
Заслуги в Зоне Реактора
За 300 Сообщений
Могу добавить, что изображения без фона не все файлообменники поддерживают - внизу пример. Многие по умолчанию добавляют белый или чёрный фон.



Сообщение отредактировал Weles17 - Пт, 07.11.2014, 14:41:12
 
Форум » Для вебмастеров » Мастерская Photoshop » Создаем аватарку без фона
Страница 1 из 11
Поиск:

Сегодня в Баре - Реактор

Кто был:
Легенда условных обозначений : Призрак, Администратор, Модератор, Проводник, Сталкеры, Чистое небо, Тёмные, Свобода, Наёмники, Нейтралы, Военные, Долг, Монолит, Заблокированные .

Последние сообщения:

Чат

Активисты Форума:

Нужные темы:


Radio Унесённых Сталкером
LENA_D               (09.10.2010)
CMIT               (03.04.2016)
kapa               (09.01.2014)
Dimon02022               (08.11.2011)
Strelok               (01.11.2014)
ULTRA               (04.09.2015)
tyman21               (09.11.2013)
Этот               (01.08.2015)
vitto               (31.03.2011)

Пришедшие в Бар:


euniceqz16               (11.12.2016)
iyaxumav               (11.12.2016)
ejayooniro               (11.12.2016)
ukapijeqixuqu               (11.12.2016)
ogesaguukoj               (11.12.2016)
uxojurecaqase               (11.12.2016)
Push 2 Check Рейтинг@Mail.ru Этот сайт защищен «Site Guard» Яндекс.Метрика