ノンゲームで使える！40分で理解するPCG | Unreal Engine Meetup Hiroshima #3

ノンゲームで使える！ 40分で理解するPCG Epic Games Japan 湊 和久 Unreal Engine Meetup Hiroshima #3

PCG

PCG 旧球団色になった 目に優しゅうなった

アジェンダ ● PCGとは？ ● PCG エディタモード ● グラフ自作のために知るべき10 のこと ● シェイプグラマーの紹介 ● まとめ

アジェンダ ● PCGとは？ ● PCG エディタモード ● グラフ自作のために知るべき10 のこと ● シェイプグラマーの紹介 ● まとめ

PCGとは？ ● Procedural Content Generation ● ルールとパラメータでコンテンツ を自動生成／配置する仕組み ● 大規模で複雑な背景構築を効率化 し、再利用も容易 ● 外部ツール（Houdini等）に依存 せず、UE5エディタ内で完結 Houdiniと組み合わせれば 数レベル上の活用も！ PCGグラフ ルールの記述は 専用のPCGグラフで

映像、建築、自動運転背景生成などに強い生産性 GIF GIF ランドスケープに応じたバイオームの生成 スプラインによる河川、道路の自動敷設 市街地のビルや建物の配置 そしてビルや建物単体の自動生成など… GIF

UE5.7でPCGはプロダクション・レディになりました！ プロダクション・レディ（実用段階） 今後「破壊的変更」が入る可能性はなく、「後方互換性」が維持されます！ 安心してお使いください PCGエディタモード 「フォリッジ」のように、作成済みのPCGグラフを利用して プロシージャルコンテンツを設置する作業に没頭できる新モードが搭載されました 新しいデータ型や演算ノードの追加 Polygon2D型や、スプライン同士の交差をとったり、切断を行うノードが追加が登場！ プロシージャル植生エディタ（PVE） 高密度の樹木を高速に描画できるNaniteの新機能に対応した樹木エディタです 本日紹介!

PCGプラグインの有効化 Edit > Plugins で設定画面へ PCGで検索し、有効化 指示に従いエディタを再起動 基本プラグイン以外は まだβか実験段階なんか

基本: PCGの構成と動作 アセット Actor PCGグラフ ロジック PCGコンポーネント 動作領域を決める何か スプラインや... ボリュームなど 入力 ・環境や空間の読み取り ・調整パラメータ ロジックと入力から点群を演算、メッシュを配置

アジェンダ ● PCGとは？ ● PCG エディタモード ● グラフ自作のために知るべき10 のこと ● シェイプグラマーの紹介 ● まとめ

新登場! PCGエディタモード 面倒な準備はもう不要！ プリセットのPCGグラフで いますぐプロシージャル体験！ 3系統の領域指定ツール （スプライン、ペイント、ボリューム） 自動化されたPCGセットアップ （必要なコンポーネントを自動付与・自動設定） すぐに使える汎用PCGグラフ （ノード作業なしで、プロシージャル発進！）

PCGエディタモードにおけるワークフロー ①ツールを選択 ②領域を指定 スプライン、ペイント、ボ リュームから用途にあわせ て最適なツールを選択 シーン上をクリックした り、ドラッグしたりするこ とで適用範囲を指定 Point! ③メッシュ割り当て 点の位置に配置するメッ シュを1つ以上割り当て ④パラメータ調整 密度やスケール、ランダム 性などのパラメータを調整 し、最終的な見た目を追い 込む PCG処理に必要なアクタやコンポーネントは②時に自動的に付与されます

①ツールの選択：3系統の領域指定ツール スプライン：ドラッグで線を引き、線上や 囲んだ領域に点を散布。フェンスや道路、 囲まれた領域（畑など）に使用します。 ペイント：フォリッジモードのように、ブ ラシを用いてサーフェイスに点を直接塗布 します。 ボリューム：立方体の大きさを指定し、体 積内に点を散布します。

①ツールの選択：3系統の領域指定ツール ②ツールを選ぶ （今のところ基本１種か２種） ①ツールカテ ゴリを選ぶ ③グラフを選ぶ 覚えておきたいのは ①→②で選択完了ということ ③はとりあえず 気にしなくてOK

②領域の指定 スプライン ペイント ボリューム GIF GIF GIF ・Draw Spline: 左ドラッグでスプライン パスを引き、点を線上に散布する ● 左クリック／ドラッグでブラシの 範囲に点を散布 1. 左ドラッグでボリュームのフット プリント（底辺形状）を決定 ・Draw Spline Surface: 閉スプラインを 引き、領域内に点を散布する ● Shiftキーを押しながら左ボタン で散布済みの点を消去 2. マウス上下操作とクリックで、ボ リュームの高さを決定

③メッシュ割り当て パラメーターオーバーライドより、出 現させるメッシュを割り当てる

④パラメータ調整 その他、露出しているパラメータを調 整し、見た目を追い込む

注意 ① アクタ非選択時／選択時の挙動の違いと注意点 アクタ未選択時 アクタ選択時 ツール使用時に新しいPCGアクタを自動作成 選択中のアクタにコンポーネントを自動追加 「なにもないと思ってたら天球があった」 未選択状態にしたいときは、ESCキーが確実！ 「空きスペースをクリック」では、不意に天 球などの既存のアクタが選択される場合も。

注意 ② ボリュームツールとコリジョ ンの相性 ● ボリュームツールはDynamic設定 のオブジェクトと判定をとらない ● そのため、ボリュームを設置して も点が散布されない ● 「Basic」テンプレートマップの 床がまさにそれだったりする・・ 無反応 WorldStatic系の コリジョンに変更しよう

注意 ② ボリュームツールとコリジョ ンの相性 ● ボリュームツールはDynamic設定 のオブジェクトと判定をとらない ● そのため、ボリュームを設置して も点が散布されない ● 「Basic」テンプレートマップの 床がまさにそれだったりする・・ 反応 WorldStatic系の コリジョンに変更しよう

アジェンダ ● PCGとは？ ● PCG エディタモード ● グラフ自作のために知るべき10 のこと ● シェイプグラマーの紹介 ● まとめ

ツールを「使う」側から「作る側」へ ● PCGエディタモードの各ツールは、標準添付のPCGグラフで動作しています ● より高度なPCG処理を行いたい場合は、グラフを自作する必要があります ● UE5.7よりテンプレートを指定して作成をスタートできるようになりました

PCGグラフの書き方はサンプルを動かしながら学べ！ PCGプラグイン SampleContent Electric Dreams 環境サンプル PCGプラグインフォルダに 格納されるシンプルな作例群 PCGを用いた大規模でリアルな 森の環境制作と、その基礎的な お作法を学べます エディタツール用 汎用PCGグラフ Cassiniサンプル シェイプグラマーを含む 最強（最凶？）最新の 公式サンプル PCGプラグインフォルダの EdMode下に格納。 でもグラフの 読み方が分からん PCGグラフ読解の ポイントを押さえてこう

知るべきこと ① グラフ解析・編集時 必携のデバッグ用ショートカット ノードの有効／無効 A E D ポイントの可視化 アトリビュートリストの表示 ※Alt+D: 全ノードのデバッグをOFF

知るべきこと ② 世の中だいたい 点である PCGはメッシュを直接配置するのでは なく、基本的に点（点群）を扱います 1 2 3 4 これらの点は、位置、回転、確率密度 などのプロパティや、ユーザー定義の アトリビュート（属性）をもちます 点を「種」、確率密度を「発芽確率」と捉 えると理解しやすいかも？ 種を蒔き、間引 き、育てた結果がメッシュになる！ ①散布→②密度付与→③フィルタリング→④実体化

知るべきこと ③ 自作PCGグラフ基本の キ 点の生成と確率密度付与 1 2 密度による間引き 3 メッシュ配置 4

知るべきこと ④ 点を撒かなきゃ始まらない！4つの基本ノード Surface Sampler ジオメトリ表面にランダム散布 サーフェイスの取得にはGet Landscape DataやWorld Ray Hit Queryを利用 Spline Sampler Get Spline Data などで取得したスプラインの線上に一定の間隔で点を散布 Create Point Grid 格子状に並んだ点を生成 Point From Mesh メッシュの形状から点群を生成。UE5.7からはスケルタルメッシュにも対応

知るべきこと ⑤ サンプラーはデータがほしい Surface Sampler に何を渡す かで点散布のために検出され る「表面」が変化する 閉スプラインの内側領域を 扱うには Create Surface From Spline を経由させる

知るべきこと ⑥ Overlap! 点には大きさがある PCGの点は単なる座標点ではなく、 大きさ（Bounds）属性をもちます 重なりの除外：点同士が重なっている 場合、片方を除外して自然な分布を作 成できます 大きさを編集するノード ‘Bounds Modifier’ 重複除去を行うノード ‘Self Punning’, ‘Difference’

知るべきこと ⑦ 点の特性をバラバラにする デジタルな生成物が「不自然」に見え る最大の要因は完全な均一性にある。 点をバラバラに回転させたり、大きさ に大小をもたせたりするのがコツ。 点の位置、回転、スケールを調整するノード ‘Transform Points’ Boundsの評価について Self Punningなどの処理では、 Bounds × スケールで評価されます

知るべきこと ⑧ 点の内部構造：プロパティ vs アトリビュート PCG Point プロパティ システム標準変数 「初めからある属性」で、 名前の頭に$がつく $Position $Rotation $Scale $BoundsMin/Max $Color $Density… アトリビュート PreviousAngle Distance Mesh… Point! ユーザー定義変数 アトリビュートは 後から足すことができる 点の最後にある属性は名前指定なしに「@Last」でアクセスができる 複数のノードを連携して走らせる場合に多用される

知るべきこと ⑨ 分岐代わりにフィルタが多 用される ● PCGにも「Branch」ノードはあ るが、登場回数は多くない ● フィルタを使用して点群を2つに わけて別々のノードネットワーク に食わせることが多い ● フィルタ基準に使われるのも、 もっぱらアトリビュートである

知るべきこと ⑩ ノードの決め打ちパラメータより点属性が使われがち ノードのパラメータで挙動を決め ると、点ごとに挙動を変化させら れない 結果的にフィルターノードによる 分岐が増えてしまう PCGでは不要な分岐を押さえ、 点の属性にデータを与えて挙動 を変える手法が好まれる Mesh 属性の追加／編集方法は多岐。 よくチェックしよう

おすすめの資料 ● 「ゼロから始めるプロシージャル入門」 ● PCG: First Steps to Advanced Development ● Unreal Engine 5 ElectricDreams環境サンプルにみるプロシージャル 生成テクニック【CEDEC 2023】

オマケ 自作グラフをPCGエディタのパレットに登録でき〼 自作PCGグラフ設定の「Is Preset」にチェックを入れ、Compatible Tool Tags に関連付けたい ツール名を文字列で打ち込むと、パレットに表示されるようになります プロジェクト独自のPCGグラフをPCGエディタに登録してアーティストができることを増やそう！ PCGグラフ側設定 PCGエディタ側

アジェンダ ● PCGとは？ ● PCG エディタモード ● グラフ自作のために知るべき10 のこと ● シェイプグラマーの紹介 ● まとめ

従前のPCGの得手不得手 得意：自然物（森、岩）のような「カオス」な 配置。植生など、ランダム性の中の規則性を記 述するのは得意。 不得意：人工物（建物、フェンス）のような秩 序のある配置。完全なる規則性やパーツ同士の 関係性を直観的に記述できない。 その悩みシェイプ グラマーが解決します！

シェイプ・グラマー（形態文法）とは ● 幾何学的形状を生成する生成システムの一種 ○ 1971年にジョージ・スタイニー氏とジェームス・ジップス氏によって初めて提唱 ● 「形の構成構造を生み出すルール」 ＝「形を構成する要素同士の関係性を記述したもの」 (※1) ● 2次元または3次元の形状を扱い、建築設計や産業デザイン分野で応用される (※2) (※1) アンズスタジオ 竹中司／岡部文「形の文法化」 2015年 (※2) 渡辺 俊：日本民家の形態文法，第38回 情報・システム・利用・ 技術シンポジウム 2015年（日本建築学会 情報システム技術委員会） ，報告H60，pp.289–292，2015.

PCG シェイプ・グラマーの基本挙動 所与のモジュールとルールでスプラインを埋める「詰め込みパズル」を 解き、スプライン上の適切な位置に点（with 属性）を散布する Spline Module サイズ（幅）をもつ 形の情報 この特性上、 スプライン専用なんよね

例：「ケン・ケン・パ」のルール記述 Pa Ken Ken [Ken, Ken, Pa]＊ ・文字列はモジュール情報と突合するための任意のシンボル ・[ ] はひとつのまとまり。＊はスペースが続く限りリピートする指示 ・文字列を書き換えるだけで、配置のリズムを即座に変更できる

シェイプ・グラマー構文チートシート 構文 説明 シンボル A で定義されるモジュールを配置 A A A [A, B] B AとBをグループ化して同一視 [A, B]＊ 領域が埋まるまで対象を 0回以上繰り返し配置 [A, B]＋ 最低1回は対象を配置し、以降は繰り返し配置 [A, B]2 A B A B 修飾対象を2回配置 <A, B> A B A B まずAが入るか試み、入らなそうなら B {A:2, B:1} 2:1の比重でAとBをランダム選択

構文は入れ子にして利用可能 {[A,P]:2,[BL,P]:1,[BS,P]:1}*,[G,P], {[A,P]:2,[BL,P]:1,[BS,P]:1}* 開始部 3つのグループを 2:1:1 でランダムに詰める 中央部 領域の中央にG, Pモジュールをセットで置く 終了部 3つのグループを 2:1:1 でランダムに詰める

シェイプ・グラマー簡単利用ガイド 自作グラフへの組み込みには要経験。最初はテンプレートを推奨！ Shape Grammer テンプレート でPCGグラフを作成 Draw SplineツールでPCGアク タを作成 詳細パネルから、PCGコンポー ネントのグラフを変更 詳細パネルから、パラメーター を変更してグラマーを活用！

モジュール定義：シンボル文 字列とサイズの組み合わせ Symbol：モジュールの「名前」のようなもの。 グラマー文字列で指定する際に使用。 Size：モジュールの幅。PCGはこれを利用して ”詰め込みパズル”を解く。 Scalable：拡縮許可。スペースぎりぎりに詰める ために必要。 Scalableには変形して問題ない（バレない）モ ジュールを指定する

メッシュ定義：モジュール定 義にあわせ同数を登録 モジュール情報はメッシュ情報をもたない どのようにシンボルとメッシュを結びつけるか は、グラフ制作者の方針に任される 以下はあくまで Showcase Shape Grammar グラ フの仕様： ● Mesh Info [ n ] が Module Info [ n ] に対 応する ● モジュールの Size はメッシュのX方向の幅 で上書きされる ● したがって Module Info の Size は頑張っ て入力しなくてよい！

実践例1：フェンスの生成 （１次元） Post [Panel, Post]* Grammar: Post, [Panel, Post]* ● ● Post ：最初に必ず支柱を立てる [Panel, Post]*：その後、「パネル＋支柱」のセットを終点まで繰り返す 応用：中央にゲートを設置したい？ Post, [Panel, Post]*, Gate, [Panel, Post]*

実践例2：列車の連結 （１次元） Head [C, Body]* [C, Tail] Grammar: Head, [Gangway, Body]*, [Gangway, Tail] 先頭と後尾を固定し、中間車両だけスプラインの長さに応じて増減させます ● ● ● Head ：スプラインの始点に1回配置 [C, Body]*：スペースが埋まるまで客車を繰り返す（C=連結部つき） [C, Tail]：スプラインの終点に1回配置

実践例3：1次元から疑似２次元へ * W] , [P [P , [P, W]* * W] * , [P W] Spline to Segment ノード Subdivide Segment ノード スプラインの制御点を結ぶ長細い点 （疑似的なセグメント）を生成 セグメント単位でグラマーを適用し なおし、点に分割

実践例④：2次元から3次元へ「ビルの構造」 グラマー対応のDuplicate Cross-Section ノードで、スプラインを垂直方向に複製 Ground, Inter*, Roof Duplicate Cross-Section Grammar: Ground, Inter*, Roof さらに Subdivide Segment で各階層ごとに 個別のグラマーを適用する 詳しくはPCGプラグインコンテンツ付属の グラマーサンプルマップをチェック

おすすめの資料 ● 「ケンケンパで学ぶPCG Shape Grammarの基本」 ● Leveraging PCG for Building and City Creation | Unreal Fest Bali 2025 （オートダビング付き！） 上述の Unreal Fest Bali 講演では ポイントグリッド+グラマーのアプローチで 建物を生成しています。必見！

オマケ PCGエディタにもグラマー用グラフがあり〼 高度なPCGグラフの実装により、モジュール段階でメッシュの指定ができ、 UseMeshBoundsAsModuleSizeを指定すれば、メッシュからサイズを自動で読み取ります。 普段使いはこちらが便利！

アジェンダ ● PCGとは？ ● PCG エディタモード ● グラフ自作のために知るべき10 のこと ● シェイプグラマーの紹介 ● まとめ

まとめ：今日お話したこと ● PCGはルールに基づきコンテンツを自動生成／配置する仕組みです ● PCGグラフでは点群を生成し、密度や属性に基づき、メッシュなどを配置し ます ● PCGエディタモードを使用すれば、難しいPCGグラフを作成することなく、 PCGを使い始めることができます ● シェイプグラマーは、人工物など秩序ある配置の課題を解決します

ご清聴ありがとうございまし た！ 広電のカープラッピング電車のイメージは下記ページより引用しました https://www.hiroden.co.jp/topics/2022/1005-crowdfunding.html

• https://www.hiroden.co.jp/topics/2022/1005-crowdfunding.html

Q&A?