
2025.02.18
「売上をスケールする」AIの使い道とは アルペンが挑む、kintone×生成AIの接客データ活用法
リンクをコピー
記事をブックマーク
大下岳志氏:続いては、「Custom Post Effect」を作成する方法です。
これは、Renderer Featureという機能と、Shader Graphを組み合わせて実現します。このRenderer Featureは何かというと、URPのレンダーパイプラインにオリジナルの描画パスを追加し、レンダリングの動作に変化を加えられるアセットです。
簡単に言うと、画面にポストエフェクトを加えたり、別のなにかを描画したりできる機能です。この機能も先ほどのCustom Functionのように、普通はコードによって制御するものですが、ひと手間加えることでShader Graphでも扱えるようになります。
Renderer Featureを設定する作業そのものは難しくないのですが、プロジェクトの中の各要素の関連がやや複雑なので、先にその構造をお伝えします。URPで描画パスを追加する時には、プロジェクト設定にあるスクリプタブルレンダーパイプライン設定で指定された、Render Pipeline Asset。さらに、そのRender Pipeline Assetのレンダラーリストに登録されているRenderer Dataというアセットに、具体的な処理が書かれたRender Featureというアセットを追加します。
そして今回は、このRender Featureに特定のマテリアルを参照するように記述して、そのマテリアルのシェーダーに、Shader Graphを使います。この構造を作ることで、Shader Graphによって画面の描画を変化させることができるようになります。
それでは、実際にやってみましょう。前半は、先ほどの構造を作る部分なので、意図がわからなくても、ひとまず手順だけ覚えてもらえればと思います。
最初に、作成、レンダリング、ユニバーサルレンダーパイプライン、レンダラー機能から、新規のRender Featureアセットを作成します。名前は自由ですが、今回はSGRenderFeatureとしました。
続けて、現在のシーンで使われているレンダラーアセットのインスペクターを開きます。レンダラーアセットの場所がわからない場合、プロジェクト設定の、グラフィックス、スクリプタブルレンダーパイプライン設定、レンダラーリストを辿ると見つけられます。レンダラーのインスペクタータブには、Add Renderer Featureというボタンがあり、ここから新たなレンダー機能を追加できます。
こちらに、先ほど作ったSGRenderFeatureを追加しますが、Render Featureには、まだなんの機能も持たせていないので、レンダリングの結果には変化がありません。
次は、Render Featureアセットをテキストエディタで開き、このように内容を書き換え、保存します。この書き換えたあとのファイルも、こちらからダウンロードできるので、直接これを使っても問題ありません。今回は、レンダーパスの順序や、RenderTargetなどの複雑な要素は省略して、レンダリングの一番最後にエフェクトのパスを追加しています。
このファイルを保存後、Unityに戻ると、先ほどのRender Featureにマテリアルをアサインするスロットが追加されました。ここに、Shader Graphを使った任意のマテリアルをセットします。これでやっとポストエフェクトを作る準備ができました。
ひとまず効果の確認のため、シンプルなシェーダーを1つ作ってみます。ポストエフェクトは通常、Unlit Graphで作成します。これは、インスペクターで指定したカラーをそのまま画面全体に出力するShader Graphです。シェーダーアセットのアイコンに、マウスカーソルが乗った状態で新規のマテリアルを作成すると、自動的にそのシェーダーを使ったマテリアルが作成されます。
これをRender Featureにセットすると、画面全体が指定した色に変わります。マテリアルのインスペクターで色を変えると、画面の色も変化することが確認できます。これで、Shader Graphによって、レンダリングの結果が変えられるようになりました。
引き続き、より実践的なポストエフェクトに挑戦してみましょう。そのために、Shader Graphで、この時点で表示されているシーンの映像を取得したいと思います。
まずは、先ほどのカラーを削除し、プロパティにTexture2Dを追加します。このテクスチャのセッティングをGraph inspectorで開き、Referenceに_CameraColorTextureと入力、Exposedをオフにします。
この_CameraColorTextureは、レンダーパイプラインの処理の中で一時的に保存されている「RenderTarget」という画像です。RenderTargetをReferenceに指定することで、Shader Graphの中でそれを扱えるようになります。
これを普通のテクスチャと同じように、Sampler Texture 2Dに接続して、Master StackのBaseColorにつなぎます。これで、シーンのカラーテクスチャを取得し、そのまま出力するという流れができました。
一見、元に戻っただけのようにも見えますが、レンダリングの結果を受け取り、出力しているので、この間にいろいろな処理を挟むことで、出力結果をアレンジできるようになっています。
例えば、このようにPosterizeノードを間に挟むと、画面全体の色を指定の数に減らせます。また、ノードの数は少し増えますが、取得した_CameraColorTextureのUVをわずかにずらしたものを作り、元のテクスチャとの色の差分を取り出すことで、輪郭を抽出することもできます。
もちろん、これに最初のカラーテクスチャを乗算して、アウトラインとして使うことも可能です。輪郭抽出にはいろいろ方法があるので、試し甲斐があると思います。
また、先ほど紹介したCustom Functionもポストエフェクトに使えるので、ブラーなど、標準機能にない効果を実装することもできます。
最後に、Sub Graphの機能を紹介します。Sub Graphは、複数のノードで作られたネットワークを、1つのノードにまとめられる機能です。先ほどのCustom Functionがコードを用いてゼロから新しいノードを作る機能であるのに対し、既存のノードを組み合わせて新しいノードを作る機能と捉えてもよいかもしれません。
Sub Graphは、Shader Graphと同じように、作成メニューから作ることもできますが、編集中のShader GraphからSub Graphにしたい箇所だけ選択し、コンバートすることでも作成できます。いずれの方法でも、Sub Graphは独立したアセットになるので、別のShader Graphや違うプロジェクトへの持ち込みも簡単です。
Sub Graphは、プロパティで入力を、Output Nodeの項目で出力する値をそれぞれ設定することで、このように普通のノードと同じような感覚で使えます。
また、プロジェクトにあるSub Graphは、標準のノードと同じようにメニューから呼び出せるので、スムーズに作業を進められます。
最初に作ったCustom Functionも、毎回設定を作り直すのは面倒ですが、このようにSub Graphにしてしまうと、その手間が省けます。Sub Graph自体は、従来からあった機能ですが、古いバージョンでは少し使いにくいものでした。
現在のSub Graphは、さまざまな改善が行われ、このように非常に使いやすいものになっています。特に、同じ工程をいろいろな箇所で使う場合に非常に便利なので、ぜひご活用ください。
Custom Function、Renderer Feature、そしてSub Graphを活用すると、個々のマテリアルから画面全体のアレンジまで、今まで難しかった描画表現のほとんどをアーティスト自身で簡単にカスタマイズできるようになります。今回紹介した機能と、サンプルコードを使って、ぜひ、いろいろな表現に挑戦してもらえればと思います。
(次回へつづく)
関連タグ:
2025.02.13
“最近の新人は報連相をしない”という、管理職の他責思考 部下に対する「NG指示」から見る、認識のズレを防ぐコツ
2025.02.13
AIを使いこなせない人が直面する本当の課題 元マッキンゼー・赤羽雄二氏が“英語の情報”を追い続ける理由
2025.02.06
すかいらーく創業者が、社長を辞めて75歳で再起業したわけ “あえて長居させるコーヒー店”の経営に込めるこだわり
2025.02.12
マネージャーは「プレイング3割」が適切 チームの業績を上げるためのマネジメントと業務の比率
2025.02.14
報連相ができない部下に対するコミュニケーションの取り方 「部下が悪い」で終わらせない、管理職のスキル向上のポイント
2025.02.13
上司からは丸投げ、部下からはハラスメント扱い、業務は増加…プレイングマネジャーを苦しめる「6つの圧力」とは
2025.02.12
何度言っても変わらない人への指示のポイント 相手が主体的に動き出す“お願い”の仕方
2025.02.13
「みんなで決めたから」を言い訳にして仲良しクラブで終わる組織 インパクトも多様性も両立させるソース原理
2025.02.10
32歳で「すかいらーく」を創業、75歳で「高倉町珈琲」で再起業 「失敗したからすかいらーくができた」横川竟氏流の経営哲学
2025.01.07
1月から始めたい「日記」を書く習慣 ビジネスパーソンにおすすめな3つの理由
着想から2か月でローンチ!爆速で新規事業を立ち上げる方法
2025.01.21 - 2025.01.21
新人の報連相スキルはマネージメントで引きあげろ!~管理職の「他責思考」を排除~
2025.01.29 - 2025.01.29
【手放すTALK LIVE#45】人と組織のポテンシャルが継承されるソース原理 ~人と組織のポテンシャルが花開く「ソース原理」とは~
2024.12.09 - 2024.12.09
『これで採用はうまくいく』著者が語る、今こそ採用担当に届けたい「口説く」力のすべて
2024.11.29 - 2024.11.29
第20回エクゼクティブメンターイベント「今、「ひと」と組織が共創する〜働き方の未来へ」
2024.12.07 - 2024.12.07