UI テクスチャのカスタマイズは時間がかかり、マテリアル関数および設定に関する深い知識が必要です。 カスタム UI テクスチャをよりアクセスしやすくするため、Unreal Editor for Fortnite (UEFN) には一連のカスタマイズ性が高いテクスチャがあります。
UI マテリアル フォルダー
UI マテリアル フォルダーは、コンテンツ ブラウザの[Fortnite (フォートナイト)] > [UI (UI)] > [Materials (マテリアル)] にあります。
マテリアル フォルダーには以下の 2 種類の UI マテリアルがあります。
メーター マテリアル: 通常、ヘルスとシールドの測定に使用されます。 (詳細については、UI マテリアル コレクションを参照してください。)
テクスチャ: 通常、背景イメージとして、または UI アニメーションの中で使用されます。
以下のパラメータ カテゴリーに属すテクスチャ:
SDF テクスチャ | テクスチャ エフェクト | テクスチャ マスク |
アウトラインが不鮮明なテクスチャ形状。 以下の項目をカスタマイズするパラメータを設定できます。
テクスチャの回転とフェザリングも可能です。 | 9 つのカスタマイズ可能な特殊エフェクトがあるテクスチャ。 すべてのエフェクトは、パラメータ入力を使用してカスタマイズするマテリアル関数によってドライブされます。 | テクスチャ マスクは、入力を基づきテクスチャの一部を隠します。 以下の項目をカスタマイズできるパラメータを設定できます。
|
マテリアル インスタンスを作成する
UI フォルダーからテクスチャを使用するには、まずマテリアル インスタンスにする必要があります。 マテリアル インスタンスはマテリアルまたはテクスチャより使用メモリが少なく、利用可能なパラメータのため UMG でのカスタマイズ性がはるかに高くなっています。
パラメータは、マテリアルが特定の方法で動作するように操作する仕掛け関数または Verse コードによってバインドされるビュー モデルで操作されます。
マテリアルからマテリアル インスタンスを作成するには、以下の手順に従ってください。
[Project (プロジェクト)] > [Fortnite (フォートナイト)] > [UI (UI)] > [Materials (マテリアル)] フォルダーを開きます。
マテリアルを右クリックすると、ドロップダウン コンテキスト メニューが開きます。
ドロップダウン メニューから [Create Material Instance (マテリアル インスタンスを作成)] を選択します。
マテリアル インスタンスがメイン プロジェクト フォルダーで自動的に生成されます。
SDF テクスチャ
SDF テクスチャは、プレイヤーのデフォルト アバター アイコン イメージをオーバーライドするか、図像に使用できます。 SDF テクスチャには、アイコンのアピアランスの決定に使用するカスタマイズ可能なパラメータが数多くあり、アイコンを不鮮明または鮮明にし、グロー エフェクトを作成してアイコンがネオン サインなどのように見えるようにします。
テクスチャのパラメータは全て、UMG で ビュー モデルとともに使用でき、Verse フィールドを通して Verse コードで使用できます。 各種パラメータの使用について詳しくは、下表を参照してください。
基地
SDF テクスチャの基本パラメータ。
パラメータ | 説明 | GIF |
テクスチャ | ドロップダウン メニューから SDF テクスチャを選択します。 | |
カラー | テクスチャの色を選択します。 | |
グロー最大 | 形状のエッジのグローを増減させます。 値が 0 に近づくほど、形状のアウトラインがソリッド化します。 値が 1 に近づくほど、形状のアウトライン グローが増えます。 追加 GlowMax パラメータは、GlowMax 値に依存します。 | |
回転 | 中心からテクスチャを回転します。 値が 0.25 の場合、テクスチャが左に 90 度回転します。 値が -0.25 の場合、右に 90 度回転します。 | |
テクスチャ フェザリングの量 | GlowMax パラメータが使用されている場合、SDF テクスチャのエッジに対して強制するフェザリングの量を決定します。 値を上げるとフェザリングの量が増え、値を下げるとフェザリングの量が減ります。 |
シャドウカラー
テクスチャ シャドウのカラーを決定します。
パラメータ | 説明 | GIF |
シャドウ グロー最大 | テクスチャ シャドウのグローの量を決定します。 値が 0 に近づくほど、形状のアウトラインがソリッド化します。 値が 1 に近づくほど、形状のアウトライン グローが増えます。 | |
シャドウ オフセット X | X 軸に沿ったテクスチャ シャドウのオフセット量を決定します。 値を上げるとシャドウがテクスチャから離れます。 値を下げるとシャドウがテクスチャに近づきます。 | |
シャドウ オフセット Y | Y 軸に沿ったテクスチャ シャドウのオフセット量を決定します。 値を上げるとシャドウがテクスチャから離れます。 値を下げるとシャドウがテクスチャに近づきます。 | |
シャドウの不透明度 | テクスチャ シャドウの不透明度を決定します。 値が 1 に近いほど、選択されたカラーの不透明度が増えます。 値が 0 に近いほど、カラーの不透明度が減ります。 | |
シャドウ回転 | 中心からテクスチャ シャドウを回転します。 値が 0.25 の場合、テクスチャ シャドウが左に 90 度回転します。 | |
シャドウの厚さ | テクスチャ シャドウの厚さを決定します。 値を上げるとシャドウの厚さのサイズが増えます。 値を下げると厚さが減ります。 |
ストローク
テクスチャのストロークのアピアランスに影響するパラメータ。
パラメータ | 説明 | GIF |
内部ストローク カラー | テクスチャの内部ストロークのカラーを決定します。 | |
内部ストローク グロー最大 | テクスチャの内部ストロークの最大グロー量を決定します。 InnerStrokeGlowMax は GlowMax 値に依存します。 最大 GlowMax 値セットは、InnerStrokeGlowMax と OuterStrokeGlowMax の最大グロー値を決定します。 | |
内部ストロークの厚さ | 内部ストロークの厚さを決定します。 値を上げるとストロークの厚さが増え、値を下げると減ります。 | |
内部ストロークの厚さのグロー最大 | テクスチャの内部ストロークのグロー厚さを決定します。 値を上げるとストロークのグロー厚さが増え、値を下げるとテクスチャの内部ストロークのグロー厚さが減ります。 InnerStrokeThicknessGlowMax は GlowMax 値に依存します。 最大 GlowMax 値セットは、InnerStrokeGlowMax、InnerStrokeThicknessGlowMax、および OuterStrokeGlowMax の最大グロー値を決定します。 | |
外部ストローク カラー | 外部ストロークのカラーを決定します。 | |
外部ストローク グロー最大 | テクスチャの外部ストロークのグロー量を決定します。 値が 0 に近づくほど、形状のアウトラインがソリッド化します。 値が 1 に近づくほど、形状のアウトライン グローが増えます。 OuterStrokeGlowMax は GlowMax 値に依存します。 最大 GlowMax 値セットは、InnerStrokeGlowMax、InnerStrokeThicknessGlowMax、および OuterStrokeGlowMax の最大グロー値を決定します。 | |
外部ストロークの厚さ | テクスチャの外部ストロークの厚さを決定します。 値を上げるとストロークの厚さが増え、値を下げると厚さが減ります。 | |
外部ストロークの厚さのグロー最大 | テクスチャの外部ストロークのグロー厚さを決定します。 値を上げるとストロークのグロー厚さが増え、値を下げると減ります。 |
テクスチャ効果
テクスチャ エフェクトには、テクスチャのアピアランスをトランスフォームできるカスタマイズ可能なエフェクトが数多くあります。
タイル
ワープ
ピクセル化
バウンス
ハーフトーン
段付きグラデーション
その他
パラメータは、UMG で ビュー モデルとともミックスおよびターゲットでき、Verse フィールドを通して Verse コードでミックスおよびターゲットできます。 各種パラメータについて詳しくは、下表を参照してください。
基本テクスチャ
テクスチャの基本パラメータ。 ドロップダウン メニューからテクスチャを選択します。
パラメータ | 説明 | GIF |
テクスチャ | ドロップダウン メニューからテクスチャを選択します。 | |
タイリング X | X 軸に沿ってテクスチャをタイルします。 値が 1 の場合、テクスチャはタイルされません。 値が 1 を超えている場合、X 軸に沿ってタイルが追加されます。 このパラメータでイメージを完全にするには、整数が最適です。 | |
タイリング Y | Y 軸に沿ってテクスチャをタイルします。 値が 1 の場合、テクスチャはタイルされません。 値が 1 を超えている場合、Y 軸に沿ってテクスチャにタイルが追加されます。 このパラメータでイメージを完全にするには、整数が最適です | |
X を平行移動 | X 軸に沿ってテクスチャを移動します。 UMG 内の Sequencer で X を平行移動パラメータをターゲットすることでテクスチャをアニメーションできます。 | |
Y を平行移動 | Y 軸に沿ってテクスチャを移動します。 UMG 内の Sequencer で Y を平行移動パラメータをターゲットすることでテクスチャをアニメーションできます。 | |
平行移動速度 X | X 軸を越える平行移動の速度を決定します。 | |
平行移動速度 Y | Y 軸を越える平行移動の速度を決定します。 |
スケーリング
テクスチャのスケールとサイズを変更できるパラメータ。 テクスチャを叩くエフェクトを作成します。
パラメータ | 説明 | GIF |
スケーリング中である | テクスチャに対するスケーリング エフェクトを決定します。 このオプションは、他のスケーリング パラメータも使用されている場合にのみ表示されます。 | |
スケーリングの最大速度 | テクスチャに対するスケーリング エフェクトの最大速度を決定します。 | |
スケーリングの最小速度 | テクスチャに対するスケーリング エフェクトの最小速度を決定します。 | |
開始サイズ | アニメーションの開始時のテクスチャのサイズ。 | |
中間サイズ | アニメーションの中間のテクスチャのサイズ。 | |
終了サイズ | アニメーションの終了時のテクスチャのサイズ。 |
ワープ
テクスチャにワープ エフェクトを追加できるパラメータ。
アイコンのアピアランスを変更するには、IsWarping パラメータと合わせて追加ワープ パラメータを使用する必要があります。
パラメータ | 説明 | GIF |
ワープ中である | テクスチャに対するワープ エフェクトの量を決定します。 | |
振幅 X | X 軸に沿ってストレッチ エフェクトを適用します。 | |
振幅 Y | Y 軸に沿ってストレッチ エフェクトを適用します。 | |
周波数 X | X 軸に沿ってテクスチャに正弦波エフェクトを適用します。 | |
周波数 Y | Y 軸に沿ってテクスチャに正弦波エフェクトを適用します。 | |
ワープ速度 | テクスチャに対するワープ エフェクトの速さを決定します。 |
ピクセル化
テクスチャのアピアランスをピクセル化できるパラメータ。
パラメータ | 説明 | GIF |
ピクセル化されている | テクスチャにピクセル エフェクトを追加します。 値が 0 の場合、テクスチャにピクセル エフェクトは適用されません。 値が 1 の場合、テクスチャは完全にピクセル化されます。 | |
ピクセル数 | テクスチャが持っているピクセルの数を決定します。 値が 1 の場合、テクスチャが正方形になります。 さらにピクセルを追加するとピクセル化された形状が作成されます。 |
バウンス
テクスチャにバウンス エフェクトを追加できるパラメータ。
パラメータ | 説明 | GIF |
バウンス中 | エフェクトのバウンス エフェクトを決定します。 このオプションは、他のバウンス パラメータも使用されている場合にのみ表示されます。 | |
バウンス速度 | テクスチャがバウンスする速さを決定します。 | |
バウンス X | X 軸に沿って適用するバウンス エフェクトの量っを決定します。 | |
バウンス Y | Y 軸に沿って適用するバウンス エフェクトの量っを決定します。 |
ハーフトーン
テクスチャに対するコミック インク ドット エフェクトを作り出すパラメータ。
パラメータ | 説明 | GIF |
ハーフトーンである | エフェクトが使用中であるかどうかと、ハーフトーン エフェクトの不透明度を決定します。 値を上げるとエフェクトの不透明度が上がり、値を下げるとエフェクトの不透明度が下がります。 | |
ドット密度 | エフェクト内のドットの密度を上げます。 値を上げると、ドットの数が増え、ドットのサイズが小さくなります。 値を上げると、ドットの数が減り、ドットのサイズが大きくなります。 | |
ドット グロー最大 | ドット周囲に適用されたグローの最大量を決定します。 値が正の場合、ドットが星のようになります。値が負の場合、ドットが円のようになります。 | |
ドット グロー最小 | ドット周囲のグローの最小量を決定します。 この値を使用して、背景とドットのカラーを切り替えることができます。 値が 5 以上の場合、エフェクトが 1 つのカラーにフェードします。 同様に、値が -7 を下回るとエフェクトが 1 つのカラーにフェードします。 | |
ドット最大サイズ | ドットの最大サイズを決定します。 | |
ドット最小サイズ | ドットの最小サイズを決定します。 | |
グラディエント カラー 1 | ハーフトーン エフェクトのプライマリ カラーを決定します。 | |
グラディエント カラー 2 | ハーフトーン エフェクトのセカンダリ カラーを決定します。 | |
ハーフトーン パン速度 X | ドットが X 軸に沿って移動する速度を決定します。 | |
ハーフトーン パン速度 Y | ドットが Y 軸に沿って移動する速度を決定します。 | |
ハーフトーン回転 | ドットが移動する方向を回転します。 |
段付きグラデーション
テクスチャに段付きグラデーションを追加できるパラメータ。
これらのパラメータは、ティント カラー パラメータに依存します。
パラメータ | 説明 | GIF |
段付きグラデーションである | 段付きグラデーション エフェクトがテクスチャに適用されるかどうかを決定します。 | |
段付きグラデーションの量 | テクスチャに適用する段付きグラデーションの量を決定します。 このパラメータを機能させるには、値を 1.0 以下にして IsSteppedGradient を有効にする必要があります。 |
ティントカラー
これらのパラメータによって、テクスチャにカラーを追加してテクスチャに対するグラデーション エフェクトを作成できます。
パラメータ | 説明 | GIF |
ティント グラデーションの不透明度 | グラデーションのカラーの不透明度を決定します。 値を下げるとテクスチャの不透明度が下がり、値を上げるとマテリアルの不透明度が上がります。 | |
ティント カラー 1 | グラデーションの最初のカラーを決定します。 | |
ティント カラー 1 の位置 | グラデーションの最初のカラーの位置を決定します。 このオプションは、ティント グラデーション オン オプションが選択されており、値が設定されている場合にのみ機能します。 | |
ティント カラー 2 | グラデーションの 2 つ目のカラーを決定します。 | |
ティント カラー 2 の位置 | グラデーションの 2 つ目のカラーの位置を決定します。 値を上げると、グラデーションの開始位置が逆側に移動します。 値を下げると、2 つ目のカラーの選択のアピアランスが増加します。 このオプションは、ティント グラデーション オン オプションが選択されており、値が設定されている場合にのみ機能します。 | |
ティント カラー 3 | グラデーションの 3 つ目のカラーを決定します。 | |
ティント カラー 3 の位置 | グラデーションの 2 つ目のカラーの位置を決定します。 値を上げると、グラデーションの開始位置が逆側に移動します。 値を下げると、2 つ目のカラーの選択のアピアランスが増加します。 このオプションは、ティント グラデーション オン オプションが選択されており、値が設定されている場合にのみ機能します。 | |
ティント グラデーション オン | グラデーション エフェクトがテクスチャに適用されるかどうかを決定します。 | |
ティント グラデーション回転 | グラデーションの方向を回転します。 | |
ティント放射状グラデーション | グラデーションを放射状グラデーションに変更します。 | |
ティント放射状グラデーション サイズ | 放射状グラデーション サイズを決定します。 |
アルファ カラー
アルファがあるテクスチャに透明性、カラー、グラデーションを追加できるパラメータ。
パラメータ | 説明 | GIF |
アルファ不透明度 | テクスチャ上のアルファ カラーの不透明度を決定します。 値を下げるとテクスチャの不透明度が下がり、値を上げるとマテリアルの不透明度が上がります。 | |
アルファ カラー 1 | グラデーションの最初のカラーを決定します。 | |
アルファ カラー 1 の位置 | グラデーションの最初のカラーの位置を決定します。 このオプションは、アルファ グラデーション オン オプションが選択されており、値が設定されている場合にのみ機能します。 | |
アルファ カラー 2 | グラデーションの 2 つ目のカラーを決定します。 | |
アルファ カラー 2 の位置 | グラデーションの 2 つ目のカラーの位置を決定します。 値を上げると、グラデーションの開始位置が逆側に移動します。 値を下げると、2 つ目のカラーの選択のアピアランスが増加します。 このオプションは、アルファ グラデーション オン オプションが選択されており、値が設定されている場合にのみ機能します。 | |
アルファ カラー 3 | グラデーションの 3 つ目のカラーを決定します。 | |
アルファ カラー 3 の位置 | グラデーションの 3 つ目のカラーの位置を決定します。 値を上げると、グラデーションの開始位置が逆側に移動します。 値を下げると、3 つ目のカラーの選択のアピアランスが増加します。 このオプションは、アルファ グラデーション オン オプションが選択されており、値が設定されている場合にのみ機能します。 | |
アルファ グラデーション オン | グラデーションがテクスチャに適用されるかどうかを決定します。 | |
アルファ グラデーション回転 | グラデーションの方向を回転します。 | |
アルファ放射状グラデーション | グラデーションを放射状グラデーションに変えます。 | |
アルファ放射状グラデーション サイズ | 放射状グラデーション サイズを決定します。 |
テクスチャ マスク
テクスチャ マスクは、アイコンまたはプレイヤー アバターをマスクし、アイコンまたはアバター イメージにアウトライン要素を追加できるパラメータを使用します。
テクスチャ マスク マテリアルには、UMG で ビュー モデルとともに使用でき、また Verse フィールドを通して Verse コードで使用するカスタマイズ可能なパラメータが数多くあります。 各種パラメータの使用について詳しくは、下表を参照してください。
テクスチャ
テクスチャのアピアランスを決定するパラメータ。
パラメータ | 説明 | GIF |
テクスチャ | ドロップダウン メニューからテクスチャを選択します。 | |
テクスチャ アルファ | テクスチャのアルファ カラーを決定します。 1 値はホワイトです。 値が 1 以下の場合、ホワイト値が減り、背景カラーとブレンドされます。 | |
テクスチャの位置 X | X 軸に沿ってテクスチャを配置します。 | |
テクスチャの位置 Y | Y 軸に沿ってテクスチャを配置します。 | |
テクスチャのスケーリング X | X 軸に沿ってテクスチャをスケーリングします。 | |
テクスチャのスケーリング Y | Y 軸に沿ってテクスチャをスケーリングします。 |
埋める
背景に適用されたグラデーションの外観を決定するパラメータ。
パラメータ | 説明 | GIF |
カスタム フィル テクスチャ | ドロップダウン メニューからフィル テクスチャを選択します。 | |
フィル アルファ | マスクのアルファ カラーを決定します。 値が 1 の場合はホワイトになり、値が 1 以下の場合はホワイト値が減り、背景カラーとブレンドされます。 | |
フィル カラー 1 | グラデーションの最初のカラーを決定します。 | |
フィル カラー 1 のグラデーション位置 | グラデーションの最初のカラーの位置を決定します。 | |
フィル カラー 2 | グラデーションの 2 つ目のカラーを決定します。 | |
フィル カラー 2 のグラデーション位置 | グラデーションの 2 つ目のカラーの位置を決定します。 値を上げると、グラデーションの開始位置が逆側に移動します。 値を下げると、2 つ目のカラーの選択のアピアランスが増加します。 | |
フィル カラー 3 | グラデーションの 3 つ目のカラーを決定します。 | |
フィル カラー 3 のグラデーション位置 | グラデーションの 3 つ目のカラーの位置を決定します。 値を上げると、グラデーションの開始位置が逆側に移動します。 値を下げると、3 つ目のカラーの選択のアピアランスが増加します。 | |
フィル カラー放射状グラデーション サイズ | 背景上のグラデーションのサイズを決定します。 | |
フィル グラデーション タイプ | グラデーション タイプを放射状から線形に変更します。 | |
グロー | 背景のグロー量を決定します。 | |
線形グラデーション フィル回転 | 円の周囲のグラデーションを回転します。 LinearGradientFillRotation オプションは、FillGradientType オプションで設定された値に依存します。 | |
形状 | テクスチャ周囲のマスクの形状を決定します。 | |
形状回転 | テクスチャ周囲のマスク形状を回転します。 | |
形状サイズ | テクスチャ周囲のマスク形状のサイズを決定します。 | |
左下のコーナー半径 | このパラメータを変更すると、使用される値に基づき左下隅に丸みのあるコーナーを追加します。 | |
右下のコーナー半径 | このパラメータを変更すると、使用される値に基づき右下隅に丸みのあるコーナーを追加します。 | |
左上のコーナー半径 | このパラメータを変更すると、使用される値に基づき左上隅に丸みのあるコーナーを追加します。 | |
右上のコーナー半径 | このパラメータを変更すると、使用される値に基づき右上隅に丸みのあるコーナーを追加します。 |
アウトライン
マスク周囲のアウトラインのアピアランスを決定するパラメータ。
パラメータ | 説明 | GIF |
ギャップの太さ | アウトラインとテクスチャの間のギャップ サイズを決定します。 GapThickness オプションは、値が 0.40 以上に設定されている OutlineAlpha オプションに依存します。 | |
アウトライン アルファ | アウトラインのアルファ カラーを決定します。 値が 1 の場合はフル アルファ カラーとなり、値が 1 以下の場合はカラー値が減り、背景とブレンドされます。 | |
アウトライン カラー 1 | アウトライン グラデーションの最初のカラーを決定します。 | |
アウトライン カラー 1 の位置 | アウトライン グラデーションの最初のカラーの位置を決定します。 | |
アウトライン カラー 2 | アウトライン グラデーションの 2 つ目のカラーを決定します。 | |
アウトライン カラー 2 の位置 | アウトライン グラデーションの 2 つ目のカラーの位置を決定します。 | |
アウトライン カラー 3 | アウトライン グラデーションの 3 つ目のカラーを決定します。 | |
アウトライン カラー 3 の位置 | アウトライン グラデーションの 3 つ目のカラーの位置を決定します。 | |
アウトラインの太さ | アウトラインの太さを決定します。 |
テクスチャ マスク
テクスチャ マスクのアピアランスを変更するパラメータ。
パラメータ | 説明 | GIF |
マスク プレビューを表示 | マスク プレビューの不透明度を決定します。 値が 0 の場合はプレビューが表示されず、値が 1 の場合はマスクが完全に表示されます。 このパラメータは、MaskWidth および MaskHeight オプションの値が 0.0 より大きい場合にのみ表示されます。 | |
マスク位置 X | X 軸に沿ってマスクを配置します。 | |
マスク位置 Y | Y 軸に沿ってマスクを配置します。 | |
マスク高さ | マスクの高さを決定します。 | |
マスク幅 | マスクの幅を決定します。 |
スラント
背景およびマスク アウトラインに適用する傾斜の程度を決定するパラメータ。
パラメータ | 説明 | GIF |
傾斜 X | X 軸に沿って背景およびマスク アウトラインを傾斜させます。 | |
傾斜 Y | Y 軸に沿って背景およびマスク アウトラインを傾斜させます。 |