Coding Challenge #59: Steering Behaviors

Subscribers:
1,740,000
Published on ● Video Link: https://www.youtube.com/watch?v=4hA7G3gup-4



Duration: 30:56
183,788 views
3,758


In this coding challenge, I look at extracting font path points from text in p5.js with p5.Font.textToPoints(). I render the text as particles with steering behaviors that react to the mouse. Code: https://thecodingtrain.com/challenges/59-steering-behaviors

πŸ•ΉοΈ p5.js Web Editor Sketch: https://editor.p5js.org/codingtrain/sketches/q7O2v_zqQ

πŸŽ₯ Previous video: https://youtu.be/dbs4IYGfAXc?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
πŸŽ₯ Next video: https://youtu.be/O_0fRV4MTZo?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
πŸŽ₯ All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH

References:
πŸ““ Steering Behaviors paper: http://www.red3d.com/cwr/steer/

Videos:
πŸŽ₯ Nature of Code Steering Behaviors Playlist: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6YHt0dtyf4uiw8tKOxQLvlW
πŸ”΄ Live Stream #79: https://youtu.be/L1nHni9HMBw?t=6833s

Related Coding Challenges:
πŸš‚ #69 Evolutionary Steering Behaviors: https://youtu.be/flxOkx0yLrY
πŸš‚ #124 Flocking Simulation: https://youtu.be/mhjuuHl6qHM

Timestamps:
0:00 Introduction
4:14 textToPoints
7:39 Craig Reynold's steering behavior
11:17 vehicle.js
12:07 Prototypes
16:14 Behaviors
17:53 Seek function
21:05 Arrive function
24:24 Random starting points
25:00 Flee the mouse

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://discord.gg/hPuGy2g
πŸ’– 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

#steeringbehaviors #craigreynoldssteering #texttopoints #p5js #javascript







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
steering behaviors
steering p5.js
steering behaviors js
craig reynolds steering behavior
Craig Reynolds steering
textToPoints
text to points
font.texttopoints
p5.js texttopoint
text reacting to mouse