WWDC Quick Look 💓 By SwiftGGTeam
中文 EN 日本語
Explore materials in Reality Composer Pro

Explore materials in Reality Composer Pro

RealityKitReality Composer ProMaterialXShader GraphvisionOS
元の動画を見る

ハイライト

Reality Composer Pro のシェーダー グラフ エディターを使用すると、開発者は Metal コードを書かずにビジュアル ノード グラフを介して MaterialX 標準 ShaderGraphMaterial を作成し、地形の輪郭や動的な幾何学的変形などの複雑なマテリアル エフェクトを実現できます。

主要内容

3D 開発を行う場合、マテリアルは常に問題点です。以前は、iOS でカスタム マテリアルを作成するには、Metal を使用してシェーダー コードを手書きする必要がありました。これはプログラマーにとって敷居が高く、アーティストが参加することはほぼ不可能です。

visionOS では、新しいマテリアル システムが導入されています。これは、2012 年に Industrial Light and Magic (ILM) によって作成されたマテリアル X オープン スタンダードに基づいており、マテリアルの作成を ShaderGraphMaterial を介した視覚的な操作に変えます。

Shader Graph エディタは Reality Composer Pro に直接組み込まれています。アーティストはノードをドラッグし、線を接続し、パラメータを調整し、3D ビューポートで効果をリアルタイムで確認できます。プログラマーはマテリアルを Xcode にエクスポートし、Swift コードを通じて動的に制御できます。

この分業により、長年のコラボレーションの問題が解決されます。アーティストは視覚効果を担当し、プログラマーはインタラクション ロジックを担当し、双方がお互いを待つ必要がありません。

マテリアルの基本

visionOS のマテリアルは物理レンダリング (PBR) に基づいています。 (01:29)

PBR マテリアルは、現実世界の物理特性を使用して、金属性や粗さなどの外観を定義します。反射率を40%に設定したシンプルなブルーの球体は、ベーシックな光沢感を与えます。カラーと粗さのマップを適用して、リアルな具体的な効果を作成します。金属性を高めて鉄の質感をシミュレートします。

ShaderGraphMaterial は 2 つのシェーダ タイプをサポートします。

  • 物理ベース: 基本的な PBR シェーダー。単純なシーンに適しており、各属性を定数値またはテクスチャで構成します。
  • カスタム: 完全にカスタマイズ可能なコントロール、アニメーション、幾何学的変形、特殊な表面効果をサポート

（02:51）

コンターマテリアル実戦

この講演では、ヨセミテ渓谷の地形モデルを使用して、等高線マテリアルを最初から作成する方法を説明します。 (04:02)

アイデアはシンプルです。地形の高さに基づいて、特定の標高に線を引きます。具体的な方法は、positionノードで描画位置の3D座標を取得し、別ノードでY軸(高さ)を抽出し、moduloノードで一定間隔で高さを切り出し、最後にifgreaterノードで現在の高さが等高線幅内に収まっているかどうかを判断し、地形色を表示するか線色を表示するかを決定します。

ノード グラフの接続方法は非常に直感的です。

Position → Separate 3(Y) → Modulo(÷0.1) → IfGreater(>0.002)
                                              ↓
                                        Surface Diffuse Color

（06:33）

ノードグラフの再利用

マテリアルが複雑になると、ノード グラフがわかりにくくなります。 Reality Composer Pro は、ノードのグループを再利用可能なノードにパッケージ化できる Compose Node Graph 機能を提供します。 (10:28)

パッケージ化されたノードはインスタンスを作成できます。インスタンスは、元のノードの変更をリアルタイムで同期します。元のノードに Spacing 入力と Color 入力を追加すると、すべてのインスタンスがこれらの入力も自動的に取得します。

この機能は、マテリアル デザインにモジュラー思考をもたらします。よく使用されるエフェクト (輪郭、ノイズ、グラデーションなど) をノード ライブラリにパッケージ化し、さまざまなプロジェクトで再利用できます。

ジオメトリ デフォーマ

ジオメトリ モディファイアは、カスタム シェーダの高度な機能です。サーフェイスシェーダーのようにピクセルカラーを変更するだけではなく、モデルの頂点位置を直接移動させます。 (13:18)

このスピーチは衝撃的な効果を示しました。平らな円盤から始まり、高さマップ データを使用して頂点を上げ、ヨセミテ バレーの地形をリアルタイムで生成しました。次に、ミックス ノードを使用して 2 つの高さマップ、法線マップ、およびカラー マップのセットを混合し、2 つの地形間のスムーズな移行を実現します。

重要な手順は、プロモート コマンドを使用して、ブレンド パラメータをマテリアルのカスタム入力にプロモートすることです。このようにして、Swift コードはトランジションの進行状況をリアルタイムで制御し、アニメーション効果を作成できます。 (18:43)

詳細

ShaderGraphmaterial のコア ノード

シェーダーグラフエディターのノードは機能ごとに分類されています。マテリアルを作成するときに最もよく使用されるカテゴリ:

入力ノード -Position: モデル空間またはワールド空間内の現在のレンダリング ポイントの 3D 座標を返します。 -Normal: 表面法線ベクトル -Texture Coordinates:UV座標

数学ノード -Separate 3: vec3 を 3 つの float コンポーネントに分割します。 -Combine 3: 3 つの float を vec3 に結合します。 -Modulo: モジュロ演算 -Remap: 値をある範囲から別の範囲にマッピングします。 -Mix: 2 つの値の間を線形補間します。

論理ノード -IfGreater: 2 つの入力を比較し、その結果に基づいて異なる値を出力します。

画像ノード -Image: テクスチャ マップを読み取り、カラー マップ、高さマップ、法線マップなどをサポートします。

（06:57）

Swift からマテリアルパラメータを制御する

Reality Composer Pro では、シェーダーで定数値を選択し、右クリックして [プロモート] を選択し、それをマテリアルのプログラム可能な入力に変換します。これらの入力は、次を介して Swift に渡されます。ShaderGraphMaterialインターフェースアクセス。

import RealityKit

// 假设 material 是从 Reality Composer Pro 导出的 ShaderGraphMaterial
if var material = model.materials.first as? ShaderGraphMaterial {
    // 设置名为 "progress" 的自定义输入
    try material.setParameter(name: "progress", value: .float(0.5))
    model.materials = [material]
}

キーポイント:

  • ShaderGraphMaterialこれは、visionOS でマテリアルをカスタマイズする唯一の方法であり、CustomMaterial
  • setParameter(name:value:)マテリアル入力を変更するために使用されます。パラメータ名は、Reality Composer Pro で定義された入力名と一致している必要があります。
  • 値型の場合.float()、.color()、.texture()など列挙ラッパー
  • マテリアルを変更した後、モデルに再割り当てする必要があります。materials配列が有効になります

ジオメトリック デフォーマの実装の詳細

ジオメトリ デフォーマには、サーフェス シェーダよりも 1 つ多いノード グラフがあります。Geometry Modifierサーフェスノード。その中心的な入力は、Model Position Offset、モデル空間内の頂点の変位ベクトルを表します。 (15:23)

地形生成ノード チェーン:

Height Map(Image) → Combine 3(X:0, Y:height, Z:0) → GeometryModifier.ModelPositionOffset
Color Map(Image) → Surface.BaseColor
Normal Map(Image) → Remap(0..1 to -1..1) → Surface.Normal

（16:15）

キーポイント:

  • 高さマップは通常、浮動小数点の高さ値を EXR 形式で保存します。これは通常の画像の 8 ビットよりも正確です。
  • 頂点を移動した後は法線を更新する必要があります。そうしないと、照明の計算が間違ってしまいます。
  • 法線マップの値の範囲は 0..1 ですが、シェーダで使用できるようにするには、これを -1..1 に再マップする必要があります。
  • アルゴリズム ラインは、特に地形の詳細が豊富な場合、高さマップから法線をリアルタイムで計算するよりも正確であることが期待されます。

地形遷移アニメーションの完全なノード構造

2 つの地形間の遷移には、高さ、色、法線を混合するための 3 セットの混合ノードが必要です。

Yosemite Height → Mix → Combine 3 → GeometryModifier
Catalina Height →    ↑
                     progress (0..1)

Yosemite Color → Mix → Surface.BaseColor
Catalina Color →    ↑
                    progress

Yosemite Normal → Mix → Remap → Surface.Normal
Catalina Normal →    ↑
                     progress

（18:01）

バンドルprogressマテリアル入力に昇格したらSwiftで使用しますTimerまたはAnimation値を継続的に変更することで、滑らかな地形変形アニメーションを実現できます。

重要ポイント

1.リアルタイム地形視覚化ツール やるべきこと: 任意の高さマップをロードし、3D 地形をリアルタイムでレンダリングできるvisionOS アプリを作成します。 実行する価値がある理由: シェーダー グラフを使用すると、地形レンダリングに手書きのメタル シェーダーが必要なくなり、数時間でプロフェッショナルな結果を生み出すことができます。 開始方法: Reality Composer Pro を使用してディスク モデルを作成し、イメージ ノードを接続して高さマップを読み取り、ジオメトリ モディファイアを使用して頂点を上げます。 Diorama サンプル コードのマテリアル構造を参照してください。

2.インタラクティブなマテリアル表示 やるべきこと: ユーザーが金属性、粗さ、色などのパラメーターを調整し、PBR 効果の変化をリアルタイムで確認できる 3D マテリアル ライブラリを作成します。 価値がある理由: PBR パラメータは多くの開発者にとって抽象的であり、インタラクティブなツールにより学習を迅速化できます。 開始方法: Reality Composer Pro で複数の物理ベースのマテリアルを作成し、主要なパラメータを入力としてプロモートします。 SwiftUIのスライダーへのバインドShaderGraphMaterial.setParameter()。

3.動的なデータドリブンの 3D チャート 機能: リアルタイム データ (株価動向、気象データなど) を 3D 幾何学的形状にマッピングします。 実行する価値がある理由: ジオメトリ モディファイアは、データ値に応じてモデルの形状をリアルタイムで変更できるため、通常の 2D チャートよりも大きな影響を与えます。 開始方法: 平面メッシュをベース ジオメトリとして使用し、データ値を高さマップとして Image ノードに渡し、Swift コードを介してフレームごとにデータ テクスチャを更新します。

4.モジュラーマテリアルアセットライブラリ 内容: よく使用されるシェーダー エフェクト (水の波、炎、金属の酸化) を再利用可能なノード グラフにカプセル化し、チーム内の内部またはオープンソースのマテリアル パックとして公開します。 実行する価値がある理由: Compose Node Graph + Instance により、マテリアルに真のモジュール性が与えられるため、チームはマテリアル アセットを共有して反復できます。 開始方法: Reality Composer Pro でエフェクトをデザインし、関連するノードを選択します。ノード グラフを構成し、エクスポートします。.usdaこのファイルは他のプロジェクトから参照できます。

関連セッション

コメント

GitHub Issues · utterances