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!


On this page of the site you can watch the video online Boids Flocking Simulation with Three.js & React with a duration of hours minute second in good quality, which was uploaded by the user Wawa Sensei 16 August 2024, share the link with friends and acquaintances, this video has already been watched 3,327 times on youtube and it was liked by 166 viewers. Enjoy your viewing!