Создаём огонь в редакторе частиц Magic Particles

Введение

Доброго времени суток, меня зовут Булатов Евгений, я работаю художником в студии "Extreme Developers" (г. Миасс), мы занимаемся разработкой игр. В этом уроке я расскажу о своем методе создания огня в редакторах частиц.

Частицы стали неотъемлемой частью компьютерной графики. Кино, телевидение, видеоигры, используют их для создания спецэффектов. Редакторы частиц встроены во многие пакеты 3D моделирования, или подключаются к ним как отдельные плагины. Например, FumeFX для 3DSmax (стоимость 845 USD). Это действительно впечатляющие системы, тысячи частиц двигаются подчиняясь физическим законам, согласно десяткам редактируемых свойств. Красиво и реалистично, но медленно и дорого.

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

Пример такой программы это "Magic Particles" (www.astralax.ru) - отечественная разработка, распрастроняющаяся бесплатно. Кроме того вам потребуется графический редактор для рисования текстур.

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

В конце статьи, в материалах к уроку вы можете найти файлы эмиттеров для Magic Particles, а также текстуры частиц и видео ролик с анимацией огня.

Итак начнем. Для выполнения задачи нам потребуется редактор частиц "Magic Particles" ( http://www.astralax.ru) и графический редактор (например Photoshop).

Часть I. Создание текстур

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

Magic Particles понимает формат файлов PSD, что очень удобно и даже его альфаканал (для прозрачности). Но поскольку мы создаем огонь, и будем использовать специальный режим смешивания (в Photoshop режим наложения, называется Screen) то альфаканал использовать необязательно.

При таком режиме смешивания, черный цвет является абсолютно прозрачным, а прочие цвета осветляют картинку под ними. Для создания частиц огня, я рисовал текстуры 256х256 на черном фоне. Потом их можно уменьшить но рисовать удобней большие. Вот что у меня получилось:


Я использовал тонкую кисть с мягкими краями, а затем размазывал края «пальцем», при необходимости дублируя слои, и размывая их Gaussian Blur.



Нарисуйте несколько текстур, от 3-ех до 6-ти. Создав эффект я экспериментировал с текстурами, удаляя те что выбивались из общей картины или перерисовывая их. Я понял, что конечный эффект во многом определяется формой и характером язычков пламени которые рисуешь.



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

Для загрузки текстур перетащите все файлы на окно предпросмотра текстуры (или воспользуйтесь кнопкой "Загрузить текстуру", в диалоге открытия файла можно выбрать сразу несколько файлов).



Теперь переключитесь на вкладку "Цвет" и включите параметр Интенсивность (специальный режим смешивания для светящихся частиц, соответствует режиму screen в Photoshop). Затем щелкните на серую полоску внизу, вы поставите на ней точку - маркер. Эта полоска с помощью маркеров, задает цвет частицам на протяжении их жизни.

Настройте цвет следующим образом:



Последний маркер должен быть черный. Это нужно для того что бы частицы плавно исчезали (используем особенности режима наложения «интенсивность»). Таким образом мы задали цвет цвет пламени нашего огня.

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

Теперь остается настроить движение частиц, и вы получите настоящий огонь! Но для начала измените интервалы видимости (внизу нижней панели) 9% в начале и 95% в конце. Так программа не будет показывать начало и конец эффекта. Это удобно если они нам не нужны.

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

Начнем с эмиттера. Переключитесь на эмиттер в Дереве эмиттеров (слева) и в самом верхнем графике смените тип эмиттера с точки на линию.

Из этой линии (отрезка) будут испускаться частицы. У нее два параметра, синий график - угол наклона, зеленый - длинна линии. Начальные параметры угол – 0, длина – 100 вполне подходят для огня.

Теперь изменим угол испускания частиц. Следующий график Направление эмиттера, параметр Градус - задайте углы 36° и 144°, чтобы частицы выбрасывались вверх.

Сейчас это не очень похоже на огонь. Переключитесь на частицы и нажмите на панели кнопку инструментов Настройка графиков:



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

Настройте параметры по своему вкусу или воспользуйтесь этими:



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

Перейдем к настройкам графиков. Сейчас огонь кажется слишком плотным, а пламя излишне ярким. Найдите график Степень непрозрачности (коэффициент) и понизьте его до 35.

Теперь можно заняться движением частиц. Пламя должно подниматься вверх, а сейчас оно выбрасывается во все стороны. Это из-за широкого угла направления эмиттера. Создавая костер я подумал что пламя должно немного расширяться внизу а затем устремляться вверх. Примерно вот так:



Сейчас пламя расширяется, осталось направить его вверх. Этого можно добиться, используя параметр Вес, с отрицательным значением. Частицы будут словно всплывать.

В Magic Particles есть два типа графиков. Обычные (серые иконки) и Коэффициенты (красные иконки). Обычные графики регулируют свойства частицы на протяжении жизни эффекта (по оси Х, отложено время всего эффекта). А коэффициенты, меняют частицу на протяжении ее жизни (по оси Х, отложено время жизни частицы).

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

Выглядит это вот так:




Так я получил нужное движение огня.

Поскольку пламя вначале расширяется, а вверху становится тоньше, то я настроил график Размер (коэффициент) вот так:



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

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



Графики с двумя линиями интересны тем, что они позволяют задавать значения случайным образом в интервале между зеленой и синей линией. Т.е. каждой создаваемой частице будут присваиваться разные значения параметра.

Получилось не плохо, но что бы бы пламя казалось более живым, я добавил вращение частицам. График Вращение частицы выставил от 0 до 100. А Вращение (коэффициент) сделал затухающим, чтобы убрать неестественное вращение вверху.



Получился вот такой результат (GIF анимация):



Также вы можете посмотреть результат в формате видео-ролика fire.avi http://www.uraldev.ru/articles/files/25/fire.avi (1.2 Мб).

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

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

Вот и весь мой нехитрый способ создания огня в редакторе частиц "Magic Particles". Здесь http://www.uraldev.ru/articles/files/25/InFlames.zip вы можете скачать файл с примером и текстурами от этого урока.

Часть III. Экспорт огня в последовательность кадров

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

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



Выбираете размер кадра обычно кратный степени двойки. Тип файла - любой графический формат, кроме сжатия с потерями. Альфаканал нам не понадобится. И жмете Экспорт.

У вас будет очень много кадров, из которых вам нужно будет выбрать небольшой участок, длиной 1-3 сек. Этого будет вполне достаточно.

Для создания плавного перехода я воспользовался программой Adobe After Effects. Не останавливаясь подробно на этом, приведу пару скриншотов:



Я импортировал последовательность кадров в After Effects и скопировал анимацию вторым слоем. Затем «разрезал» дорожки посередине и сдвинул их так, чтобы одна заканчивалась в месте разрыва, а другая начиналась. Немного уменьшил время композиции, чтобы слои шли внахлест. А затем непрозрачность верхнего слоя настроил так, чтобы от точки А до точки В она изменялась от 0 до 100%.

После такой операции переход становится почти незаметен. Остается только экспортировать композицию в последовательность кадров, и посмотреть как все это работает в игре.

Есть и другой способ, который позволяет перенести огонь в игру – это использование девелоперской версии программы Magic Particles (Dev) (www.astralax.ru). Эта версия имеет в своем составе API для переноса спецэффектов в движок на уровне обработки частиц. Пример использования API можно скачать здесь http://www.astralax.ru/programm/demo_api.rar.

Заключение

Материалы для урока: InFlames.zip (2.5 Мб) http://www.uraldev.ru/articles/files/25/InFlames.zip.

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

В заключении хочу поблагодарить Яшу известного как Snork, Алексея a.k.a. Odin_KG и Машу Зайцеву за помощь в создании урока.

Задавайте вопросы, и оставляйте комментарии.
С наилучшими пожеланиями Евгений Булатов "Vendigo".