Dilmer Valecillos | WebXR Tutorial: BUILD A Mixed Reality Game In Mattercraft Using Realtime Physics! @dilmerv | Uploaded June 2024 | Updated October 2024, 7 hours ago.
In today's video, we're going to create a Mixed Reality (MR) game from the ground up using WebXR in Mattercraft.
❤️ Support on Patreon: patreon.com/dilmerv
🔔 Subscribe for more XR Tutorials : youtube.com/@dilmerv?sub_confirmation=1
🐦 Twitter X: twitter.com/dilmerv
👥 Discord : discord.gg/dNMHBc8KdP
📸 Instagram : instagram.com/dilmerv
Mattercraft allows us to maintain a single codebase and run the same MR experience on Apple Vision Pro, Meta Quest 3, Zapbox + iPhone, and Magic Leap 2. We'll begin by experimenting with the new WebXR physics, which will enable us to create a fun slingshot mechanic and a target for our mini game.
📌 In this second Mattercraft video, we'll be working on the following areas:
- Creating the WebXR Project by using the Headsets & VR Templates
- Creating A Slingshot Mechanic (SlingshotGrabber.ts typescript behavior)
- Creating A Ball Factory / or in other words A Ball Spawner (BallSpawner.ts typescript component)
- Creating Target (SlingshotTarget.ts typescript behavior)
- Creating A Simple Score System (GlobalContext.ts typescript context)
- Creating A Simple Environment & various physical objects (Havok Physics)
📚 Video Chapters:
00:00 - Intro To Mixed Reality Project WebXR Tools
00:44 - Overview of WebXR New Features Covered Today With Mattercraft
01:00 - Creating A New WebXR Project & Setup Of Physics Dependency
03:41 - Setting Up Controllers / Hands With Grab Interactions
06:11 - Adding Shapes, Setting Up Shapes Rigidbodies, And Colliders
12:16 - Setting Up Slingshot Ball Component
17:34 - Setting Up Ball Factory
38:01 - Testing Ball Factory Physics Within Mattercraft Viewer And Apple Vision Pro
38:30 - Setting Up Slingshot Component And Slingshot Grabber Behavior
50:20 - Testing Slingshot Mechanic With Meta Quest 3 And Zapbox
51:03 - Setting Up Target And Slingshot Target Behavior
53:44 - Creating A UIVisualizer To Bind UI And Audio Manager
54:25 - Testing Our Final WebXR Mixed Reality Project
56:08 - Outro
💻 Full Project Source Code And Docs Available From GitHub: github.com/dilmerv/SlingshotMRGame
📢 Recommended:
👉 If you missed the previous Mattercraft WebXR video then be sure to watch it from: youtu.be/1y40Y3wdpCY
👉 Get started with Mattercraft IDE by signing-up at: bit.ly/3VSmruD
👉 Get Started With AR/VR By Using 🕶️ Zapbox: zapbox.io/?via=dilmer (affiliate link)
ℹ️ Resources:
👉 Mattercraft WebXR Developer Docs: docs.zap.works/mattercraft/getting-started
👉 Mattercraft WebXR Animation System Docs: docs.zap.works/mattercraft/animation-system
👉 Mattercraft WebXR Scripting (very helpful): docs.zap.works/mattercraft/scripting
Huge thanks to @ZapparApp for sponsoring this WebXR video.
🥽 Learn & Get my XR Training from:
learnxr.io
👉 My Blog / 🔥 Newsletter (Subscribe to get up to date XR news)
blog.learnxr.io
#webxr #applevisionpro #quest3
In today's video, we're going to create a Mixed Reality (MR) game from the ground up using WebXR in Mattercraft.
❤️ Support on Patreon: patreon.com/dilmerv
🔔 Subscribe for more XR Tutorials : youtube.com/@dilmerv?sub_confirmation=1
🐦 Twitter X: twitter.com/dilmerv
👥 Discord : discord.gg/dNMHBc8KdP
📸 Instagram : instagram.com/dilmerv
Mattercraft allows us to maintain a single codebase and run the same MR experience on Apple Vision Pro, Meta Quest 3, Zapbox + iPhone, and Magic Leap 2. We'll begin by experimenting with the new WebXR physics, which will enable us to create a fun slingshot mechanic and a target for our mini game.
📌 In this second Mattercraft video, we'll be working on the following areas:
- Creating the WebXR Project by using the Headsets & VR Templates
- Creating A Slingshot Mechanic (SlingshotGrabber.ts typescript behavior)
- Creating A Ball Factory / or in other words A Ball Spawner (BallSpawner.ts typescript component)
- Creating Target (SlingshotTarget.ts typescript behavior)
- Creating A Simple Score System (GlobalContext.ts typescript context)
- Creating A Simple Environment & various physical objects (Havok Physics)
📚 Video Chapters:
00:00 - Intro To Mixed Reality Project WebXR Tools
00:44 - Overview of WebXR New Features Covered Today With Mattercraft
01:00 - Creating A New WebXR Project & Setup Of Physics Dependency
03:41 - Setting Up Controllers / Hands With Grab Interactions
06:11 - Adding Shapes, Setting Up Shapes Rigidbodies, And Colliders
12:16 - Setting Up Slingshot Ball Component
17:34 - Setting Up Ball Factory
38:01 - Testing Ball Factory Physics Within Mattercraft Viewer And Apple Vision Pro
38:30 - Setting Up Slingshot Component And Slingshot Grabber Behavior
50:20 - Testing Slingshot Mechanic With Meta Quest 3 And Zapbox
51:03 - Setting Up Target And Slingshot Target Behavior
53:44 - Creating A UIVisualizer To Bind UI And Audio Manager
54:25 - Testing Our Final WebXR Mixed Reality Project
56:08 - Outro
💻 Full Project Source Code And Docs Available From GitHub: github.com/dilmerv/SlingshotMRGame
📢 Recommended:
👉 If you missed the previous Mattercraft WebXR video then be sure to watch it from: youtu.be/1y40Y3wdpCY
👉 Get started with Mattercraft IDE by signing-up at: bit.ly/3VSmruD
👉 Get Started With AR/VR By Using 🕶️ Zapbox: zapbox.io/?via=dilmer (affiliate link)
ℹ️ Resources:
👉 Mattercraft WebXR Developer Docs: docs.zap.works/mattercraft/getting-started
👉 Mattercraft WebXR Animation System Docs: docs.zap.works/mattercraft/animation-system
👉 Mattercraft WebXR Scripting (very helpful): docs.zap.works/mattercraft/scripting
Huge thanks to @ZapparApp for sponsoring this WebXR video.
🥽 Learn & Get my XR Training from:
learnxr.io
👉 My Blog / 🔥 Newsletter (Subscribe to get up to date XR news)
blog.learnxr.io
#webxr #applevisionpro #quest3
