Create an Infinite 3D Gallery with Three.js & VIVERSE

Learn how to build a collaborative 3D photo booth world where users can create and share avatar photos in an infinite gallery! In this tutorial, we'll use React Three Fiber and deploy with VIVERSE's free platform. What you'll learn: Setting up an interactive 3D gallery with React Three Fiber Implementing customizable avatars with poses and accessories Creating a photo booth experience with backgrounds and props Using VIVERSE SDK for authentication, physics, avatars, and leaderboard features Deploying your 3D web experience to VIVERSE with the CLI Building collaborative features with built-in physics and leaderboards 🚀 VIVERSE Platform (Sponsor): VIVERSE provides a free platform for publishing interactive 3D web experiences with zero gatekeeping. Their pmndrs/viverse library gives you instant access to authentication, avatars, physics, and more for both vanilla Three.js and React Three Fiber projects. 🎮 Final Demo: https://worlds.viverse.com/UxpTMPd 📦 Source Code: https://github.com/wass08/r3f-wawa-ph... 🔗 Starter code: https://github.com/wass08/r3f-vite-st... 🚀 Learn React Three Fiber with the Ultimate Guide to 3D Web Development ✨ https://wawasensei.dev/courses/react-... #threejs #js #viverse ▬▬▬▬▬▬ 📚 RESOURCES ▬▬▬▬▬▬ VIVERSE SDK https://pmndrs.github.io/viverse/gett... VIVERSE Studio https://studio.viverse.com/ VIVERSE Platform https://www.viverse.com/ PocketBase https://pocketbase.io/ VRM Bones List https://pixiv.github.io/three-vrm/doc... Threejs https://threejs.org/ React Three Fiber https://r3f.docs.pmnd.rs/getting-star... ▬▬▬▬▬▬ Support the channel 🙏 ▬▬▬▬▬▬ Become a member to get access to awesome perks:    / @wawasensei   ▬▬▬▬▬▬ Connect with me 👋 ▬▬▬▬▬▬ 💻 The Discord Community   / discord   📸 Instagram :   / wawa.sensei   🎎 Facebook :   / wawasenseiyt   🐦Twitter :   / wawasensei   🐦TikTok :   / wawasensei08   ▬▬▬▬▬▬ T I M E S T A M P S ⏰ ▬▬▬▬▬▬ 00:00 Introduction 01:15 Project Starter 01:43 VIVERSE SDK 03:45 Publishing to VIVERSE 05:47 Avatar creation & selection 10:48 Login button 12:16 Infinite Grid System 17:36 Pocketbase Photos Storage 21:24 Generating & Saving Photos 26:28 Gallery Room 28:12 Picture Materials 32:34 Frame Colliders 37:13 Photo Booth 41:10 Custom Animation Poses 43:48 Attaching Items to Bones 47:26 High Score Leaderboard 51:53 Going Further 52:58 Conclusion