В этом уроке вы узнаете, как создать весёлый 3D pop up эффект, подобно детской всплывающей книги, где главный объект съёмки, словно «выходит» из плоского изображения.
Для достижения еще большого 3D эффекта, мы изогнем края фотографии с помощью команды Деформация в Photoshop и добавим тень. Чтобы достичь такого эффекта потребуется лишь несколько шагов, все они очень просты и легки. В этом уроке я буду использовать Photoshop CS6, но вы можете работать в любой из последних версий Photoshop.
В качестве исходного изображения я буду использовать вот эту фотографию:
Шаг 1. Откройте фотографию в Photoshop. Если мы посмотрим на палитру слоев то увидим что фотография отображается в качестве фонового слоя:
Давайте создадим несколько копий слоя. Для этого нажмите Ctrl + J на клавиатуре, для быстрого создания первого экземпляра. Копии, которую вы только что создали, Photoshop автоматически присвоил название Layer 1 (Слой 1). Это название по умолчанию, которое Photoshop присваивает к вновь созданным слоям. Это не очень удобно, и поэтому чтобы в последствии у нас не возникало путаницы переименуйте слой на flat. Для этого дважды щелкните непосредственно по названию слоя, переименуйте его на flat и нажмите Enter. Этот слой будет являться плоскостью нашей будущей композиции.
Теперь мы создадим вторую копию слоя. Нажмите сочетание клавиш Ctrl + J и продублируйте один из слоев. Переименуйте этот слой на pop up. Этот слой мы будем использовать в качестве «всплывающего эффекта» нашей композиции.
Шаг 2. Отключите видимость двух созданных раннее слоёв (flat, pop up), нажав на значки глаза в левой части каждого из слоёв.
Шаг 3. Выберите фоновый слой, кликнув по нему левой кнопкой мыши (выбранные слои подсвечиваются синим цветом):
Шаг 4. Теперь для фонового слоя добавим градиентную заливку. Применение градиентной заливки придаст более интересный эффект, нежели использование сплошного цвета. Нажмите на кнопку New Fill or Adjustment Layer (Создать новый корректирующий слой или слой заливка) в нижней части панели слоёв:
Из появившегося списка выберите Gradient (Градиент).
Шаг 5. В результате откроется диалоговое окно Gradient Fill (Градиентная заливка). Кликните по градиенту.
В диалоговом окне редактора градиентов выберите чёрно-белый градиент.
Шаг 6. Теперь нам нужно изменить цвета для градиента. Для этого сделайте двойной клик по левой контрольной точке цвета.
В результате откроется окно Color Picker (Палитра цветов), в котором вы можете изменить цвет. В данном случае чёрный цвет слишком тёмный для фона, поэтому выберите светлый оттенок серого цвета. Нажмите OK, чтобы закрыть палитру цветов.
Затем нажмите OK, чтобы закрыть редактор градиентов. И наконец нажмите OK, чтобы закрыть окно градиентной заливки. Посмотрите на панель слоёв, корректирующий слой появился чуть выше фонового слоя.
Вот результат:
Шаг 7. Включите видимость слоя flat, для этого кликните по значку видимости слоя.
Так как этот слой находится выше корректирующего слоя с градиентной заливкой, то он перекроет градиент.
Шаг 8. На панели инструментов выберите инструмент Rectangular Marquee Tool (M) (Прямоугольная область).
Шаг 9. Создайте выделение, для этого кликните в верхней левой части фотографии и переместите выделение в нижнюю правую часть. Не переживайте, что в выделенную область вошла не вся нужная часть фотографии, мы это сейчас исправим.
Шаг 10. Не снимая выделения, перейдите в меню Select > Transform Selection (Выделение - Трансформировать выделенную область).
Шаг 11. Как только вы активируете команду Transform Selection, вы увидите, маленькие квадратики - маркеры, которые появятся вокруг выделенного контура (по одному в каждом углу и по центру каждой из сторон). Мы будем использовать эти маркеры, для изменения геометрии выделенной области, но прежде нам необходимо переключиться в режим - Perspective (Перспектива). Для этого щелкните правой кнопкой мыши в любом месте внутри выделения из появившегося контекстного меню выберите - Perspective (Перспектива):
Шаг 12. Теперь, когда мы находимся в режиме перспективы, левой кнопкой мыши кликните по маркеру в левом верхнем углу выделенного контура и, не отпуская кнопку мыши, перетащите его в правую сторону. Противоположный маркер в правом верхнем углу передвинется автоматически:
Таким же образом потяните за маркер в левом нижнем углу выделенного контура и перетащите его наружу, как на изображении ниже. Так как мы все еще в режиме перспективы, то маркер напротив также передвинется автоматически:
Теперь, когда мы находимся в режим масштабирования, кликните по центральному верхнему маркеру контура и, удерживая левую кнопку мыши, перетащите маркер немного вниз:
После этого кликните по центральному нижнему маркеру и, удерживая левую кнопку мыши, переместите маркер немного вверх.
Продолжайте перемещать маркеры, чтобы изменить контур выделения. По мере необходимости производите переключение между режимами перспективы и масштабирования, пока не получите результат, как на изображении ниже. Если вас устраивает полученный результат - нажмите Enter, чтобы сохранить изменения.
Шаг 14. Убедитесь, что у вас выбран слой flat и добавьте к нему маску, кликнув по значку Add Layer Mask (Добавить слой-маску) в нижней части панели слоёв.
В результате наше выделение превратится в маску. Рядом с миниатюрой слоя flat появилась миниатюра маски слоя. Чёрным цветом представлена та часть фотографии, которая скрыта в документе, а белая область - этот часть, которая осталась видна.
Посмотрите на наш холст, и вы всё поймёте.
Шаг 15. Теперь к видимой части фотографии добавим обводку при помощи стиля слоя Stroke (Обводка). Для этого нажмите на значок FX в нижней части панели слоёв и из списка выберите нужный стиль.
В открывшемся окне нам нужно изменить цвет для обводки, поэтому кликните по образцу цвета.
В палитре цветов выберите белый цвет #ffffff и нажмите OK.
Затем в параметре Position (Положение) выберите Inside (Внутри).
В параметре Size (Размер) я установил 16 пикселей, всё зависит от выбранного вами изображения, возможно, вам понадобится установить размер обводки больше моего для получения желаемого результата.
Когда вы закончите с настройками, нажмите OK, чтобы закрыть окно стилей слоя. В результате на краях фотографии у на появилась обводка.
Шаг 16. Теперь займемся созданием основного всплывающего эффекта. На панели слоев перейдите на слой pop up, а затем нажмите на значок видимости слоя - глаз.
Шаг 17. По своему усмотрению выберите любой из инструментов выделения и создайте выделение вокруг главного объекта на фотографии. Я выбрал двух мальчиков и снеговик. Постарайтесь сделать выделение как можно более точным вокруг тех областей, которые в последствии будут выходить из фото (другими словами, те области, которые вы выделите в конечном итоге будут располагаться перед градиентной заливкой). Опирайтесь на изображение ниже:
Шаг 18. К слою pop up нужно добавить маску, кликнув по значку Add Layer Mask (Добавить слой-маску) в нижней части панели слоёв.
Наше выделение снова превратиться в маску.
Вот, что у меня получилось:
Шаг 19. Для завершения эффекта мы немного изогнём углы и добавим тень. Перейдите на слой flat, чтобы выбрать его.
Шаг 20. Зажмите Ctrl и левой кнопкой мыши кликните по миниатюре маски слоя flat.
В окне документа появится контур выделения содержимого маски этого слоя.
Шаг 21. Удерживая Ctrl, нажмите на значок нового слоя в нижней части панели слоев:
Как правило, Photoshop добавляет новый слой прямо над выделенным слоем, но, нажав клавишу Ctrl, Photoshop помещает новый слой ниже выделенного слоя. В нашем случае новый слой создался ниже слоя flat. Дважды щелкните по имени нового слоя и переименуйте ее в shadow, а затем нажмите Enter чтобы сохранить изменение:
Шаг 22. Заполните выделение на слое shadow чёрным цветом. Для этого перейдите во вкладку Edit > Fill (Редактирование - Выполнить заливку).
В диалоговом окне заливки установите такие параметры: Use (Использовать) - Black (Чёрный), Mode (Режим) - Normal (Нормальный), Opacity (Непрозрачность) 100%.
Когда вы закончите, нажмите кнопку ОК, чтобы закрыть диалоговое окно заливки. Photoshop заполнил контур слоя shadow чёрным цветом. Мы не можем это увидеть на данный момент в окне документа, потому что слой flat перекрывает слой с контуром, но если посмотреть на миниатюру слоя shadow в палитре слоев, то всё вполне очевидно.
Шаг 23. К слою shadow мы вернемся позже, а пока добавим изгибы к уголкам нашей фотографии. Кликните по миниатюре маски слоя flat, чтобы выбрать её:
Шаг 24. Обратите внимание на значок связи (значок цепи) между миниатюрой слоя flat и векторной маской. Кликните по этому значку, чтобы удалить его, таким образом, мы разорвем связь маски с содержимым слоя.
Шаг 25. Перейдите на маску слоя flat и зайдите в меню Edit > Transform > Warp (Редактирование - Трансформирование - Деформация).
Шаг 26. Вы увидите, что вокруг содержимого маски слоя появится сетка для деформации. Поочерёдно кликайте по угловым маркерам сетки и перемещайте их вверх. Нажмите Enter, чтобы применить деформацию.
Шаг 27. Теперь нам нужно немного смягчить тень. В палитре слоёв выберите слой shadow.
Шаг 28. Перейдите в меню Filter > Blur > Gaussian Blur (Фильтр - Размытие - Размытие по Гауссу).
В диалоговом окне этого фильтра для радиуса установите значение 10,1 пиксель. Но если вы работаете с другой фотографией, то значение для радиуса размытия подберите самостоятельно.
Нажмите OK, чтобы применить размытие.
Шаг 29. Если после размытия тень кажется ещё слишком насыщенной, то уменьшите уровень непрозрачности для слоя с тенью до 60%.
Вот результат:
Шаг 30. Нам осталось уменьшить размер тени. Перейдите в меню Edit > Free Transform (Редактирование - Свободное трансформирование).
Вокруг тени появится рамка. Переместите левый, нижний и правый средние маркеры внутрь. Смотрите изображение ниже.
Нажмите Enter, чтобы применить преобразования.
Если вас не устраивает цвета градиентного фона, то перейдите на слой Gradient Fill 1 и кликните два раза по миниатюрке этого слоя.
В окне градиентной заливки кликните по градиенту.
В редакторе градиентов дважды кликните по левой контрольной точке серого цвета, чтобы изменить его.
У вас должна открыться цветовая палитра, но цвет я выбирал не из цветовой палитры, а из самого изображения. Когда вы наведёте курсор мыши на изображение, то курсор автоматически превратиться в пипетку, с помощью которой можно взять образец цвета. Я взял образец в области голубого снега.
После того, как вы определитесь с цветом, нажмите OK.
Давайте начнем! Создаем новый документ (File> New) со следующими настройками:
Загрузить изображение Осенний парк и разместите его на своем полотне. Образ, который я использую в этом уроке имеет тот же размер что и холст, так что эта фотография будет полностью покрывать его. Если вы хотите использовать собственное изображение для фона вы должны изменить его размер в соответствии с размером холста. Поместите его в холст и перетащите одну из угловых точек. Удерживайте Shift, чтобы изменить размер изображения пропорционально. Выберите «Background» слой, слой с вашей фотографией и объединить их (Ctrl + E)
Итак, давайте начнем создание 3D букв. Загрузите изображение английского алфавита и откройте его в Photoshop. Теперь вы должны решить, какое слово вы будете составлять из букв и какие цвета вы будете использовать для них. Я решила сделать слово «Leaf». Возьмите Lasso Tool (L) и выберите первую букву слова, скопируйте (Ctrl + C) и вставьте его (Ctrl + V) на свой холст.
Назовите этот слой с буквой в соответствии с его названием, например, мой слой будет называться «Letter L». Теперь нам нужно удалить белый фон. Возьмите Magic Wand Tool (W), выберите слой с буквой и нажмите на белом фоне. Нажмите кнопку Удалить. Обратите внимание, что параметр «Sample All Layers» не отмечен галочкой.
Выберите слой с вашей буквой и активируйте инструмент Transform (Ctrl + T).Удерживая клавишу Shift перетащите один из угловых маркеров, чтобы уменьшить размер буквы.
Если вы хотите изменить цвет вашей бувы вы можете использовать корректирующий слой (например, Color Balance и Selective color). Я дам подробное описание в шаге 15. Так как меня вполне устраивает красный цвет моей первой буквы, то я перешла к созданию 3D буквы.
Для создания 3D буквы, выберите слой с буквой и перейти к 3D> New 3D Extrusion из выбранного слоя. Photoshop попросит вас переключиться в 3D рабочее пространство - нажмите кнопку ОК.Таким образом, 3D рабочее пространство Photoshop CS6 находится перед вами. Сначала мы должны определить положение плоскости земли, на которой письмо будет расположен. Чтобы сделать это, выберите сцену в 3D-панели и отрегулируйте положение Ground Plane с помощью значков на панели Options.
Постарайтесь расположить Ground Plane так, чтобы она совпадала с горизонтальной поверхностью, на которой вы поместите буквы:
Если фоновое ваше изображение отличается от моего, вы должны выбрать правильное положение Ground Plane самостоятельно.
Теперь нам нужно сделать текстуру для письма. Скачайте эту бетоннную текстуру (рисунок 1) и откройте его в Photoshop.
Мы будем использовать его для передней и экструдированной части букв. «500 пикселей» на панели параметров, чтобы получить квадрат размером 500 × 500 пикселей. После того как область выбрана, нажмите клавишу ВВОД и сохраните текстуру. Имя файла «texture_front».
Теперь пришло время, чтобы применить текстуру рельефа в письме. На панели 3D выберите «Front Inflation Material » и перейдите к панели свойств 3D-объектов. Эта панель будет открываться автоматически при переключении в 3D-пространство. Найти Bump настройки в панели свойств и выберите " Load texture ". В открывшемся окне выбрать текстуру, что вы подготовили на предыдущем шаге («texture_front.jpg»):
Bump настройка отвечает за облегчение, так что вы можете установить желаемую степень рельефа с помощью ползунка. Я поставила его на 20%. Вам придется изменить масштаб и расположение текстуры. Для этого нажмите на значок папки рядом с Bump настройкой и выберите пункт " Edit UV Properties ".
Вертикальная и горизонтальная шкала (шкала V и U шкала соответственно) являются основными параметрами, которые необходимо отрегулировать. Параметры U Offset и V Offset несут ответственность за перемещение текстур, вы можете настроить их, как вам нравится.
Далее нам нужно добавить текстуру на экструдированную часть буквы. Чтобы сделать это, перейдите к панели 3D выберите " Extrusion Material " и загрузите ту же текстуру («texture_front.jpg») для параметра Bump.
Я увеличила значение Bump до 25% на экструдированные части буквы. Точно так же, как мы делали в предыдущем шаге, редактируйтеь свойства текстуры: нажмите на значок папки рядом с Bump настройки и выберите пункт " Edit UV Properties ". Я использовала следующие значения:
Кроме того, я изменила цвет экструзии на розовый, так что вы можете визуально видеть, как изменение параметров влияет на текстуры. Позже я покажу вам, как подобрать цвет экструзии лучше.
Теперь пришло время работать на месте буквы. Перейти в 3D-панель и выберите букву - вы увидите, что три оси окажутся в центре буквы. Вы можете вращать, изменять размер и перемещать объект относительно этих осей, используя те же иконки на панели параметров, которые используются для перемещения Ground Plane. Есть иконки на оси, которые вы также можете использовать для вращения, перемещения и масштабирования объектов:
Кроме того, это удобно для перемещения объекта в нескольких плоскостях одновременно. Для этого переместите курсор на ребро куба, внутри которого ваша буква находится: стороны куба (которые являются соответствующие плоскости, вдоль которой движение будет осуществляться) будут выделены желтым цветом, и намек с направлениями появится рядом с курсором.
При перемещении курсора на стороне куба, движение будет осуществляться по одной плоскости (она также будет выделена желтым цветом), если вы хотите букву, которая будет расположена на поверхности, не перемещать по вертикальной оси (Y). Если вы заметили, что буква зашла слишком вверх или вниз, перейдите к 3D> Snap объекта к Ground Plane – буква будет снова на движущиеся поверхности и вращающейся оси на панели Properties в разделе координаты. Если вы не знаете, как вернуть букву в исходное положение на определенной оси, просто установите угол поворота соответствующей оси до 0 градусов:
Теперь вы знаете, как изменить положение 3D-объектов. Таким образом разместите букву на Ground Plane, как вам нравится и измените ее размер, если это необходимо. Например, позиция моей буквы заключается в следующем:
В этом шаге мы будем работать над появлением буквы - мы будем корректировать размер экструзии, а в следующем шаге мы настроим фаски. Сетка - для регулировки толщины буквы.Мы заинтересованы в значении глубины Экструзии: Я поставила его на 250, но вы можете использовать другое значение, если хотите. Кроме того, параметры Catch Shadows и Cast Shadows должны быть проверены, когда мы поставим источники света.
В этом шаге мы настроим фаски. Перейти к Properties panel > Mesh section, я выбрала тип Bevel, но вы можете попробовать другой, а затем поэкспериментировать с его настройками:
Теперь вы должны определить цвет экструзии. Чтобы изменить свой цвет, выберите Extrusion Material на 3D панели и перейдите к панели свойств. Основной цвет экструзии будет определять цвет, который вы выбрали для параметра Diffuse. Я выбрала цвет # f25646:
Вы также можете поэкспериментировать с другими настройками, такими как Specular (она влияет на резкость / контрастность текстуры) и Illumination (она влияет на яркость боковых краев). В данном случае я выбрала следующие значения: Specular color - # 645858, Illumination color - # 290816.
Теперь пришло время для работы над источниками света. Идите к 3D-панели и выберите первый источник света (у вас уже есть там) - Infinite Light 1. Мы создадим основной источник света.В этом случае основным источником света является Солнце, и он находится в правом верхнем углу.Если вы используете собственное изображение для фона вы должны определить положение основного источника света самостоятельно (обратите внимание на направление людей / объектов тени и т.д.)
позицию источника света. Щелкните левой кнопкой мыши на источнике и поверните его так, чтобы тень от буквы находится примерно в левом нижнем углу:
Параметры и координаты этого источника света следующие (цвет # ffebcf):
Координаты этого источника света одинаковы для всех букв, которые вы создадите в этой сцене.
Давайте добавим еще один источник света, так чтобы буква не была слишком темной. Для этого щелкните на Add new Light на сцену значок в нижней части панели 3D и выберите New Infinite Light.
Таким образом, работы по первой букве практически завершены. На этом этапе мы будем корректировать цвета stroke буквы. Если вы любите черный цвет, вы можете пропустить этот шаг.
Мы будем редактировать текстуры, которые используются в двух местах на букве - Front Inflation Material и Front Bevel Material… Итак, когда вы выбираете Изменить текстуру, Photoshop предупредит вас о том, что изменения будут применены ко всем местам на сцене.Нажмите кнопку ОК. New Adjustment Layer> Selective Color. Выберите черный канал и настройте цвет stroke. В этом примере он становится красным:
После того как вы закончили работать с текстурой, сохранить ее (Ctrl + S) и закройте этот файл. Переключить на ваш рабочий документ, - вы увидите, что текстура была обновлена:
Теперь вы можете создавать все остальные буквы таким же образом. Но если вы хотите изменить цвет буквы сразу, вы можете использовать корректирующий слой Selective Color и опции Replace Color. Давайте практиковать это на моей второй букве - «E». Если вы хотите продолжать работать со слоями в Photoshop, просто переключитесь на панели слоев. Разместите следующую букву в рабочем документе и удалить ее фон, как мы делали в шаге 3. Я назвала этот слой «letter – „E“и перейдите к Image > Adjustments > Replace Color. Возьмите пипетки с „+“ и расширьте зону замены цвета, нажав на оттенки светло-голубого цвета. А затем отрегулируйте ползунки, чтобы получить цвет, близкий к этому (цвет # fed4b6):
Далее создайте корректирующий слой Selective Color (Layer> New Adjustment Layer> Selective Color) и преобразуйте его слой в обтравочную маску для слоя » letter – «E ». Для этого щелкните правой кнопкой мыши на слое Selective Color на панели слоев и выберите Create Clipping Mask. Так Selective Color влияет только на слой " letter – «E ».
Теперь я довольна оранжевым цветом, который у меня есть, и я могу объединить слой с буквой и корректирующим слоем Selective Color (выберите оба слоя на панели слоев и нажмите Ctrl + E).
Таким образом, база буквы будет готова, и вы можете начать делать 3D-буквы. Перейдите к шагу 4 и повторите все инструкции для создания 3D буквы. Не забывайте о перспективе букв: если буква далеко от зрителя, его размеры должны быть меньше, чем размер вашей первой буквыа.Слой с первой буквой должна быть на верхней части панели Layers, а все остальные слои с буквами должны быть расположены под ней одна за другой. Не забывайте, что вы можете изменить настройки 3D, движение букв, изменить цвет текстуры, пока вы не получите желаемый результат.Так я создала все буквы и получила следующие результаты:
Буквы готовы и вы можете растрировать эти 3D-слои. Но я рекомендую вам сохранить оригинальный 3D-слой в случае, если вы хотите что-то изменить. Чтобы сделать это, дублируйте все ваши 3D-слои (выберите их на панели слоев и нажмите Ctrl + J). Группа оригинальных 3D-слоев (Ctrl + G), назовите эту группу «3D» и отключите их видимость (нажмите на иконку глаза возле миниатюры слоя). Далее, перейдите к вашим дублированным слоям и растрируйте их: правой кнопкой мыши на один из слоев и выбрать Rasterize 3D.
В этом шаге мы добавим больше контраста в тенях буквы на траве. Чтобы сделать это, создайте новый слой (Ctrl + Shift + N), назовите его «Shadow» и поставьте его под все слои с буквами на панели слоев. Возьмите Brush Tool (B) со следующими настройками: Цвет: # 1d280a, твердость: 50%, режим смешивания: Multiply, Opacity: 10-15%. Размер кисти зависит от вас.
Закрашиваем на затененных участках выбранной кистью, как это показано на рисунке:
Теперь мы собираемся сделать нижнюю части буквы, чтобы они выглядели, как будто они действительно стоят на траве. Мы будем использовать стандартный набор кистей для этого. Возьмите Brush Tool (B) и выберите жесткую (100% Hardness) круглую кисть, непрозрачность около 50%. Лучше работать на маске слоя буквы, потому что в этом случае вы сможете изменить результат в любое время. Так что добавьте маски на все слои с буквами (Layer> Layer Mask> Reveal All) и измените цвет переднего плана на черный. Нажмите на миниатюру слоя маски и закрасьте нижнюю часть буквы, чтобы скрыть ее:
Если вы закрасили некоторые дополнительные области, просто измените цвет переднего плана на белый и закрасьте те области, чтобы сделать их видимыми.
Убедитесь, что Brush Tool выбран, нажмите клавишу F5 и выберите «Dune Grass» кисти. Параметры являются Кисти следующие:
Красьте по нижней части буквы выбранной кистью на маске слоя. Выберите кисть небольшого размера - около 30 пикселей. Вот что вы должны получить:
Как вы видите, мы спрятали некоторые части тени буквы, потому что они находятся на том же слоев, что и сами букв. Таким образом, вернемсяк шагу 18 и установим кисти на те же параметры.Выберите слой «Shadow» и закрасьте области, которые были скрыты под маской:
Если вы не полностью удовлетворены результатом, выберите кисть «Dry Brush Tip Light Flow» из стандартного набора кистей и окрасьте нижнюю часть букв на Layer Mask.
Далее нам нужно изменить экструдированные части букв, так чтобы они не были гладкими. Чтобы сделать это, возьмите Brush Tool (B) и выберите одну из следующих кистей (Opacity: 100%, размер кисти: около 50 точек, основной цвет: черный):
В масках слоев букв, закрасьте задний край букв.
Получаем следующий результат:
Теперь нам нужно применить фильтр Gaussian Blur к буквам, так что текстура будет не столь резким. Но прежде чем сделать это, лучше будет преобразовать все слои с буквами в смарт-объект - в этом случае у вас будет возможность изменить настройки фильтра после его применения.Щелкните правой кнопкой мыши на одном из слоев с буквами на панели слоев и выберите Convert to Smart Object. Не беспокойтесь о маске слоя. Она не была удалена, теперь это только внутри смарт-объекта
для редактирования, дважды щелкните на текущий слой на панели слоев.
Выберите слой с первой буквой L и перейдите к Filter> Blur> Gaussian Blur. Размытие зависит от размера вашей буквы. Я выбрала значение 0,4:
Примените фильтр Gaussian Blur ко всем другим буквам. Не забывайте о глубине поля: если письмо далеко от зрителя, оно должно быть более размытым, чем первая буква. Если вы хотите изменить степень размытия, дважды щелкните на имени фильтра на панели слоев:
Итак, вот что я получаю:
Загрузить изображение с трещинами краски (я использовала размер 1600х1200 пикселей) и поместите его в документ. Уменьшите размер текстуры, как это показано на рисунке (при изменении размера не забывайте держать клавишу Shift):
Активизируйте инструмент Transform (Command / Ctrl + T), щелкните правой кнопкой мыши на холсте и выберите Distort. Потяните за угловые маркеры так, чтобы текстура стала почти параллельно лицевой стороне буквы:
Rasterize слой с текстурой (щелкните правой кнопкой мыши по слою> Rasterize Layer). Назовите этот слой " Texture L» Загрузите выделение слоя «Letter L copy » (Ctrl щелкните по иконке слоя на панели слоев), выберите «Texture L» слоя и нажмите на иконку Add Layer Mask в нижней части панели Layers.
Измените режим наложения «Texture L» слоя на Soft Light, возьмите Brush Tool (B), установите непрозрачность до 50% и измените цвет переднего плана на черный. Переключитесь на маску «Texture L» слоя и закрасьте стороны, тень и переднюю области букв, так текстура выглядит более реалистично:
Повторите то же самое с другими буквами. Не забывайте, что направление текстуры должны быть параллельны лицевой стороне букв.
Вы должны получить что-то вроде этого:
Сгруппируйте все слои, связанные с буквами (Ctrl + G) и назовите группу " Letters ":
В этом шаге мы будем делать передний план более насыщенным и контрастностным. Чтобы сделать это, создайте слой Levels Adjustment (Layer> New Adjustment Layer> Levels), поместите его над «Background» слой. После этого создайте Hue / Saturation Adjustment Layer (Layer> New Adjustment Layer> Hue / Saturation) и установите следующие значения:
step026
Далее возьмите Gradient Tool (G), цвета градиента черный и белый, тип градиента - линейный.Переключитесь на " Levels " слой-маску и нарисуйте градиент от верха до низа. Выберите маску «Hue / Saturation» слой и нарисуйте градиент с теми же настройками, но в этом случае он должен быть шире:
Теперь нужно настроить контрастность и насыщенность цвета букв, чтобы они лучше вписывались в окружающую среду. Чтобы это сделать, создайте два корректирующих слоя: Levels и Hue / Saturation, и конвертировать их в Clipping Mask для группы «Letters», так что эти слои будут влиять только на эту группу. Настройки Adjustment Layers » следующие:
Загрузите изображение с желтыми кленовыми листьями и откройте его в Photoshop. Возьмите о Selection Tool (W) и выберите лист. Если вы захватили дополнительную площадь, переключитесь на режим «Subtract from Selection » и нажмите на область, которую вы хотите удалить из вашего выделения. Теперь вам не нужно делать точное выделение, потому что размер листа будет сокращен и вы не заметите неровные края.
Скопируйте и вставьте выбранный лист в свой рабочий документ, измените его размер в соответствии с изображением ниже. Отразите по горизонтали (нажмите Ctrl + T> щелкните правой кнопкой мыши на холсте> Flip Horizontal), а затем используйте режим Деформации преобразования (нажмите Ctrl + T> щелкните правой кнопкой мыши на холсте> Warp), чтобы сделать листья похожи на мой пример:
Далее, нам необходимо добавить два стили слоя к слою «Leaf»: Gradient Overlay и Drop Shadow. Дважды щелкните на кнопку слоя «Leaf» на панели слоев, параметры следующие:
Gradient Overlay: Я использую «Оранжевый, желтый, оранжевый« градиент из стандартного набора. Drop Shadow: цвет # 460000
Скачать еще одну картину с желтыми кленовыми листьями, выделите ее таким же образом, и вставьте в ваш рабочий документ. Назовите этот слой » Leaf 2". Используйте Warp transformation, чтобы сделать следующую форму:
Дважды щелкните на этом слое на панели слоев, установите следующие значения:
результат:
Теперь скачивайте и открывайте изображения куста и с помощью Selection Tool (W) выделите эту область:
Скопируйте и вставьте эту область на ваш рабочий документ. Поместите эти листья рядом с буквой «L», назовите ее " Leaf 3" и создайте слой Levels Adjustment в Clipping Mask режиме. Настройки корректирующего слоя Levels показаны на рисунке ниже. Кроме того, я уменьшила непрозрачность " Leaf 3" слоя до 85%.
Наконец открываем третье изображение с кленовым листом, выберите его с помощью Selection Tool (W) и вставьте его в ваш документ. Назовите этот слой " Leaf 4". Изменените размер листа, используя Warp transformation, чтобы сделать следующую форму:
Выберите слой" Leaf 4" и добавьте Drop Shadow Layer Style (цвет: # 172617):
Если вы посмотрите на букву «F», вы увидите, что тень должна падать на верхнюю стороу листа.Чтобы сделать это, создайте Hue / Saturation слой корректировки в режим Clipping Mask " Leaf 4" слоя.Установить значения, как это показано на рисунке ниже. Идите к Levels маски корректирующего слоя, возьмите инструмент Brush Tool (B) и измените цвет переднего плана на черный и закрасьте нижнюю часть листа. Кроме того, я уменьшила непрозрачность на слое" Leaf 4" до 85%.
Теперь вы можете объединить все слои, связанные с листьями (Ctrl + G) и назовите группу " Leaves ".
В этом шаге мы будем делать тени и блики. Чтобы сделать это, создайте новый слой (Ctrl + Shift + N), назовите его «Shadows / Highlights», поместите его на верхней части панели Layers и залейте его 50% серым цветом (Edit> Fill):
Измените режим смешивания «Shadows / Highlights» слоя на Soft Light. Возьмите Brush Tool (B), измените цвет переднего плана на белый, установите непрозрачность до 5% и закрасьте моменты.Затем нажмите кнопку «D», чтобы измените цвет передн
Фотошоп является не только самым популярным графическим редактором, но и имеет инструменты для создания не сложных 3D моделей. С помощью Photoshop можно сделать практически любую 3D модель, для использования ее в какой-либо композиции, дизайне или для последующей 3D печати.
В данном уроке мы рассмотрим создание простого 3D объекта, а именно вазы. Рассматриваемым способом можно создавать различные округлые 3D объекты, например стакан, трубу, круглый стол и т.п.. По ходу урока вы сами поймете, какие именно объекты можно создать данным способом.
Для работы я нашел изображение вазы в формате png, из которого и буду делать 3D объект. Данное изображение, а так же файл-исходник к данному уроку вы можете скачать с данной страници в правом столбце.
1) Открываем изображение вазы программой фотошоп, для этого в верхней панели меню выбираем "Файл" - "Открыть" или нажимаем комбинацию клавишь "Ctrl + O".
2) Создаем новый холст необходимого размера, для этого в верхнем меню выбираем "Файл" - "Создать" или комбинацию клавишь "Ctrl + N" и указываем необходимый размер холста, я сделаю квадратный холст размером 1024px на 1024px.
3) Перетаскиваем изображение вазы на созданный холст, для этого выбираем инструмент "Перемещение" в левой панели, затем в панели слоев кликаем по слою с вазой левой кнопкой мыши и удерживая ее просто перетаскиваем слой на новый холст.
Если после открытия изображения слой с ним заблокирован, т.е. на слое справа имеется иконка замочек, то сначала необходимо его разблокировать, иначе перетащить слой на другой холст не получится. Если вы не знаете, как разблокировать слой, то можете ознакомиться со статьей "как разблокировать слой в фотошопе ".
4) Теперь, после того, как слой с вазой мы перетащили на новый холст необходимо подогнать изображение под размер холста, для этого выделяем слой с изображением вазы, кликнув по нему левой кнопкой мыши в панели слоев и в верхнем меню выбираем "Редактирование" - "Свободное трансформирование" или нажимаем комбинацию клавишь "Ctrl + T".
Затем, удерживая клавишу "Shift" и левую кнопку мыши настраиваем необходимый размер вазы.
Клавишу "Shift" необходимо удерживать для того, чтобы размер изображения изменялся пропорционально.
5) После того, как мы разместили изображение вазы на холсте и настроили необходимый размер, нужно нарисовать стенки вазы, для того, чтобы в дальнейшем при помощи 3D деформации создать сам объект. Нам необходимо нарисовать не все стенки вазы, а ровно половину, поэтому для удобства можно использовать вспомогательный инструмент фотошоп - "Линейка", с помощью которого разметить на изображении половину вазы. Если у вас не отображается линейка, то ее просто нужно включить, для этого в верхнем меню выбираем "Просмотр" - "Линейки". У пункта "Линейки" должна стоять галочка. Так же рекомендую включить "Вспомогательные элементы", если они не включены.
Теперь можно разметить изображение, расставив линейки, чтобы поставить линейку необъодимо на ней зажать левую кнопку мыши и удерживая ее потащить линейку на нужное место. В данном случае нам нужно разметить половину вазы по вертикали, поэтому я возьму вертикальную линейку слева и поставлю ее на середине вазы.
Далее выбираем инструмент "Перо" в панели инструментов и с помощью него обводим стенки вазы, при этом делаем необходимую толщину стенок, чем она будет толще, тем толще стенки будут у 3D объекта. Получиться должно типа того, как на скриншоте ниже.
Вообщем надо сделать контур стенки необходимой толщины. Заметьте, что дно вазы я сделал ровно горизонтальным, потому что если его сделать округлым, то у 3D вазы будет выпуклое дно. Чтобы провести ровный горизонтальный контур пером, необходимо удерживать клавишу "Shift". Сам контур стенки должен быть замкнутый.
Теперь зальем контур, чтобы сделать из него фигуру. Для этого тем же инструментом "Перо" кликаем по контуру правой кнопкой мыши и в появившемся меню выбираем "Выполнить заливку контура". В результате контур будет залит тем цветом, который у вас выбран в панели инструментом, в моем случае - красный. Цветом заливать можно абсолютно любым, в дальнейшем на выза мы все-равно будем накладывать рисунок.
После заливки контура, еще раз кликаем правой кнопкой мыши по контуру и выбираем "Удалить контур"
В результате мы получим фигуру стенки вазы на новом слое. После этого слой с изображение вазы можно просто отключить, кликнув по иконке "Глаз" на против данного слоя.
6) Наконец то мы добрались до самого интересного - работа с инструентами 3D фотошоп. В верхней панели меню, при выделенном слое с изображением стенки вазы, выбираем "3D" - "Новая 3D-экструзия из выделенного слоя".
Таким образом мы создадим 3D объект из ыигуры стенки вазы и рабочая среда фотошоп автоматически будет переключена из режима "Основная рабочая среда", по умолчанию, в режим "3D".
В панели слоев, как вы видите на скриншоте выше, появилась вкладка "3D", в которой размещены слои нашего 3D объекта.
7) Далее мы сделаем из стенки вазы саму полноценную вазу, использую инструмент 3D деформации. В правой панели в свойств выбираем свойство "Деформировать" и выставляем ползунок настройки "Угол по горизонтали (X)" на 360 градусов.
В результате получится готовая 3D модель вазы.
Но, как мы видим, ваза получилась не совсем похожей на ту, которую нам необходимо сделать, она получилась тоньше, чем на изображении. Чтобы подогнать ее по необходимой ширине перемещаем ползунок настройки "Глубина экструзии" до нужного размера, при этом ориентируемся по линейке, которая должна получиться ровно по середине вазы.
При работе с 3D объектом имейте в виду, что в панели слоев должен быть выделен основной слой объекта, помеченный иконкой "звездочка".
8) И так, у нас получилась ваза точно такая же, как на изображении, ее можно покрутить, осмотреть со всех сторон.
Далее мы нанесем на данную вазу рисунок, можно нанести и рельеф, но я оставлю поверхность вазы гладкой. Для того, чтобы задать 3D объекту материал, необходимо в панели слоев выбрать слой "Материал экструзии", кликнув по нему левой кнопкой мыши. В результате справа, над панелью слоев, появятся свойства объекта, в которых можно выбрать материал из стандартных фотошоп, либо создать свой.
Стандартные материалы фотошоп достаточно разнообразны, здесь имеется метал, платик, стекло, дерево и т.д., можно выбрать любой готовый материал для вашего объекта, как с текстурой, так и без нее (гладкий).
В случае с вазой, я выберу простой материал, без текстуры, не особо важно металл это будет, пластик или что-то другое, потому что в дальнейшем мы будем накладывать на этот материал картинку.
9) И так, мы выбрали необходимый материал и теперь будем накладывать изображение цветов, чтобы получилась окрашенная ваза. Я взял изображение цветов, которое вы можете скачать со всеми файлами к уроку в правом столбце, но вы можете использовать любое свое изображение. Изображение лучше подбирать бесшовное, чтобы оно ровно наложилось на объект и не имело видимых швов, иначе будет все выглядеть не очень. Вы можете погуглить и найти готовые бесшовные обои на ваш вкус.
В панели свойств 3D объекта кликаем кнопкой мыши по значку "Рассеивание объекта" и выбираем "Редактировать текстуру".
Обратите внимание, что есть текстуры, которые нельзя отредактировать и они имеют другой вид значка рассеивания. Если вы установили не редактируемую текстуру, то просто поменяйте ее на другую, чтобы у пункта "Рассеивание" отображался значок, как на скриншоте выше.
Кликнув на пункт "Редактировать текстуру" у нас откроется данная текстура в отдельной вкладке фотошоп. Для того, чтобы было удобнее редактировать текстуру и наблюдать результат на 3D модели, мы откроем окно с текстурой и окно с вазой рядом, расположив их по вертикали. Для этого в верхнем меню выбираем "Окно" - "Упорядочить" - "Расположить все вертикально" и в результате получим вот такой вид интерфейса:
Теперь, когда мы будем редактировать текстуру, мы сможем наблюдать внешний вид нашей 3D вазы. Можно взять любую кисть, задать ей цвет и размер и просто нарисовать что-нибудь на текстуре и врезультате мы получим данный рисунок на вазе.
Но, как я и говорил ранее, мы будем не раскрашивать наш 3D объект, а наложим на него готовый рисунок с цветами. Для этого открываем бесшовный рисунок программой фотошоп и перетаскиваем его на холст с текстурой, т.е. выполняем действия как в пункте №1 и №3 данного урока.
Как мы видим, рисунок отобразился на вазе, теперь необходимо подогнать рисунок по размеру текстуры или скопировать его несколько раз и разместить по всей плоскости текстуры, так как рисунок бесшовный все должно получиться без каких-либо резких переходов. Рисунок можно уменьшить, повернуть или увеличить, вообщем на ваше усмотрение.
После наложения рисунка на вазу возвращаем обычное отображение окон, для этого в верхнем меню выбираем "Окно" - "Упорядочить" - "Объединить все на вкладках".
9) Следующим шагом будет настройка ракурса вазы, т.е. мы ее устанавливаем в нужном нам ракурсе, допустим вид немного сверху. Если вы хотите поместить объект на фото, допустим поставить эту вазу на полку, запечатленную на фото, то подстраиваете ракурс вазы под расположение полки на фотографии.
Так же можно настроить тень объекта, либо отключить ее, чтобы потом просто дорисовать в ручную. Если хотите настроить тень сразу, то выбираете в панели слоев, во вкладке 3D основной слой с объектом и мышкой настраиваете угол и дальность освещения перемещая лампу. Если хотите отключить тени, то убираете галочки с пунктов "Захватить тени" и "Наложить тени".
10) Наложив на вазу нужный рисунок, настроив необходимый ракурс и наложив тени последним моментом необходимо произвести рендеринг объекта, для того, чтобы он принял наилучшее качество отображения. В верхнем меню выбираем "3D" - "Рендеринг слоя 3D" и ждем, пока фотошоп отрендерит объект. Время ожидания занимает достаточно долгое время, примерно 5-10 минут, все зависит от мощности вашего компьютера.
По окончании процедуры рендеринга, можно сохранять получившийся объект в нужном вам формате, для этого выбираем в верхнем меню "Файл" - "Экспортировать" - "Сохранить для web....". Если хотите сохранить объект в png формате на прозрачном фоне, чтобы в дальнейшем его разместить на другом изображении или фото, то перед сохранением отключите в панели слоев нижний белый фон.
В результате получилась вот такая-вот симпатичная ваза, свет я сделал падающим сверху спереди, поэтому тень видна только на самой вазе от ее горловины, а от вазы тень не видна.
3D анаглиф работает, используя нашу естественную способность воспринимать глубину с помощью бинокулярного зрения. Восприятие глубины исходит из того, что каждый из наших глаз видит несколько отличную от другого картинку. Наш мозг обрабатывает картинки, полученные каждым глазом, и на основе небольшой разницы в углах обзора между двумя изображениями получает ощущение глубины. Это основная предпосылка для работы техники, изложенной в данном уроке.
Мы начинаем с отделения цветовых каналов на каждом слое.
Большинство анаглифных 3D-очков поставляются с красными линзами для левого глаза и синей (бирюзовой) линзы для правого. Поскольку красная линза позволяет видеть только в красном канале, мы отключим зеленый и синий каналы для этого слоя. Отключение каналов можно сделать в диалоговом окне Параметров наложения (Blending Options).
Перетащите верхний левый угол изображения вверх, как показано на картинке. Чем выше Вы его перетащите, тем более выраженным будет эффект объёма на фото:
Нажмите Enter для применения действия инструмента.
Отключите видимость слоя "левый-красный", включите видимость слоя "правый-голубой" и сделайте таким де образом трансформируйте его, только с правой стороны:
Включите видимость обеих слоёв, и у Вас получится примерно такое изображение:
Теперь, мы посмотрим на фото в 3D-очках, мы заставим наш мозг подумать, что он воспринимает два разных изображения. Но картинка не готова, т.к. центр изображения не совмещён. Исправим это с помощью инструмента "Перемещение" (Move Tool).
Возьмите инструмент "Перемещение", зажмите клавишу Shift и переместите слои вправо и влево соответственно, в качестве общего центра я использовал лицо модели. Для перемещения можно использовать не мышь, а клавиши "стрелка вправо" и "стрелка влево":
Осталось только обрезать левый и правый край картинки с помощью инструмента "Обрезка" (Crop Tool) и сохранить документ.
Вот как выглядит готовое фото:
Хотя этот метод отличается от создания реального 3D анаглифного фото, где используются две фотокамеры, снимающие с разных углов, мы получили почти подобный эффект, используя только одну фотографию.
Теперь, всё, что вам нужно, это 3D-очки...
С появлением программы Photoshop жизнь фотографов, представителей рекламного бизнеса и просто любителей фотоколлажей изменилась, ведь теперь с фотографиями можно было сделать все что угодно. Потратив немного усилий, вы могли улучшить качество фотографии, добавить надпись, сделать другие манипуляции, но долгое время вы не могли сделать одного – создать трехмерной фотографии. Производители этого продукта предлагали множество решений, одним из которых был плагин Adobe Dimensions, от которого пришлось впоследствии отказаться. Сегодня вопрос, как сделать 3D фото в Фотошопе легко решается в новых версиях программы, и в этом вы можете убедиться.
Многие, прежде чем выяснять, как сделать 3Д эффект в Фотошопе, спросят, а зачем это надо, ведь сегодня существует большое множество специальных программ. Все дело в том, что хорошие программы стоят дорого, так зачем платить дважды, если вы уже имеете такой мощный инструмент, а сделать 3D эффект в Фотошопе, как оказалось, не так сложно, как кажется. Тем более, есть несколько вариантов того, как сделать эффект 3D в Фотошопе, но для начала достаточно ознакомиться самым простым.
В надежде на то, что вы владеете основами программы, перейдем к решению более сложных задач, и расскажем, как сделать 3Д рисунок в Фотошопе. Для этого вы должны, как минимум, работать со слоями, ведь только работая с ними, вы сможете создать 3D эффект в Фотошопе. Есть два варианта создания трехмерного изображения. В первом случае это напрямую касается вашего умения фотографировать, ведь для этого придется использовать несколько изображений, снятых с небольшим смещением, но этот вариант нам не подойдет, так как чаще всего приходится работать с уже готовыми изображениями. Поэтому мы расскажем, как сделать 3Д фото в Фотошопе, используя уже готовое изображение.
Теперь вы можете уверенно сказать, что знаете, как сделать 3D фотографию в Фотошопе, но это только начало и даже опытные «фотошоперы» не могут однозначно сказать, что знают, как сделать 3D изображение в Фотошопе, так как для этого существует много приемов. Если же вы не можете, или не хотите знать, как сделать 3Д анаглиф в Фотошопе, воспользуйтесь специальными инструментами 3D, но это касается только свежих версий программы.
