Создаём реалистичную молнию в Фотошоп. Молнии

Представляю ваше вниманию проект заставки, который можно сделать даже без применения сторонних футажей. Достаточно только бекграунта, то есть фона, текста и двух эффектов программы.
В примере заставки, который вы сейчас видите я использовал дополнительные видео и аудиофутажи. Ну, чтобы довести до ума, как говорится. Но даже если я выключу видимость всех дополнительных футажей, проект все равно будет достаточно эффектным.
Центральный эффект на основе которого создавался этот проект это эффект «Lightning». Расположен он в папке видеоэффектов «Generate»
Перетаскиваем эффект на клип и у нас сразу появилась молния на экране. У этого эффекта много настроек. Никаких определенных правил в настройках эффекта нет и все зависит только от ваших задач и фантазии. Итак…

Start point — стартовая точка. Поменяйте точки оси X и Y, то есть горизонтальные и вертикальные точки расположения и укажите место откуда будет бить молния.
End point — конечная точка. Тоже самое с точкой куда будет бить молния
Segments — сегменты или количество отрезков молнии. Из какого количества сегментов она будет состоять.
Amplitude — амплитуда колебаний молнии
Detail Level — Уровень детализации. При нулевом значении будут просто ровные сегменты. При увеличении числа сегменты разбиваются на участки. Цифра соответствует количеству участков, увеличивается детализация
Detail Amplitude — амплитуда колебаний участков детализации
Branching — разветвление
ReBranching — повторные разветвления
Branch Angle — углы разветвлений
Branch Segments Length — длинна сегментов разветвления
Branch Segments — количество сегментов разветвления
Branch Width — ширина или толщина веток разветвления
Speed — скорость эффекта молнии
Stability — стабилизация эффекта
Fixed Endpoint — если стоит галочка в этом чекбоксе то молния будет бить в одну точку. Снимите галочку точка куда будет бить молния будет в разных местах
Width — ширина или толщина самой молнии
Width Variator — вариатор толщины молнии. То есть будет ли она одинаково толстой по всей длине или толщина будет варьироваться и с какой силой
Core Width — толщина ядра молнии. То есть.. Молния состоит из двух цветов. Outside Color-внешний цвет, у нас он синий. И Inside Color — внутренний цвет — у меня он белый. Так вот Core Width регулирует толщину вот этого внутреннего цвета
Pull Force — усилие вытягивания или сила натяжения. Pull Direction — направление вытягивания молнии.
Random Seed — дословно звучит, как случайное зерно. То есть рисунок работы эффекта молнии повторяется. А помощью этой настройки вы можете заставить работать эффект в случайном порядке.
Ну и последнее Blending Mode — режим наложения.

Огромное количество настроек, а в придачу каждый из них можно еще и анимировать. Вот например в этом проекте я анимировал «End point», то есть точку в которую бьет молния. У этого эффекта есть особенность: когда вы применили его к клипу, он, как бы интегрируется в клип. И все дальнейшие эффекты, которые вы примените к клипу, будут воздействовать и на молнию.
В продвинутом курсе, мы разберем эту заставку пошагово, я расскажу обо всех тонкостях создания подобных эффектов и вы сможете скачать этот проект.
Заходите на сайт почаще, регистрируйтесь и получайте бесплатности. До встречи!

Сегодня у нас небольшой урок, который поможет «зарядить» ваши фотографии при помощи молнии, нарисованной в Photoshop. В уроке будем добавлять молнию этому жуткому кладбищу. Ее мы создадим самостоятельно без трюков с использованием готовых фотографий.

Это популярный метод создания молнии. Я видел много уроков, которые обещают чему-то научить, но в итоге сводятся к простому использованию готового изображения. Лично меня подобный подход разочаровывает. Как и в большинстве уроков от PhotoshopCAFE, я научу вас создавать все самостоятельно. Каждый разряд молнии будет уникальным и персональным! У меня есть написанный урок и видео. Видеоуроки хороши, чтобы увидеть, как все делается. Добавьте эту страницу в закладки и потом сможете быстро к ней вернуться. Я снял много пошаговых видеоуроков для PhotoshopCAFE, упростив обучение. Даже если вы просмотрели видео, пролистайте вниз к концу урока. Там обычно публикуются альтернативные способы создания эффекта, идеи или советы по его выполнению.

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

Шаг 1

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


Шаг 2

Перейдите в меню Фильтр > Рендеринг > Облака с наложением (Filters > Render > Difference Clouds).

Должен получиться примерно такой результат.

Шаг 3

Теперь инвертируйте облака, нажав Ctrl + I .

Уже можно увидеть некоторое подобие молнии.

Шаг 4

Откорректируем уровни, выделив молнию. Для открытия окна Уровней (Levels) используйте Ctrl + L . Сместите левый ползунок вправо, примерно до середины гистограммы. Средний ползунок сместите к правому краю гистограммы.

Шаг 5

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

Шаг 6

Измените режим наложения слоя на Экран (Screen). Это позволит изображению под ним просвечиваться.

Также активируйте Свободное трансформирование (Free Transform), нажав Ctrl + T . Масштабируйте, поверните и переместите слой с молнией так, чтобы разряд молнии ударял в один из предметов на фотографии.

Шаг 7

Повторите шаги 1-6, создав несколько форм молний.

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

На данный момент у вас должно быть что-то вроде этого:

Шаг 8

Объедините все слои с молниями. Для этого выделите их, а затем нажмите Ctrl + E . Будьте осторожны и не затроньте фон. После того, как все молнии стали одним слоем, снова может потребоваться изменить режим наложения слоя на Экран (Screen).

Шаг 9

Теперь добавим немного цвета (опционально). Дважды кликните по слою с молнией, открыв окно Стиль слоя (Layer Style). Выберите пункт Наложение цвета (Color Overlay).

Выберите синеватый/пурпурный цвет.

Измените режим наложения на Цветность (Color).

Шаг 10

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

В верхней части окна Стилей слоя (Layer Style) кликните по пункту Параметры наложения: по умолчанию (Blending Options: Custom). Это откроет дополнительно меню.

Трюк здесь заключается в том, чтобы поставить галочку Наложение внутренних эффектов как группы (Blend Interior Effects as a group).

Обратите внимание, теперь цвет применяется только к молнии.

Шаг 11

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

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

По крайней мере, таков план.

Но как же именно вам, как разработчику игры, отрендерить такой эффект?

Генерируем молнию

Как оказалось, генерация молнии между двумя точками может быть на удивление простой задачей. Она может быть сгенерирована как L-System (с небольшим рандомом во время генерации). Ниже пример простого псевдо-кода (этот код, как и вообще всё в этой статье, относится к 2d молниям. Обычно это всё что вам нужно. В 3d просто генерируйте молнию так, чтобы её смещения относились к плоскости камеры. Или же можете сгенерировать полноценную молнию во всех трёх измерениях - выбор за вами)

SegmentList.Add(new Segment(startPoint, endPoint)); offsetAmount = maximumOffset; // максимальное смещение вершины молнии for each iteration // (некоторое число итераций) for each segment in segmentList // Проходим по списку сегментов, которые были в начале текущей итерации segmentList.Remove(segment); // Этот сегмент уже не обязателен midPoint = Average(startpoint, endPoint); // Сдвигаем midPoint на случайную величину в направлении перепендикуляра midPoint += Perpendicular(Normalize(endPoint-startPoint))*RandomFloat(-offsetAmount,offsetAmount); // Делаем два новых сегмента, из начальной точки к конечной // и через новую (случайную) центральную segmentList.Add(new Segment(startPoint, midPoint)); segmentList.Add(new Segment(midPoint, endPoint)); end for offsetAmount /= 2; // Каждый раз уменьшаем в два раза смещение центральной точки по сравнению с предыдущей итерацией end for

По сути, каждую итерацию каждый сегмент делится пополам, с небольшим сдвигом центральной точки. Каждую итерацию этот сдвиг уменьшается вдвое. Так, для пяти итераций получится следующее:








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

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

Direction = midPoint - startPoint; splitEnd = Rotate(direction, randomSmallAngle)*lengthScale + midPoint; // lengthScale лучше взять < 1. С 0.7 выглядит неплохо. segmentList.Add(new Segment(midPoint, splitEnd));

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

Теперь это выглядит так:





Теперь это больше похоже на молнию! Ну… по крайней мере форма. Но что насчёт всего остального?

Добавляем свет

Первоначально система, разработанная для игры использовала закруглённые лучи. Каждый сегмент молнии рендерился с использованием трёх четырёхугольников, для каждого из которых применялась текстура со светом (чтобы сделать её похожей на округлённую линию). Закругленные края пересекались, образуя стыки. Выглядело довольно хорошо:

… но, как вы видите, получилось довольно ярко. И, по мере уменьшения молнии, яркость только увеличивалась (так как пересечения становились всё ближе). При попытки уменьшить яркость возникала другая проблема - переходы становились очень заметными, как небольшие точки на протяжение всей молнии.
Если у вас есть возможность рендерить молнию на закадровом буфере - вы можете отрендерить её, применяя максимальное смешивание (D3DBLENDOP_MAX) к закадровому буферу, а затем просто добавить полученное на основной экран. Это позволит избежать описанную выше проблема. Если у вас нет такой возможности - вы можете создать вершину, вырезанную из молнии путём создания двух вершин для каждой точки молнии и перемещения каждой из них в направлении 2D нормали (нормаль - перпендикуляр к среднему направлению между двумя сегментами, идущими в эту вершину).

Должно получится примерно следующее:

Анимируем

А это самое интересное. Как нам анимировать эту штуку?

Немного поэкспериментировав, я нашёл полезным следующее:

Каждая молния - на самом деле две молнии за раз. В этом случае, каждую 1/3 секунды, одна из молний заканчивается, а цикл каждой молнии составляет 1/6 секунды. С 60 FPS получится так:

  • Фрейм 0: Молния1 генерируется с полной яркостью
  • Фрейм 10: Молния1 генерируется с частичной яркостью, молния2 генерируется с полной яркостью
  • Фрейм 20: Новая молния1 генерируется с полной яркостью, молния2 генерируется с частичной яркостью
  • Фрейм 30: Новая молния2 генерируется с полной яркостью, молния1 генерируется с частичной яркостью
  • Фрейм 40: Новая молния1 генерируется с полной яркостью, молния2 генерируется с частичной яркостью
  • И т. д.

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

И, конечно, вы можете сдвигать конечные точки… скажем, если вы целитесь по движущимся целям:

И это всё! Как вы видите - сделать круто выглядящую молнию не так и сложно.