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

Шаг 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 !.

Конечный результат:

Шаг 1
Создайте новый документ размером 540х340 пикселей с разрешением 72 ppi. Залейте фон любым цветом, отличающимся от белого. Инструментом Прямоугольная область (

",this,event,"320px");">Rectangular Marquee Tool) создайте прямоугольное выделение, как показано ниже. Создайте новый слой ( ",this,event,"320px");">Create New Layer) и назовите его “Envelope” и залейте выделение белым цветом.

Шаг 2
Добавьте слой-маску (

",this,event,"320px");">Layer Mask):

Шаг 3
Выберите инструмент Кисть (

",this,event,"320px");">Brush Tool), кисть “Chalk 60” и обрисуйте края чёрным цветом в маске.

Шаг 4
Потом перейдите в меню Стилей слоя (

",this,event,"320px");">Layer Style - Blending Options) и настройте так:

Отбрасывание тени (Режим – Умножение):

Внутреннее свечение (Режим – Затемнение основы, Метод – Мягкий):

Тиснение (Стиль – Внутренний скос, Метод – Плавный, Режим подсветки – Осветление, Режим тени – Умножение):

Шаг 5
Создайте новый слой “Old Paper”. Загрузите кисть “PaperFold”, которые включены в архив в конце урока. Выберите эту кисть и поверните её на 90 градусов (как это сделать можете прочесть ). Нарисуйте узор так, чтобы только одна четверть покрывала конверт и не было больших помятостей. Потом создайте обтравочную маску для этого слоя (кликните правой кнопкой и выберите Создать обтравочную маску (Create Clipping Mask), либо просто кликните между слоями, удерживая Alt).

Шаг 6
Установите Заливку (Fill) слоя – 15%.

Шаг 7
Создайте новый слой и назовите его “Burns”, создайте для него обтравочную маску, установите Режим наложения – Затемнение основы (

",this,event,"320px");">Blending Mode – Color Burn) и Заливку (Fill) – 75%. Обычной круглой кистью с мягкими краями обрисуйте чёрным цветом края конверта:

Шаг 8
Создайте новый слой (

",this,event,"320px");">Create New Layer) и назовите его “Watermarks 1”, создайте для него обтравочную маску. Установите Режим наложения – Мягкий свет ( ",this,event,"320px");">Blending Mode – Soft Light), Заливку (Fill) – 0%, Непрозрачность – 40% и примените стиль Внешнее свечение ( ",this,event,"320px");">Layer Style - Outer Glow):

Режим – Затемнение основы, Метод – Мягкий

Шаг 9
Выберите инструмент Кисть (

",this,event,"320px");">Brush Tool) с мягкими краями размером 100 пикселей и обрисуйте края.

Шаг 10
Создайте новый слой “Watermarks 2” с такими же настройками, как и для предыдущего слоя и обрисуйте края в других местах.

Шаг 11
Добавим немного желтизны на бумагу (так как бумага желтеет со временем).
Создайте новый слой (

",this,event,"320px");">Create New Layer) и назовите его “Discoloration”, установите Режим наложения – Мягкий свет ( ",this,event,"320px");">Blending Mode – Soft Light), Заливку (Fill) – 0% и Непрозрачность – 25%. Создайте обтравочную маску и примените эти стили:

Внешнее свечение (Режим – Затемнение основы, Метод – Мягкий).

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

Предварительный просмотр результата

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

Детали урока

• Программа: Adobe Illustrator CS5
• Ожидаемое время выполнения: 45 минут
• Сложность: Начинающий-Средний уровень

Источники

Шаг 1

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

Шаг 2

Устанавливаем в качестве цвета переднего плана цвет #ddf1ff и берем инструмент Rounded Rectangle Tool . Фокусируемся на верхней панели, устанавливаем радиус 10рх, а затем создаем векторную фигуру 240 на 150px. Привязка к сетке облегчит вашу задачу. Переходим на панель слоев и называем этот голубой скругленный прямоугольник «main».

Шаг 3

Теперь нам необходимо создать простой узор. Нажимаем Control + N , чтобы открыть новый документ. Вводим 10 в окно ширины и 20 в окно высоты, затем нажимаем ОК . Устанавливаем в качестве цвета переднего плана черный цвет, берем инструмент Rectangle Tool и создаем квадрат со стороной 10рх, располагаем его, как показано на первом изображении. Убедитесь, что новая векторная фигура выделена, фокусируемся на её правой стороне и переключаемся на инструмент Direct Selection Tool . Выделяем обе ключевые точки и просто тянем их на 5рх вверх. В результате картинка должна выглядеть как наше второе изображение. Убедитесь, что ваша черная векторная фигура больше не выделена, и перейдите в меню Edit > Define Pattern . Введите имя «envelopePattern» и нажмите ОК . Закрываем этот документ и возвращаемся к основному.

Шаг 4

Дублируем слой «main» (Control + J Rectangle Tool . Фокусируемся на верхней панели, отмечаем настройку Intersect и рисуем векторную фигуру 10 на 150px, как показано на первом изображении.
Переходим на панель слоев и дважды нажимаем на новой векторной фигуре, чтобы открыть окно Стилей слоя. Активируем Drop Shadow и Pattern Overlay , затем вводим настройки, показанные на следующих изображениях.
Для секции Pattern Overlay используем узор «envelopePattern», созданный в предыдущем шаге.
После того как вы применили все атрибуты, возвращаемся к панели слоев. Нажимаем правой кнопкой мыши на узорной векторной фигуре и просто переходим в меню Copy Layer Style .

Шаг 5

Дублируем слой «main» (Control + J ). Выделяем копию и берем инструмент Rectangle Tool . Фокусируемся на верхней панели, убедитесь, что настройка Intersect активна, и рисуем векторную фигуру 10 на 150px, как показано на первом изображении.
Переходим на панель слоев, нажимаем правой кнопкой на этой новой векторной фигуре и переходим в Paste Layer Style . Открываем окно стилей слоя для этой фигуры, фокусируемся на Drop Shadow и просто инвертируем угол.

Шаг 6

Дублируем слой «main» (Control + J Shift + Control + ] ).
Переходим на панель слоев, фокусируемся на этой копии, нажимаем дважды на цветной иконке и заменяем синий цвет цветом #ed4505.

Шаг 7

Убедитесь, что ваш оранжевый скругленный прямоугольник выделен и берем инструмент Rectangle Tool . Отмечаем настройку Intersect на верхней панели и рисуем векторную фигуру 260 на 100px, как показано на первом изображении.
Фокусируемся на верхней стороне нашего нового прямоугольника и выбираем Delete Anchor Point . Просто нажимаем на правой ключевой точке, чтобы удалить её, затем переключаемся на инструмент Direct Selection Tool . Выбираем оставшуюся верхнюю ключевую точку и перетаскиваем её на 130рх вправо. В результате у вас должна получиться картинка, похожая на второе наше изображение.

Шаг 8

Фокусируемся на панели слоев, открываем окно стилей слоя для нашей оранжевой векторной фигуры и вводим все настройки, показанные на следующих изображениях.

Шаг 9

Дублируем нашу оранжевую векторную фигуру (Control + J ). Фокусируемся на панели слоев, нажимаем правой кнопкой на этой копии и переходим в меню Clear Layer Style . Убедитесь, что копия все ещё выделена, понизьте её заливку до 0%, затем откройте окно стилей слоя и введите настройки, показанные на следующих изображениях.

Шаг 10

Дублируем слой «main» (Control + J ), выделяем копию и перетаскиваем её вперед Shift + Control + ] ).
Переходим на панель слоев, фокусируемся на этой копии и заменяем синий цвет цветом #b40007.

Шаг 11

Убедитесь, что ваша бордовая фигура ещё выделена и возьмите инструмент Rectangle Tool . Отметьте настройку Intersect на верхней панели и нарисуйте векторную фигуру 260 на 95px, как показано на первом изображении.
Фокусируемся на нижней стороне этого нового прямоугольника и выбираем Delete Anchor Point . Просто нажимаем на правой ключевой точке, чтобы удалить ей, затем переключаемся на Direct Selection Tool . Выбираем оставшуюся ключевую точну и тянем её на 130рх вправо. В конце у вас должен получиться результат, похожий на наше второе изображение.

Шаг 12

Для этого шага вам понадобится сетка через каждый 1 рх. Переходим в меню Edit > Preferences > Guides, Grid & Slices и вводим значение 1 в окно Gridline Every .
Убедитесь, что бордовая векторная фигура ещё выделена, фокусируемся на её нижней стороне и берем инструмент Rectangle Tool . Отмечаем настройку Subtract с верхней панели и рисуем векторную фигуру 8 на 3px, как показано на первом изображении.
Продолжаем фокусироваться на нижней стороне и переключаемся на инструмент Ellipse Tool . Отмечаем настройку Add с верхней панели и просто рисуем круг размером 14рх, как показано на втором изображении.

Шаг 13

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

Шаг 14

Дублируем бордовую векторную фигуру (Control + J ). Выделяем эту копию, очищаем текущие атрибуты стилей слоя, снижаем заливку до 0%, затем открываем окно стилей слоя и вводим настройки, показанные на следующих изображениях.

Шаг 15

Для следующих шагов нам снова нужна сетка через каждые 5рх, поэтому переходим в меню Edit > Preferences > Guides, Grid & Slices и вводим значение 5 в окно Gridline Every .
Устанавливаем в качестве цвета переднего плана черный цвет, берем инструмент Rectangle Tool , создаем векторную фигуру 210 на 80px и располагаем её так, как показано на первом изображении.
Фокусируемся на нижней части этого нового прямоугольника и берем Delete Anchor Point . Удаляем правую ключевую точку, затем переключаемся на инструмент Direct Selection Tool . Выделяем оставшуюся нижнюю ключевую точку и тянем её на 105рх вправо. В результате у вас должно получиться изображение, похожее на нашу вторую картинку.

Шаг 16

Фокусируемся на панели слоев, выделяем черную векторную фигуру и тянем её под бордовую векторную фигуру.
Продолжаем фокусироваться на панели слоев, нажимаем правой кнопкой на этой черной векторной фигуре и просто переходим в меню Convert to Smart Object . Убедитесь, что этот новый объект выделен, меняем его режим смешивания на Soft Light и переходим в фильтр Filter > Blur > Gaussian Blur . Тянем бегунок на 4рх и нажимаем ОК .

Шаг 17

Теперь вам нужно создать простую текстуру бумаги. Открываем изображение текстуры в Photoshop, переходим в меню Image > Adjustments > Desaturate , затем переходим в меню Edit > Define Pattern . Называем его «paper» и нажимаем ОК . Закрываем документ и возвращаемся к нашему конверту.

Шаг 18

Дублируем слой «main» (Control + J ), выделяем копию и перетаскиваем её вперед Shift + Control + ] ).
Снижаем заливку до 0% и открываем окно стилей слоя. Активируем Pattern Overlay и вводим настройки, показанные на следующем изображении. Вам обязательно нужно использовать узор «paper», созданный в предыдущем шаге.

Шаг 19

Создаем новый слой (Shift + Control + Alt + N ), перетаскиваем его над всеми слоями на панели слоев и убеждаемся, что он остается выделенным. Устанавливаем цветом переднего плана черный цвет, берем инструмент Brush Tool и нажимаем правой кнопкой внутри документа, чтобы открыть Настройки кистей. Выбираем круглую мягкую кисть, устанавливаем размер 50рх и жесткость 0%, затем рисуем произвольный путь вдоль верхней стороны нашего конверта, как показано на следующем изображении.

Шаг 20

Фокусируемся на панели слоев, удерживаем Control и нажимаем на слое «main». Это действие загрузит выделение вокруг фигуры. Убедитесь, что она все ещё выделена, выделите слой, созданный в предыдущем шаге, сфокусируйтесь на нижней части панели слоев и просто нажимаем на кнопке «Add layer mask» . Результат должен выглядеть, как наше второе изображение.
Снимаем выделение (Control + D ), убеждаемся, что замаскированный слой все ещё выделен, снижаем непрозрачность до 30% и меняем режим смешивания на Soft Light .

Шаг 21

Создаем новый слой (Shift + Control + Alt + N ), перетаскиваем её вверх панели слоев и убеждаемся, что он все ещё выделен. Устанавливаем цветом переднего плана белый цвет, берем инструмент Brush Tool и рисуем произвольный путь вдоль верхней стороны нашего конверта, как показано на следующих изображениях.

Шаг 22

Загружаем новое выделение вокруг нашей векторной фигуры «main» и используем маску слоя, созданную в предыдущем шаге.
Снимаем выделение (Control + D ), убедитесь, что наш замаскированный слой все ещё выделен, снижаем непрозрачность до 70% и меняем режим смешивания на Soft Light .

Шаг 23

Фокусируемся на панели слоев, открываем окно стилей слоя для «main» и вводим настройки, показанные на следующих изображениях.

Шаг 24

Дублируем слой «main» (Control + J ). Открываем окно стилей слоя для этой копии и корректирует атрибуты, используя Drop Shadow , как показано на следующем изображении.

Результат

И вот, что у нас получилось в результате.

В этом уроке мы нарисуем в фотошопе почтовый конверт, который можно будет использовать как иконку, а заодно повторим принципы работы с векторными формами.

Конверт в фотошопе

1. Начнём с создания нового изображения размером 500x500 px, а фон пока зальём белым цветом. Пока — потому что сначала мы создадим все элементы, из которых будет состоять конверт, т.е. начнём с создания формы, а затем раскрасим его, применив эффекты. В связи с этим создаваемые фигуры могут быть любого цвета и я не буду оговаривать его дополнительно. Для наглядности в качестве цвета будем задавать фигурам различные оттенки серого.

Итак, нарисуем прямоугольник при помощи инструмента Rectangle Tool (Прямоугольник), примерно как на картинке:

2. Выберите инструмент Polygon Tool (Многоугольник), с числом сторон равным трем (Sides в панели свойств).

Нарисуйте треугольник, у которого нижняя сторона будет расположена горизонтально, для этого удерживайте клавишу Shift и вращайте его до тех пор, пока он не займет нужное положение:

3. Теперь трансформируем треугольник (Edit —> Free Transform Path (Правка —> Свободное трансформирование)) так, чтобы нижние его углы совпадали с нижними углами прямоугольника, а вершина располагалась чуть выше середины прямоугольника:

4. Инструментом Add Anchor Point Tool (Добавить опорную точку) поставьте четыре дополнительных точки на боковых сторонах треугольника (по две на каждой) как на рисунке:

5. Инструментом Convert Point Tool (Преобразовать опорную точку) сделаем вершину треугольника сглаженной, для этого нужно нажать левую кнопку мыши на опорной точке и немного потянуть в сторону — появятся направляющие линии и вершина станет сглаженной:

6. Инструментом Direct Selection Tool (Непосредственное выделение) выделите эту опорную точку и сдвиньте её немного вниз (можно мышью, а можно нажимая кнопку «вниз» на клавиатуре) до получения, закругленности, похожей на представленную ниже:

Для дальнейшей работы нам понадобятся два экземпляра получившейся фигуры, поэтому сделайте её копию, щелкнув правой клавишей мыши на изображении фигуры в панели слоёв Layers и выбрав в появившемся меню пункт Duplicate Layer (Дублировать слой). Полученную копию слоя пока можно скрыть, нажав на иконку глаза соответствующую слою в панели слоев.

7. Возвращаемся к нашему измененному треугольнику. Следующим шагом будет выделение нескольких опорных точек инструментом Direct Selection Tool (Непосредственное выделение). Держа нажатой клавишу Shift , щёлкните последовательно по всем точкам кроме двух нижних, при этом выделенные точки становятся тёмными:

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

8. Оставить их такими или сделать острыми — дело вкуса. Я преобразовал точки в острые щелкнув по ним инструментом Convert Point Tool (Преобразовать опорную точку):

9. Самая сложная в этом уроке фигура закончена, теперь мы будем пользоваться её копиями. Дублируйте полученный слой (клик правой клавишей мыши на названии слоя, там выбирайте пункт Duplicate Layer (Дублировать слой) и поместите копию в верхнюю часть будущего конверта:

10. Вот теперь нам и понадобится копия фигуры, предусмотрительно спрятанная нами в пункте 6. Сделайте её видимой и разместите поверх «клапана» конверта:

11. Уменьшим эту фигуру (Edit —> Free Transform Path (Правка —> Свободное трансформирование)) как показано на рисунке ниже:

12. Вернёмся к фигуре, расположенной в нижней части конверта. Сделайте ещё одну её копию, продублировав слой. Развернём фигуру на 90 градусов против часовой стрелки (Edit —> Transform Path —> Rotate 90 CCW ):

13. Измените форму фигуры (Edit —> Free Transform Path (Правка —> Свободное трансформирование)) и разместите её как показано на рисунке:

14. Дублируйте полученную фигуру, а затем отразите её горизонтально (Edit —> Transform Path —> Flip Horizontal ) и разместите с левой стороны:

15. Осталось только поменять порядок слоёв и разместить их так, чтобы основная часть конверта (лицевая его сторона) вместе с клапаном (состоящим из двух фигур) размещались в панели слоев ниже, чем боковые стороны, а слой с нижней частью конверта был выше всех остальных:

Форма конверта готова. Можно в этот конверт что-нибудь вложить. Пусть это будет карточка с неким текстом.

16. Создайте прямоугольник при помощи инструмента Rectangle Tool (Прямоугольник):

17. Добавьте текст и преобразуйте его в векторные фигуры (клик правой клавишей мыши на названии слоя с текстом, там выберите Convert to Shape (Конвертировать в форму)). После такой операции мы не сможем просто поменять текст, так как теперь он состоит из векторных форм в виде букв, зато в таком виде его можно трансформировать наравне с другими фигурами:

18. Выделите слои с карточкой и текстом в панели слоев, удерживая клавишу Ctrl . Немного поверните их (Edit —> Transform —> Rotate (Правка —> Трансформация —> Поворот)):

И разместите слои ниже правой, левой и нижней сторон конверта (фигуры 2,5,6 на рисунке ниже). Цифровые обозначения для фигур (по порядку создания) введены для того, чтобы не запутаться в слоях при применении эффектов, чем мы сейчас и займёмся, но прежде сделаем еще кое-что:

19. В панели слоёв выделите три слоя с фигурами 2, 5, 6 (удерживайте Ctrl при выделении) и дублируйте их (клик правой клавишей мыши на названии одного из выделенных слоёв, там выберите Duplicate Layers... (Дублировать слои) и соглашаемся нажатием на кнопку Ok . Цвет трёх фигур, являющихся копиями, поменяйте на чёрный. В результате должно получиться вот так:

А в панели слоёв у нас такая картина:

20. Выделите три слоя с копиями и объедините их (клик правой клавишей мыши на названии одного из выделенных слоев, там выбираем Merge Layers (Объединить слои)). Полученный растровый слой поместите ниже слоев с фигурами 2, 5, 6.

21. Размоем этот слой, применив фильтр: Filter —> Blur —> Motion Blur (Фильтр —> Размытие —> Размытие в движении) со следующими параметрами:

Затем сдвиньте слой на 3..4 пикселя вверх и установите непрозрачность слоя примерно на 25% (Opacity (Непрозрачность)) в верхней части панели слоев Layers ).

Сделали мы так, чтобы получить имитацию тени от трех фигур сразу, при чём тень нам нужна только в верхней открытой части конверта. К тени мы ещё вернемся, а пока переходим к эффектам...

22. Выберите в панели слоёв слой с фигурой №1. Сделаем двойной клик правой клавишей мыши по свободному месту справа от изображения слоя в панели слоёв и в появившемся окне Layer Style (Эффект слоя) выбираем пункт Gradient Overlay (Наложение градиента). Выставляем там следующие параметры:

Подтверждаем изменения нажатием на кнопку Ok и переходим к следующему слою...

23. Для слоя с фигурой №2 задайте следующие параметры в пункте Gradient Overlay (Наложение градиента):

В пункте Stroke (Штрих):

Точно такие же параметры в пункте Stroke будут применяться к слоям с фигурами 3, 5 и 6. Для них я в дальнейшем буду просто указывать толщину и цвет...

24. Для слоя с фигурой №3 задайте следующие параметры в пункте Gradient Overlay (Наложение градиента):

В пункте Stroke Size: 1px , Color: #878787 .

25. Для слоя с фигурой №4 параметры в пункте Gradient Overlay (Наложение градиента) будут следующими:

26. Для слоев с фигурами №5 и №6 задайте следующие параметры в пункте Gradient Overlay (Наложение градиента):

И в пункте Stroke (Штрих) установите параметры Size: 1px , Color: #878787 .

27. Для слоя с фигурой №7 установите следующие параметры в пункте Drop Shadow (Отбросить тень):

В пункте Gradient Overlay (Наложение градиента):

В пункте Stroke (Штрих) установите параметры:

28. К слою (слоям) с текстом примените следующие параметры в пункте Gradient Overlay (Наложение градиента):

29. Для слоя с фоном параметры в пункте Gradient Overlay (Наложение градиента) будут такими:

В результате применения эффектов должны получить следующую картинку:

30. Теперь вернёмся к внутренней тени. К слою с имитацией тени, полученной в пункте 21, добавьте слой-маску (иконка Add layer mask (Добавить слой-маску) в нижней части панели слоёв). Выберите инструмент Gradient Tool (Градиент) и чёрно-белую заливку. Залейте градиентом слой-маску сверху вниз, как показано на рисунке ниже. Этим мы уберём тень в верхних углах конверта:

Фактически наш конверт готов. Осталось добавить отражение и перспективу.

31. Для создания отражения нужно выделить все нарисованные нами слои в панели слоёв, кроме слоя с фоном. Дублируем эти слои (Duplicate Layers... (Дублировать слои)) и объединяем их (Merge Layers (Объединить слои)).

32. Полученное в результате растровое изображение отразим вертикально (Edit —> Transform —> Flip Vertical (Правка —> Трансформация —> Отразить вертикально)):

И передвигаем его вниз к основанию конверта:

33. Теперь добавим перспективу. Выделите все слои конверта и слой с его отражением.

Исказим изображение Edit —> Transform —> Distort (Правка —> Трансформация —> Исказить) примерно как на рисунке ниже (для удобства нужно уменьшить изображение):

34. Приведём в порядок отражение. К слою с отражением добавьте слой-маску и залейте её черно-белым градиентом снизу вверх примерно как на рисунке. Непрозрачность слоя установите около 50%:

35. Добавим небольшое свечение под конвертом. Для этого нарисуйте белый прямоугольник инструментом Rectangle Tool (Прямоугольник). Слой с прямоугольником разместите ниже остальных слоёв, составляющих конверт:

36. Разверните прямоугольник (Edit —> Free Transform Path (Правка —> Свободное трансформирование)) и поместите его как на картинке ниже:

37. Инструментом Direct Selection Tool (Непосредственное выделение) разместите опорные точки прямоугольника так, чтобы придать ему такую форму, как будто он лежит на плоскости в пространстве. Исключительной точности в придании прямоугольнику перспективы не понадобится, поэтому просто придайте ему форму, похожую на изображённую на картинке ниже:

38. Финальный шаг. Размойте прямоугольник Filter —> Blur —> Gaussian Blur (Фильтр —> Размытие —> Размытие по Гауссу). Перед применением фильтра появится предупреждение о том, что для продолжения фигура будет автоматически растрирована. Согласитесь нажатием на кнопку Ok и для размытия установите радиус (Radius ) 16 px. После применения фильтра установите непрозрачность слоя на 40..45%:

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