Как сделать анимированный огонь в фотошопе
Тема 20-5. GIF-анимация.
Практическая работа «Анимированный огонь».
1. Новый документ (600х200 пикселов). Залить черным. Новый слой.
2. На новом слое в нижней части документа (около трети высоты) выделить прямоугольную область по всей ширине, залить белым. Снять выделение.
3. Filter/Blur/Guassian Blur (Фильтр/Рразмывка/Размывка Гасси) . Установить 10-15 пикселов.
4. Продублировать слой 3 раза: Layer/DuplicateLayer . Активный — первый с белым прямоугольником.
5. Инструмент «Палец»- Smudge Tool (в блоке с Blur Tool (размытие) и Sharpen Tool(резкость)). Параметры: Brush = 45; Mode = Normal; Strentght = 66%.
6. Рисуем эффект пламени (как пальцем, снизу-вверх с изгибами, размазывая краску) по всей ширине документа. Толщину языков пламени можно менять, изменяя толщину кисти (параметр Brush).
7. Делаем этот слой невидимым, активируем второй слой, аналогично рисуем языки пламени на втором слое. Повторить операцию для третьего и четвертого слоя.
8. Открыть окно анимации командой Window/Animation . Создать 4 кадра.
9. Первый кадр — видимость первого слоя, остальных — выключить. Установить время просмотра кадра — 0.1 сек. Второй кадр — видимость второго слоя, третий — третьего, четвертый — четвертого. Установить время просмотра кадров.
10. Добавляем цвет: активный слой — верхний, кнопка в палитре Слоев — Layers. Устанавливаем параметры Color Balance:
| Midtone | 60 | 0 | -15 |
| Shadows | 100 | 0 | -30 |
| HightLights | 50 | 0 | -30 |
11. Сохранение анимации. Команда File/Save for Web. Проверить, что сохранение в gif-формате. Подтвердить оптимизированное сохранение.
Задание:
1. Создать цветной (зеленый, синий. ) огонь («поиграть» с настройками цвета).
2. Создать крупную плакатную надпись 01 с пламенем внутри.
Как сделать огонь в фотошопе
В данном руководстве рассказывается, как в Photoshop создать портрет Человека-факела, используя стоковые изображения. Кроме того эта статья отвечает на вопрос как сделать огонь в фотошопе.
Обновлено: 2023-06-11 19:38:28 Вадим Дворников автор материала
Шаг 1
Откройте Photoshop и создайте новый документ размером 1920 на 1200 пикселей. Примените стиль слоя « Наложение градиента» , установив режим наложения « Нормальный» , непрозрачность на 100% и стиль « Радиальный» .
Увеличьте масштаб до 150%. Для градиента установите цвета # 040302 для более темных областей и # 1b140b для более светлых.
Шаг 2
Откройте фотографию, купленную на Shutterstock, или используйте собственное изображение. Затем примените инструмент « Перо» ( P ), чтобы нарисовать контур человека. Преобразуйте контур в выделение, удерживая нажатой клавишу Ctrl и кликнув по миниатюре контура.
Шаг 3
Скопируйте изображение на новый слой. Используйте большую мягкую кисть, чтобы стереть часть руки. Назовите новый слой «model arm», а исходный слой — «model».
Шаг 4
Создайте копию слоя «model arm» и перейдите в меню Фильтр> Другое> Цветовой контраст . Установите радиус 10 пикселей, а режим наложения – « Жесткий свет» .
Шаг 5
Создайте копию слоя «model» и назовите ее «model glow». Перейдите в меню Фильтр> Стилизация> Свечение краев . Установите ширину края в значение 6, яркость края 7 и смягчение 7.
Шаг 6
На слое «model glow» удалите остальную часть тела, оставив только руку. Это будут яркие части огня. Также измените режим наложения на « Экран» .
Шаг 7
Добавьте новый слой, назвав его «model mask». Затем перейдите в меню Фильтр>Рендеринг> Облака . Установите черный и белый цвета в качестве цвета переднего и заднего плана. Перейдите в палитру « Контуры» и загрузите контур, созданный на шаге 2. Затем перейдите в меню Слои> Слой-маска > Показать выделенную область .
Шаг 8
Удалите оставшуюся часть тела на слое «model mask», оставив только руку. Затем перейдите в меню Слои> Стили слоя и выберите « Наложение цвета» . Установите оранжевый цвет, измените режим наложения на « Линейный свет» и непрозрачность на 88%. Используйте оранжевый цвет и измените режим смешивания на « Линейный осветлитель (добавить)» . Установите режим наложения для всего слоя на « Осветление основы» .
Шаг 9
Добавьте еще один слой поверх остальных и назовите его «smoke». Перейдите в меню Фильтр > Рендеринг > Облака . Снова установите черный и белый в качестве основных цветов. Измените режим наложения на « Осветление основы» и с помощью инструмента « Ластик» большой мягкой кистью удалите большую часть слоя, оставив близкую к руке область, которая будет гореть.
Шаг 10
Выберите пункт Слой> Новый слой-заливка> Цвет . Затем кликните по слою, чтобы открыть диалоговое окно « Стили слоя» . Выберите стиль « Наложение градиента» и измените режим наложения на « Перекрытие» .
В качестве цвета используйте оранжевый и темно-оранжевый оттенок. Установите стиль « Радиальный» , масштаб — 100%. Примените градиент таким образом, чтобы более светлая часть находилась поверх руки модели.
Шаг 11
Перейдите в меню Слои> Новый корректирующий слой> Карта градиента и измените режим наложения на « Мягкий свет» .
Шаг 12
Теперь добавим пламя. Для этого вы можете купить изображение, которое используется в этом руководстве или использовать собственную фотографию. Начните копировать части пламени и вставлять их поверх пылающей руки модели. Установите режим наложения на « Осветление» . Затем перейдите в меню Редактирование> Трансформирование > Деформация и измените части пламени так, чтобы их размеры соответствовали руке модели.
Шаг 13
Теперь добавим огненный шар. Для этого можно купить изображение, которое используется в этом руководстве. Измените режим наложения на « Осветление» . Затем перейдите в меню Изображение > Коррекция > Уровни . Немного увеличьте входные значения белого, чтобы цвета соответствовали другим языкам пламени.
Чтобы закончить сцену, вы можете зажечь глаза или создать лучи света.
Вадим Дворников автор-переводчик статьи « Photoshop tutorial: How to create fire effect in Photoshop »
Анимированный огонь в Фотошоп
Есть вещи, на которые можно смотреть вечно и пламя огня одна из них. Огонь даёт тепло, свет, с его помощью мы готовим пищу. Сфотографированное пламя не передаёт полноты ощущения, которое мы получаем от живого огня. Чтобы максимально приблизить ваше искусство к натуральному, огонь можно сделать анимированным.
Создаём новый документ и заливаем его чёрным цветом. На новом слое выделяем прямоугольник с помощью Marquee Tool, заливаем его белым цветом. Применяем к нему фильтр «Размытие по Гауссу» (Filter=> Blur=> Gaussian Blur):
Создаём три копии слоя с прямоугольником:
Приступаем к рисованию костра. Для этого нам понадобится инструмент Палец со следующими настройками:
Проводим им от центра к краям, образовывая этим отдельные языки пламени. В процессе можно менять размеры инструмента. Вот такой огонь получился у меня:
На трёх копиях слоя нужно сделать то же самое, при этом обращайте внимание, чтоб высота и ширина пламени не очень отличались:
В итоге у нас получилось четыре слоя с огнём, можно приступать к анимации (Window=> Animation).
Для первого кадра оставляем видимыми нижний чёрный слой и первый с огнем. Добавляем кадр – убираем глазик с первого слоя огня, ставим на первой его копии. Таким образом, сделаем еще два кадра с оставшимися слоями:
Ставим периодичность анимации от 0,1 до 0,2 секунд и проверяем результат:
Если результат устраивает, можем приступать к тонированию костра. На панели слоёв жмём и находим в выпадающем списке Color Balance. Настраиваем приблизительно такие значения:
Вот такой огонь у нас получается:
Анимация огня в Photoshop
В этой статье я расскажу, как создать реалистичную анимацию огня в программе Photoshop, не используя какие-либо мудрёные инструменты, приёмы или методики.
С помощью данного способа можно создать gif анимацию практически любого предмета, здесь я покажу это на примере анимации огненного текста.
Причём, анимировать текст можно двумя способами: огонь будет гореть на буквах, и, другой вариант — огонь буде гореть не на буквах, а в виде букв, т.е. мы создадим анимацию пламени в виде текста.
Примеры результатов анимации горения букв и огня в виде текста, которые можно получить с помощью методики, описанной в материале:
Открываем программу Фотошоп, создаём документ 400 на 400 пикселей.
На клавиатуре жмём клавишу D, цвета в цветовой палитре на панели инструментов становятся чёрным и былым, причём чёрный — основной, затем жмём сочетание клавиш Alt+Delete, документ зальётся чёрным (основным) цветом.
Теперь пишем текст с помощью инструмента Горизонтальный текст (Horizontal Type Tool) какое-нибудь слово. Вот что получились у меня:
Если Вы заранее не задали цвет тексту (например, текст получился одного цвета с фоном, в нашем случае, чёрным, и поэтому текст не виден из-за сливания с фоном), то необходимо придать тексту другой цвет.
Для этого в панели слоёв нужно дважды кликнуть по миниатюре текстового слоя (она имеет вид белого квадрата с буквой Т), при этом выделится весь текст, затем вверху рабочего окна Photoshop`а, под главным меню, кликнуть по окошку цвета текста:
После чего откроется цветовая палитра, в которой Вы можете задать тексту любой цвет.
Копируем текстовый слой методом перетаскивания слоя на иконку «Создать новый слой» (Create New Layer).
Отключаем видимость верхнего текстового слоя.
Зажимаем клавишу Ctrl и кликаем по нижнему текстовому и фоновому слою, при этом они выделятся, и нажимаем комбинацию клавиш Ctrl+E для объединения выделенных слоёв в один.
Далее поворачиваем холст на 90 градусов по часовой стрелке, для этого идём по вкладке главного меню Изображение —> Вращение изображения —> 90° по часовой (Image —> Image Rotation —> 90° CW).
Затем применяем фильтр «Ветер», вкладка Фильтр —> Стилизация —> Ветер (Filter —> Stylize —> Wind).
Выставляем метод Ветер (Wind), направление — Слева (Direction From the left). Применяем фильтр ещё три-пять раз, нажав для этого три-пять раз Ctrl+F.
Затем поворачиваем холст обратно с помощью Изображение —> Вращение изображения —> 90° против часовой (Image —> Image Rotation —> 90° CCW).
У меня получилась вот такая картинка:
После этого применяем фильтр Рябь ( Фильтр —> Искажение —> Рябь, или Filter —> Distort —> Ripple) с параметром Количество (Amount) 77% и Размер: Большая ( Size: Medium).
Затем два раза применяем Фильтр размытие по Гауссу со значением радиуса размытия один пиксель.
В результате получаем следующее:
Вот уже вроде как похоже на огонь, что, несомненно, радует.
Теперь создаём новый документ, нажав Ctrl+N, делаем размер поболее, скажем, 1200 на 1200 пикселей. И применяем к нему Фильтр —> Рендер —> Облака (Filter —> Render —> Glouds), затем четыре раза применяем Фильтр —> Рендер —> Облака с наложением (Filter —> Render —> Difference Glouds).
Далее изменяем цвет изображения. Нажимаем клавиши Ctrl+U (либо вкладка меню Изображение —> Коррекия —> Цветовой тон/Насыщенность, в английском Image —> Adjustments —> Hue/Saturation). Открывается окно Цветовой тон/Насыщенность, в котором ставим галку у Тонирование (Colorize), также задаём параметр Цветовой тон (Hue) равным 40, а Насыщенность (Saturation) 80. В результате у меня получился вот что:
Назову этот слой «Облака».
Далее, открываем оба документа в режиме окон (переключить режим отображения документов можно с помощью клавиши F), главное окно Фотошопа буде выглядеть вот так:
И с помощью инструмента «Перемещение» (Move Tool, клавиша V) мышкой перетаскиваем документ с облаками на документ с текстом. В панели слоёв располагаем слой «Облака» между слоями, выбираем режим наложения «Осветление основы» (Color Dodge), а непрозрачность заливки задаём 85%.
Затем, инструментом «Перемещение» перетаскиваем слой «Облака» максимально вниз, но так, чтобы он полностью перекрывал слой «Фон»
Открываем панель анимации, Окно —> Анимация (Window —> Animation). Мы видим, что первый фрейм анимации был создан автоматически. Задаём время отображения кадра 0,1 секунда, для этого надо кликнуть по чёрному треугольничку на иконке фрейма:
Создаём второй фрейм анимации, кликнув по иконке (создание копии выделенных кадров) в панели анимации.
Затем, с помощью инструмента «Перемещение» перетаскиваем слой «Облака» максимально вверх, но так, чтобы он полностью перекрывал слой «Фон». Можно перетащить этот слой не строго вверх, а вверх и вбок, т.к. линейный размер этого слоя значительно больше фонового.
Теперь создаём промежуточные кадры анимации между этими двумя. Кликаем по кнопке «Создание промежуточных кадров»
В открывшемся окне вбиваем в параметр «Добавить кадров» значение 10, жмём ОК. Между двумя нашими кадрами добавятся ещё десять переходных, отличие которых заключается в разном положении слоя «Облака» у каждого кадра.
Запускаем анимацию. У меня получилось это:
Ну вот, уже похоже на анимацию огня, но вроде как не виден сам текст. В решении этой проблемы нам поможет текстовый слой с отключенной видимостью, который был продублирован в самом начале.
Важно! В палитре анимации перейдите на первый кадр.
Затем в панели слоёв включим видимость верхнего текстового слоя и придадим ему стили, кликнув по иконке «Добавить стиль слоя» , находящейся внизу панели слоёв. Стили зададим такие: Тиснение и Наложение цвета, параметры Тиснения оставим дефолтные, а в Наложение цвета зададим чёрный цвет #000000. Затем в панели слоёв задаём Непрозрачность 30%. Ну вот, уже лучше, видно, что горит не что-нибудь, а текст:
Как мы помним, для создания данной анимации в слое «Облака» был использован режим наложения «Осветление основы» (Color Dodge), а непрозрачность заливки была 85%.
Попробуем использовать другие значения.
Переходим на первый кадр в палитре анимации, это важно!
Меняем режим наложения слоя «Облака» на Перекрытие (Overlay), а непрозрачность делаем 100%, затем запускаем анимацию огня. Смотрим результат:
А вот этот огонь мне больше нравится, чем первый вариант. Можно ещё немного уменьшить непрозрачность слоя «Облака».