Почтовый конверт в PhotoShop. Старый конверт

В этом уроке Вы узнаете, как нарисовать иконку с конвертом.

Шаг 1. Создайте новый документ 512×512 пикселей с белым или прозрачным фоновым слоем. Залейте фоновый слой серым (9D9D9D). Создайте вертикальную и горизонтальную направляющие для удобства.

Шаг 2. Создайте новый слой и назовите его “envelope”. Выберете инструмент Rectangular Marquee Tool (M) (прямоугольное выделение) и на новом слое создайте и залейте выделение белым. Назовите новый слой “body”.

Шаг 3. Дважды кликните на новом слое (в палитре слоев) и примените к нему “Gradient Overlay” (заливка градиентом). Настройки показаны на рисунке.

Шаг 4. Создайте новый слой и назовите его “pattern”. Используя инструмент Rectangular Marquee Tool (прямоугольное выделение), заливайте выделения по очереди цветами #6092BD и #E84141. Убедитесь, что расстояние между всеми прямоугольниками одинаковое.

Шаг 5. Переместите полоски к левому краю конверта. Выполните команду Edit > Transform > Skew (редактировать > трансформирование > скос) и «скосите» полоски так, как показано на рисунка. Ту часть, которая вышла за пределы конверта, удалите при помощи инструмента Eraser Tool (ластик).

Шаг 6. Создайте новый слой и назовите его “shade”. Зажмите CTRL и кликните по слою “body”, чтобы выделить его содержимое. Примените черно-белый градиент от левого края конверта до середины полос (примерно). Измените режим наложения слоя на Multiply (Умножение) и уменьшите его непрозрачность (Opacity) до 30%.

Шаг 7. Сейчас нужно создать такие же полосы для правого края конверта. Для этого дублируйте слой “pattern” (CTRL+J), выполните команду Edit > Transform > Flip Horizontal (Редактировать > Трансформирование > Отразить по горизонтали) и переместите его в правый край конверта. То же самое проделайте со слоем “shade”.

Шаг 8. Выберите инструмент Pen (Перо) и создайте фигуру как показано ниже. Назовите новый слой “lower”

Для более точного размещения фигуры, можете использовать направляющие.

Шаг 9. Примените к слою “lower” следующие стили:

Шаг 10. Сделайте копию слоя “pattern” и расположите его выше слоя “lower” (в палитре слоев). Выполните команду Edit > Transform > Rotate 90 deg CCW (Редактировать > Трансформирование > Повернуть на 900 против часовой стрелки). Затем поместите полосы так, как показано на рисунке.

Сотрите незаконченные секции полосок, используя инструмент Eraser (Ластик). Выберите инструмент Polygonal Lasso (Полигональное лассо) и выделите полную полоску. Затем щелкните на выделении правой кнопкой мыши и выберите Layer via copy (скопировать на новый слой). Переместите полученную полоску вправо.

Шаг 11. Выделите содержимое слоя “lower” и на новом слое залейте выделение черно-белым градиентом как в шаге 6. После этого смените режим наложения на Multiply (Умножение) и измените непрозрачность (Opacity) до 50%

Шаг 12 . Создайте новый слой и расположите под слоем “lower”. Выделите содержимое слоя “lower” и залейте выделение черным. Нажмите CTRL + T и измените высоту до 102%. Теперь выполните команду Filter > Blur > Gaussian Blur (Фильтры > Размытие > Размытие по Гауссу) с радиусом 0,7 пикселей. Уменьшите непрозрачность до 40%. Удалите часть тени, которая вышла за пределы конверта.

Шаг 13. Используя инструмент Pen (Перо) создайте фигуру, изображенную на рисунке. Новый слой назовите upper.

Шаг 14. Добавьте этому слою следующие стили:

Шаг 15. Чтобы добавить тень, повторите шаги 11 и 12, но с некоторыми изменениями. В шаге 11 измените непрозрачность до 10%, а в 12 – высоту до 103%, радиус размытия до 1,2 пикселей и непрозрачность до 70%.
Вы должны получить что-то, похожее на это:

Шаг 16. Теперь нужно добавить тень внизу конверта. Для этого создайте черный прямоугольник и примените к нему следующие фильтры:
Filter > Blur > Gaussian Blur (Фильтры> Размытие > Размытие по Гауссу) с радиусом 2,0 пикселя
Filter > Blur > Motion Blur (Фильтры > Размытие > Размытие в движении) с дистанцией 20 пикселей

Наш конверт готов. Осталось добавить к нему штамп. Множество штампов Вы можете найти в Интернете, но можете сделать сами. Для этого проделайте следующие шаги.

Шаг 17. Создайте новый документ 180×180 пикселей с белым фоновым слоем. Создайте новый слой и назовите его “shape”. Создайте круг любого цвета. Измените его заливку (Fill) на 0%. И задайте ему параметр Stroke (Обводка).

Шаг 18. Дублируйте слой “shape” и уменьшите круг наполовину.

Шаг 19. Выделите содержимое копии слоя “shape”. Перейдите на вкладку «контуры» (Paths) и нажмите на кнопку Make work path from selection (Создать рабочий контур из выделения).

Выберите инструмент Type Tool (текст), подведите курсор к краю контура. Когда курсор изменит свой вид, нажмите на контур и напишите что-нибудь. Текст будет располагаться вокруг контура. Для завершения штампа добавьте какой-нибудь логотип в центр круга.

Шаг 20. Сделайте фоновый слой невидимым. Нажмите сочетание клавиш CTRL + SHIFT + E для того, чтобы объединить все видимые слои в один.
Выберите только что объединенный слой и выполните команду Layer > Add layer mask > reveal all . Теперь откройте это изображение () и поместите его поверх штампа. Назовите новый слой fade. Выделите содержимое слоя fade и выполните команду Select > Color Range (Выделение > Цветовой диапазон) (настройки показаны на рисунке). После этого белая часть изображения выделится. Не отменяя выделения, сделайте слой fade невидимым, щелкните правой кнопкой мыши на символе маски слоя “stamp” и выберитеApply Layer Mask (применить маску).

Шаг 21. Переместите штамп в документ с конвертом поверх всех слоев. Уменьшите непрозрачность до 35%.

Шаг 22. Выделите содержимое слоя upper (активным оставаться должен слой со штампом), щелкните на выделении правой кнопкой мыши и выберите пункт Layer Via Cut (Вырезать на новый слой). Уменьшите непрозрачность получившегося слоя до 30%. Удалите фоновый слой и сохраните файл в формате PNG.

Добрый вечер пользователи сайта сайт. В этом уроке мы научимся создавать иконку конверта в Photoshop (фотошоп). Вам нужно потратить всего лишь 15-20 минут времени.

Вот что у нас должно получится в конце урока:

Шаг 1
Открываем новый документ Ctrl+N размером 256×256 pix с разрешением 300 dpi . Выбираем инструмент Rectangle Tool [U] в режиме Shape белого цвета с фиксированным размером 100х75 pix и создаем основу конверта.

Шаг 2
Применяем стиль слоя Gradient Overlay

Шаг 3
Далее создадим верхний отворот конверта. Дублируем слой с основой конверта Ctrl+J , очищаем стили слоя, кликнув правой клавишей мыши по пиктограмме стилей слоя в появившемся окне выберите пункт Clear Layer Style и перемещаем его в верхнюю часть конверта.

Далее с помощью инструмента Pen Tool [P] добавляем узлы, а с помощью инструмента Direct Selection Tool [A] выбирая необходимые создаем желаемую форму отворота конверта (P.S. используйте направляющие для более точной подгонки узлов).

Шаг 4
Применяем стили слоя Gradient Overlay и Stroke со следующими значениями настроек.

В результате у вас получится следующий вид

Шаг 5
Переместите слой с отворотом конверта ниже слоя с основой в палитре слоем и выбрав инструмент Move Tool [V] передвиньте его на 2 pix вниз чтоб скрыть белую обводку.

Шаг 6
Создадим боковые отвороты. Дублируем слой с основой конверта Ctrl+J , очищаем стили слоя (смотри шаг 3) и так же с помощью инструмента Pen Tool [P] добавляем новые узлы, а с помощью инструмента Direct Selection Tool [A] выбирая необходимые перемещаем их тем самым создаем желаемую форму боковым отворотам конверта.

Шаг 7
Применяем стили слоя Gradient Overlay , Inner Shadow и Drop Shadow со следующими значениями настроек.

В результате у вас получится следующий вид

Шаг 8
Добавим немного объема нашим боковым отворотам. Сделаем сначала для правой части. Дублируем слой с боковыми отворотами, очищаем стили слоя и перемещаем слой ниже в палитре слоев. Изменяем цвет на черный и и выбрав инструмент Move Tool [V] передвиньте его на 1 pix влево.

Шаг 9
Выбираем инструмента Direct Selection Tool [A] выбирая необходимые узлы и перемещаем их в право так, чтоб они не выходили за область конверта.

После уменьшите этому слою Opacity до 10% .

Шаг 10
Теперь приступим к левой части. Дублируем слой с боковыми отворотами, очищаем стили слоя и перемещаем слой ниже в палитре слоев. Изменяем цвет на белый и выбрав инструмент Move Tool [V] передвиньте его на 1 pix в право.

Затем так же как и в предыдущем шаге инструментом Direct Selection Tool [A] выбирая необходимые узлы и перемещаем их влево так, чтоб они не выходили за область конверта, только не уменьшайте слою Opacity !.

Этот урок по фотошопу описывает процесс создания простой иллюстрации почтового конверта.

Законченное изображение

Детали урока
Использованное ПО: Adobe Photoshop CS5
Примерное время выполнения: 45 минут
Сложность: для начинающих/средняя

Шаг 1
Создайте новый документ: Control + N. Введите параметры, представленные на скриншоте ниже, и нажмите OK. Включите отображение сетки: Просмотр > Показать > Сетку (View > Show > Grid) и Привязку к сетке: Просмотр > Привязка к… > Сетке (View > Snap To > Grid). Вам понадобится сетка ячейками в 5 пикселей. Пройдите в меню Редактирование > Установки > Направляющие, Сетка и Фрагменты (Edit > Preferences > Guides, Grid & Slices). Обратите внимание на раздел Сетка (Grid). Введите величину 5 в поле Линия через каждые… (Gridline Every) и величину 1 в поле Внутреннее деление на… (Subdivision). Также установите цвет сетки: #a7a7a7. Задав все эти параметры, нажмите OK. Пусть вас не смущает покрывшая холст сетка. В конце концов она значительно упростит вам работу. Кроме того, вам необходимо отобразить еще и панель информации: Окно > Инфо (Window > Info), чтобы в реальном режиме времени отслеживать положение и размер ваших фигур.

Шаг 2
Установите Основным цветом (foreground color) - #ddf1ff и выберите инструмент Прямоугольник со скругленными углами (Rounded Rectangle Tool). Установите Радиус – 10 пикселей и начертите фигуру размером 240x150 пикселей. Режим привязки к сетке облегчит вам работу. Назовите слой с этой голубой фигурой “Основа”.

Шаг 3
Далее нам предстоит создать простой узор. Нажмите Control + N, чтобы открыть новый документ. В поле Ширина (Width) введите 10, а в поле Высота (Height) – 20, после чего нажмите OK. Установите Основным цветом (Foreground color) – черный, выберите инструмент Прямоугольник (Rectangle Tool) и начертите 10-пиксельный квадрат, расположив его, как показано на первом изображении. При этой активной векторной фигуре переключитесь на инструмент Стрелка (Direct selection Tool). Выделите две опорные анкерные точки, показанные на втором изображении ниже, и просто переместите их на 5 пикселей вверх. Теперь снимите, сделав эту черную векторную фигуру неактивной, пройдите в меню Редактирование > Определить узор (Edit > Define Pattern). Введите название “Узор конверта”, и нажмите OK. Сохраните и закройте этот документ и вернитесь к своему соновному.

Шаг 4
Продублируйте слой с Основой (Control + J). Выделите копию и выберите инструмент Прямоугольник (Rectangle Tool). На панели опций в верхней части окна программы выберите режим Область пересечения фигур (Intersect) и начертите фигуру с размерами 10x150 пикселей, как показано ниже.
Двойным кликом по слою с векторной фигурой на палитре слоев откройте окно параметров наложения. Примените стили слоя Тень (Drop Shadow) и Наложение узора (Pattern Overlay), с настройками, приведенными на изображениях ниже. В разделе Наложение узора (Pattern Overlay) укажите узор, созданный на предыдущем шаге.
После того, как вы примените все эти стили, кликните ПКМ на вашей, покрытой узором векторной фигуре и, в открывшемся контекстном меню, выберите пункт Копировать стиль слоя (Copy Layer Style).

Шаг 5
Продублируйте слой с Основой еще раз. Выделите копию и выберите инструмент Прямоугольник (Rectangle Tool). Убедитесь, что на панели опций в верхней части окна программы по-прежнему активен режим Области пересечения фигур (Intersect) и начертите фигуру с размерами 10x150 пикселей, как показано на первом изображении ниже.
Теперь кликните ПКМ по слою с этой фигурой на палитре слоев, и, в открывшемся контекстном меню, выберите пункт Вклеить стили слоя (Paste Layer Style). Откройте окно стиле слоя для этой же фигуры, и в разделе Тень (Drop Shadow) просто инвертируйте значение Угла (Angle).

Шаг 6
Продублируйте слой с Основой (Control + J), выделите копию и переместите ее на задний план (Shift + Control + ]).
Дважды кликните на палитре слоев по цветной иконке на слою с только что созданной копией, и замените голубой цвет на #ed4505.

Шаг 7
Убедитесь, что активным является слой с оранжевым скругленным прямоугольником и выберите инструмент Прямоугольник (Rectangle Tool). На панели опций в верхней части окна программы активируйте режим Область пересечения фигур, и начертите векторную фигуру размером 260x100 пикселей, как показано на первом изображении ниже.
Теперь выберите инструмент Перо (удалить опорную точку) - Delete Anchor Point. Просто кликните по правой опорной точке, чтобы удалить ее и переключитесь на инструмент Стрелка (Direct selection Tool). Выделите оставшуюся верхнюю опорную точку, и сместите ее на 130 пикселей вправо. В результате у вас должно получиться нечто похожее на второе изображение, приведенное ниже.

Шаг 8
Откройте окно стилей слоя для оранжевой векторной фигуры и примените установки, приведенные на изображениях ниже.

Шаг 9
Продублируйте оранжевую фигуру. Кликните ПКМ по копии фигуры на палитре слоев, и, в открывшемся контекстном меню, выберите пункт Очистить стили слоя (Clear Layer Style). Убедитесь, что эта копия по-прежнему активна, уменьшите ее Заливку (Fill) до 0%, после чего откройте окно стилей слоя и примените установки, показанные ниже.

Шаг 10
Продублируйте слой Основа (Control + J), выделите копию и переместите ее на передний план (Shift + Control + ]). Теперь замените ее синий цвет на #b40007.

Шаг 11
При активном слое с только что созданным бордовым скругленным прямоугольником, выберите инструмент Прямоугольник (Rectangle Tool). На панели опций в верхней части окна программы активируйте режим Область пересечения фигур (Intersect) и начертите векторную фигуру размером 260x95 пикселей, как показано на первом изображении ниже.
Теперь выберите инструмент Перо (удалить опорную точку) - Delete Anchor Point. Просто кликните по правой опорной точке, чтобы удалить ее и переключитесь на инструмент Стрелка (Direct selection Tool). Выделите оставшуюся нижнюю опорную точку, и сместите ее на 130 пикселей вправо. В результате у вас должно получиться нечто похожее на второе изображение, приведенное ниже.

Шаг 12
Для выполнения следующих шагов нам понадобится сетка с величиной ячейки 1 пиксель. Пройдите в меню Редактирование > Установки > Направляющие, Сетка и Фрагменты (Edit > Preferences > Guides, Grid & Slices). Обратите внимание на раздел Сетка (Grid). Введите величину 1 в поле Линия через каждые… (Gridline Every).
Далее, при активном слое с бордовой векторной фигурой, выберите инструмент Прямоугольник (Rectangle Tool). На панели опций в верхней части окна программы выберите Вычесть из области фигуры переднюю фигуру (Subtract) и начертите векторную фигуру размером 8x13 пикселей, как показано на первом изображении ниже.
Переключитесь на инструмент Эллипс (Ellipse Tool). На панели опций в верхней части окна программы активируйте Добавить к области фигуры (Add) и начертите 14-пиксельный круг, как показано на втором изображении ниже.

Шаг 13
Откройте окно стилей слоя для бордовой векторной фигуры и примените установки, приведенные на изображения ниже.

Шаг 14
Продублируйте бордовую слой-фигуру. Выделите копию и очистите имеющиеся здесь стили слоя. Уменьшите Заливку (Fill) этого слоя до 0%, откройте окно стилей слоя и введите параметры, приведенные на следующих изображениях.

Шаг 15
Для выполнения следующих шагов нам понадобится сетка с ценой деления 5 пикселей. Пройдите в меню Редактирование > Установки > Направляющие, Сетка и Фрагменты (Edit > Preferences > Guides, Grid & Slices). Обратите внимание на раздел Сетка (Grid). Введите величину 5 в поле Линия через каждые… (Gridline Every).
Установите Основным цветом (Foreground color) – черный, выберите инструмент Прямоугольник (Rectangle Tool) и начертите векторную фигуру размером 210x80 пикселей, расположив ее, как показано на первом изображении ниже.
Теперь выберите инструмент Перо (удалить опорную точку) - Delete Anchor Point. Просто кликните по правой опорной точке, чтобы удалить ее и переключитесь на инструмент Стрелка (Direct selection Tool). Выделите оставшуюся нижнюю опорную точку, и сместите ее на 105 пикселей вправо. В результате у вас должно получиться нечто похожее на второе изображение, приведенное ниже.

Шаг 16
Выделите на палитре слоев черную векторную фигуру, и сместите ее под ранее созданные бордовые.
Кликните по слою с черной векторной фигурой ПКМ, и, в открывшемся контекстном меню, выберите пункт Преобразовать в смарт-объект (Convert to Smart Object). Измените Режим наложения (Blend mode) этого смарт-объекта на Мягкий свет (Soft Light) и пройдите в меню Фильтр > Размытие > Фильтр > Размытие > Размытие по Гауссу (Filter > Blur > Gaussian blur). Задайте величину 4 пикселя и нажмите OK.

Шаг 17
Далее, мы создадим простой узор на основе бумажной текстуры. Откройте в фотошопе изображение с бумажной текстурой, пройдите в меню Изображение > Коррекция > Обесцветить (Image > Adjustments > Desaturate) а затем – в меню Редактирование > Определить узор (Edit > Define Pattern). Присвой этому узору имя “Бумага” и нажмите OK. Сохраните и закройте этот документ. Вернитесь к своему основному документу.

Шаг 18
Продублируйте слой с Основой еще раз, выделите копию и переместите ее на передний план (Shift + Control + ]). Уменьшите Заливку (Fill) этого слоя до 0% и откройте окно стилей слоя. Откройте раздел Наложение градиента (Gradient Overlay) и задайте установки, приведенные на изображении ниже. Конечно же в качестве узора следует указать узор, созданный на предыдущем шаге.

Шаг 19
Создайте новый слой (Shift + Control + Alt + N), расположите его поверх всех существующих слоев. Установите Основным цветом (Foreground color) – черный, выберите инструмент Кисть (Brush tool), и кликните по холсту ПКМ, чтобы открыть выбора кистей. Выберите мягкую круглую кисть, задайте размер 50 пикселей и Жесткость (Hardness) – 0%. Нарисуйте с помощью этой кисти произвольный контур в нижней части вашего конверта, как показано на изображении ниже.

Шаг 20
Удерживая Ctrl, по слою с Основой на палитре слоев. В результате будет загружена выделенная область, включающая конверт. При активной выделенной области, выделите слой, созданный на предыдущем шаге и, кликнув по специальной кнопке Добавления слоя-маски (Add layer mask) в нижней части палитры слоев, создайте слоя слой-маску. В результате у вас должно получиться нечто похожее на второе изображение, представленное ниже.
Снимите выделение (Control + D), убедитесь, что активным является замаскированный слой, уменьшите его Непрозрачность (Opacity) до 30% и измените режим наложения на Мягкий свет (Soft Light).

Шаг 21
Создайте новый слой (Shift + Control + Alt + N), расположите его поверх всех существующих слоев. Установите Основным цветом (Foreground color) – белый, выберите инструмент Кисть (Brush tool). Нарисуйте с помощью этой кисти произвольный контур в верхней части вашего конверта, как показано на изображении ниже.

Шаг 22
Загрузите новую выделенную область, включающую слой с Основой, и используйте ее, чтобы замаскировать слой, созданный на предыдущем шаге.
Снимите выделение (Control + D), убедитесь, что активным является только что созданный замаскированный слой, уменьшите его Непрозрачность (Opacity) до 70% и установите его в Режим наложения (Blend mode) – Мягкий свет (Soft Light).

Шаг 23
Откройте для слоя с основой окно настроек стилей слоя и введите параметры, приведенные ниже:

Шаг 24
Продублируйте слой с Основой (Control + J). Откройте окно стилей слоя для созданной копии и измените параметры в разделе Тень (Drop Shadow) следующим образом:

Вот мы и закончили!

Шаг 1. Создайте новый документ 512x512 пикселей с белым или прозрачным фоновым слоем. Залейте фоновый слой серым (9D9D9D). Создайте вертикальную и горизонтальную направляющие для удобства.

Шаг 8. Выберите инструмент Pen (Перо) и создайте фигуру как показано ниже. Назовите новый слой “lower”

Для более точного размещения фигуры, можете использовать направляющие.

Шаг 9. Примените к слою “lower” следующие стили:

Шаг 10. Сделайте копию слоя “pattern” и расположите его выше слоя “lower” (в палитре слоев). Выполните команду Edit > Transform > Rotate 90 deg CCW (Редактировать > Трансформирование > Повернуть на 90 0 против часовой стрелки). Затем поместите полосы так, как показано на рисунке.

Шаг 13. Используя инструмент Pen (Перо) создайте фигуру, изображенную на рисунке. Новый слой назовите upper.

Шаг 14. Добавьте этому слою следующие стили:

Шаг 15. Чтобы добавить тень, повторите шаги 11 и 12, но с некоторыми изменениями. В шаге 11 измените непрозрачность до 10%, а в 12 - высоту до 103%, радиус размытия до 1,2 пикселей и непрозрачность до 70%.
Вы должны получить что-то, похожее на это:

Шаг 17. Создайте новый документ 180x180 пикселей с белым фоновым слоем. Создайте новый слой и назовите его “shape”. Создайте круг любого цвета. Измените его заливку (Fill) на 0%. И задайте ему параметр Stroke (Обводка).

Шаг 18. Дублируйте слой “shape” и уменьшите круг наполовину.

Шаг 20. Сделайте фоновый слой невидимым. Нажмите сочетание клавиш CTRL + SHIFT + E для того, чтобы объединить все видимые слои в один.
Выберите только что объединенный слой и выполните команду Layer > Add layer mask > reveal all . Теперь откройте это изображение (рис. Image 1) и поместите его поверх штампа. Назовите новый слой fade. Выделите содержимое слоя fade и выполните команду Select > Color Range (Выделение > Цветовой диапазон) (настройки показаны на рисунке). После этого белая часть изображения выделится. Не отменяя выделения, сделайте слой fade невидимым, щелкните правой кнопкой мыши на символе маски слоя “stamp” и выберите Apply Layer Mask (применить маску).

Шаг 21. Переместите штамп в документ с конвертом поверх всех слоев. Уменьшите непрозрачность до 35%.