Make a beautiful Bubble Shader for Apple Vision Pro | Reality Composer Pro Shader Graph Tutorial
ฝัง
- เผยแพร่เมื่อ 9 ก.พ. 2025
- Welcome to a comprehensive tutorial on creating mesmerizing bubble shaders for your Apple Vision Pro app using Reality Composer Pro Shader Graph! This video is perfect for developers looking to enhance their apps with visually captivating effects. Follow along as I guide you through each step, ensuring your shaders are both beautiful and efficient.
In this tutorial, you’ll learn:
1. Creating a Bubble Material:
• Step-by-step process for designing a bubble shader using the Shader Graph in Reality Composer Pro.
2. Organizing Node Graphs:
• Techniques to clean up your shader graph spaghetti, ensuring a tidy and efficient workflow.
3. Exposing Shader Parameters:
• How to expose parameters of the shader, allowing for manipulation in code to create dynamic effects.
4. Adding Interactivity:
• Integrate spatial tap gesture to pop bubbles and animate shader parameters, adding an interactive element to your app.
By the end of this video, you’ll have a complete understanding of how to create, organize, and manipulate bubble shaders, making your Apple Vision Pro app more engaging and visually stunning.
📂 GitHub Repository: Access the project files and follow along with the tutorial by visiting our GitHub repository: github.com/sar...
🔔 Don’t forget to like, subscribe, and hit the bell icon to stay updated with my latest tutorials!
Hashtags: #AppleVisionPro #RealityComposerPro #ShaderGraph #BubbleShaders #ARDevelopment #VRDevelopment #AppDevelopment #InteractiveShaders #ShaderTutorial #TechTutorials #3DGraphics #visionpro #visionos #shadertutorial #Shader #shadergraph #procedural #ar
Music from #Uppbeat (free for Creators!):
Fugu Vibes - Spatial
uppbeat.io/t/f...
License code: W7XGUCITVDPADJDA
You make SUCH great videos and I just wanted to say *THANK YOU*
Keep going with the tutorials! You rock man!
Such a great video - you covered so many areas.
awesome work. will include it in our newsletter and sent it to my dev team to watch
this is awesome!!!
INCREDIBLE! Please keep up the avp rcp tutorials.
loved this video, which camera you are using, love to see more videos and playlist for beginner !
IPhone 15 pro max
Hey! This is great! Can we use this to make a transparent glass material?
@@marcesmack sadly we cannot right now as we don’t have access to camera texture in shader graph
Does this tutorial also apply for regular RealityKit Apps? If I'm not mistaken, Reality Composer Pro now also supports creating content for regular mobile AR apps, but I'm not sure.
Most of it will apply. ArKit part will be slightly different but will work with some changes. There is a session in WWDC 24 on making cross device apps with reality kit that will have good pointers to what should be different. As is the Reality Composer pro scene is directly portable
Awesome! Thank you so much for clarifying!
Very good video - You cover a lot of ground, thank you! (maybe i'd take the music down, or way down though)
Noted!
for some reason i can't directly edit the values on the nodes, only in the inspector. Do you know where the setting for this might be to enable that? Thank you so much
There is no setting to enable that. You will have to be on XCode 16 i believe.
If you make soap bubbles mushy custom in blender, customization will be lost in reality comps, what should I do about this? Please let me know.
So there are 2 approaches.
1. In the final outputs node there is a custom geometry modifier. You can use the same strategy of using noise and multiplying it with the surface normals and the adding that to the position of each vertex. Animating the noise with time will make the bubble wobbly.
2. You can look in to the low level mesh API introduced in vision OS2 xcode 16.
Here is a talk that goes in depth about it.
Check out this video at 14 min mark
developer.apple.com/videos/play/wwdc2024/10104/
If you want to do it in blender then you will have to export the animation and play the animation files in realitykit but i am not sure how to export the morphing mesh animation from blender
And if I give the lighting from the blender and then go to the reality component, the quality gets too low, so how can I make this work as well?
If you want to get lighting from blender. I will suggest you bake the lighting from blender scene and export it as an IBL. This video explains it at the 1 minute mark about how you can use a custom ibl instead of the system one.
developer.apple.com/videos/play/wwdc2023/10095/
With vision OS 2 realitykit api there is also things that you can do with dynamic lighting
Check out this video around 17:45 mark
developer.apple.com/videos/play/wwdc2024/10103/