空間コンピューティングの表現力を解き放つ、visionOS開発入門：『マテリアル』を見渡す

LODGE XR “Tech” Talk - visionOS
https://vrtokyo.connpass.com/event/368195/

マテリアルについてざっくり解説して、RealityKitのマテリアル全体を用途とともにご紹介しています。

動画の部分は以下のリンクからご確認いただけます
・35p CustomMaterial：https://youtu.be/tutsd3CZgt4?si=J_RlYuGGcUuRzzJX
・40p ShaderGraphMaterial：https://youtu.be/dpJbtAHzox8?si=NfUeDVCxUcWsP4So

#LODGEXRTechTalk

Transcript

1. 空間コンピューティングの表現力を解き放つ、 visionOS開発入門：『マテリアル』を見渡す LODGE XR “Tech” Talk - visionOS
2. SPEAKER Nao_RandD ᯅ / ナオランド @Nao_RandD • ⽇頃は iOS エンジニアとして働く • R&D 領域の取り組みで Apple Vision Pro 向けの開発に携わる • 3Dモデリングは visionOS 開発を キッカケに初めて触れる
3. 󰢐 話すこと 本日お話しする内容 • 3Dモデリングにおけるマテリア ルの入門的な解説 • RealityKit で扱えるマテリアル の種類 󰢄 話さないこと • Shader Graph などについて 踏み込んだ解説 • Blender や Unity, Unreal Engine など RealityKit 以外を 利用したケースの解説
4. iOSエンジニアの自分は思った
5. 3Dモデリングに出てくる 用語多すぎ rrrrrrrr 🙃
6. PBR Material Metalness Diffuse Color Rendering Normal Map Roughness Glossiness Specular Base Color Mesh Bump/Relief Emission Luminescence Texture Shader Lighting UV Refraction Iridescence IOR Fresnel Effect Collision 3D Modeling 😇
7. マテリアルから攻略してみる
8. マテリアルとは 3Dモデルの外観を定義してその表面が光とどのように 相互作用するかを定義する （Apple のドキュメントより抜粋）
9. マテリアルとは 3Dモデルの外観を定義してその表面が光とどのように 相互作用するかを定義する （Apple のドキュメントより抜粋） → 単に色だけではなく、質感など物質が持つ情報を付与する 色, 光沢, 粗さ, 金属度, 透明度, 発光 など
10. マテリアルとは 用語と物理的な表現との対応も知っておくと 󰢐 マテリアルの要素 キーワード 表現していること 色（アルベド） Albedo, Base Color, Diffuse Color 物体の基本的な色を表現する。拡散反射。 光沢（スペキュラ） Specular, Reflection 表面の光沢の強さや色を表現する。鏡面反射。 粗さ（ラフネス） Roughness 表面の滑らかさやザラザラ感を表現する。 金属度（メタリック） Metallic 金属・非金属を表現する。特有の光沢や色合い。 透明度（オパシティ） Opacity, Alpha, Transparency 物体の透明度を表現する。光の透過。 発光（エミッシブ） Emissive, Glow, Luminance 自ら光を放つ部分を表現する。 凹凸（法線） Normal, Bump 表面の細かな凹凸を視覚的に表現する。
11. RealityKit にあるマテリアルを 用途と合わせて丸っと把握する
12. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial RealityKit / Material, textures, and shaders： https://developer.apple.com/documentation/realitykit/scene-content- materials-and-shaders
13. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial
14. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial
15. 1. SimpleMaterial RealityKit で提供されるマテリアル 概要: • 基本的なマテリアルで、色やテクスチャ、 ライティングに対応 用途: • シンプルなオブジェクトの表現や、 パフォーマンスを重視したい時 • デバッグで位置を調整したい時 SimpleMaterial：https://developer.apple.com/documentation/realitykit/simplematerial
16. 1. SimpleMaterial RealityKit で提供されるマテリアル SimpleMaterial：https://developer.apple.com/documentation/realitykit/simplematerial
17. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial
18. 2. UnlitMaterial RealityKit で提供されるマテリアル 概要: • ライティングの影響を受けないマテリアルで 常に一定の外観を保つ • アンリット：陰影をつけない、光を処理しない 用途: • UI要素やアイコンなどライティングの影響を 受けたくないオブジェクトの表現したい時 UnlitMaterial：https://developer.apple.com/documentation/realitykit/unlitmaterial
19. 2. UnlitMaterial RealityKit で提供されるマテリアル UnlitMaterial：https://developer.apple.com/documentation/realitykit/unlitmaterial
20. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial
21. 3. PhysicallyBasedMaterial RealityKit で提供されるマテリアル 概要: • 物理ベースレンダリング（ PBR）に基づいた マテリアルで現実的な外観を再現 • 現実世界の物体に光が反射する様子を 忠実に再現するマテリアルの一種 用途: • 金属、プラスチック、木材などの質感を 持つオブジェクトを作成したい時 ノーマルマップを取り込んで凹凸による 陰影を表現するなど （_norとか名前に入ってるやつ。法線情報） PhysicallyBasedMaterial：https://developer.apple.com/documentation/ realitykit/physicallybasedmaterial
22. 3. PhysicallyBasedMaterial RealityKit で提供されるマテリアル PhysicallyBasedMaterial：https://developer.apple.com/documentation/ realitykit/physicallybasedmaterial
23. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial
24. 4. PortalMaterial RealityKit で提供されるマテリアル 概要: • ポータルエフェクトを実現するための マテリアルでの空間への入り口を表現 • ポータル：入り口。玄関 用途: • ユーザーが別のシーンや空間に移動する ためのポータル（入り口）を表現したい時 PortalMaterial：https://developer.apple.com/documentation/realitykit/portalmaterial
25. 4. PortalMaterial RealityKit で提供されるマテリアル PortalMaterial：https://developer.apple.com/documentation/realitykit/portalmaterial
26. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial
27. 5. VideoMaterial RealityKit で提供されるマテリアル 概要: • ビデオをテクスチャとして使用するマテリアルで AVPlayerと連携して動画を再生 用途: • 仮想スクリーンでの動画再生や 動的な背景の作成 VideoMaterial：https://developer.apple.com/documentation/realitykit/videomaterial
28. 5. VideoMaterial RealityKit で提供されるマテリアル VideoMaterial：https://developer.apple.com/documentation/realitykit/videomaterial
29. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial
30. 6. OcculusionMaterial RealityKit で提供されるマテリアル 概要: • 視覚的には表示されず他のオブジェクトを 隠すために使用 • オクルージョン: 遮蔽、覆い隠し 用途: • 仮想オブジェクトが現実世界のオブジェクトの 背後に隠れるような表現をしたい時 OcclusionMaterial：https://developer.apple.com/documentation/realityki t/occlusionmaterial
31. 6. OcculusionMaterial RealityKit で提供されるマテリアル OcclusionMaterial：https://developer.apple.com/documentation/realityki t/occlusionmaterial
32. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial
33. 概要: • Metal シェーダーを使用してマテリアルの外観や動作を カスタマイズできる 用途: • iOS で高度なマテリアルのカスタマイズが必要とする時 （例：特殊な視覚効果や独自のライティングモデル） 7. CustomMaterial RealityKit で提供されるマテリアル CustomMaterial：https://developer.apple.com/documentation/realitykit/custommaterial
34. 7. CustomMaterial RealityKit で提供されるマテリアル CustomMaterial：https://developer.apple.com/documentation/realitykit/custommaterial カスタムシェーダー（.metal ファイル）
35. 7. CustomMaterial RealityKit で提供されるマテリアル CustomMaterial：https://developer.apple.com/documentation/realitykit/custommaterial
36. 🚨 注意: • visionOS では使用できない • ShaderGraphMaterial（ + LowLevelMesh, LowLevelTexture ） を使う 7. CustomMaterial RealityKit で提供されるマテリアル
37. RealityKit で提供されるマテリアル 1. SimpleMaterial 2. UnlitMaterial 3. PhysicallyBasedMaterial 4. PortalMaterial 5. VideoMaterial 6. OcculusionMaterial 7. CustomMaterial 8. ShaderGraphMaterial
38. 8. ShaderGraphMaterial RealityKit で提供されるマテリアル 概要: • Material X のフォーマットに基づき ノードベースでカスタマイズする方法 • Reality Composer Pro の Shader Graph を 使用して作成するカスタムマテリアル 用途: • アニメーションのような時間変化する 波の表現やノイズなどのテクスチャを表現したい時 ◦ Swift コードから制御するパラメータから インタラクション性のある表現もできる ShaderGraphMaterial：https://developer.apple.com/documentation/realitykit /shadergraphmaterial
39. 8. ShaderGraphMaterial RealityKit で提供されるマテリアル Implementing adjustable material：https://developer.apple.com/documentation/visionOS/implementing-adjustable-material-in-vi
40. 8. ShaderGraphMaterial RealityKit で提供されるマテリアル Implementing adjustable material：https://developer.apple.com/documentation/visionOS/implementing-adjustable-material-in-vi
41. まとめ iOS エンジニアが visionOS 開発を始めることをきっかけに マテリアルから理解 を進めてみた お話したこと • マテリアルに関連する用語ごとにどの物理表現と対応するか整理した • RealityKit にあるマテリアル全体を把握できるように用途と 合わせて紹介した
42. ご清聴ありがとうございました 良い visionOS 開発を！ 🥽