Создание световых эффектов, как правило, не является сложным процессом. Придание таким эффектам жизни и реалистичности может потребовать немного больше умений, времени и терпения. Сегодня я продемонстрирую вам, как создать композицию Street Fighter в стиле гранж с использованием света, фотографий и текстовых эффектов. Начнем!

Материалы:

Архив

Источником вдохновения для этой работы послужил постер фильма Pandorum. Мне нравится выгравированная надпись и то, как она контрастирует с остальной композицией. Поэтому моей главной задачей было как можно детальнее сосредоточиться на создании такого текстового эффекта. А затем перейти к персонажу. Я большой поклонник научной фантастики и всего сверхъестественного и мне хотелось создать какого-нибудь супергероя. Я хотел бы создать персонажа похожего на Ryu из Street Fighter с исходящей от его тела светлой энергией. Энергия Ryu в виде пузыря выглядит слишком скучной, поэтому я решил придать ей силуэт грозного животного, на это меня вдохновил мультфильм Покемоны и Гарри Поттер, в котором у главных героев есть магические существа-защитники, которых они могут контролировать.

А вот некоторые детали работы крупным планом.

Шаг 1. Создаем новый документ в Фотошопе. Я использовал размер 1920х1200, как и разрешение моего монитора, чтобы потом использовать работу в качестве заставки рабочего стола. Вы можете сделать то же самое. После этого заливаем полотно серым цветом (#b8b8b8).

Шаг 2. Создаем новый слой и заливаем его черным цветом. Убедитесь, что в качестве основных цветов выбраны черный и белый, в противном случае жмем CTRL+D. Применяем фильтр Filter - Render - Clouds (Фильтр - Рендеринг - Облака). Я хочу сделать из этих облаков красивый линейный эффект. Поэтому переходим Filter - Blur - Motion Blur (Фильтр - Размытие - Размытие в движении) с Distance (Расстояние) 999px и Angle (Угол) 0. Устанавливаем режим смешивания слоя на Multiply (Умножение) с Opacity (Непрозрачность) 60%.

Шаг 3. Загружаем faded blue texture и вставляем на рабочий документ. Уменьшаем Opacity (Непрозрачность) до 35%.

Обратите внимание на то, что левая часть темнее правой. Чтобы это исправить, берем Burn Tool  (Затемнение) (O) и рисуем в правой области, чтобы сбалансировать цвета.

Создаем новый слой, берем черную мягкую кисть (B) с Hardness (Жесткость) 0% и работаем по краям полотна. Уменьшаем Opacity(Непрозрачность) примерно до 15%. Текст мы расположим в центре. Затемнив края, мы акцентировали внимание в центре композиции.

Шаг 4. Поработаем над фоном. Мы должны добавить три корректирующих слоя. Начнем с Layer - New Adjustment Layer - Gradient Map(Слой - Новый корректирующий слой - Карта градиента), устанавливаем режим смешивания на Overlay (Перекрытие) с Opaciy(Непрозрачность) 70%.

Далее Layer - New Adjustment Layer - Brightness/Contrast (Слой - Новый корректирующий слой - Яркость/Контраст): Brightness (Яркость) -18, Contrast (Контраст) 80.

И, наконец, добавляем последний корректирующий слой Gradient Map (Карта градиента), но в этот раз используем темно-синий (#082a75) и оранжевый (#ffba00). Устанавливаем режим смешивания на Overlay (Перекрытие) с Opacity (Непрозрачность) 40%.

Шаг 5. Пришло время для символа и текста. Начнем с символа. Используем Rectangle Tool  (Прямоугольник) (U), чтобы создать первую фигуру, затем дублируем ее (CTRL+J) и поворачиваем на 90 градусов (CTRL+T).

Шаг 6. Создаем новый слой, загружаем изображение cracked edges brushes и работаем кистью  по краям символа. Мы используем эти кисти, чтобы создать эффект разрушения. Не волнуйтесь по поводу цвета, позже мы все исправим.

Шаг 7. Выделяем три слоя с символом "плюс" (два слоя с прямоугольниками и один с трещинами) и жмем CTRL+ALT+E, чтобы объединить их в один новый слой. Можете скрыть три оригинальных слоя, так как далее мы будем использовать только объединенный слой.
Жмем правой кнопкой по слою с символом и выбираем Blending Options (Параметры наложения). Сначала применяем Color Overlay (Перекрытие цветом) (#630707).

Далее добавляем Inner Shadow (Внутренняя тень), чтобы создать эффект гравировки. Помните, что параметры зависят от размеров символа.

И, наконец, добавляем Drop Shadow (Тень) белого цвета с режимом смешивания Linear Dodge (Линейный осветлитель), чтобы завершить добавление эффекта.

Шаг 8. Теперь мы должны добавить эффект поцарапанного металла. Загружаем Scratched metallic textures.  Располагаем текстуру на рабочем полотне, корректируем размер (CTRL+T) и устанавливаем режим смешивания на Overlay (Перекрытие). Запомните, что этот эффект применяется только к знаку плюса, поэтому регулируем расположение текстуры так, чтобы результат вас устраивал.

Шаг 9. Продолжаем работать на слое с текстурой, зажимаем CTRL и кликаем по слою с плюсом, затем жмем на кнопку Add layer mask (Добавить слой-маску) внизу панели слоев. Благодаря проделанным действиям эффект царапин будет действовать только на символ. Уменьшаем Opacity (Непрозрачность) до 60%.

Шаг 10. Мне кажется эффект будет более реалистичным, если будут черные и белые царапины. Дублируем (CTRL+J) текстуру и удаляем слой-маску. Перемещаем белую текстуру так, чтобы она не пересекалась с черной. Жмем CTRL+I, чтобы инвертировать цвета и устанавливаем режим смешивания на Screen (Осветление). Таким образом, мы сохраним только белые области. Снова применяем маску, используя "плюс" в качестве вспомогательной формы.
Если мы установим Opacity (Непрозрачность) на 100%, то увидим небольшую проблему: белые царапины находятся поверх теней. Не беспокойтесь, мы исправим эту проблему в следующем шаге.

Шаг 11. Чтобы переместить белые царапины под тень, необходимо, чтобы все эффекты Layer Style (Стиль слоя) находились на отдельном слое. К счастью, такое возможно сделать в Photoshop. Жмем правой кнопкой мышки по стилю слоя на панели слоев и выбираем Create layers (Создать слои).

Теперь перемещаем слой с белыми царапинами между слоем с внутренней тенью и цветовой заливкой. Также уменьшаем Opacity(Непрозрачность) примерно до 30%.

Шаг 12. В этом шаге мы добавим текст TUTPLUS (шрифт Edistys) и применим к нему те же эффекты, что и к логотипу. Можете поэкспериментировать с кистями и текстурами, чтобы результат не выглядел однообразным.

Шаг 13. Мне кажется, что атмосфера слишком мрачновата. Создаем новую группу и меняем ее режим смешивания на Color Dodge(Осветление основы). Создаем слой внутри группы, берем большую мягкую круглую кисть  (B) белого цвета и один раз кликаем в центре полотна. Уменьшаем Opacity (Непрозрачность) примерно до 45%. Теперь текст стал более заметным и ярким.

Создаем новый слой, выбираем красный цвет, берем кисть из набора Toxic Paint brushes  и один раз кликаем на полотне.

Шаг 14. Внимательно рассмотрев постер Pandorum, можно заметить что-то вроде этажа за текстом и металлическую поверхность. Мне хотелось бы создать такой же эффект. Для этого выделяем все созданные слои и объединяем их вместе (CTRL+ALT+E). Называем слой "объединенный". Скрываем все остальные слои. В следующих шагах мы будем использовать только слой "объединенный".
Загружаем изображение Chateau Noisy и располагаем на рабочем документе под всеми остальными слоями. Активируем объединенный слой и добавляем слой-маску . С помощью черной большой мягкой кисти  (B) аккуратно стираем нижнюю область.

Пол не очень похож на металлическую поверхность. Мне кажется, вся проблема в цвете: он слишком обесцвечен. Находим корректирующий слой Gradient Map (Карта градиента) с сине-оранжевым градиентом, который мы создали ранее, зажимаем ALT и перемещаем корректирующий слой поверх слоя с металлическим полом. Благодаря этому, мы дублировали Gradient Map (Карта градиента) и расположили копию над полом.

Шаг 15. Теперь, когда с фоном покончено, мы можем сосредоточиться на главном персонаже и световых эффектах. Для начала мы должны освободить от фона фото парня и вставить его на рабочее полотно. Затем дублируем (CTRL+J) этот слой и устанавливаем режим смешивания на Overlay (Перекрытие) с Opacity (Непрозрачность) 70%; дублируем еще раз и применяем фильтр Filter - Sharpen - Smart Sharpen (Фильтр - Резкость - Умная резкость), чтобы создать эффект грязи и немного детализировать. Дублируем слой впоследний раз и применяем Filter - Other - High Pass (Фильтр - Другое - Цветовой контраст), режим смешивания ставим на Overlay (Перекрытие).

Шаг 16. С помощью Burn Tool  (Затемнитель) (O) затемняем левую часть персонажа.

Шаг 17. Цвета нашего героя слишком насыщенны. Выделяем все слои с парнем и объединяем их вместе в новый слой (CTRL+ALT+E). Жмем CTRL+U, чтобы открыть окно Hue/Saturation (Цветовой тон/Насыщенность) и уменьшить Saturation (Насыщенность) до -30.

Шаг 18. Пришло время добавить деталей для парня, так как сейчас он больше похож на испачканного ребенка, а не на супергероя после кровавой битвы. Создаем новый слой, зумируем область глаза, белой кистью (B) зарисовываем глазное яблоко. Наш супергерой теперь находится в трансе.

Шаг 19. Теперь добавим шрамы. Для этого активируем Brush Tool  (Кисть) (B). Я использовал планшет, чтобы нарисовать три шрама. После выбора круглой кисти красного цвета (размером около 5px), открываем окно настроек кисти (если вы используете планшет) Window - Brushes (Окно - Кисти) и активируем параметр Shape Dynamics (Динамика формы), чтобы толщина линии зависела от силы нажатия пера.

Создаем новый слой и размещаем его под слоем со шрамом. Белой кистью (B) рисуем по краям шрама. Это должно придать реалистичности.

Шаг 20. Теперь мы можем поэкспериментировать со световыми эффектами. Создаем новую группу "световые эффекты". Добавляем новый слой внутри группы и берем Smoke brushes. Начнем со света, исходящего от рук. Выбираем подходящую кисть из набора и один раз кликаем.

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

Используем Eraser Tool  (Ластик) (E) или слой-маску, чтобы удалить лишние детали дыма.

Шаг 21. Для дыма применяем стиль слоя Gradient Overlay (Перекрытие градиентом) от светло-лазурного (#cffeff) к светло-желтому (#fffeeb).

Шаг 22. Используя метод из Шага 20, создаем еще одну световую дорожку.

Шаг 23. Чтобы создать лицо тигра, нам понадобится вспомогательное изображение. Загружаем фото tiger и открываем в Фотошопе. Используем Pen Tool  (Перо) (P) или Lasso Tool  (Лассо) (L), чтобы вырезать голову, затем перемещаем ее на рабочее полотно. Располагаем в нужном месте.
Обесцвечиваем изображение (CTRL+SHIFT+U) и уменьшаем Opacity (Непрозрачность).

Шаг 24. Создаем новый слой и один раз кликаем кистью с дымом.

Находим область, напоминающую зуб тигра.

Перемещаем в нужное место.

И, наконец, ластиком  (E) удаляем лишнее.

Шаг 25. Повторяем вышеописанный процесс. При необходимости дублируем слой с дымом, чтобы сделать эффект более насыщенным.

Шаг 26. Скрываем слой с тигром. На данном этапе вы можете добавить больше деталей для тигра, чтобы придать ему индивидуальности. Вы не должны в точности повторять мои действия.

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

Шаг 28. Композиция почти готова, есть еще что-то, что мы должны сделать. Создаем новую группу и меняем ее режим смешивания на Color Dodge (Осветление основы). Мы будем использовать эту группу, чтобы добавить финальные световые штрихи. Создаем новый слой внутри группы, берем мягкую большую кисть  (B) белого цвета и начинаем рисовать световые эффекты. При необходимости, уменьшаемOpacity (Непрозрачость) слоя.

Вот, что получается.

Вот финальный результат. Надеюсь, вам понравился этот урок и вы узнали что-то новое.

Автор: Sebastiano Guerriero
 

источник

примеры