Скачать архив с материалами к уроку

Иллюстрация с 3D текстом в Фотошоп

Яндекс.Директ

Учимся работать в фотошопеБесплатные мастер классы фото-видео съемке. Получить приглашение и подарок! 18+mastersecrets.ruАстана

15 мая 2013 29 029 просмотров | Сложность:

В этом уроке вы узнаете, как создать осеннюю иллюстрацию с 3D-буквами, используя Photoshop CS6 Extended.

Использованные материалы:

  1. Autumn park
  2. English Alphabet
  3. Concrete texture (Image 1)
  4. Crackles texture
  5. Autumn bush
  6. Yellow maple leaf
  7. Yellow maple leaf 2
  8. Red maple leaf

Архив


Шаг 1

Создаем новый документ File - New (Файл - Новый).

Шаг 2

Загружаем изображение Autumn park и размещаем на рабочем документе. Это фото такого же размера, что и рабочее полотно. Если вы возьмете другое изображение, то его размер нужно подогнать в соответствии с размером документа.

Перетаскиваем фото на документ и подгоняем размер, потянув за один из угловых узелков. Чтобы сохранить пропорции, удерживаем клавишу Shift. Выделяем слой с осенним пейзажем и фоновый слой (Background), затем жмем Command/Ctrl+E, чтобы объединить их вместе.

Шаг 3

Теперь начнем работать над буквами. Загружаем English Alphabet и открываем его в Photoshop. Теперь вы должны решить, какое слово хотите написать и определиться с цветом. Берем Lasso tool (Лассо) (L) и выделяем первую букву слова, копируем выделение (Command/Ctrl+C) и вставляем на рабочее полотно (Command/Ctrl+V).

Называем новый слой в соответствии с буквой (в данном случае "Letter L"). Теперь мы должны удалить белый фон. Берем Magic Wand tool (Волшебная палочка) (W), активируем слой с буквой и кликаем по белому фону. Жмем клавишу Delete. Обратите внимание, что параметр Sample All Layers (Образец со всех слоев) должен быть деактивирован.

Выделяем слой с буквой и активируем трансформацию (Ctrl+T). Зажав клавишу Shift, тянем за один из угловых узелков, чтобы уменьшить размер буквы.

Если вы хотите изменить цвет буквы, то воспользуйтесь корректирующими слоями (например, Color Balance (Цветовой баланс) или Selective Color (Выборочная коррекция цвета)). В шаге 15 я детально опишу этот процесс. Меня устраивает красный цвет, поэтому я сразу перехожу к работе с 3D.

Шаг 4

Выделяем слой с буквой и переходим 3D - New 3D Extrusion from Selected Layer (Новая экструзия из выбранного слоя). Фотошоп предложит вам перейти в рабочую среду 3D - жмем OK. Для начала нам нужно определить положение плоскости, на которой будут расположены буквы. Для этого на панели 3D выбираем Scene и, используя специальные инструменты на панели параметров, корректируем положение плоскости.

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

Шаг 5

Загружаем изображение Concrete texture (Image 1) и открываем его в Photoshop. Активируем Crop tool (Кадрирование) (С) и выделяем наиболее подходящую область текстуры. Размер выделения можно настроить на панели параметров. Закончив с выделением, жмем Enter и сохраняем текстуру в отдельный файл с названием "texture_front".

Шаг 6

Теперь мы должны применить текстуру к букве. На вкладке 3D выделяем Front Inflation Material (Материал передней выпуклости) и переходим к панели Properties(Параметры). Когда вы перейдете в рабочую среду 3D, эта панель будет открываться автоматически.

Переходим к параметру Bump(Рельеф), кликаем по иконке папки и выбираем Load texture (Загрузить текстуру). В открывшемся окне находим текстуру созданную в предыдущем шаге ("texture_front.jpg").

Параметр Bump (Рельеф) отвечает за рельефность. Потянув за ползунок, вы можете установить желаемый уровень рельефности. В моем случае я остановилась на 20%. Затем нужно настроить масштаб и положение текстуры. Для этого кликаем по иконке папки рядом с Bump (Рельеф) и выбираем Edit UV Properties (Редактировать UV-свойства).

Масштаб по вертикали и горизонтали (V Scale и U Scale соответственно) являются основными параметрами, которые нужно настроить. Параметры U Offset и V Offset отвечают за смещение текстуры, если хотите, можете их подкорректировать.

Шаг 7

Теперь мы должны добавить текстуру на выдавленной части буквы. Для этого переходим на владку 3D, выделяем Extrusion Material (Материал экструзии) и применяем ту же текстуру ("texture_front.jpg"), что и для параметра Bump (Рельеф).

Для выдавленой части буквы я увеличила параметр Bump(Рельеф) до 25%. Редактируем параметры текстуры: кликаем по иконке папки рядом сBump (Рельеф) и выбираем Edit UV Properties (Редактировать UV-свойства).

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

Шаг 8

Теперь пришло время поработать над положением буквы. Переходим на вкладку 3D и выделяем группу с буквой. В центре буквы появятся три оси, с помощью которых вы можете поворачивать, менять размер и перемещать объект.

Также вы можете перемещать объект сразу в нескольких плоскостях. Для этого подведите курсор к ребру куба, внутри которого находится буква: стороны куба (которые соответствуют плоскостям, в которых будет происходить перемещение) будут подсвечены желтым, а рядом с курсором появится всплывающая подсказка с названиями плоскостей.

Когда вы подводите курсор к грани куба, передвижение будет возможным только по одной плоскости (она также будет подсвечена желтым). Если вы хотите, чтобы буква стояла на плоскости, не перемещайте ее по оси Y (вертикальная ось).

Если случайно буква оказалась выше или ниже уровня плоскости, примените 3D - Snap Object to the Ground Plane (3D - Привязать объект к плоскости основания). В результате буква снова окажется на своем месте. Чтобы вернуть ей изначальное положение по отдельной оси, установите угол поворота соответствующей оси на 0 градусов.

Теперь вы знаете, как менять положение 3D-объекта. Поэтому настраиваем положение буквы на плоскости и, при необходимости, регулируем ее размер.

Шаг 9

В этом шаге мы поработаем над внешним видом буквы. Сейчас мы настроим экструзию, а в следующем шаге применим фаску. Устанавливаем значение Extrusion Depth (Глубина экструзии) на 250. Можете использовать другое значение. Также активируем параметры Catch Shadows (Захватить тени) и Cast Shadows (Наложить тени), которые понадобятся нам при установке источника света.

Шаг 10

В этом шаге мы применим к букве фаску. Переходим на панель свойств и выбираем тип фаски. Можете попробовать поэкспериментировать с настройками.

Переходим к параметрам Cap (Капитель) и выбираем тип контура фаски.

Шаг 11

Теперь мы должны определиться с цветом экструзии. Чтобы изменить цвет экструзии, на вкладке 3D выбираем Extrusion Material (Материал экструзии) и переходим на панель свойств. Основным цветом экструзии является цвет параметра Diffuse (Рассеивание). Я выбрала #f25646.

Также можете поэкспериментировать с другими параметрами, например, Specular(Цвет блика) (он влияет на резкость/контрастность текстуры) и Illumination (Свечение) (он влияет на яркость боковых ребер). В моем случаем я выбрала такие цвета: цвет Specular – #645858, цвет Illumination – #290816.

Шаг 12

Теперь займемся освещением. Переходим на вкладку 3D и выбираем первый источник света (он уже есть в сцене) - Infinite Light 1 (Бесконечный свет). С его помощью мы установим основной источник света. В данной иллюстрации основным источником света является солнце, которое находится в верхнем правом углу.

Если вы используете другой фон, то должны сами определить, где расположен основной источник света (обратите внимание на направление теней, падающих от объектов/людей). Левой кнопкой мыши кликаем по источнику света и настраиваем его поворот, чтобы тень от буквы падала в нижний левый угол.

Редактируем настройки и координаты этого источника света, как показано ниже ( цвет #ffebcf). Запомните или запишите его координаты, так как они одинаковы для всех букв, которые мы создадим в этом уроке.

Шаг 13

Давайте добавим еще один источник света. Для этого кликаем по иконке Add new Light to Scene (Добавить новый свет на сцену) в нижней части панели 3D и выбираем New Infinite Light (Новый бесконечный свет).

Настраиваем параметры света (цвет # ffc871).

Шаг 14

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

Мы отредактируем текстуру, которая используется в качестве материала для Front Inflation Material (Материал передней выпуклости) и Front Bevel Material (Материал переднего скоса). Когда вы нажмете Edit texture (Редактировать текстуру), Photoshop предупредит вас, что изменения будут применены ко всем местам сцены. Жмем OK.

Затем переходим Layer - New Adjustment Layer - Selective Color (Слой - Новый корректирующий слой - Выборочная коррекция цвета). Выбираем черный канал (Black) и корректируем цвет обводки.

Закончив работать с текстурой, сохраняем ее (Command/Ctrl+S) и закрываем файл. Возвращаемся к рабочему документу. Текстура обновилась и мы можем видеть готовый результат.

Шаг 15

Таким же образом создаем остальные буквы. Чтобы изменить их цвета, используем корректирующий слой Selective Color (Выборочная коррекция цвета) и команду Replace Color (Заменить цвет). Давайте сделаем это на примере буквы "Е".

Чтобы продолжить работать с обычными слоями Photoshop, просто переключаемся на панель слоев. Вырезаем вторую букву и удаляем белый фон, как мы делали в третьем шаге. Я назвала слой с буквой "Letter E". Применяем к слою Image - Adjustment - Replace Color (Изображение - Коррекция - Заменить цвет). Берем пипетку с плюсом и увеличиваем область замены цвета, кликнув по светло-голубому оттенку внутри буквы. С помощью ползунков корректируем цвет буквы.

Далее создаем корректирующий слой Selective Color (Выборочная коррекция цвета) и конвертируем его в обтравочную маску (Command/Ctrl+Alt+G) для слоя "Letter E". Теперь корректирующий слой будет действовать только на слой с буквой. Закончив, объединяем букву с корректирующим слоем (выделяем оба слоя и жмем Command/Ctrl+E).

Шаг 16

Основа буквы готова и мы можем преобразовать ее в 3D. Возвращаемся к четвертому шагу и повторяем весь процесс. Не забудьте про искажение в перспективе: чем дальше буква от зрителя, тем меньше ее размер. Слой с первой буквой должен быть самым верхним, остальные разместите один за другим. Не забывайте, что вы можете изменить параметры каждой буквы по своему предпочтению.

Шаг 17

Если вы довольны положением и цветом букв, то можете их растрировать. Но я советую на всякий случай сохранить оригинальные копии 3D-слоев. Для этого дублируем их (Command/Ctrl+J) и группируем оригиналы (Command/Ctrl+G). Называем группу "3D" и отменяем ее видимость (кликаем по иконке глаза рядом с группой на панели слоев). Затем растрируем дубликаты. Для этого правой кнопкой кликаем по слою и выбираем Rasterize 3D (Растировать 3D).

Шаг 18

В этом шаге мы добавим контрастности теням. Создаем новый слой (Command/Ctrl+Shift+N), называем его "Shadow" и размещаем под слоями с буквами. Берем Brush tool (Кисть) (В) с такими параметрами: цвет: #1d280a, жесткость: 50%, режим: Умножение, непрозрачность: 10-15%. Размер выбирайте на свое усмотрение.

Проводим кистью по теням от букв.

Шаг 19

Теперь в нижней части букв мы должны дорисовать немного травы. Для этого мы будем использовать стандартные кисти Photoshop. Берем круглуюкисть (В) с жесткостью 100% и непрозрачностью примерно 50%. Лучше работать на слой-маске, чтобы в любой момент можно было исправить результат.

Добавляем маску всем слоям с буквами Layer - Layer Mask - Reveal All (Слой - Слой-маска - Показать все) и меняем цвет переднего плана на черный. Кликаем по миниатюре маски на панели слоев и закрашиваем нижнюю часть каждой буквы.

Если вы где-то ошиблись или сделали лишний мазок, то смените цвет кисти на белый, чтобы восстановить буквы. Черный - скрывает, белый - возвращает. Жмем F5, чтобы открыть панель параметров кисти, и выбираем кисточку Dune Grass. Настраиваем ее, как показано ниже.

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

Шаг 20

Как вы видите, в результате предыдущего действия мы скрыли некоторую часть теней, так как они находятся на одном слое с буквами. Поэтому настраиваем кисть (В), как в шаге 18, переходим на слой "Shadow" и дорисовываем недостающую тень.

Чтобы исправить мелкие недостатки, берем кисточку Dry Brush Tip Light Flow из стандартного набора Photoshop и редактируем слой-маску в нижней части букв.

Шаг 21

Теперь мы должны добавить неровности задним ребрам букв. Берем Brush tool (Кисть) (В) и выбираем одну из кисточек, показанных на скриншоте ниже (Непрозрачность: 100%, размер: примерно 50 px, черный цвет).

На слой-масках проводим кистью по заднему краю букв. Чтобы изменить угол наклона кисти, жмем F5 и поворачиваем стрелку указателя в желаемое направление.

Получаем вот такой результат:

Шаг 22

Чтобы текстура не была слишком резкой, мы применим к ней фильтр Gaussian Blur (Размытие по Гауссу). Но перед этим преобразуем все слои с буквами в смарт-объекты, чтобы позже мы имели возможность при необходимости изменить параметры фильтра. Кликаем правой кнопкой по слою и выбираем Convert to Smart Object (Конветировать в смарт-объект). О слой-масках можете не беспокоиться, они находятся внутри смарт-объекта. Чтобы редактировать смарт-объект, дважды кликните по нему на панели слоев.

Шаг 23

Выделяем слой с первой буквой и переходим Filter - Blur - Gaussian Blur (Фильтр - Размытие - Размытие по Гауссу). Уровень размытия зависит от размера ваших букв.

Применяем фильтр к остальным буквам. Не забывайте про глубину резкости: чем дальше буква от зрителя, тем сильнее ее размытие. Чтобы изменить параметры фильтра в смарт-объекте, дважды кликните по названию фильтра на панели слоев.

Вот, что у нас получилось:

Шаг 24

Загружаем текстуру и вставляем ее на рабочий документ. Регулируем ее размер, при этом удерживая клавишу Shift, чтобы сохранить пропорции.

Активируем трансформацию (Ctrl+T), щелкаем правой кнопкой по рабочему полотну и выбираем Distort (Искажение). Тянем за угловые узелки, чтобы текстура была параллельна передней грани буквы.

Растрируем слой с текстурой (правой кнопкой мыши по слою и выбираем Rasterize Layer (Растрировать слой)). Назывем его "Texture L". Загружаем выделение слоя "Letter L copy" (зажимаем Ctrl/Command и кликаем по миниатюре слоя на панели слоев), выделяем слой "Texture L" и добавляем на него маску, нажав кнопку Add Layer Mask (Добавить слой-маску) внизу панели слоев.

Меняем режим смешивания слоя "Texture L" на Soft Light (Мягкий свет), берем Brush tool (Кисть) (В), устанавливаем непрозрачность на 50% и выбираем черный цвет. Активируем маску и удаляем текстуру по бокам, в областях теней и слегка на передней грани, чтобы придать реалистичности.

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

У вас должен получиться вот такой результат:

Шаг 25

Группируем все слои, относящиеся к буквам (Command/Ctrl+G) и называем группу "Letters".

Шаг 26

В этом шаге мы сделаем передний план более насыщенным и контрастным. Для этого создаем корректирующий слой Layer - New Adjustment Layer - Levels (Слой - Новый корректирующий слой - Уровни) и размещаем его над фоновым слоем. После этого создаем корректирующий слой Hue/Saturation(Цветовой тог/Насыщенность). Параметры корректирующих слоев должны быть следующими:

Далее берем Gradient tool (Градиент) (G) и выбираем линейный градиент от черного к белому. Активируем маску корректирующего слоя и заливаем ее градиентом сверху вниз. Затем заливаем слой Hue/Saturation (Цветовой тон/Насыщенность), только в этот раз градиент должен быть немного шире.

Шаг 27

Теперь мы настроим цвет и контрастность букв, чтобы они лучше вписывались в окружение. Для этого создаем два корректирующих слоя: Levels (Уровни) и Hue/Saturation (Цветовой тон/Насыщенность). Преобразовываем их в обтравочные маски (Ctrl/Command+Alt+G) для группы "Letters", чтобы они действовали только на буквы.

Шаг 28

Загружаем фото кленового листа и открываем его в Photoshop. Берем Quick Selection tool (Быстрое выделение) (W) и выделяем лист. Чтобы убрать из выделения лишние области, переключаемся в режим Subtract from Selection (Вычесть из выделения) и кликаем по ним. Не нужно создавать идеальное выделение, так как мы все равно уменьшим лист и мелких недостатков не будет заметно.

Копируем выделенную область и вставляем на рабочий документ, корректируем размер. Отражаем лист по горизонтали (Command/Ctrl+Е - правой кнопкой по рабочему полотну - Flip Horizontal (Отразить по горизонтали)) и деформируем (Command/Ctrl+Е - правой кнопкой по рабочему полотну - Warp(Деформация)) как показано ниже:

Теперь мы должны для листа добавить стили слоя: Gradient Overlay (Наложение градиента) и Drop Shadows (Тень). Дважды кликаем по слою "Leaf" на панели слоев, чтобы открыть окно Layer Style:
Gradient Overlay (Наложение градиента): используем стандартный градиент "Оранжевый, Желтый, Оранжевый". Цвет тени: #460000

Шаг 29

Загружаем еще одно фото кленового листа, вырезаем его и вставляем на рабочий документ. Называем этот слой "Leaf 2". Используем Warp (Деформация), чтобы деформировать лист, как показано ниже:

Применяем стили слоя.

Результат:

Шаг 30

Теперь загружаем изображение с кустом и с помощью Quick Selection tool (Быстрое выделение) (W) выделяем область с листьями.

Копируем и вставляем выделенную область на рабочий документ. Размещаем эти листья рядом с буквой "L", называем слой "Leaf 3", добавляем корректирующий слой Levels (Уровни) и преобразовываем его в обтравочную маску. Параметры корректирующего слоя показаны на скриншоте ниже. Также уменьшаем непрозрачность слоя "Leaf 3" до 85%.

Шаг 31

И, наконец, загружаем третье фото с кленовым листом, выделяем его с помощью Quick Selection tool (Быстрое выделение) (W) и вставляем на рабочий документ. Называем слой "Leaf 4". Корректируем размер листа и деформируем его с помощью Warp(Деформация).

На слое "Leaf 4" применяем стиль слоя Drop Shadow (Тень) (цвет: #172617):

Если вы внимательно посмотрите на букву "F", то заметите, что тень должна перекрывать верхнюю часть листа. Добавляем корректирующий слой Hue/Saturation (Цветовой тон/Насыщенность) и преобразовываем его в обтравочную маску для слоя "Leaf 4". Устанавливаем прааметры, как показано ниже. Активируем маску корректирующего слоя, берем черную кисть (В) и скрываем нижнюю половину листа. Также уменьшаем непрозрачность слоя "Leaf 4" до 85%.

Теперь мы можем сгруппировать (Command/Ctrl+G) все слои с листьями в группу "Leaves".

Шаг 32

В этом шаге мы сделаем тени и блики более выразительными. Создаем новый слой (Command/Ctrl+Shift+N), называем его "Shadows/Highlights". Размещаем его в самом верху панели слоев и заливаем серым цветом Edit - Fill (Редактирование - Заливка).

Меняем режим смешивания слоя "Shadows/Highlights" на Soft Light (Мягкий свет). Берем кисть (В) белого цвета с непрозрачностью 5% и рисуем по бликам. Затем жмем клавишу D, чтобы сменить цвет переднего плана на черный, и рисуем в областях с тенями. Мой результат вы можете увидеть ниже. На нижнем скриншоте показаны затемненные/осветленные области.

Шаг 33

В этом шаге мы уменьшим насыщенность желтого цвета на кроне дерева. Создаем корректирующий слой Layer - New Adjustment Layer - Selective Color (Слой - Новый корректирующий слой - Выборочная коррекция цвета), выбираем желтый канал и устанавливаем параметры, как показано ниже. Переключаемся на слой-маску и заполняем ее черным цветом Edit - Fill (Редактирование - Заливка). Берем кисть (В) белого цвета и закрашиваем крону.

Шаг 34

В этом шаге мы создадим эффект глубины резкости. Для начала нужно создать карту глубины, другими словами, мы должны определить количество размытия на каждом объекте. Создаем новый слой (Command/Ctrl+Shift+N), называем его "Depth Map" и размещаем в самом верху панели слоев.

Загружаем выделение самой отдаленной буквы, в данном случаем "A". Жмем Shift+Backspace, чтобы открыть параметры заливки. Убеждаемся, что слой "Depth Map" активен, и заливаем его цветом #474747. Далее выделяем буквы, которые находятся чуть ближе к зрителю, в данном случаем "E" и "F" (чтобы выделить их, зажмите Command/Ctrl+Shift и кликните по миниатюрам слоев).

Активируем слой "Depth Map" и заливаем выделение цветом #2d2d2d. Загружаем выделение последней буквы и листьев, которые находятся рядом с ней. Заливаем выделение черным цветом. Тени, которые выделились вместе с буквами и также залиты цветом, нам не нужны, поэтому их удаляем ластиком (Е).

Шаг 35

Создаем еще один слой (Command/Ctrl+Shift+N) и размещаем его под слоем "Depth Map". Заливаем его любым цветом. Дважды кликаем по слою и применяем стиль слоя Gradient Overlay (Наложение градиента).

Ваш градиент должен выглядеть примерно так же:

Теперь мы можем объединить (Command/Ctrl+E) градиентный слой и "Depth Map". Карта глубины готова.

Шаг 36

Выделяем слой "Depth Map", жмем Command/Ctrl+A > Command/Ctrl+С, чтобы копировать карту глубины, затем переходим на панель каналов и создаем новый Alpha 1 (жмем на кнопку Create New Channel (Создать новый канал) в нижней части панели каналов). Выбираем канал Alpha 1 и жмем Command/Ctrl+V, чтобы вставить карту глубины.

Затем выделяем канал RGB и возвращаемся на панель слоев. Скрываем слой "Depth Map" (для этого щелкаем по иконке глаза рядом с миниатюрой слоя). Активируем слой, который находится под картой глубины. В данном случае это корректирующий слой Selective Color (Выборочная коррекция цвета). Жмем Command/Ctrl+Shift+Alt+E, чтобы объединить все видимые слои на одном новом.

Активируем получившийся слой (на скриншоте это "Layer 1") и переходим Filter - Blur - Lens Blur (Фильтр - Размытие - Размытие при малой глубине резкости). Выбираем канал Alpha 1 из выпадающего меню Source(Источник), затем производим размытие изображения в соответствии с созданной картой глубины. Остальные параметры вы можете посмотреть на скриншоте:

Шаг 37

Теперь мы должны уменьшить насыщенность размытого фона. Для этого создаем корректирующий слой Hue/Saturation (Цветовой тон/Насыщенность) и размещаем его в самом верху панели слоев. Удерживая клавишу Command/Ctrl, кликаем по миниатюре слоя "Depth Map", чтобы загрузить его выделение.

Жмем Command/Ctrl+C, чтобы скопировать содержимое слоя, затем зажимаем клавишу Alt и кликаем по маске корректирующего слоя Hue/Saturation (Цветовой тон/Насыщенность). Жмем Command/Ctrl+V, чтобы вставить скопированное содержимое слоя "Depth Map" на маску корректирующего слоя. Загружаем выделение всех букв и заливаем маску корректирующего слоя черным цветом.

Кликаем по иконке корректирующего слоя Hue/Saturation (Цветовой тон/Насыщенность), чтобы вернуться в нормальный режим. Параметры корректирующего слоя показаны ниже. Активируем его маску, берем черную кисть и закрашиваем крону дерева.

Шаг 38

Создаем еще один корректирующий слой Hue/Saturation (Цветовой тон/Насыщенность), но теперь мы сделаем цвета переднего плана более насыщенными. Снова копируем содержимое слоя "Depth Map", затем переходим на маску корректирующего слоя. Вставляем скопированное содержимое слоя "Depth Map" на маску и инвертируем цвета, нажав Command/Ctrl+I.

Вот, что должно получиться в результате:

Шаг 39

Это дополнительный шаг. Я решила немного обрезать изображение с помощью Crop tool (Кадрирование) (С).

Шаг 40

Давайте добавим виньетку. Выделяем верхний слой на панели слоев и жмем Command/Ctrl+Shift+Alt+E, чтобы объединить все видимые слои на отдельном. Выделяем новый слой и переходим Filter - Lens Correction(Фильтр - Коррекция дисторсии). Переходим на вкладку Custom (Заказная) и вводим следующие параметры для виньетки:

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

 

Яндекс.Директ

Урок Фотошопа 3d!50 крутых фотокурсов онлайн. Личный тренер, увлекательные задания! 18+Основы съемкиОсновы композицииОсновы портретаОсновы пейзажаfotoshkola.net

16 сентября 2013 52 577 просмотров | Сложность:

В этом уроке вы узнаете, как создать воздушный, летний текст с 3D эффектом. В ходе урока вы научитесь использовать функции 3D в фотошоп для создания базовой формы текста, затем объединить его с различными изображениями, чтобы добиться желаемого результата. Итак, начнем!

Детали урока:

Используемое ПО: Adobe Photoshop CS6

Сложность: Средняя

Затраченное время: 3 часа

Итоговый результат.

Материалы для урока:

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

Материалы для урока:

Шрифт Rbno 2.1
Beach (Пляж)
Paradise at my Fingtertips
Cuba, cayo largo (1)
Cuba, cayo largo (2)
Mangsnag beach in KOREA
Sunset
Coconut palm against blue sky
Seagull
Beach ball
Umbrella
Water new
Green Flip Flops on Beach

Архив

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

D текст

Шаг 1

Прежде чем открыть фотошоп, нам нужно найти красивый шрифт для 3D текста. Автор использует шрифт RBNo 2.1 Black DEMO, который вы можете скачать на MyFonts бесплатно. Просто нажмите кнопку “Add to Cart”, завершите процесс, и вам будет предоставлена ??ссылка на скачивание шрифта. Тем не менее, не стесняйтесь использовать любой другой шрифт, который вам понравится. Автор считает, что для 3D текста больше подходят шрифты без засечек.

Примечание переводчика: шрифт можно скачать здесь.

Шаг 2

Как только шрифт установлен, откройте Photoshop и создайте новый документ (Ctrl + N). Так как мы будем работать в дальнейшем с документом с размеровм 1920 × 1080 пикселей, то наш 3D текст будет в два раза больше для достижения максимального качества. Настройте свой документ с размером 3840 за 2160 пикселей и нажмите кнопку ОК.

Выберите инструмент Текст (Type Tool) и напишите слово “SUMMER” в центре документа. Откройте палитруСимвол (Character ) и задайте следующие настройки.

С выделенным текстовым слоем перейдите в меню 3D – Новая 3D-экструзия из выделенного слоя (3D - New 3D Extrusion from Selected Layer). У вас получится следующий результат.

Шаг 3

Если вы никогда не использовали возможности 3D в фотошоп, вам покажется это немного запутанным. Для того чтобы использовать эти функции, вам необходимо открыть две панели - панель 3D и панель Свойства (Properties). В 3D панели вы можете выбрать различные настройки объекта, с которыми вы хотите работать (окружающая среда, фигура, свет и т.д.), а на панели Свойства (Properties) у вас есть возможность редактировать значения настроек.

И так, откройте эти две панели. В панели 3Dвыделите ваш текст и задайте ему следующие настройки в панели Свойства (Properties) как показано на скриншотах ниже. В редакторе Контура (Contour) убедитесь, что на всех точках контура отмечена опция Угол (Corner), иначе вы не получите необходимый результат.

Теперь введите следующие настройки для Окружающей среды (Environment), Сцены (Scene) и опции Текущий вид (Current View). Для того чтобы текст выглядел с перспективой не забудьте в настройке Текущий вид (Current View) в опции Поле зр… (FOV) установить значение на 10 мм.

Окружающая среда (Environment)
Координаты (Coordinates)
Сцена (Scene)
Текущий вид (Current View)

Наконец давайте применим к тексту материалы. Используйте настройки ниже для применения параметров и изменения цвета материалов, которые пригодятся нам для выделения в следующих шагах.

После того как 3D текст готов, для визуализации конечного результата нужно применить рендеринг (это может занять некоторое время), а затем текст растрировать. Так как мы работали с размером документа вдвое превышающим размер конечного нашего документа, рендеринг необязательно доводить до лучшего качества. Теперь идём в меню 3D – Рендеринг (3D – Render).

Примечание переводчика: Вы можете остановить рендеринг в любое время, нажав в любом месте документа.

Шаг 4

В этом шаге мы подготовим наш текст для работы с изображениями. Для этого нам понадобятся три версии текста.

Первую довольно легко получить. Выделите растрированный слой с текстом и идите в меню Выделение – Цветовой диапазон (Select > Color Range). Выберите синий цвет и затем создайте обтравочную маску в меню Слои – Создать обтравочную маску (Layer > Create Clipping Mask). Назовите этот слой “Blue”.

Примечание переводчика: видимо автор ошибся с выбором маски как обтравочной. Мой вариант для этого действия Слои – Слой маска – Показать выделенную область, после чего будет отделена нужная часть текста и маска как на скриншоте.

Идём дальше. Дублируйте слой с надписью и инвертируйте маску Ctrl + I. Возьмите инструмент Кисть (Brush) чёрного цвета и закрасьте зелёные области на надписи. Теперь загрузите выделение слоя “Blue”, удерживая клавишу Ctrl и щелкнув по его маске. Наконец, заполните выделение белым цветом на маске. Назовите этот слой “Red + Blue”.

Дублируйте слой "Blue" и скройте его маску (Shift + клик по маске). Теперь идите в меню Выделение – Цветовой диапазон (Select > Color Range) и создайте выделение из красного. Снова сделайте видимой маску и залейте выделение белым цветом. Снимите выделение Ctrl + D и инвертируйте маску. Назовите этот слой “Green”.

Нам предстоит проделать ещё немного работы над текстом. Создайте новый слой с обтравочной маской над слоем “Green” и, используя инструмент Штамп (Clone Stamp Tool), очистите остатки синего цвета на зелёном.

Пляж

Шаг 1

Теперь, когда наши 3D текст готов, нам нужно создать красивый пляж. Для начала создайте новый документ 3840x2160 пикселей так же, как в прошлый раз.

Откройте изображение с пляжем, перетащите в ваш документ и примените искажение в меню Редактирование – Трансформирование – Искажение (Edit > Transform > Distort).

Продублируйте слой с пляжем, отразите его по горизонтали в меню Редактирование – Трансформирование – Отразить по горизонтали (Edit> Transform> Flip Horizontal) и расположите его с правой стороны. Добавьте маску слоя копии и скройте аккуратно чёрной кисточкой области пляжа чтобы получилось единое изображение.

Теперь поместите изображение Paradise at my Fingtertips в ваш документ, уменьшите его примерно до 60% и растяните по горизонтали примерно до 200%. Используя маску слоя, мягкой кисточкой скройте лишнюю область отмеченную красным на скриншоте, чтобы слить низ с фоном. Добавьте два корректирующих слоя Цветовой баланс (Color Balance) и Кривые (Curves). Дополнительно автор создал новый слой с обтравочной маской в режиме Умножение (Multiply) и затемнил края слева и справа мягкой синей кисточкой. Как только закончите, сгруппируйте созданные слои в группу Ctrl + G и дайте ей название “Sea”.

Шаг 2

Откройте два изображения Cuba, cayo largo 1 и Cuba, cayo largo 2 и разместите так, чтобы их горизонт соответствовал вашему фону. Используйте ту же технику, как мы делали в предыдущем шаге для того, чтобы аккуратно слить слои вместе. Затем сгруппируйте их и скройте под маской нижнюю часть слоя как показано на скриншоте. Назовите группу “Sky”.

Добавьте в созданную группу два корректирующих слоя Цветовой баланс (Color Balance) и Кривые (Curves), чтобы осветлить небо и придать изображению вид Карибского бассейна.

Шаг 3

Скройте обе группы и откройте изображение Mangsnag beach in Korea. Поместите его в вашем документе слева, дублируйте и отразите по горизонтали. На новом слое, используя инструмент Штамп (Clone Stamp Tool) очистите песок. Не забудьте в верхнем меню настроек штампа поставить параметр Активный и ниже (Current & Below).

Добавьте вверху новый корректирующий слой Карта градиента (Gradient Map) и задайте следующий градиент. Сгруппируйте слои, с которыми сейчас работали и дайте название группе “Sand”.

Сделайте видимыми все группы. Добавьте маску группе “Sea” и скройте часть пены на песке, а так же для улучшения контраста добавьте группе стиль слоя Тень (Drop Shadow). Настройки ниже.

Добавим корректирующие слои группе “Sea”. Это будут Цветовой баланс (Color Balance) и Кривые (Curves).

Шаг 4

Давайте добавим солнышко в небе. Мягкой кисточкой на новом слое нарисуйте три пятна наложенные друг на друга, начиная с большого синего, затем среднего голубого и, наконец, небольшого белого. Установите режим наложения этому слою Экран (Screen).

Повторите те же действия, но на этот раз сделайте пятна больше и вне группы “Sky”. Теперь сгруппируйте эти слои и дайте название группе “Light”.

Чтобы сделать солнышко красивее, мы добавим его яркое отражение в море. Загрузите изображение Sunset, отделите отражение в воде, обесцветьте его Ctrl + Shift + U и затемните с помощью Кривых (Curves). Теперь трансформируйте слой, сжав его и установите ему режим наложения Экран (Screen).

Интеграция

Шаг 5

Теперь, когда у нас есть 3D текст и фон с пляжем, мы должны объединить их. Создайте еще раз новый документ, но на этот раз размеры его будут 1920 × 1080 пикселей и назовите его “Hello Summer”. Вернитесь в документ с пляжем и преобразуйте все слои в один Смарт объект (Smart Object). Для этого выделите все слои и группы, нажмите правой кнопкой мыши и выберите пункт Преобразовать в смарт объект (Convert to Smart Object)). Теперь дублируйте этот смарт в меню Слои – Создать дубликат слоя (Layrs – Duplicate layers) и выберите документ “Hello Summer”. Слои с 3D текстом дублируйте тоже в документ “Hello Summer”.

Используя Свободную трансформацию (Free Transform Ctrl + T), уменьшите все вплоть до 50%.

Теперь расположите в палитре слоёв смарт объект “Beach” с обтравочной маской над слоем “Red + Blue”. Так как слой с пляжем является смарт объектом при необходимости его всегда можно подвергнуть редактированию.

Шаг 6

Установите слою “Blue” Заливку (Fill) на 15% и задайте ему следующие стили слоя. Настройки ниже. Дублируйте слой “Beach” и сделайте его как обтравочную маску к слою “Blue”.

Слейте слой “Green” вместе с его вспомогательным слоем со штампом. Обесцветьте его Ctrl + Shift + U и измените режим наложения на Умножение (Multiply). Дублируйте слой “Beach” в очередной раз и поместите его ниже слоя “Green” в палитре слоёв. Затем загрузите выделение слоя “Green” и добавьте маску копии с пляжем.

Теперь добавим два корректирующих слоя с обтравочными масками для коррекции “Green”. Это будут Кривые (Curves) и Цвет (Solid Color).

Так же для копии пляжа добавьте корректирующий слой с обтравкой Кривые (Curves). В меню Фильтр – Размытие – Размытие по Гауссу (Filter – Blur – Gaussian Blur) добавьте размытие с радиусом 25 пикселей.

Теперь затемним выступающие грани текста. Дублируйте слой “Green” и разместите его выше всех слоёв. Измените ему режим наложения на Умножение (Multiply) и сотрите области с внешней экструзией. В меню Фильтр – Размытие – Размытие по Гауссу (Filter – Blur – Gaussian Blur) добавьте размытие с радиусом 5 пикселей и прикрепите к слою “Green” тоже слой с пляжем с обтравочной маской.

Шаг 7

Теперь наш 3D текст готов. Дублируйте слой “Beach” в очередной раз и растрируйте его в меню Слои – Растрировать – Смарт объект (Layer> Rasterize> Smart Object). В меню Фильтр – Размытие – Размытие по Гауссу (Filter – Blur – Gaussian Blur) добавьте размытие с радиусом 50 пикселей. Добавьте корректирующий слой Цветовой тон / Насыщенность (Hue/Saturation), сгруппируйте все текстовые слои вместе и дайте название группе “Summer”. Сделайте то же самое со слоями фона и дайте название группе “BG.”

Добавим нашему тексту тень, чтобы был вид, что он на песке. Дублируйте группу “Summer” и слейте её. Нажмите иконку в верху палитры слоёв Сохраняет прозрачность пикселов (Lock Transparent Pixels) и залейте слой цветом # 8A725F в меню Редактирование – Выполнить заливку (Edit> Fill). Переместите слой вниз.

Разблокируйте прозрачность пикселов и в меню Фильтр – Размытие – Размытие по Гауссу (Filter – Blur – Gaussian Blur) добавьте размытие с радиусом 15 пикселей. Трансформируйте слой, сжав его вертикально, сотрите верхнюю часть и разместите под группой “Summer” в палитре слоёв.

Повторите процедуру ещё раз, но значение радиуса размытия поставьте 3 пиксела. Сгруппируйте оба слоя и назовите группу “Shadow”.

Дополнительный материал

Шаг 8

В следующих шагах, мы начнем добавлять различные изображения в нашу композицию с целью сделать её более интересной. Начнём с пальмы. Для того чтобы отделить её от фона воспользуйтесь инструментом Волшебная палочка (Magic Wand Tool) и щёлкните по фону. Не обращайте пока внимания на облака и острова, мы это поправим. Добавьте маску слоя и чёрной кисточкой удалите лишние области как показано ниже.

Оставьте активной маску слоя и откройте панель Свойства (Properties). Кликните на кнопку Край маски(Mask Edge) и зарисуйте небо вокруг листьев. Установите значение радиуса (Radius) 0,6 пикселей, значение Сгладить (Smooth) 1 и включите опцию Очистить цвета (Decontaminate Colors).

Теперь преобразуйте слой с пальмой в Смарт объект (Smart Object), дублируйте его в ваш основной документ и уменьшите до 64 × 44%. Переименуйте слой в “Palm Tree” и скройте под маской правую нижнюю область пальмы. Когда слой преобразован в смарт объект вы можете его трансформировать сколько угодно раз, не теряя при этом качества.

Так как основной источник света в нашей композиции исходит от солнца в центре текста, мы сделаем внутреннюю тень нашей пальмы. Для этого создайте корректирующий слой Кривые (Curves) с обтравочной маской к пальме. Инвертируйте маску корректирующего слоя и обработайте на ней правую часть дерева. Примените фильтр Умная резкость(Smart Sharpen) и поместите слой в группу с одноименным названием. Так же можно уменьшить на маске воздействие фильтра чтобы листья не были слишком резкими.

Шаг 9

Добавим в нашу композицию пляжный мяч. Его необходимо отделить от фона и сделать это можно с помощью инструмента Эллипс (Ellipse Too), который послужит для создания маски. Теперь преобразуйте слой с мячом в Смарт объект (Smart Object), переместите в свой документ и отразите горизонтально. Примените стиль слоя Внутренняя тень (Inner Shadow) и при желании добавьте тень, как делали ранее тень для текста на песке.

Скачайте изображение с зонтиком, откройте его в фотошоп. Отделите его от фона, убрав ручку выходящую за пределы зонта. Преобразуйте слой с зонтиком в Смарт объект (Smart Object) и переместите в свой документ. Инструментом Кисть (Brush) с небольшой жёсткостью, с зажатой клавишей SHIFT, нарисуйте серым цветом прямой шест до песка. Примените к шесту стиль слоя Тиснение(Bevel & Emboss).

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

Теперь добавим текст с надписью “Hello”. Автор использует шрифт Shelby, который вы можете купить здесь Так же вы можете использовать любой шрифт на ваш выбор. Добавьте тексту стиль слоя Наложение градиента (Gradient Overlay).

Шаг 10

В этом шаге мы добавим пролитую воду на песок. Для этого используем фигуру брызг, которую вы можете скачать в интернете. Поместите фигуру в ваш документ, трансформируйте её в меню Редактирование - Трансформирование – Перспектива (Edit> Transform> Perspective). Поставьте Заливку (Fill) слоя на 0% и примените стили слоя.

Тиснение(Bevel & Emboss)

Наложение цвета (Color Overlay)

Скачайте изображение Water new и разместите его в перспективе над слоем с брызгами. Загрузите выделение брызг и, стоя на слое с водой, добавьте маску, так вы отсечёте лишнюю область воды. Теперь обесцветьте воду Ctrl + Shift + U и затемните с помощью коррекции кривых. Измените режим наложения на Мягкий свет (Soft Light) и уменьшите Непрозрачность (Оpacity) 20%.

Повторите процесс, добавив ещё небольшие брызги. Автор поместил эти слои в группу и для лёгкости добавил стили слоя прямо к ней.

Шаг 11

Чтобы лучше вписать наши буквы и сделать их интереснее, добавим немного просыпанного песка на поверхность. Скачайте изображение песочка, для удобства лучше сразу в формате PNG и задайте ему следующие настройки – стиль Тиснение(Bevel & Emboss) и два корректирующих слоя Цветовой баланс (Color Balance) и Кривые (Curves).

Нарисуем немного песчинок на поверхности. Чтобы сделать это, выберите небольшую жесткую кисть, откройте панель настроек кисти (F5) и установите настройки, используя скриншоты ниже. ИнструментомПипетка (Eyedropper Tool) отберите цвет песка для рисования песчинок. Нарисуйте их на новом слое и для контраста примените стиль слоя Тень(Drop Shadow).

Повторите этот процесс столько, сколько посчитаете нужным.

Шаг 12

Используя ту же технику, добавьте шлёпанцы рядом с буквой U и назовите группу “Sandals”.

Финальная коррекция

Шаг 13

На данный момент мы уже имеем такую работу.

Она выглядит достаточно хорошо, но мы все еще можем улучшить работу. В этом шаге мы добавим несколько корректирующих слоев, чтобы помочь объединить различные элементы в композиции. Добавьте следующие корректирующие слои как на скриншотах ниже. Для коррекции Карта градиента (Gradient Map) измените режим наложения на Перекрытие (Overlay) и уменьшите Непрозрачность (Оpacity) до 50%. Не забудьте на маске корректирующего слоя Цветовой баланс (Color Balance) мягкой чёрной кисточкой убрать воздействие коррекции так, чтобы листья пальмы остались зелеными. Теперь сгруппируйте все слои и дайте название группе “Adjustments”.

Фото фильтр (Photo filter)

Цветовой баланс (Color Balance)

Кривые (Curves).