ゲームのグラフィクスはどうやって描画される？～最新のリアルタイムレンダリング描画フローを見ていこう！～
2.6K Views
December 22, 25
スライド概要
本スライドは2025年8月30日(土)に開催したゲーム開発者向けのリアルイベント『ゲームメーカーズ スクランブル2025』で行われた講演のスライドとなります。
タイトル：
ゲームのグラフィクスはどうやって描画される？ ～最新のリアルタイムレンダリング描画フローを見ていこう！～
内容：
ゲームエンジンの普及などにより誰もがクオリティの高いCGをリアルタイムで生み出せるようになりました。しかし、よりうまく使いこなすためには、そのグラフィクスがどのように生成されているかを理解しておくことが非常に重要です。本講演では、グラフィクス専門の方じゃない方やエンジニアではない方も対象に、最新のリアルタイムレンダリングフローを見ていきます。
登壇者：
Epic Games Japan
Customer Success Director
篠山 範明 氏
講演動画も公開中！
【アーカイブ記事】https://gamemakers.jp/article/2025_12_22_119902/
【イベントページ】https://gamemakers.jp/scramble2025/
【イベントレポート記事】https://gamemakers.jp/article/2025_09_24_116494/
ゲームづくりに役立つ情報をお届けする「ゲームメーカーズ」の資料公開用アカウント。 WEBメディア「ゲームメーカーズ」では、ゲーム開発TIPSや”作り手目線”のインタビュー、お得なセール情報などを毎日更新！ http://gamemakers.jp
関連スライド
各ページのテキスト
ゲームのグラフィックスは どうやって描画される？ 最新のリアルタイムレンダリング描画フローを見ていこう！! Epic Games Japan Customer Success Director 篠山 範明 / Nori Shinoyama
ゲームグラフィックスは よりリアルに よりユニークに
ゲームエンジンなどの普及で 誰もが気軽に 最先端グラフィックスを試せる時代に
ゲームエンジンなどの 様々な便利ツール 誰もが気軽にハイクオリティなグラフィックスを 使える様になった！。。。けど。。。
なんかよくわかんないけど 絵が全然綺麗にならない！！
シェーダ コンパイル！？ エディタ固まるんです けど！？
全然速度がでない。。。 パフォーマンスがでない。。。
あのゲームみたいな 絵作りしたいんだけど やり方がわからん！！！！
このようなグラフィクスは どうやって 描画されているんだろう？
中身を知っていると 自分の表現したいものを実現しやすくなり 更に苦手な部分の解消になったり
ゲームエンジンなどの 様々な便利ツール 少しだけ踏み込んで、中身を見てみましょう
ゲームエンジンなどの 様々な便利ツール アート 技術 CGは、人のインスピレーションをデジタルの技術 で映像にすること。。。と言えるかも？
ゲームエンジンなどの 様々な便利ツール アート 技術 3DCGは アーティストとしてのアート力 またエンジニアとしての技術力が共に重要
ということで、本日の内容です
アート 技術 リアルタイム レンダリング に関わる全ての人に 知ってほしい 前提知識 本日お話しすること
アート 技術 リアルタイム レンダリング に関わる全ての人に 知ってほしい 前提知識 本日お話しすること ゲームデザイナーも プロデューサーも なんとなくは 知ってほしい！
アート 学生も！ ゲームの中身が気にな るゲーム好きな方も！ 技術 リアルタイム レンダリング に関わる全ての人に 知ってほしい 前提知識 本日お話しすること ゲームデザイナーも プロデューサーも なんとなくは 知ってほしい！
Agenda ● リアルタイムレンダリング？？ ● 超ざっくりレンダリングフロー ● 各項目をもう一歩深堀り ● 次の一歩へ （アートの道 / 技術の道） ● まとめ
自己紹介 Who I am? 篠山 範明 ● ● Epic Games Japan, Customer Success, Director ● X @tempkinder ● 国際きき酒師 ● 日本のアイドル文化を 幅広く応援しています ● ばってん少女隊 ● RAY ● ukka
今回の例や使用している画像などは すべてアンリアルエンジンのものですが、 免責事項 内容はアンリアルエンジンに限定されない 一般的なものとなっております また、アンリアルエンジン固有の説明は一 切ありません
リアルタイムレンダリング
レンダリング？
レンダリング？ デジタルデータを、人間にわかる形に表示、再生すること。映像だけではなく、音の再生も言う CG ポリゴンデータなどを解釈し モニターに表示 Webブラウザ HTMLデータを表示 サウンド 音の波形データを 実際の音にして再生
※この画像は実写です CGレンダリングは 現実の光の挙動の物理シミュレーション
※この画像は実写です ライト カメラ 形状 質感 CGレンダリングは 現実の光の挙動の物理シミュレーション
※この画像はCGです CGレンダリングは 現実の光の挙動の物理シミュレーション
リアルタイム？ ようこそミリ秒の世界へ
オフラインレンダリング (プリレンダリング) ● ● ● 一枚の絵を数秒 ~ 数十時間かけて生成 複雑な光のシミュレーションを 時間をかけて行う CPUまたはGPUで計算される リアルタイムレンダリング ● ● ● （”リアルタイム”に厳密な定義はないが） 0.016秒/0.033秒で絵を生成 高速に高品質な絵を出すために、 様々な簡略化や工夫がされている GPUメインで計算される
オフラインとリアルタイムのレンダリング時間比較 1時間 22万5千倍速い! オフラインレンダリング （様々なので1枚1時間と仮定、 これはめちゃくちゃ速い方） 0.016秒 リアルタイムレンダリング (60fpsと仮定)
リアルタイムレンダリングは なんでこんなに高速に レンダリングできてるの？ 種もしかけもございます！
GPU Graphics Processing Unit
とあるゲーミングPCのスペック GPUスペックによって、 扱えるグラフィックス処理に 大きな差がでます
このセクションのまとめ リアルタイム レンダリング？? ようこそ、ミリ秒の世界へ CGのレンダリングは光のシミュレーション リアルタイムはミリ秒の世界 高速に描画するために、 専用の機械”GPU”を駆使する
ではここからが今日の本番
Monitor では、GPUにどのような計算をさせて 描画されているのかを見ていきます
Agenda ● リアルタイムレンダリング？？ ● 超ざっくりレンダリングフロー ● 各項目をもう一歩深堀り ● 次の一歩へ （アートの道 / 技術の道） ● まとめ
超ざっくりレンダリングフロー
オブジェクトのレンダリングの基本構成
オブジェクトの基本構造(仮) 形状 質感 ポリゴンメッシュ マテリアル/シェーダ
Polygon Mesh 形状: ポリゴンメッシュ ポリゴンメッシュ = 物体の表面を形成する三角形(ポリゴン)の集合体
質感: マテリアル 材質や質感を定義するマテリアル では、”質感”とはなんだろう？？
ライト来たけど どうカメラに返す？ 質感とはつまるところ、ライトに当たった際に 「オブジェクトがどのような反射やふるまいをするか？」 を定義するもの
質感: マテリアル マテリアルを正しく作成することにより、 様々な素材の質感を表現可能に
Official Document: マテリアルの基本概念 質感: マテリアル UEではノードベースでマテリアルを作成していきます
模様/詳細: テクスチャ テクスチャ また、詳細な変化や模様のために貼り付ける画像がテクスチャです
オブジェクトの基本構造 形状 質感 ポリゴンメッシュ マテリアル/シェーダ 模様/詳細 テクスチャ
オブジェクトの構造がわかったので 代表的な二つのレンダリング手法を見ていきましょう ● フォワードレンダリング ● ディファードレンダリング
フォワード レンダリング モバイルやVRなどリソース制約が強い 環境で多く採用 直観的かつシンプル ジオメトリを描画するときに、 その場でシェーディング(ライティング)が 行われる
フォワードレンダリングで この様なシーンの絵がどんな流れで生成されるかを見ていきましょう
直観的かつシンプル フォワード レンダリング モバイルやVRなどリソース制約が強い 環境で多く採用 ジオメトリを描画するときに、その場でマテリアルシェー ディング(ライティング)が行われる 他にも色々利点ある！(けど今回は割愛) MSAAなどのGPUベースアンチエイリアシングを活用できる ディファードと比べて低メモリ モバイルやVRなどで採用多数 モバイルやVRなどリソース制約が強い環境で使われています
フォワードレンダリングの際に 最初に描画されたこの地面。。。。 せっかくライティングされてるけど...
最終的に地面が殆ど見えてない！！ 計算の無駄になってしまう。 見えてるところだけレンダリングしたい！！
ディファード レンダリング オブジェクトの情報を G-Bufferに書きだし(BasePass)、 後にライティング PCやコンソールなどでのスタンダード なリアルタイムレンダリング手法 見える部分だけライティング計算されるため 負荷を抑えられる
Base Pass 不透明オブジェクト描画 二つのPassに分かれます Lighting Pass
Base Pass 不透明オブジェクト描画 Lighting Pass Base Pass G-Bufferを作るだけ！ライティングはまだしない！ G-Buffer = ジオメトリ情報を蓄えるバッファ(画像) 各ピクセルにオブジェクトのマテリアル情報や法線などのデータを格納
Base Pass 不透明オブジェクト描画 Lighting Pass Lighting Pass G-Bufferを見ながらライト一個一個をのライティングを重ね書きしていく
ディファードレンダリングのライティングパスで この様なシーンの絵がどんな流れでライティングされるかを見ていきましょう
オブジェクトの情報をG-Bufferに書きだし、 後にライティング 見える部分だけライティング計算されるため負荷を抑えられる ディファード レンダリング PCやコンソールなどでのスタンダード なリアルタイムレンダリング手法 多数のライトを扱える(今回詳細な説明は割愛) ジオメトリ描画とライティングを分けることで、 フォワードに比べライトの数を増やすしやすい G-Bufferがあることで高度なポストプロセスが可能に (後に少し説明) G-Bufferを保持するために多くのメモリを消費し 描画コストがかかる ＰＣやコンソールなどでのスタンダードな描画手法
このまま Deferred Renderingの 一般的な流れを見ていきましょう
BasePass 不透明オブジェクト描画 ライティング G-Buffer 半透明描画 あとで詳しく！
BasePass 不透明オブジェクト描画 ライティング G-Buffer 半透明描画 Post Process
BasePass 完成！ 不透明オブジェクト描画 ライティング 半透明描画 Post Process
Post Process でどんなことができるか？
※この画像は実写です 現実のカメラで 起きることの シミュレーション ポストプロセスで カメラ特有の現象をシミュレーション
Post Process 被写界深度: Depth of Field カメラのボケ表現
Post Process Bloom
Post Process Motion Blur
BasePass 完成！ 不透明オブジェクト描画 ライティング 半透明描画 Post Process
BasePass 完成！ 不透明オブジェクト描画 ライティング このセクションのまとめ 超ざっくり レンダリングフロー 半透明描画 Post Process リアルタイムレンダリングフロー は大きく二種に分かれる PC・コンソールで主流のディファード モバイル・VRなどで使われているフォワード ディファードが主流 半透明やポストプロセス描画がその後き、 リッチな絵作りを可能にする
Agenda ● リアルタイムレンダリング？？ ● 超ざっくりレンダリングフロー ● 各項目をもう一歩深堀り ● 次の一歩へ （アートの道 / 技術の道） ● まとめ
各項目をもう一歩深堀り (Deferred Rendering ベースで)
ここから、 タイトルの ”最新の” を回収していきたいと思います
アート 技術 リアルタイム レンダリング に関わる全ての人に 知ってほしい 前提知識 この章の内容は、少し専門的になるかもです 業務外の方は流す程度で。。。おねがいします
BasePass 完成！ 不透明オブジェクト描画 ライティング 半透明描画 Post Process
※この画像は実写です CGレンダリングは 現実の光の挙動の物理シミュレーション
※この画像は実写です ● ● ● ● 直接光: Direct Lighting 間接光: Indirect Lighting 影: Shadow 映り込み: Reflection ライティングも様々な効果を それぞれ独立してシミュレーションしています
※この画像は実写です ● ● ● ● 直接光: Direct Lighting 間接光: Indirect Lighting 影: Shadow 映り込み: Reflection ライティングも様々な効果を それぞれ独立してシミュレーションしています
Direct Lighting Indirect Lighting
直接光 (Direct Lighting) ライトからの直接(Direct)のライティング
間接光 (Indirect Lighting) 二次反射。照り返し。複数回バウンドしたライティング 直接光で届かない場所へも、光が回り込む。
Direct Lighting Indirect Lighting
Indirect Lighting & Reflection 直接光 (Direct Lighting) とある点のライティング結果が知りたいとき... ライトからの影響だけを計算すればよい
Indirect Lighting & Reflection 間接光 (Indirect Lighting) 二次反射。照り返し。複数回バウンドしたライティング 直接光で届かない場所へも、光が回り込む。
Indirect Lighting & Reflection 間接光 (Indirect Lighting) どこからくるのかわからない... ライトの複数回反射を事前にシミュレートしておく必要がある とある点のライティング結果が知りたいときは... シーン全体を見に行く必要がある
そんな計算が沢山必要な間接光を どうやってリアルタイムで実現するの？
長く使われてきた手法 事前計算！
建築ビジュアライズにおけるLightmass実践使用方法 （フリーランス 真茅健一様） 間接光の実現方法 Light Bake: ライティングの焼き付け 昔から使われてきた間接光のリアルタイム表現手法 ● ● ● 事前にライティング結果を計算しテクスチャで焼き付ける このテクスチャをLightMapという ただし、ライトもオブジェクトも変化しないシーンにのみ使える 小さなシーンでも数十時間かかることがある！
しかし、最近ようやく リアルタイムの間接光が扱えるように。。。
Lumen ( Unreal Engine) 完全に動的なグローバルイルミネーション ライトもワールドも動的変更が可能 ベイクなし、ライトマップUVなし
すごい！ もうライト置くだけで勝手にリアルになる！！ … なる？
Indirect Lighting & Reflection Lumen Algorithm 概要 各メッシュの カード形状作成 事前準備 (Editor) Lumen Sceneの構築と ライティング レイトレで GIを計算 ランタイム アップサンプリング！
Indirect Lighting & Reflection Lumen Algorithm 概要 なんか色々難しいこと組み合わせて どうにかリアルタイムで表現しようとしている！ 各メッシュの カード形状作成 事前準備 (Editor) Lumen Sceneの構築と ライティング レイトレで GIを計算 ランタイム アップサンプリング！
映り込みなどのReflectionも同様です
※この画像は実写です ● ● ● ● 直接光: Direct Lighting 間接光: Indirect Lighting 影: Shadow 映り込み: Reflection
Indirect Lighting & Reflection 参考: 反射/映り込み (Reflection) 反射や映り込みもGIと同様。とある点の反射を得るためには... シーン全体から反射する部分(とその部分のシェーディングも！)を 取得する必要がある
Reflection Probe Screen Space Reflection Planar Reflection 今までは、 事前計算などの色々な疑似手法でどうにか再現
- https://dev.epicgames.com/documentation/ja-jp/unreal-engine/reflections-environment-in-unreal-engine#reflectioncapture(反射キャプチャ)アクタ
- https://dev.epicgames.com/documentation/ja-jp/unreal-engine/reflections-environment-in-unreal-engine#スクリーン空間の反射(screenspacereflections)
- https://dev.epicgames.com/documentation/ja-jp/unreal-engine/reflections-environment-in-unreal-engine#平面反射
※この画像は実写です ● ● ● ● 直接光: Direct Lighting 間接光: Indirect Lighting 影: Shadow 映り込み: Reflection
BasePass 完成！ 不透明オブジェクト描画 ライティング 半透明描画 Post Process
Level of Detail(LOD) 高速化するためにいまだに必要なもの
Official Document: LOD の作成と使用 Official Document:スケルタルメッシュの LOD Polygon Mesh Level of Detail: コンセプト オブジェクトのディティールを表現するために 高密度になりがちなポリゴンメッシュですが...
Polygon Mesh Official Document: LOD の作成と使用 Official Document:スケルタルメッシュの LOD Level of Detail: コンセプト すごく遠くにいたりと描画面積が小さい場合でも、 この高密度なポリゴンを計算するのは効率が悪いのは想像つくかと思います
Polygon Mesh Official Document: LOD の作成と使用 Official Document:スケルタルメッシュの LOD Level of Detail (LOD) とは？ 遠くにいるオブジェクトの描画負荷削減やちらつき防止のための低ポリゴンモデル UE上で自動生成することも、独自メッシュをいれることも可能 どれぐらい遠くでメッシュが切り替わるかの設定も細かくできます
Polygon Mesh Official Document: LOD の作成と使用 Official Document:スケルタルメッシュの LOD Level of Detail: コンセプト このLODにより、実際に遠くでレンダリングされるメッシュは 非常に数少ないポリゴンでレンダリングできます リアルタイムで多くのオブジェクトを高速にレンダリングするための 基礎的な手法です
今世代の新しいオブジェクト表現術 仮想化ジオメトリ
BasePass 完成！ 不透明オブジェクト描画 ライティング 半透明描画 Post Process
4Kそのままレンダリング 57.33ms 1080pでレンダリングして 4Kに 26.08ms
Unreal Engine Temporal Super Resolution (TSR) ● ● 低解像度のレンダリングを行いつつ、 過去の複数フレームを参照して アップスケールする手法 計算するピクセル量を減らすので、 Nanite/Lumen含めた多くの処理負荷を劇的に下げる
複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある 100% 100%のターゲット解像度でレンダリングしたら、アップスケールも不要 そのまま 100%の画像を出力すれば良い ターゲット 高解像度
複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある 70% 70% 内部解像度が低くなるにつれ、必要なフレームが増える ターゲット 高解像度
複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある 50% 50% 50% 50% 内部解像度が低くなるにつれ、必要なフレームが増える ターゲット 高解像度
複数フレーム処理 TSRの注意点 ターゲットの高解像度に達する(収束する)ために、十分なサンプルを集める必要がある ．．． 50% 50% 60fps → 30fpsになると、収束する時間も倍になる ターゲット 高解像度
複数フレーム処理 TSRの注意点 内部解像度が低かったり、フレームレートが遅い中で画面が大きく動くとボケやすい https://twitter.com/tempkinder/status/1639482361871216
BasePass 完成！ 不透明オブジェクト描画 ライティング 半透明描画 Post Process
画面全体の色を変える PostEffect 煙のエフェクト一個 どちらが重たいでしょう？？
右の煙のワイヤーフレーム表示 煙のエフェクト一個 半透明描画では、 透明でも沢山のピクセルを描画している可能性がある
半 透 明 半 透 明 半 透 明 半 透 明 半透明オブジェクトははすり抜けるので何回も計算しなけばいけない 不 透 明
画面全体の色を変える PostEffect 煙のエフェクト一個 たった一個のエフェクトでも、描画するピクセル数が増えれば PostEffect以上の負荷に簡単に跳ね上がる可能性があります
Translucent 半透明リアルタイムレンダリングの大きな壁 様々な問題があります 1. 描画負荷 2. 描画順序 3. デプスを描画しない 今回時間の都合上割愛しますが。。。大変！！！
UE5の最新グラフィクスを使いこなすための4個の勘所 UE5がメインとなりますが、 現代のリアルタイムレンダリング技術の注意点を紹介しています
ちょっと脇道
アニメ調やイラスト調はどう作るの？
同じレンダリングフロー内で 様々なテクニックを駆使して作っています！
シルエット用のオブジェクトを レンダリングして重ねたり...
UE5 Official Document: ポストプロセスマテリアル Post Processで頑張ったり 3D人さん(@ymt3d)による Stylized PostProcess for Unreal Engine 5 機能紹介とv2.0への展望 Alweiさん(@aizen76)による UE5 初心者・入門者向けPPLineDrawing導入手順
おすすめ記事 CGWORLD: 原画イラストの再現を目指した個性的な キャラクターと悪魔たち『真・女神転生V』
BasePass 完成！ 不透明オブジェクト描画 ライティング このセクションのまとめ 各項目をもう一歩深堀り 半透明描画 Post Process リアルでリッチな表現を実現するため 様々な新機能が実装されています ただし、それらはまだ完ぺきではなく 得手不得手を理解して 注意深く使用する必要があります
Agenda ● リアルタイムレンダリング？？ ● 超ざっくりレンダリングフロー ● 各項目をもう一歩深堀り ● 次の一歩へ （アートの道 / 技術の道） ● まとめ
次の一歩へ
アート リアルタイム レンダリング に関わる全ての人に 知ってほしい 前提知識 = 基本となる レンダリングフロー 本日お話したこと 技術
ただ、 今日紹介したフローは ほんとうにざっくりしたもの。。。
Unreal Engine 5 レンダリングフロー総おさらい(2024) UE5がメインとなりますが、 レンダリングフローをより詳細に説明しています
アート リアルタイム レンダリング に関わる全ての人に 知ってほしい 前提知識 = 基本となる レンダリングフロー 更に深い知識やスキルを身に着けていくためには 技術
更に深堀する際、 エンジニアリングに行きたいか? アートに行きたいか? で学ぶものが変わっていきます 学生さんやキャリアを考える人の参考になればと考えをまとめます
アート 技術 自分がどこに責任をもちたいか
アート 技術 基本となるレンダリングフロー (レンダリングのアルゴリズム)
アート 技術 基本となるレンダリングフロー (レンダリングのアルゴリズム) レンダリングフローの実装 CPU実装 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 基本となるレンダリングフロー (レンダリングのアルゴリズム) レンダリングフローの実装 CPU実装 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 基本となるレンダリングフロー (レンダリングのアルゴリズム) レンダリングフローの実装 CPU実装 ゲームエンジンなどが カバーしている領域 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
リアルタイムレンダリング技術を深堀りしたい人におすすめの 次のステップ
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 基本となるレンダリングフロー (レンダリングのアルゴリズム) GPUがどう描画処理を するかを見てみては？？ レンダリングフローの実装 CPU実装 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
(Unreal Engineの話になってしまいますが） Unreal Insight を使って レンダリングフローがどのようにGPUで処理されているかを見てみよう
また、更に詳細がわかるキャプチャツールやプロファイツールを触ってみよう！ 例: PiX
【UE5】PIXでピクセルデバッグ – Unreal Engine 5.4 Kafues511さんが非常に丁寧に UE5でPiXを用いてキャプチャする方法を説明してくれています！
これらをより理解するために、 自分の持ってるGPUの会社のブログを読みはじめよう！
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 基本となるレンダリングフロー (レンダリングのアルゴリズム) アーティストは？ レンダリングフローの実装 CPU実装 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
自分はアーティストではないので、 知り合いのアーティスト達に相談しました ここからは彼らの言葉を代弁します
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 基本となるレンダリングフロー (レンダリングのアルゴリズム) アーティストといっても 様々な業種がある... またこの辺りはツールや 時代に非常に依存する... レンダリングフローの実装 CPU実装 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 基本となるレンダリングフロー (レンダリングのアルゴリズム) 毎年ツールが変わるぐらい の覚悟をもって、 日々様々なツールを 学習し続けよう！ レンダリングフローの実装 CPU実装 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 CGに活きる アートスキル、 目を養おう！！ CGに活きるって？ どうやって？ 基本となるレンダリングフロー (レンダリングのアルゴリズム) レンダリングフローの実装 CPU実装 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
CGや絵ではなく、 実写の映画、写真などを沢山見よう！ 好きなカットを集めよう！ その理由を考えよう！
なんで実写？？
※この画像は実写です ライト カメラ 形状 質感 CGレンダリングは 現実の光の挙動の物理シミュレーション
ここまで来て気づきました。。。
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 3Dグラフィックスに関わる 基本となるレンダリングフロー エンジニア、アーティスト (レンダリングのアルゴリズム) どちらも学ぶべき レンダリングフローの実装 CPU実装 もう1つのレイヤーあった。。。 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
※この画像は実写です ライト カメラ 形状 質感 CGレンダリングは 現実の光の挙動の物理シミュレーション
カメラを中心とした現実の撮影技術 またその原理を理解する必要がある！！！
レンダリングフロー以外にも学ぶべき大切なことの一つ アート 技術 カメラやライト を用いた様々な 表現方法 カメラ, ライト, 色 の基本的な仕組み それをどうリアル タイムCGで実現 するかの実装方法
18%Gray Exposure Color Management RAW HDR SS/Aperture カメラやライトの仕組みは アーティストやエンジニアの共通言語 (映像からリアルタイムに来た人などは特に精通している場合が多い)
しかし カメラは とても高い...
携帯で十分 スタートできる！ ある程度のマニュアル設定で撮影で きるカメラアプリが沢山あります！ 例: Lightroom mobile (無料) Android iOS
CG空間でも スタートできる！ 例えば、 Unreal EngineのVirtual Cameraも 無料で様々なレンズの画角やカメラ 設定を試せます！
おすすめ講演 ライティングのヒント：なぜCGアーティストは光に興味がないのか？ |Unreal Fest Tokyo 2025 Square Enix 木村さん
今日紹介したレンダリングフローは 基礎的なものアーティストもエンジニ アも共通認識でもっておくべきもの このセクションのまとめ 次の一歩へ 次に学ぶこととして エンジニアはGPUの挙動を アーティストは実写の撮影表現を 提案しました 更に、 レンダリングフローだけではなく、 カメラの基礎ももう一つの大きな分野 無料で試せる方法があるので、 今から試してみましょう！
Agenda ● リアルタイムレンダリング？？ ● 超ざっくりレンダリングフロー ● 各項目をもう一歩深堀り ● 次の一歩へ （アートの道 / 技術の道） ● まとめ
まとめ
ゲームエンジンなどの 様々な便利ツール 誰もが気軽にハイクオリティなグラフィックスを 使える様になった！。。。けど。。。
なんかよくわかんないけど 絵が全然綺麗にならない！！
中身を知っていると 自分の表現したいものを実現しやすくなり 更に苦手な部分の解消になったり
ゲームエンジンなどの 様々な便利ツール アート 技術 3DCGは アーティストとしてのアート力 またエンジニアとしての技術力が共に重要
アート 学生も！ ゲームの中身が気にな るゲーム好きな方も！ 技術 リアルタイム レンダリング に関わる全ての人に 知ってほしい 前提知識 本日お話しすること ゲームデザイナーも プロデューサーも なんとなくは 知ってほしい！
※この画像は実写です CGレンダリングは 現実の光の挙動の物理シミュレーション
オフラインとリアルタイムのレンダリング時間比較 1時間 22万5千倍速い! オフラインレンダリング （様々なので1枚1時間と仮定、 これはめちゃくちゃ速い方） 0.016秒 リアルタイムレンダリング (60fpsと仮定)
GPU Graphics Processing Unit
Monitor では、GPUにどのような計算をさせて 描画されているのかを見ていきます
ディファード レンダリング PCやコンソールなどでのスタンダード なリアルタイムレンダリング手法 オブジェクトの情報をG-Bufferに書きだし(BasePass)、 後にライティング 見える部分だけライティング計算されるため負荷を抑えられる
BasePass 完成！ 不透明オブジェクト描画 ライティング 半透明描画 Post Process
Lumen ( Unreal Engine) 完全に動的なグローバルイルミネーション ライトもワールドも動的変更が可能 ベイクなし、ライトマップUVなし
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 基本となるレンダリングフロー (レンダリングのアルゴリズム) GPUがどう描画処理を するか見てみては？？ レンダリングフローの実装 CPU実装 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
アート 表現したいもの 技術 リアルタイムレンダリングに適した アセット作成やシーン作成 CGに活きる アートスキル、 目を養おう！！ CGに活きるって？ どうやって？ 基本となるレンダリングフロー (レンダリングのアルゴリズム) レンダリングフローの実装 CPU実装 GPUに描画コマンドを送る CPU側: DirectX / OpenGLなど GPU描画処理
CGや絵ではなく、 実写の映画、写真などを沢山見よう！ 好きなカットを集めよう！ その理由を考えよう！
カメラを中心とした現実の撮影技術 またその原理を理解する必要がある！！！
携帯で十分 スタートできる！ ある程度のマニュアル設定で撮影で きるカメラアプリが沢山あります！ 例: Lightroom mobile (無料) Android iOS
Thank you!