I See Redの激しい色の背後にある技術的アート
このゲスト投稿では、ホワイトボードゲームズがスタジオの最初の商業リリースであるI See Redの歴史を詳述し、ゲームのユニークな色のアプローチに込められた技術的思考を共有します。
私たちはホワイトボードゲームズです。2021年にアルゼンチンのブエノスアイレスで、ゲーム業界で自分たちの道を切り開きたいと考えた5人の大学卒業生によって設立された開発スタジオです。それ以来、ホワイトボードは30人の若いプロフェッショナルのチームに成長し、あなたがこのイントロを読んでいるのは、私たちが今日ここに集まって最初の商業リリースについて話すためです。I See Red。
I See Redは、怒り、戦闘、復讐、血、悲劇的な過去、そして名前にある通りの赤をテーマにした、フレンティックなツインスティックシューターのローグライトです。サイエンスフィクションの環境とトップダウンカメラだけでなく、重要な美的要素のおかげで、他のゲームの中でも目立つことは難しくありません。あなたは黒、白、グレー、赤以外の色を見つける挑戦を受けることになります。これは早い段階で決定されたもので、物語とゲームプレイの両方の側面に密接に関連しています。もちろん、いくつかの課題もあります：このような限られたパレットでゲームを作る（そしてプレイする）ことは、誰にでも向いているわけではありません。では、私たちはどのように進めたのでしょうか？続きを読んでみてください。
まず、簡単な歴史の寄り道をして、見た目がどのように進化してきたのか、そしてI See Redが今日の形になるまでの重要な決定を検証しましょう。
すべては、ブエノスアイレスのダ・ヴィンチ・ファースト・スクール・オブ・マルチメディア・アートの「ビデオゲームデザインとプログラミング」コースのための論文プロジェクトから始まりました。この作品から、学生たちがあまり資金を持っていないため、芸術的にあまり要求されないゲームが生まれました。この時点では、赤の色はまだ支配していませんでした。ゲームには青や緑もありましたが、追加の色は長くは続かないので、あまり愛着を持たないでください。
コースの修了後、私たちの創設チームはプロジェクトを手放すことができず、実際の商業的な可能性を見出しました。私たちは大学の外で開発を続け、チームを結成することに決めました。これがホワイトボードゲームズをスタジオとして設立することにつながりました。（面白い事実：私たちの教授の中にも可能性を見た人がいて、助けを求められたとき、チームに参加することに決めました。）
この時点で、ゲームの基本はすでにカバーされていました：赤く激しい復讐についての高速SFシューティングゲームです。
数ヶ月、さらには数年が過ぎました。出版社や投資家との話し合いの中で、I See Redは多くの相互接続されたレベルを持つようになりました - 今では人間の敵だけでなく、エイリアンも登場し、膨大な数のパッシブ、カットシーン、さらに洗練されたアートスタイルが加わりました。十分なバグ修正、テスト、コンテンツ、パフォーマンスの改善（大丈夫です、感謝する必要はありません）、ゲームは日の目を見る準備が整っていました。
ついにゲームのデモリリースの時が来ました。私たちはいくつかのイベントやコンテストに参加し、私たちが作り上げたものを誇りに思っていました。この段階で、私たちはコンソールへのリリースを計画することに決め、HDRPからURPに移行し、鮮明なHDをさらにスタイライズされた美学に交換しました。私たちはまた、グレースケールの色に微妙な冷たい色相を追加しました（はい、青が戻ってきました…でも誰にも言わないでください）より金属的な感触を得るために、そしてすべてをさらに磨きました。この切り替えを行うことは、いくつかのHDRP機能をURPに逆エンジニアリングする必要があることを意味しましたが、その努力は価値があったと確信しています。
前の段階のエイリアンレベルに加えて、I See Redにはロボットの敵、いくつかのボス、ストーリーライン、QA、ローカリゼーション、そして「完了した」ものがさらに追加されました。大きな緑のボタンを押す時が来ました。
確かに、多くの課題や変化があった長い旅でしたし、何年もの作業もありました。私たちはそれが素晴らしいと感じ、見えると思います。そして、もしレジー・フィルス＝アメや「業界で最も経験豊富な幹部の中の他の人々」がそう言うなら、私たちは狂っていないに違いありません。いずれにせよ、私たちはそれを成し遂げ、リリースしました。しかし、どうやってそれを実現したのかという疑問が残りました。技術アートファンの皆さんに朗報です：技術的な話を始める時が来ました。（内容警告：血液に関しては全力を尽くしました。）
敵を攻撃したり、ゲーム内で攻撃を受けたときの主な視覚的フィードバックであるため、血液に多くの時間を費やしました。この要素は明確で満足のいくものである必要があり、赤はゲームの最も重要な色なので、怠ける余地はありませんでした。
私たちは血で世界を赤く塗りたかったので、環境のグレーと血の間に強いコントラストが必要であり、デカールのバリエーションも必要でした。デカールをマスクするためにテクスチャを使用することもできましたが、必要な量ではあまりにも繰り返しになってしまうでしょう。もちろん、私たちはそれを望んでいませんでした。
私たちが考えたのは、ノイズ、URPデカールプロジェクター、そしてワールド座標を組み合わせることで、デカールを配置する場所によって形状が変わるようにすることでした。この技術を使用することで、幅、高さ、エッジの滑らかさ、血の粗さをすべて変更でき、スムーズにアニメーションさせることができました。これは、例えば、倒された敵の下に血のプールをスポーンさせる必要があるときに便利です。
アルベドの色とノイズマスクの特性を変更することで、油に似たものを持つエイリアンやロボットのために異なるタイプの血液を生成することもできました。これは敵間の美的な違いを達成するためだけではありませんでした。どの血がどれかを知ることは、ゲームプレイの観点からも同様に重要であり、プレイヤーは「吸収」することができるパッシブ能力を取得でき、異なる効果があります：人間の血は中立、エイリアンの血はダメージ、ロボットの血は回復します。
デカールの他にも、I See Redで使用される多くの血液粒子があります。私たちが今話したパッシブ能力を考えてみてください：プレイヤーに吸収を伝える方法が必要でした。結果はもちろん、ミニ血の竜巻です。
これらのひどい渦巻きは、スクロールするテクスチャとパーティクル効果の両方を使用することで実現されました。パーティクル効果は、3Dモデリングされたリボン（ポリゴンのストライプ）と、メインUVを使用してテクスチャを上にスクロールさせるシェーダーです。これを行うことで、パーティクルシステムからのカスタムデータを使用して、メッシュの速度、流れ、形状を変更し、ストリップのフェードインとフェードアウトを追加して、効果が竜巻の上部と下部でスムーズに現れたり消えたりすることができました。これを取り、追加のジュースのために血の糸を加えれば、プレイヤーの血を吸収する逆血の竜巻ができます。
パーティクルの話をすると、プレイヤーや敵がダメージを受けたときのヒット時パーティクル効果を忘れてはいけません。これらのパーティクルは、私たちが話した血のプール/デカールと同じフレームでスポーンし、両方がアニメーションしてコードコルーチンを通じてシームレスな遷移を実現します。彼らは弾丸が進んでいた方向、一般的にはプレイヤーとは反対の方向にスポーンします。
コードを通じてこれを行うことは、効果をパーソナライズするのに非常に役立ち、ダメージが大きい場合や敵が近い場合、または効果が壁に近い場合には大きくすることができます。私たちはレイキャスティングを使用して、デカールとパーティクルが壁を貫通する前にどれくらいの長さにできるか、デカールの傾斜がどのようになるべきか（例えば、壁に貼る必要がある場合）を判断しました。その後、これらの値をアニメーションに渡し、魔法が起こりました。
たくさんの血です。たくさんの赤です。ゲームが限られたパレットを使用しているため、どの側面でも可読性が失われないようにする必要がありました。私たちのシグネチャールックの制限により、クリエイティブになり、多くのツールやトリックを使用する必要がありました。例えば、赤いものは常に赤いわけではありません。
赤いアウトラインと光を持つドアを見つけるかもしれませんが、一度通り抜けるとグレーになります。敵にも同じことが起こり、敵対的な間は赤く、敵対的でなくなったらグレーになります。これらの信号を通じて、ゲームは独特の色を使って、興味のあるものを伝えます：未探索のエリア、重要なオブジェクト、危険な障害物など。ある意味では、プレイヤーが常に「探偵の視覚」を持っていて、その瞬間に関連するものだけを常に更新して表示しているかのようです。
しかし、あなたが私たちと同じように赤を見ない場合はどうでしょうか？I See Redをプレイしたい人が赤とグレーの違いを認識できない場合はどうでしょうか？私たちは確かに、すべての人が「怒り」を体験できるようにしたいと思っています。これがI See Redが13の言語で利用可能な理由です。確かに、これらの13の言語を話す多くの人々はアクセシビリティ機能の恩恵を受けるでしょう。私たちのカスタムURP色盲モードに入ります。
I See Redを作成する際、黒、白、赤の宇宙がすべての人にとって読みやすくないかもしれないことを知っていたので、すべての人がプレイできるように異なる色盲モードを実装する解決策を考えました。これを作成する最良の方法は、UnityのScriptable Render機能とシンプルなシェーダーを使用することでした。 これの主なアイデアは、SRF内のルックアップテーブルを使用して異なるチャネルのすべての値を変換し、それらの値を最終レンダーパスのシェーダーに変換することです。 効果は、世界でレンダリングされている他のすべてのオブジェクトの上に最終パスとして実行される必要があったため、このパスはUIがレンダリングされた後に行われ、I See Redのすべてのフレームで最終パスです。
異なるタイプの色盲を調査し、I See Redの中で各人が色をどのように認識するかを理解することで、Scriptable Renderを使用してそれに対応できる方法を見つけた後、色を適切に鋭くしたり修正したりするための異なるモードを作成することができました：プロタノマリー、プロタノピア、デュータノマリー、デュータノピア、トリタノマリー、トリタノピア、アクロマトマリー、アクロマトプシア。誰に聞いているかによって、ゲームの赤はこれらの下ではそれほど赤く見えないかもしれませんが、それは私たちには問題ありません：結局のところ、最も重要なのは、すべての人がゲームを楽しめることです。あなたが必要とするすべての怒りを伝えるために、さらに多くのシステムがあります。
最後に、私たちの血は美しく、すべての人のためのものです…少なくとも、あなたが住んでいる場所によって14、15、16または17歳以上である限り。しかし、血は確かにI See Redの美学を構成するすべてではありません。赤は多くの方法、色合い、形で存在し、グレーも同様です。
新しいモデルに適応できるカラースキームを作成する方法を見つけなければなりませんでした。テクスチャを最初からやり直すのは時間がかかります。この時点で、私たちは正直にならなければなりません：I See Redは本当に黒、白、赤ではなく、実際には赤、緑、青です。他のほとんどのゲームと同様に。最初に嘘をつきました（ごめんなさい）が、それでも他のほとんどのゲームのようには見えません。これは、複数のグレースケールテクスチャやマスクを1つにまとめるスプラットマップを適用するカスタムシェーダーを使用したためです。各テクスチャごとに異なるチャンネル（赤、緑、青、またはアルファ）を使用します。
これにより、エンジン内で各チャンネルの値を個別に制御することで、ゲーム内の色をより良く制御でき、テクスチャを少なく読み込むことでリソースを節約できます。これにより、反復時間が大幅に短縮されます。
私たちは血があります。私たちは敵がいます。私たちは環境があります。私たちは必要な色を持っています。気分が良いです。次に、カスタムフォグ、ライティング、カメラの数学、トーンマッピング、またはカットシーンのフェイクパースペクティブに関するクールなことについて話すことができます…
はい、もっと多くのことが言えますが、ここに何時間もいることになります（そして、これを書くのには時間がかかります）、だから、そろそろまとめましょう。もう技術的なことはありません。ただ行って体験してください：I See Red を自分でプレイして、教えてくださいここで話したことに関連するものを見つけたかどうか。最後に、もっと知りたい場合は、私たちやUnityの素晴らしい人々に連絡することをためらわないでください。
お読みいただきありがとうございます。また次回お会いしましょう！
ダウンロードできます I See Red をSteamで今日。プレイ後、Made with Unityの開発者からのストーリーをもっと発見してください。