Создание анимационных спецэффектов для флеш игр

Презентация была на Flashgamm 2010 Киев.



Не секрет, что визуальные спецэффекты достаточно важны и нужны в любой игре, тем более если речь идет о создании экшн-игры. Тут уж без спецэффектов и визуальных эффектов не обойтись. Мы не можем проигнорировать их.
Первые эффекты появились в 19 веку, так что это очень старая технология. Активно использовались весь 20й век, и вот, пришло время digital-кино, и понятие спецэффектов немного размылось. Появились компьютерные игры, в которых так же востребованы спецэффекты.
В играх спецэффекты используем очень часто, это и интерфейс-эффекты ( кнопки, элементы — показываем блики (blinks), сплеши (splashes) и т.д, персонажные (character) эффекты, фоновые (background, middleground, foreground) эффекты, эффекты доп предметов в игре (artefacts, etc.) — аптечки, жизни, бонусы. Анимация “интро”(intro) — в переходах между уровнями, в финале или начале игры. Я буду говорить о 2D (рисованых) спецэффектах.
Существует, достаточно большое количество ресурсов по этой тематике. Основные – это порталы vimeo.com, youtube.com, frederatorblogs.com и другие видео порталы. Еще один ресурс – blogspot.com. Художники его очень любят. Можно от одного художника переходить по линкам к другим. Сайты flashfx.blogspot.com (Ron Doucet), gagneint.com (Michel Gagne), bitey.com (Adam Philips). Существующие игры — можно смотреть что сделано другими людьми, видеофильмы, анимационные фильмы, ролики.
Инструментарий. В своей работе я исполюзую пакет Flash как редактор и графический планшет (который очень упрощает работу над анимацией и спецэффектами)
Спецэффект. К примеру борцы сумо. Слева- нет никаких эффектов, справа — используем сплеш, выражающий место удара борцов. Даже если мы делаем упрощенную анимацию (не делаем точки контакта, не просчитываем), мы можем определить это место каким-нибудь спецэффектом. Вот здесь он толкнул, мы усилили здесь наш roe. Таки образом, при использовании спецэффектов игра становится ярче, при этом не обязательно применять их везде или делать сложными, применять покадрово и т.п.


1) — без эффектов 2) — используем дополнительный эффект

Примеры спецэффектов:


1) — взрывы; 2) — кипящий котел, пламя; 3) — дым; 4) — пламя снаряда; 5) — электроразряд;
6) — лазер; 7) — блеск золота; 8) — загрязнение

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



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



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



Пламя. Самый простой способ анимации — motion tweening или shape tweening. Более сложный — покадровая анимация. Рисуем кадр пламени, дублируем это в 3й кадр и прорисовываем “противофазу” пламени — получили ключевые кадры на основе которых рисуем остальные фазы. Соблюдаем правило “перетекания” выпуклостей и вогнутостей в одном направлении.



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



Часто требуется в играх использовать более экономно ресурсы — на выручку приходят простые фигуры — shapes. Они используются как частички (particles), вспышки (splashes), блики (blinks). Для их ввода и вывода на сцене используется motion tweening или shape tweening от 0 до 100% прозрачности (или наоборот), или масштабирование (от малого к нормальному размеру, или наоборот). Примеры элементов для экономных спецэффектов.


Желательно минимальное использование градиентных растяжек и числа точек в shapes. Эти факторы сильно загружают процессор, что критично в флеш ролках и особенно на мобильных платфрмах.
Цвет нужно подбирать контрастный для выделения или близкий по тону (если это дым, туман). Цветом мы выделяем траекторию движения пули, снаряда — то что глаз не заметил.
При анимации спецэффектов необходимо учитывать законы физики (все эффекты основаны на природных явлениях). Движения должны быть гармоничны и плавные. Взгляд не должен останавливаться на некачественных фазах анимации — такие фазы лучше перерисовать.
Тема спецэффектов достаточно обширна, и постоянно развивается. Придумываются новые методы и способы подачи информации зрителю, вызова у него эмоций. Все это не умещается в тему одного доклада. Но основные моменты которые использую я в своей практике — я изложил в докладе. Буду рад вопросом и дискуссиям на тему спецэффектов.

Выражаю благодарность компании Absolutist и Валерии Малаевой за подготовку этого материала.