p5.js Coding Tutorial | Interactive Bridge with Bouncing Balls (matter.js + ml5.js)

Veröffentlicht am: 15 Oktober 2024
auf dem Kanal: Patt Vira

4,850

204

LET'S CONNECT
✨ Sign up for my newsletter at https://www.pattvira.com
✨ Instagram:   / pattvira
✨ Twitter:   / pattvira
--
Links:
🔗 p5.js editor: https://editor.p5js.org/
🔗 Interactive Bridge with Bouncing Balls Code: https://editor.p5js.org/pattvira/sket...
🔗 Introduction to Creative Coding Playlist:    • START HERE: Creative Coding for Beginners

References:
🔗 matter.js:
🔗 Website https://brm.io/matter-js/
🔗 Starter Code (from Springy Chain with matter.js Tutorial): https://editor.p5js.org/pattvira/sket...
🔗 Playlist:    • matter.js
🔗 ml5.js:
🔗 Website: https://ml5js.org/
🔗 ml5.js Handpose Example: https://editor.p5js.org/ml5/sketches/...
🔗 ml5.js playlist:    • ml5.js
🔗 Inspiration: ml5.js+matter.js sketch by Golan Levin: https://editor.p5js.org/golan/sketche...

Timestamps:
0:00 Intro
2:08 Create a Bridge class
6:42 Fix positions of the outer most circles to create a bridge
9:49 Walk through ml5.js documentation
11:38 Add ml5.js handpose example code to sketch
25:07 Use thumb and index fingers' positions as bridge's position
27:32 Create a bunch of color bouncy balls
35:07 Remove balls that are off screen
41:40 Final touches

Auf dieser Seite können Sie das Online-Video p5.js Coding Tutorial | Interactive Bridge with Bouncing Balls (matter.js + ml5.js) mit der Dauer stunde minuten sekunde in guter Qualität ansehen, das der Benutzer Patt Vira 15 Oktober 2024 hochgeladen hat, den Link mit Freunden und Bekannten teilen, dieses Video wurde auf Youtube bereits 4,850 Mal angesehen und es wurde von 204 den Zuschauern gefallen. Viel Spaß beim Betrachtenden Zuschauern gefallen!

174,633

8.5K