Unreal Engine 5 (UE5) の Product Configurator (製品コンフィギュレータ) テンプレートは、カスタマイズ可能な製品コンフィギュレータとユーザー インターフェースの作成開始地点を 3D ビジュアリゼーション アーティストに提供します。このテンプレートでは Level Variant Sets、カスタムの UMG インターフェース要素、および次の機能を備えた専用のコンフィギュレーション ブループリントを利用します。
- アクタの切替を使用したジオメトリのバリエーション。
- マテリアル オプションとビジビリティ オプション。
- カメラの位置および設定のバリエーション。
- ライティングおよび環境のバリエーション。
- ユーザーにオプションを提示するプロシージャルに生成されたインターフェース。
- ブループリント コードを使用せずに新しいバリエーションを追加する機能。
概要
Variant Manager を使用すると、LevelVariantSet アクタ内の アクタ バリアント と バリアント セット を定義することができます。それにより、情報が BP_Configurator ブループリントに渡されます。この情報を使用してユーザー インターフェースを動的に作成し、すべてのバリアント オプションをユーザー定義のサムネイル画像とともに表示します。
画像をクリックするとフルサイズで表示されます。
テンプレートを制御する
| コントロール | 説明 |
|---|---|
| Alt + マウスの左ボタンをクリック | 製品の周囲をカメラが回転します |
| Alt + マウスの右ボタンをクリック | ズームイン / ズームアウトします |
| G | インターフェースを表示 / 非表示にします |
| Escape | コンフィギュレータを終了します |
テンプレートの特徴
テンプレートは Variant Manager を使用します。これは、レベル内のアクタについてプロパティのさまざまな設定を整理し、LevelVariantSet アクタに格納する特別な UI です。
画像をクリックするとフルサイズで表示されます。
| 番号 | 説明 |
|---|---|
| 1 | バリアント |
| 2 | アクタ |
| 3 | プロパティ |
| 4 | 自動キャプチャプロパティを有効にします |
バリアント列にはバリアントと呼ばれるアクタ構成がすべて含まれ、バリアント セットとしてまとめられています。各バリアントはコンフィギュレータのオプションを表し、さまざまなプロパティ変更を持つ 1 つ以上のアクタを含めることができます。これらはユーザーが設定したサムネイル画像で表示されます。すべてのバリアントは、ランタイム時に BP_Configurator を介してインターフェースのボタンに変換されます。
Variant Manger の使用に関する詳細は、「Variant Manager」のドキュメントを参照してください。
BP_Configurator を使用する
BP_Configurator のブループリントは、指定した Level Variant Set からデータを取得し、コンフィギュレータのユーザー インターフェースを動的に作成します。
- BP_Configurator は指定した Level Variant Set からデータを取得します。
- 各バリアント セットは メインの UI ツールバーのアイコンに変換されます。
- 各バリアントは、そのバリアント セットのサブメニューのオプションになります。
- バリアントは、Variant Manager で設定されたサムネイルで視覚的に表示されます。
- バリアント セットは、現在有効なバリアントのアイコンで表示されます。
データのインポート方法
「Product Configurator」テンプレートのカスタマイズは、3D アートワークとテクスチャのインポートから開始します。Unreal Engine 5 では Datasmith に加え、Maya、3ds Max、Blender など使い慣れた 3D アプリケーションからのインポート用に FBX コンテンツ パイプライン もサポートしています。
コンテンツ ブラウザ に 3D および 2D アセットをインポートした後は、レベルからサンプルのギターを削除し、Variant Manager を使用してバリアントおよびバリアント セットをビルドする必要があります。最後にレベルのバリアント セットを BP_Configurator に接続して、ランタイム時にカスタムのユーザー インターフェースを作成します。
アートワークをメイン レベルに追加する
アセットを UE5 にインポートしてコンテンツ ブラウザでセットアップした後、サンプルのギターを削除して新しいアートをレベルに追加する必要があります。
画像をクリックするとフルサイズで表示されます。
画像をクリックするとフルサイズで表示されます。
Product Configurator では 1 つ以上のルート アクタを使用してスタティック メッシュの標準配置を提供します。
画像をクリックするとフルサイズで表示されます。
サンプル モデルを削除するには、GuitarRoot オブジェクトとその子オブジェクトをすべて削除します。
次に、新しい空のアクタをレベルに設置して新しいルート オブジェクトにします。レベルの原点 (X=0, Y=0, Z=0) を中心に配置します。
画像をクリックするとフルサイズで表示されます。
画像をクリックするとフルサイズで表示されます。
画像をクリックするとフルサイズで表示されます。
これにより、既存のカメラ設定の前に製品が配置されます。
次に、レベルに製品の要素をルート オブジェクトの子として配置します。
画像をクリックするとフルサイズで表示されます。
Variant Manager でバリアントを作成する
レベルにアートワークを設定したら、バリアントとバリアント セットを LevelVariantSet アクタと Variant Manager を使用して作成します。
BP_Configurator で作成した動的 UI が機能するためには、最初の 2 つのバリアント セットを環境とカメラに設定する 必要があります。
LevelVariantSet アクタは、コンテンツ ブラウザで右クリックして [Miscellaneous (その他)] サブメニューに移動し、[Level Variant Sets] オプションを選択して作成します。
画像をクリックするとフルサイズで表示されます。
画像をクリックするとフルサイズで表示されます。
画像をクリックするとフルサイズで表示されます。
一意の名前を付けてダブルクリックし、Variant Manager で開きます。
まず、カスタムのバリアント セットを作成します。[+Variant Set] ボタンをクリックして新しいセットに名前を付けます。
画像をクリックするとフルサイズで表示されます。
バリアント セットを作成したら、名前の横にある [Add (+)] ボタンをクリックしてバリアントを作成します。これは、ユーザーがこのプリセットを選択した場合に変更するアクタとプロパティです。
画像をクリックするとフルサイズで表示されます。
新しいバリアントをクリックしてハイライト表示し、次に [Actors] 列の [+] ボタンをクリックします。新しいウィンドウが開き、シーン内のすべてのアクタがリスト表示されます。ユーザーがこのバリアントを選択した時に変更するアクタを選択します。このプリセットに含めるアクタごとに、この作業を繰り返します。
画像をクリックするとフルサイズで表示されます。
次に、作業するアクタをハイライト表示して [Properties (プロパティ)] 列の [Add (+)] ボタンをクリックします。これにより、バリアントの一部として変更することができるすべてのアクタのプロパティが新しいウィンドウにリスト表示されます。バリアントが選択された場合に変更されるプロパティのチェックボックスをオンにします。
画像をクリックするとフルサイズで表示されます。
このリストには、デフォルトのプロパティとユーザーが定義したプロパティの両方が含まれます。上の画像では、[Env Map] プロパティが選択されています。このプロパティを変更すると、実行時に製品コンフィギュレータの環境を変更することができます。
最後に、プロパティの値を設定します。これは、2つの方法のいずれかで完了することができます。1 つ目は [Values (値)] 列を使用して値を手動で設定する方法です。
画像をクリックするとフルサイズで表示されます。
ボタンを使用してバリアントの現在の値を記録することで、レベルに設定されている値を使用してプロパティを設定することもできます。
もう 1 つは、 
ボタンを押してプロパティの自動キャプチャを有効にする方法です。このオプションを有効にすると、Variant Manager がレベル内のアクタに加えられた変更をリッスンし、選択したバリアントにそれを記録するようになります。変更されたアクタが選択しているバリアントにバインドされていない場合は、自動的にバインドされます。
バリアント セットの各バリアントにはサムネイルも必要です。これらのサムネイルはユーザー インターフェースのボタン アイコンとして使用されます。また、エンジンにインポートされたり UE4 ビューポートからキャプチャされるテクスチャ画像にもなります。バリアントを右クリックしてメニューを開きます。
画像をクリックするとフルサイズで表示されます。
すべてのバリアントとバリアント セットに対してこの作業を繰り返します。
BP_Configurator に接続する
テンプレートのカスタマイズ処理を完了するには、作成した Level Variant Set を BP_Configurator に接続する必要があります。まず、既存の LevelVariantSet アクタをレベルから削除し、自分で作成したものに置き換えます。アクタは BP_Configurator から確認できるようにレベル内に配置する必要があります。
画像をクリックするとフルサイズで表示されます。
[Details (詳細)] パネルでメニューの [Default (デフォルト)] セクションにある [LVSActor] オプションを選択し、ドロップダウンメニューを使用して設定を作成した Level Variant Set に変更します。
最後にコンフィギュレータをテストします。
画像をクリックするとフルサイズで表示されます。
画像をクリックするとフルサイズで表示されます。
画像をクリックするとフルサイズで表示されます。