Пришло время очередного урока, но, знаете, он будет очень милым и даже вернет некоторых в детство. Мы будем учиться заштриховывать иконки — помните, как было скучно на физике, например, и мы рисовали шариковой ручкой на последней странице тетрадки? Весь урок займет около 20 минут, а понадобится нам Adobe Photoshop и набор плоских иконок.

Что должно получиться

Что понадобится

• Набор иконок 42 Icons for Designers

Шаг 1

Для начала нам нужно нарисовать паттерн для иконок. Нажмите Control + N, создайте новый документ размером 200 px на 200 px и убедитесь, что фон в режиме Transparent / Прозрачность.

Шаг 2

Задайте цвет переднего плана, например, #2E8E99 и выберите инструмент Brush Tool / Кисть. Далее Window > Brush / Окно > Наборы кистей, выберите Hard Round / Жесткая Круглая и задайте следующие параметры (см. ниже).

Теперь перейдите к холсту и создайте 2 набора линий (вертикальных и горизонтальных) как показано на картинке.

Шаг 3

Чтобы сохранить свой паттерн, воспользуйтесь Edit > Define Pattern / Редактирование > Определить узор. Выберите имя своему паттерну и нажмите ОК.

Шаг 4

Нажмите Control + N и создайте новый документ с размерами 600 px на 500 px.

Шаг 5

Установите цвет переднего плана на #B08232, возьмите Paint Bucket Tool / Инструмент «Заливка» и залейте холст новым цветом.

Зайдите в Layers Style / Стиль Слоя для фонового слоя и задайте следующие параметры:

Шаг 6

Откройте скачанный файл 42 Icons for Designers и зайдите в группу  "flat". Выберите те иконки, которые вам нравятся больше всего, и перетяните их в свой рабочий документ.

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

Шаг 7

Откройте окно Layer Style / Стиль Слоя для иконки и задайте параметры, как показано внизу.

После этого идите в палитру Layers / Слои, правой кнопкой мыши нажмите на редактируемую иконку и выберите Copy Layer Style / Скопировать Стиль Слоя. Перейдите к другим иконкам, кликните правой кнопкой и выберите Paste Layer Style / Вклеить Стиль Слоя.

Шаг 8

Идите в палитру Layers / Слои, выберите иконку и сделайте ее дубликат. Откройте окно Layer Style / Стиль Слоя для свежесозданной копии иконки и задайте параметры, как показано ниже.

В секции Pattern Overlay / Наложение Узора используйте паттерн, который вы только что создали.

Теперь скопируйте этот новый стиль слоя, продублируйте остальные иконки и задайте этот стиль им.

Шаг 9

Выберите одну из иконок, идите в палитру Layers/ Слои и выделите все фигуры, из которых она создана.  Затем делаем правый клик на этих выделенных фигурах и выбираем Covert to Smart Object / Преобразовать в Cмарт-объект.

Проделайте то же самое с остальными иконками.

Шаг 10

Продолжаем работать в палитре Layers / Слои. Выделите смарт-объекты, из которых состоит иконка с конвертом. Смотрим на нижнюю часть палитры Layers / Слои, нажимаем Create new fill / Создать Новый Слой или кнопку корректировки слоя, выбираем Hue/Saturation // Цветовой тон/Насыщенность и нажимаем Control + Alt +G.

Теперь идем в Properties / Свойства и просто вводим атрибуты, показанные ниже на картинке.

Шаг 11

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

Ну, вот мы и закончили!

Финальный результат

Автор - Razvan Gabriel

Перевод — Дежурка

Смотрите также:

• Эффект вырезанных бумажных кругов в Photoshop 
• Эпичная фотоманипуляция с рыцарем в Photoshop 
• Создаем эффект разваливающегося каменного текста в Adobe Photoshop