Using SwiftUI to Add 2D and 3D Content in Apple Vision Pro App | (Part 1/3) - Windows and Volumes

In this video, I’ll walk you through how to use SwiftUI to add 2D and 3D content to Windows and Volumes in your Apple Vision Pro apps. We’ll leverage SwiftUI’s Model3D and RealityView to create dynamic, immersive content for AR and VR experiences.
What you’ll learn in Part 1:
1. Adding 2D & 3D content to Windows & Volumes: Learn how to use SwiftUI's Model3D and RealityView to seamlessly integrate 3D models into your Vision Pro app.
2. Creating a portal effect in a card: Discover how to design a portal effect that lets users view alternate worlds through a card interface.
3. Lighting models using Image-Based Lighting (IBL): Understand how to apply IBL for realistic lighting on your 3D models.
4. Adding grounding shadows: Learn how to implement grounding shadows to make your 3D models feel connected to the environment.
GitHub Project:
Access the project code on GitHub:
github.com/sar...
Attributions:
3D Models by Kenchoo - sketchfab.com/...
"Branchiosaurus" (skfb.ly/oRqFu) by kenchoo is licensed under Creative Commons Attribution (creativecommons....
"Velociraptor Rebuilt" (skfb.ly/oRnop) by kenchoo is licensed under Creative Commons Attribution (creativecommons....
"Triceratop" (skfb.ly/oR6Vs) by kenchoo is licensed under Creative Commons Attribution (creativecommons....
"Trex2022" (skfb.ly/oRtyP) by kenchoo is licensed under Creative Commons Attribution (creativecommons....
"Stegosaurus Sf" (skfb.ly/oR9GL) by kenchoo is licensed under Creative Commons Attribution (creativecommons....
Music: BMO by Dyalla
Stay Tuned for More!
In Part 2 of this series, I’ll explore adding 2D and 3D content to Immersive Spaces. And in Part 3, we’ll put it all together in the Find A Dino Experience, where you’ll use a portal magnifying glass to search for dinosaurs around you. Make sure to subscribe and hit the bell icon so you don’t miss out when the next videos go live!
#SwiftUI #AppleVisionPro #SpatialComputing #ARDevelopment #VRDevelopment #MixedReality #RealityView #Model3D #Portal #GameDevelopment #AR #VR #XR #SwiftUITutorial #ImmersiveSpaces #Tutorial #AugmentedReality #VirtualReality #VisionProDevelopment #AppleVisionProDevelopers #VisionProApps #VisionPro #RealityComposerPro #appledeveloper #iosdevelopment #swift #AppDevelopment #appledev #RealityComposer

[@Nealcar30489]

Amazing video and project. Love your videos, please keep it up.

[@guacamole456]

This is a great, well-produced video. I need to try to build this project. Thanks.

[@chrischeng1879]

Great tutorial!

[@swapnilgupta_xi]

please keep making more

[@mannychop]

legend

[@zeroh_chill2966]

I tried to subscribe. But I already was 😂 I need to turn on your notifications cause you make some amazing content that’s so easy to follow. Like your portal video. One thing to note though, this is the first time I’ve found a video that’s so descriptive on IBL. I know real world lighting ads to the effect of what you’re viewing but in my case, I don’t want that. A lot of the time I want lighting at night to view my models and my local lighting (lamps and such at night or hotel) doesn’t have sufficient lighting and it’s always been a problem. Polycam, for example, gives us the option to turn a light on/off. Can you share a video on how to do this? Or maybe at least some info on it? And lastly, in polycam again, they have a unique loading animation that’s like a ball of sand that’s really amazing to watch. Do you have any idea on how that’s created?

[@sarangborude8260]

That is exactly what Environment lighting is doing. I cover it at the 17 minute mark at the video. You light the scene with the IBL texture loaded as an environment resource. Using this you can light your models with the IBL. If you need is to toggle it on or off, then you can simply remove the ImageBasedLightComponent and ImageBasedLightReceiverComponent from your entity and that should toggle it off. I haven't tested this though.
This video from WWDC 23 developer.apple.com/videos/play/wwdc2023/10095/ also covers it at the beginning in the lighting and shadows part, but it covers how to replace the system IBL with your own IBL but I believe it still uses ARKit generated environment probe texture that you cannot replace.