Coding Challenge #56: Attraction and Repulsion Forces

Subscribers:
1,750,000
Published on ● Video Link: https://www.youtube.com/watch?v=OAcXnzRNiCY



Duration: 45:13
105,947 views
1,901


In this challenge, I create a particle system and add "attractors" simulating attraction and repulsion forces. Code: https://thecodingtrain.com/challenges/56-attraction-and-repulsion-forces

๐Ÿ•น๏ธ p5.js Web Editor Sketch: https://editor.p5js.org/codingtrain/sketches/6WL2O4vq0

๐ŸŽฅ Previous video: https://youtu.be/f5QBExMNB1I?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
๐ŸŽฅ Next video: https://youtu.be/ZiYdOwOrGyc?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
๐ŸŽฅ All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH

Videos:
๐Ÿš‚ Vectors Video: https://youtu.be/vqE8DMfOajk
๐Ÿš‚ Gravitational Attraction: https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/2-forces/5-gravitational-attraction
๐Ÿ”ด Live Stream #76: https://youtu.be/OkkjlHTdLGI?t=4692

Timestamps:
00:00 Introduction to the Challenge!
02:31 Explanation of Gravitational Attraction
05:04 Create a particle and an attractor
07:26 Add physics to the particles
11:09 Explanation of force and Newton's Second Law
13:04 Create the attraction force vector
17:51 Fine tuning the attraction force
19:34 Drawing the trails of the particle
20:37 Adding multiple particles and other changes
23:08 Adding multiple attractors
27:13 More visual changes and emerging patterns
32:31 Creating attractors with the mouse
35:11 Add repulsion force
35:55 Create alternating attractors and repellers
37:59 Suggestions for improvement and tuning parameters
38:30 Adding repulsions when particle is close to the attractor
43:42 Wrapping up and more possibilities

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

๐Ÿš‚ Website: http://thecodingtrain.com/
๐Ÿ‘พ Share Your Creation! https://thecodingtrain.com/guides/passenger-showcase-guide
๐Ÿšฉ Suggest Topics: https://github.com/CodingTrain/Suggestion-Box
๐Ÿ’ก GitHub: https://github.com/CodingTrain
๐Ÿ’ฌ Discord: https://thecodingtrain.com/discord
๐Ÿ’– Membership: http://youtube.com/thecodingtrain/join
๐Ÿ›’ Store: https://standard.tv/codingtrain
๐Ÿ–‹๏ธ Twitter: https://twitter.com/thecodingtrain
๐Ÿ“ธ Instagram: https://www.instagram.com/the.coding.train/

๐ŸŽฅ Coding Challenges: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
๐ŸŽฅ Intro to Programming: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA

๐Ÿ”— p5.js: https://p5js.org
๐Ÿ”— p5.js Web Editor: https://editor.p5js.org/
๐Ÿ”— Processing: https://processing.org

๐Ÿ“„ Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct

This description was auto-generated. If you see a problem, please open an issue: https://github.com/CodingTrain/thecodingtrain.com/issues/new

#forces #vectors #attractionrepulsion #physics #p5js







Tags:
JavaScript (Programming Language)
live
programming
daniel shiffman
creative coding
p5.js
coding challenge
p5.js tutorial
p5js
javascript (programming language)
tutorial
javascript
coding
challenges
coding train
the coding train
nature of code
forces
vectors
attraction
attractors
repulsion
gravity
physics
gravity javascript
physics engine
javascript oop
object oriented programming