How to Create a VTuber Studio with Three.js, React & VRM

In this tutorial, you'll learn what VRM avatars are and how to use them with React Three Fiber. In addition, we will use Mediapipe face recognition features to control our avatar eyes, face, and pose with our webcam! 🚀 Learn React Three Fiber with the Ultimate Guide to 3D Web Development ✨ https://wawasensei.dev/courses/react-... Demo 🔗 https://vrm.wawasensei.dev/ Starter code 🔗 https://github.com/wass08/r3f-vrm-sta... Final code 🔗 https://github.com/wass08/r3f-vrm-final #threejs #reactjs #reactthreefiber ▬▬▬▬▬▬ Useful L I N K S 🔗 ▬▬▬▬▬▬ Pixiv ThreeVRM https://github.com/pixiv/three-vrm VRoid Hub https://hub.vroid.com/en VRoid Studio https://vroid.com/en/studio Mixamo https://www.mixamo.com/ Kalidokit https://github.com/yeemachine/kalidokit Mediapipe Holistic https://ai.google.dev/edge/mediapipe/... React Three Fiber https://r3f.docs.pmnd.rs/getting-star... Threejs https://threejs.org/ ▬▬▬▬▬▬ 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:00 Introduction 00:01:31 What is a VRM 00:02:05 Starter Pack 00:03:02 Find VRM models 00:04:18 Load VRM with Three.js 00:08:31 Facial Expressions / MorphTargets 00:14:10 Play animations 00:20:39 Mediapipe face and pose tracking 00:24:23 Apply results to VRM with Kalidokit 00:30:16 Conclusion ▬▬▬▬▬▬ CREDITS ▬▬▬▬▬▬ Song: Blue Boi Composer: Lakey Inspired Website:    / lakeyinspired   License: Creative Commons (BY-NC 3.0) https://creativecommons.org/licenses/... Music powered by BreakingCopyright: https://breakingcopyright.com