Unityでイラストを使って3D空間を表現する工夫〜faultでの例〜

今回の投稿では、以前載せたUnityでの実装をどうしているか、という部分に触れてみたいと思います。 ３Dカメラを実装する以前（milestone oneのとき）は「シナリオ＝文章」といういわゆる一般的なビジュアルノベルの形式でテキストを制作していました。 そのため、あくまでテキスト優位の制作の流れであり、イラストはテキストを飾るためのものとして活用していました。 しかし、ノベルゲームは「ノベル」というだけあって、視覚的に作ることをあまり想定されていないのではないか？ということに気づき、milestone two 上からカメラの概念を入れることにしました。 ディレクターであるMunisixはそれまで映像関係の仕事をしていたということもあり、faultでは文章主体ではなく、よりビジュアルでのストーリーテリングをする方向に傾倒していくようになりました。 ３Dカメラ機能では、疑似的な三次元空間（前景、中景、背景）を作ることができます。３Dカメラ機能はいわゆる「パララックス」と呼ばれており、カメラを動かすと、手前にあるものほど大きく移動し、奥にあるものほど小さく移動するというものです。 ※当時は「パララックス」だと直感的に分かりづらいかな？ということで「３Dカメラ」という名称を付けさせて頂きました。 この３Dカメラによって奥行きを持たせることができ、カメラを動かすことでシーンを作ることができるようになったのです。 これはつまり、たった１枚の背景から色々なシーンを作れるようになった、ということでもあります。 特にそれが活かされているシーンは、milesteon two 上のソルとミルの家の前のイラストです。 この背景絵では、左右の幅をやや大きく持たせることで、キャラクター達が話している場所や、今起こっているシーンに合わせてカメラを設定することで「何をしているのか」、「どこにいるのか」をよりビジュアルで見せることができます。 また、ズームしたり左右に動かすことで１枚の絵でも全く異なるカットのように見せることができ、同じ素材の流用感がかなり軽減されました。加えて、１つの空間で物事がすべて展開するため、背景移動時の暗転などの演出がなく、一体感のある風景を描き出すことができるようになりました。 しかし残念なことに、Renpyはそれ以上の伸びしろがなくなってしまいました。 映像では演出として多数のエフェクトが使用されていますが、Renpyでは明確にやりたい事がわかっていてもエンジンの制限で実現できない案が増えていきました。 また、高解像度の素材を表示するのにはあまり適していないため、せっかく高解像度で素材を用意しても縮小しなければならない等、制限が多いように感じるようになってしまいました。 元々コンシューマ機に移植するという話もあったため、今後Renpyで制作しても再度Unityで制作しなければならないのであれば最初からUnityで制作しましょう、ということで今はUnityで使える様々なエフェクトの制作や最適化を行っています。 今回の動画ではUnityで制作することでできるようになった演出を解説しています。 【Unityにしたことでできるようになった事】 ・被写界深度 ・ラックフォーカス ・高解像度の素材 ・モーションブラー ・パーティクルシステム ・エンジン内でビネットを使用できる ・クロマチックアブレーション（色収差） ・カメラの手ブレ 【今回の動画の演出ポイント】 ・素材を4K対応の高画質にすることによりマクロレベルまでのクロースアップを実現（ただし素材を制作するコストはぐんと上がります）。 ・被写界深度を浅くし、埃のパーティクルを飛ばして深い奥行きを表現できるようになりました。また、静止時でも埃が舞うエフェクトのおかげで躍動感が失われません。 ・カメラを引く際にX軸に微量な回転を加えることにより、平面的な動きを払拭。 ・素材をY軸上で４度ほど傾けることにより目と目の間にZ軸上の段差を作成。これにより左目から右目へのラックフォーカスが可能になりました。 ・シーンさえセットアップしてしまえば、あとは自由にラックフォーカスができます。台詞に合った場面で強調したい部分にピントを合わせられるため、文章での説明ではなくビジュアルでの説明がより簡単にできるようになりました。 ・これまで「ビネット」「被写界深度によるボケ」などの演出はそれ用の素材（画像または動画）を作ってその都度書き出して対応していましたが、Unityになってからエンジン内でそれらのエフェクトを調整できるようになりました。元となる素材さえあれば、ビネット機能で「思考」の演出を強調したり、任意のものだけにピントを合わせたり…様々なエフェクトをその場で調整できるようになりました。 いかがだったでしょうか？ これらのエフェクトが手軽に使えるようになったということは制作者としては本当に本当にありがたいことなんです。 そして、この機能があるということは、より手軽に映画やアニメのような演出ができるようになった…ということでもあります。 今回の動画を見てもおわかりかと思いますが、たった２枚のイラストでここまで色々な演出ができるようになったのです。 大きな解像度でダイナミックな動きをしたり、静止画でもより動的に見せる演出ができたり、これからのfaultの演出には可能性がまだまだあるな、と私達自身感じています。 ネタバレのない範囲でまた面白そうなものができたらご報告させて頂こうかと思いますので、引き続きご支援頂けると嬉しいです！今回の投稿では、以前載せたUnityでの実装をどうしているか、という部分に触れてみたいと思います。 ３Dカメラを実装する以前（milestone oneのとき）は「シナリオ＝文章」といういわゆる一般的なビジュアルノベルの形式でテキストを制作していました。 そのため、あくまでテキスト優位の制作の流れであり、イラストはテキストを飾るためのものとして活用していました。 しかし、ノベルゲームは「ノベル」というだけあって、視覚的に作ることをあまり想定されていないのではないか？ということに気づき、milestone two 上からカメラの概念を入れることにしました。 ディレクターであるMunisixはそれまで映像関係の仕事をしていたということもあり、faultでは文章主体ではなく、よりビジュアルでのストーリーテリングをする方向に傾倒していくようになりました。 ３Dカメラ機能では、疑似的な三次元空間（前景、中景、背景）を作ることができます。３Dカメラ機能はいわゆる「パララックス」と呼ばれており、カメラを動かすと、手前にあるものほど大きく移動し、奥にあるものほど小さく移動するというものです。 ※当時は「パララックス」だと直感的に分かりづらいかな？ということで「３Dカメラ」という名称を付けさせて頂きました。 この３Dカメラによって奥行きを持たせることができ、カメラを動かすことでシーンを作ることができるようになったのです。 これはつまり、たった１枚の背景から色々なシーンを作れるようになった、ということでもあります。 特にそれが活かされているシーンは、milesteon two 上のソルとミルの家の前のイラストです。 この背景絵では、左右の幅をやや大きく持たせることで、キャラクター達が話している場所や、今起こっているシーンに合わせてカメラを設定することで「何をしているのか」、「どこにいるのか」をよりビジュアルで見せることができます。 また、ズームしたり左右に動かすことで１枚の絵でも全く異なるカットのように見せることができ、同じ素材の流用感がかなり軽減されました。加えて、１つの空間で物事がすべて展開するため、背景移動時の暗転などの演出がなく、一体感のある風景を描き出すことができるようになりました。 しかし残念なことに、Renpyはそれ以上の伸びしろがなくなってしまいました。 映像では演出として多数のエフェクトが使用されていますが、Renpyでは明確にやりたい事がわかっていてもエンジンの制限で実現できない案が増えていきました。 また、高解像度の素材を表示するのにはあまり適していないため、せっかく高解像度で素材を用意しても縮小しなければならない等、制限が多いように感じるようになってしまいました。 元々コンシューマ機に移植するという話もあったため、今後Renpyで制作しても再度Unityで制作しなければならないのであれば最初からUnityで制作しましょう、ということで今はUnityで使える様々なエフェクトの制作や最適化を行っています。 今回の動画ではUnityで制作することでできるようになった演出を解説しています。 【Unityにしたことでできるようになった事】 ・被写界深度 ・ラックフォーカス ・高解像度の素材 ・モーションブラー ・パーティクルシステム ・エンジン内でビネットを使用できる ・クロマチックアブレーション（色収差） ・カメラの手ブレ 【今回の動画の演出ポイント】 ・素材を4K対応の高画質にすることによりマクロレベルまでのクロースアップを実現（ただし素材を制作するコストはぐんと上がります）。 ・被写界深度を浅くし、埃のパーティクルを飛ばして深い奥行きを表現できるようになりました。また、静止時でも埃が舞うエフェクトのおかげで躍動感が失われません。 ・カメラを引く際にX軸に微量な回転を加えることにより、平面的な動きを払拭。 ・素材をY軸上で４度ほど傾けることにより目と目の間にZ軸上の段差を作成。これにより左目から右目へのラックフォーカスが可能になりました。 ・シーンさえセットアップしてしまえば、あとは自由にラックフォーカスができます。台詞に合った場面で強調したい部分にピントを合わせられるため、文章での説明ではなくビジュアルでの説明がより簡単にできるようになりました。 ・これまで「ビネット」「被写界深度によるボケ」などの演出はそれ用の素材（画像または動画）を作ってその都度書き出して対応していましたが、Unityになってからエンジン内でそれらのエフェクトを調整できるようになりました。元となる素材さえあれば、ビネット機能で「思考」の演出を強調したり、任意のものだけにピントを合わせたり…様々なエフェクトをその場で調整できるようになりました。 いかがだったでしょうか？ これらのエフェクトが手軽に使えるようになったということは制作者としては本当に本当にありがたいことなんです。 そして、この機能があるということは、より手軽に映画やアニメのような演出ができるようになった…ということでもあります。 今回の動画を見てもおわかりかと思いますが、たった２枚のイラストでここまで色々な演出ができるようになったのです。 大きな解像度でダイナミックな動きをしたり、静止画でもより動的に見せる演出ができたり、これからのfaultの演出には可能性がまだまだあるな、と私達自身感じています。 ネタバレのない範囲でまた面白そうなものができたらご報告させて頂こうかと思いますので、引き続きご支援頂けると嬉しいです！
youtube post: ptGRw6H2SAo