V24 – エフェクト制作の舞台裏

V24 – エフェクト制作の舞台裏

こんにちは!マネージャー・テクニカルアーティスト・アートディレクターなどを担当しています遠藤博紀です

今回は動画内の「エフェクト」について紹介したいと思います。エフェクトは㈱スカイアーツ様、㈱ドキドキグルーヴワークス様と私もすこしお手伝いで制作いたしましたが、記事の方は遠藤(Aiming)と藤田(ドキドキグルーヴワークス)で書いています

この記事はエフェクトを制作しはじめて間もない方や、エフェクトは制作したことがあるが業務では制作したことがない方などを対象に書いています


プロジェクトV24概要

V24はビジュアルアートデモ2024の略で、技術向上とPRを兼ねて、ふだんのスマートフォン向け開発の中ではあまりできない手法や表現を短いデモリールを作成して行うというプロジェクトです

こちらが作成したリールです

BGM : ©Composer Squad


動画の中のエフェクト

今回制作したデモではエフェクトに割ける時間があまりないため、エフェクトは少なめになるシーン構成にしました。このため、お題も動画全体でチャレンジできるものにしました

■動画の中ででてくるエフェクトの種類
  • 環境エフェクト
  • キャラクターエフェクト (魔導書のオーラ、武器の出現、オブジェクトの破壊)
  • スキルエフェクト (トワリカの発動する魔法)
  • ポストエフェクト
    ※呼称や分類の違いが多少あると思いますが、概ねこのような内容です
■エフェクトのお題

お題の内容は、シェーダーやポストエフェクトなど既存のプロジェクトで当然できているものもありますが技術的なクオリティラインを再確認する上でも明記するようにしました

  • 破壊シミュレーションを使った表現
  • VFXグラフを使ったエフェクト制作
  • シェーディング情報を持つライトの影響を受けるエフェクト
  • シェーダーグラフ・ポストエフェクトとの連動

弾頭の落下シーン

与えられた期間が1ヶ月と短めであったことも考慮しながら、落下してくるオブジェクトによって爆風が起こるシンプルなシーンにしました。ここのシーンはお題の中でも「シェーディング情報を持つライトの影響を受けるエフェクト」の点が伝わる映像を目指し、㈱スカイアーツの牧野様に担当いただきました

■シェーディング情報を含むテクスチャ?

ライトの影響を受ける

法線マップの連番アニメ

法線のテクスチャを追加することでライティングの影響を受けるようにしたり、熱量や環境光の影響などシェーダー側で何を表現するかによって変わります。連番のリアルな煙や炎では手描きで作らず、シミュレーションができるツールを利用します

■シミュレーションツール

テイストにもよりますがシェーディング情報を含めた連番テクスチャを作成するには多くの場合、炎や煙がシミュレーションできる外部ツールを利用して制作します

💡ツールの例

  • Houdini
  • Maya / Blender
  • Embergen / SPARK GEAR
  • AfterEfffects ※ etc…

※AfterEffectsは追加のプラグインが必要になるためシミュレーションにはあまり使いません

エフェクトでシミュレーション系の素材を制作する場合、Houdiniが多く利用されているように感じますが、最近ではEmbergenのようなシミュレーションに特化したツールをサブツールとして使う現場が徐々に増えてきているように感じます
将来的にはゲームエンジン内で作れるようになってゆくのだろうと思いますが、まだまだこのような外部ツールを使うことは欠かせません

■静止画のテクスチャ作成のためのツール

PhotoshopとAfterEffectsを基本として使うことも多いですが、最近はSubstanceDesignerでなるべく作るようにしています。SubstanceDesignerを利用するメリットは派生のバリエーション制作や流用がしやすく、制作を積み重ねることで素材が資産化してゆく点です

パラメータ化し扱いやすくすることもできる

絵を描くのではなくノードの組み合わせで作る


VFX Graphを用いた大剣の出現エフェクト

■VFX Graphでスキニングメッシュからパーティクルを出す

従来のパーティクルシステム「Shuriken」では、スキンメッシュからパーティクルを発生させることはできるものの、追従させることができないという課題がありました

大剣はギミックの動きをスキニングメッシュで表現していましたが、VFX Graphを使用することでこの課題は簡単に解決できました

■ディゾルブの境界からパーティクルを出す

スキニングメッシュからパーティクルを発生させる事が実現できたので、そこからモデルのマテリアルとVFX Graphのパラメータを同期させるスクリプトをテクニカルアーティスト担当に作成いただき、武器のマテリアルアニメーションに連動してディゾルブの境界周辺からパーティクルが発生する様にしました

ディゾルブの中心点とパーティクルの中心点は剣の持ち手に合わせています


破壊演出をUnity上で完結する

オブジェクトの破壊演出を作成する場合、各DCCツール(HoudiniやMaya、Blender)のShatter(ツールですこし名前は違います)という機能を使い、破壊したオブジェクトを利用するのが多いです

今回はDCCツールを使わずに、ゲームエンジン内の機能で(リアルタイム向けの)破壊オブジェクトを利用する方法を試しました

■RayFireによる破壊

破壊はRayFireプラグインを利用しました。RayFIreの使い方は丁寧に説明いただいているサイトがありますので、ここでの説明は省略しますが下記の画像のような流れで簡単に利用できるのが魅力です

良い感じに破壊の動きができましたが、これはリアルタイムの動きなので演出としては利用できません。次の工程でこれを演出で利用できるファイルに保存します

■Unity Recorderで破壊の動きを保存する

Unity Recorderはゲームやカメラの画面を録画できるツールですが、動画以外にもオブジェクトのトランスフォームやコンポーネントの値を保存することもできます

キューブを用いて踏み潰すような動きを再現したものを録画しました

■Unity FBX Exporterで破壊オブジェクトをファイルに保存する

ランタイムに破壊した場合、破壊されたモデルはメモリ(シーン上)に保存されているため、演出として利用する場合、オブジェクトも保存する必要があります。保存にはFBX Exporterを利用します

このFBX Exporterは今回の演出での利用以外でも様々な場面で使えるので、入れておくと便利です

■ファイル化したFBXオブジェクトとアニメーションクリップをタイムラインへ配置する

タイムラインへの配置は一例ですが、これで破壊を演出として利用することができるようになりました

ファイル化されているので、アニメーションをスローや逆転させて利用することができます

■勿論リアルタイム処理で演出することも

こちらは今回の説明用に用意したリアルタイムの破壊例です


※キャラクターはZBrushではおなじみのサンプル(Kotelnikoff Earthquake)を使いました

シェーダーグラフ・VFXグラフを使うと簡単に演出用のプロパティ持てるので、エフェクトとポストエフェクトの動きを1つの値で操作するといったことがしやすいです
(シェーダーが増えてすぐメモリを圧迫するので、エンジニアさんと相談しましょう)

今回作ったものは、キーになる0-1の範囲の値によって各プロパティがカーブの値で再マップされるようなものを作って制御しています


エフェクターを目指す方へ

今回は技術的なところをお話しましたが、勿論これができればOKというものではありません。エフェクトデザイナーとして演技力やデザイン力が重要で、日頃からあらゆるコンテンツを観察していることが大事だと思います

必要な能力を分けてみると次のような感じでしょうか

  • 演技力  :◯◯したようにみえるなど
    (何が起きたのかが伝わる、観察力や読解力)
  • デザイン力:美しく・整ってにみえる、気持ち良く・悪く感じさせる
    (色や形、時間の使い方、多くの人が感じる感覚、独自性)
  • 技術力   :水が作れる・火が作れるなど
    (機能やツールの使い方、物理や科学の理解)
エフェクトの場合(エフェクトに限らず?)「技術力」は人から教わると比較的覚えやすく、演技力やデザイン力といった感覚的なところはふだんから養っておく必要があると思います。「これがキレイだ」「こっちのほうが気持ち良い」「この色にすると意図が伝わる」というような感覚的なやりとりも多い仕事なので、これらの感覚が伝わるようにしておくと良いように思います
エフェクトはツールを使えば「とりあえず作る」ということがすぐできるのが楽しい反面、「何かしっくりこない」という場合に問題を見つけにくいですが、上記のような分解をしてみることで何が足りていないのかの手がかりになるかもしれません

デザイナーを募集中です

Aimingでは、より良いものを追い求める技術向上や表現の追求に興味があるデザイナーを募集中です。今回はデザイナーの話をしましたが、企画やエンジニアも同じような方々が集まっている会社です。このような環境でゲームを作りたいと思った方は、ぜひ下記の応募欄から応募をお願いいたします。

最後まで読んでいただき、ありがとうございました!


一緒にゲームを作る仲間を募集中です!!詳しくは各ページをご覧ください!

株式会社Aiming第1事業部<TWILO>
■採用ページ
https://recruit.aiming-inc.com/career/
■事業部紹介ページ
https://recruit.aiming-inc.com/twilo/