Make a 3D Recycling Bin Icon with PhotoshopВ этом уроке я покажу вам, как сделать с чистого листа привлекательный 3D значок мусорного ящика со смятой белой бумагой. Шаг 1: Настройка нового документаСоздайте новый документ, выбрав (File > New) или нажав Ctrl + N. Шаг 2: Создание верхней части мусорного ящикаСоздайте новый слой, выбрав Layer> New> Layer или с помощью сочетание клавиш Ctrl + Shift + N. Назовем слой, "top".Выберите инструмент прямоугольник с закруглением (U) и установите радиус в 10px Перейти в Edit > Transform > Skew. Перетащите верхний левый и правый верхний угол внутрь. Дважды щелкните на слой в панели слоев, чтобы открыть стиль слоя. задайте параметры (Drop Shadow) белый цвет тени (#ffffff). Теперь
задайте параметры (Gradient Overlay) и создадим переход от
светло-синего (#89bef9) к светло голубом (#99d9fa ), поставьте еще
галочку возле Reverse. Результат должен выглядеть так: Шаг 3: Создаем отражения светаСоздайте
новый слой (назовем его "top-shine"). Используйте Rectangular Marquee
Tool (M), Сделайте такое выделение как на картинке ниже. Выберите Gradient Tool (G), выберите градиента от белого к прозрачному и установить стиль градиента Reflected Gradient. Примените градиент, начиная от центра к правому или левому краю вашего прямоугольного выделения. Слой "top-shine" смените стиль слоя на "Overlay" и и установите Opacity 23%. Шаг 4: Создание иллюзии глубины
Создаем новый слоя назовем его "top-depth" над слоем "top", создаем
фигуру с помощью Rounded Rectangle Tool (U) и Edit> Transform>
Skew, как мы делали раньше.Совет: В качестве альтернативы, вы
можете продублировать слой "top" , и отредактировать его используя
Edit> Transform> Scale. Откройте стиль слоя и задайте (Drop Shadow) и (Gradient Overlay) такие параметры.Drop ShadowЦвет теней должен быть белым (# ffffff). Gradient Overlayсоздадим переход градиента от светло-синего (# 61a0dc), к темно-синему (4b84be #), не забудьте поставить галочку возле Reverse Должен получиться такой результат:  Шаг 5: Организуйте ваше слоиАвтор
урока советует создавать отдельные группы слоев. Это намного упрощает
их поиск. Нажмите на иконку Создать новую группу слоев (это выглядит как
папка) в нижней части панели слоев. Назовите группу "top". Перетащите
в эту группу каждый созданный слой до этого - за исключением фонового
слоя. Сверните эту группу, нажав на маленький значок треугольника слева
от папки. Теперь стало намного компактней в панели "Слоев".Шаг 6: Создание нижней части мусорного ящика.Теперь, в панели "Слои", создайте новый слой над слоем Background, назовите его "front".С
помощью Rounded Rectangle Tool и Transform -> Skew, как и в
предыдущих шагах мы использовали для верхней части мусорный ящик, но на
этот раз, нам нужно сделать такую форму как на нижней картинке. Шаг 7: Зададим слою "front" нужный цвет.Откроем
стиль слоя, если забыли как это делать сделайте двойной клик по слою
"front", потом перед вами откроется окно выберете Gradient Overlay. И
создадим там градиент с переходом от светло синего (#6dc2f8) к темно
синем (#29619f). Не забывайте поставить галочку возле Reverse. Вот имеем такой вид: Шаг 8: Создадим тень с правой стороны края мусорного ящика.Сделать новую форму справой стороны значка, как на картинке. Назовем этот слой "side-shade". Зададим цвет тени с помощью Color Overlay стилях слоя, с использованием темного синего цвета (# 1f456f).  Теперь
создадим маску слоя, чтобы тень сделать боле реалистичной. Выбираем
слой "side-shade", зададим ему маску слоя, нажав на значок "Добавить
маску слоя" в нижней части панели.Если все сделано правильно, вы увидите, что "side-shade" слой будет выглядеть как показано на следующем рисунке. Теперь
возьмите Gradient Tool (G) и установите его параметры так, что градиент
бил от белого до черного, а стиль градиент выбираем значение Linear
Gradient. Примените градиент как показано ниже (обозначен красной
стрелкой). Это должно привести к созданию, правой стороне мусорный ящик эффекта изогнутости. Теперь нужно снизить непрозрачность слоя до 29%, для большей реалистичности. Шаг 9: Создаем тень левому краю мусорный ящика.Здесь немного проще. делаем копию слоя "side-shade", нажав Ctrl + J, или выбрав Layer> Duplicate Layer в главном меню.Теперь нужно этот слой отразить по горизонтали, это делаем с помощью (Edit> Transform> Flip Horizontal). Теперь перетащите дублированный слой с помощью Move Tool (V).  Шаг 10: Создаем Свет Отражения.
Зададим нашем значку радиальное отражения света, чтобы его поверхность
стала еще более интересной. Создайте новый слой (можно назвать его
"front-light"). Выбираем с палитры инструментов Elliptical Marquee Tool
(M) делаем выделение круга и заполнением его белым цветом.Расположение круга должно быть так как на картинке ниже. Теперь
нужно Смягчить края круга, с помощью (Gaussian Blur), выбираем
(Filter> Blur> Gaussian Blur) в настройках задаем значение радиус
около 18,6 px. Результат должен получиться так как на картинке ниже: Теперь
нужна удалить отражение света на вершине, выбрав инструмент
(Rectangular Marquee Tool) с прямоугольным выделением и нажав (Delete),
чтобы удалить выделенную область. Для реалистичного отражения нужно сменить наложения слоя с Normal на Overlay и снизить непрозрачность до 67%. Шаг 11: Добавим символ переработки.Выберите
Custom Shape Tool (U) на Панели инструментов. Ищем символ "Recycle 2"
(которая находится в "Symbol" набор custom shapes).Делаем произвольной форму по вашем усмотрению в центре нашего мусорного ящика. Шаг 12: Стиль символа переработки.Нам нужно сделать так чтобы символ был выдавлен из стенки ящика. Для этого будем использовать стили слоя.Drop ShadowУстановим цвет тени синий (# 3c6a99). Inner ShadowВнутренний цвет тени должен бить белым (# FFFFFF). Gradient OverlayЗадайте градиент цвета наложения от голубого (# bee4f9) к белому (FFFFFF #).  Эти стили слоя дают некоторую гармонию символу с остальной частью дизайна наших иконки. Прежде
чем двигаться дальше, давайте организуем нашу работу в составе
созданных всех слоев "front" в слой группы. Эго также назовем "front".
"front" группа слоев должна быть между слоем "Background" и слоя
"top" группы.Шаг 13: Создаем смятую бумагу.Теперь
мы создадим мятый клочок бумаги, который бросили в нашу мусорный ящик.
Над группою слоев "top", создайте новый слой (назовем этот слой как
"paper").Для создания бумаги будем использовать (Polygonal Lasso Tool, Pen Tool). Будем создавать случайную форму мятого клочка бумаги. Шаг 14: Создаем реалистичность складчатой формы бумаги:Открываем стиль слоя и задаем такие параметры: Drop ShadowЦвет тени зададим черный цвета (# 000000) и его прозрачность снижаем до 10%. StrokeЗдесь также задаем цвет черный (# 000000).  Шаг 15: Создаем складки бумаги.Чтобы
добавить складки на бумагу, создайте новый слой (назовите его
"paper-shade1") и нарисуйте черные фигуры вдоль некоторых из его краев. Снижаем
непрозрачность слоя "paper-shade1" примерно до 14%. Это должно привести
к созданию бумаге некоторые скрытые глубины и определения. Чтобы добавить складки, просто создайте новый слой (назовем это один "paper-shade2") и нарисуйте более черные фигуры. Снижаем
непрозрачность до 4%. Добавление складок оттенков на разных слоях и
снижения непрозрачности на другое значение, придаст более подробные
случайных нюансов, которые сделают бумаге более реалистичный вид. Шаг 16: Создаем больше листов бумаги.Сначала
сделаем новую группу слоев для наших скомканные бумажек. Называем эту
группу "paper". Перетащите все слои, связанные с бумагой те которые
только что сделали в новою группу слоев.Далее продублируйте этот слой группы (Layer> Duplicate Group) сделать еще один лист бумаги.Переместите новый клочок бумаги от первого с помощью Move Tool (V). Сделайте еще бумажку используя ту же технику. Нужна
немного изменить куски бумаги так, чтобы они не выглядят идентичными.
это сделаем с помощью команды Free Transform (Edit> Free Transform).
Вы можете вращать их, изменять их размеры, и так далее.Мы
изменим угол средней бумажки на 45 °. Выберите слой средней бумажки из
группы слоев в панели "Слои", выбрать (Edit> Transform> Rotate), а
в панели параметров установите опцию поворот на 45 °. Создайте
столько же бумажек, как вы хотите, поэкспериментируйте с углами,
размеры и порядок наложения слоя. Цель состоит в том, чтобы куски мятой
бумаги изменялись так, чтобы наша корзина имитировала реальную корзину
для мусора. Вы также можете добавить кусочки бумаги за пределами мусорного ящика, чтобы она выглядела более реальной. Шаг 17: Сделаем наш мусорный ящик полупрозрачным.Давайте сделаем нашу корзину так, будто мы можем увидеть внутри нее немного мусора. Начните с выбора всех "paper" групп слоев - кроме бумажек, которые лежат на полу.  И еще сделаем слияние дублированных слоев щелкнув правой кнопкой мыши на панели cлои и выбрать "Merge Layers". Повторяйте,
дублировать так чтобы в итоге вы получите что-то как на картинке ниже.
Мы хотим, чтобы корзина выглядела, заполненной до краев. Слейте эти слои (выберите их в панели слоев и нажмите Ctrl + E) и название объединенного слоя, как "translucent-property".Добавить маску слоя на слой "translucent-property", затем с помощью Gradient Tool, черно-белым градиентом создайте маску. Должно получиться как на картинке ниже: Шаг 18: Добавим тени на куски бумаги.Мы
должны добавить некоторые дополнительные тени от листов бумаги.
Создайте новый слой называется "extra-shadow", и на этом новом слое,
нарисуйте черные фигуры по краям бумаги. Установите непрозрачность слоя на 10%, чтобы смягчить тени. Шаг 19: Создаем тень под корзиной.Давайте создадим тень на полу под мусорным ящиком. Создайте новый слой (назовите его "main-shadow") чуть выше слоя Background.С помощью Rounded Rectangle Tool (U), чтобы сделать округлые углы квадрата. Применить фильтр (Gaussian Blur), чтобы смягчить края округлые прямой угол, используя радиус 18-19px. С
помощью команды Free Transform (Ctrl + T), как раньше, измените эту
форму так, что он выглядит, как показано на следующем рисунке. Используйте косые преобразования так, чтобы углы в соответствии с формой корзины.  Шаг 20: Создаем тень для бумажки на полу.Мы
должны добавить тень под мятые листики бумаги, которые находятся на
полу так, чтобы освещение нашей иконки являлось точным и
последовательным. Во-первых, создайте новый слой (назовите его
"paper-shadow") выше слоя тени корзины (который мы назвали
"main-shadow").С помощью Brush Tool с мягкими черным кончиком кисти и Master Diameter, что составляет около 65px. Сделайте один клик на холсте, так как на картинке ниже. Используйте
Free Transform для сжатия мазка кисти, чтобы он выглядел как тень от
бумажки на полу. Разместите его в нижней части смятых листов бумаги с
помощью Move Tool (V).  Сделайте
копию слоя "paper-shadow" и измените масштаб с помощью Free Transform.
Сместите его под другие бумаги с помощью Move Tool (V). Наличие двух
слоев тени дает глубину наших кусочков бумаги как можно более точным.  Шаг 21: Добавим отражение света окна.Давайте добавим к нашей работе некоторые тонкие детали. Мы приходим к окончательному шагу дизайну нашей иконке.Теперь
мы сделаем отражение света в верхнем левом углу. Создайте новый слой
под названием "reflection". Используйте Polygonal Lasso Tool (L) для
того чтобы сделать неравномерное выделение. Заметим, что новый слой,
должен быть на самом верху всех слоев. Далее используя Gradient Tool (G), применим градиент от белого к прозрачному градиент. Предположим, что источник света падает с окна. Сделайте выделение, которое выглядит как крест (с помощью Polygonal Lasso Tool). Затем, просто нажмите кнопку Delete, чтобы удалить части отражения света. Изменить режим наложения слоя "reflection" на (Overlay), а также еще нужно уменьшить непрозрачность до 35%. Шаг 22: Добавим еще складки на куски бумаги.Добавим
нашим бумажкам некоторые штрихи. Создайте новый слой (назовем этот слой
"crumples"). На новом слое, нарисуйте черные фигуры по краям, как
показано ниже. Сократите непрозрачность этого слоя примерно до 10%. Это дает нашим бумажкам некоторые тонкие определения. Шаг 23: Добавить отражения света на краю корзины.Для
завершения нашей работы, мы добавим отражение света на верхней границе
корзины. Этот процесс даст нашей поверхности еще более интересный
элемент дизайна, а также привлечь взгляд зрителей к середине иконки.
Создайте новый слой (мы можем назвать этот слой "add-shine"). С помощью
Brush Tool с белым, мягким кистью размером около 45px. Нажмите один раз в
центре (в направлении сверху). С помощью Free Transform изменяем форму
блика как на картинке ниже. Установите непрозрачность этого слоя на 60%. Краткий обзор выполненной роботыВсе готово 
! В этом уроке мы использовали основные инструменты Photoshop, таких
как Rounded Rectangle Tool, Custom Shape Tool и Gradient Tool, а также
базовые команды, такие как Free Transform и косых преобразования
обратить, сделали значок мусорного ящика "с нуля".Вы можете
изменить ваши стили слоя, изменить цвет мусорного ящика и другое. Ниже
вы можете увидеть, что я изменил цвет на зеленый. Автор: Supratim Nayakперевод: NeSK
|
