Boids Flocking Simulation with Three.js & React

Published: 16 August 2024
on channel: Wawa Sensei
3,327
166

Learn how to build an amazing Boids Flocking Simulation landing page with Three.js and React Three Fiber

🚀 Learn React Three Fiber with my complete course ✨
https://lessons.wawasensei.dev/course...

Kirzozz 👸
  / kirzozz  

Live demo 🏖️
https://r3f-boids-final.vercel.app/

Starter pack 🔗
https://github.com/wass08/r3f-boids-s...

Final code 🔗
https://github.com/wass08/r3f-boids-f...

#threejs #webdevelopment #reactthreefiber

▬▬▬▬▬▬ Useful L I N K S 🔗 ▬▬▬▬▬▬

Convert fonts to Typeface
https://gero3.github.io/facetype.js/

Boids algorithm
https://www.red3d.com/cwr/boids/

React Three Fiber Examples
https://react-three-fiber.docs.pmnd.r...

GPGPU example
https://threejs.org/examples/?q=pgp#w...


▬▬▬▬▬▬ 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 Intro
00:00:44 Starter pack
00:01:51 Boundaries
00:05:19 Boids creation
00:09:27 Wandering
00:15:15 Limits
00:18:16 Small but fast!
00:20:10 Alignment
00:23:41 Separation
00:26:13 Cohesion
00:28:37 3 Dimensions
00:30:01 PostProcessing
00:33:30 Glassy Text
00:35:14 Going further
00:35:38 Thank you!


Watch video Boids Flocking Simulation with Three.js & React online without registration, duration hours minute second in high quality. This video was added by user Wawa Sensei 16 August 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 3,327 once and liked it 166 people.