3.2: The Bouncing Ball - p5.js Tutorial

Channel:
United States The Coding Train
Subscribers:
1,740,000
Published on ● Video Link: https://www.youtube.com/watch?v=LO3Awjn_gyU


Category:
Tutorial
Duration: 7:35
260,314 views
2,776

This video continues the discussion of conditional statements and looks at a classic scenario -- a circle that bounces off the edges of the canvas. Code: https://thecodingtrain.com/tracks/code-programming-with-p5-js/code/3-conditionals/2-bouncing

🕹️ p5.js Web Editor Sketch: https://editor.p5js.org/codingtrain/sketches/Xm4cmQvU

🎥 Previous video: https://youtu.be/1Osb_iGDdjk?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA
🎥 Next video: https://youtu.be/r2S7j54I68c?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA
🎥 All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA

Timestamps:
0:00 Introduction
1:25 Reversing the Ball's Direction
5:38 Using a Variable to Change Direction

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

#ifstatement #motion #p5js #javascript



Other Videos By The Coding Train


2015-09-17Preparing to discuss Processing 3
2015-09-175.2: Function Parameters and Arguments - p5.js Tutorial
2015-09-175.4: Functions Inside of Objects - p5.js Tutorial
2015-09-175.1: Function Basics - p5.js Tutorial
2015-09-175.3: Functions and Return - p5.js Tutorial
2015-09-114.1: while and for Loops - p5.js tutorial
2015-09-114.2: Nested Loops - p5.js Tutorial
2015-09-11Live Stream #4: p5.js Lessons About Loops
2015-09-103.4: Boolean Variables - p5.js Tutorial
2015-09-103.3: Else and Else if, AND and OR - p5.js Tutorial
2015-09-103.2: The Bouncing Ball - p5.js Tutorial
2015-09-103.1: Introduction to Conditional Statements - p5.js Tutorial
2015-09-10Coding Train Live 3: p5.js Conditionals and Loops - Part 2
2015-09-10Live Stream #2.1: p5.js Conditionals and Loops - Part 1
2015-09-042.5: The random() Function - p5.js Tutorial
2015-09-042.5: The map() Function - p5.js Tutorial
2015-09-042.3: JavaScript Objects - p5.js Tutorial
2015-09-042.2: Variables in p5.js (Make your own) - p5.js Tutorial
2015-09-042.1: Variables in p5.js (mouseX, mouseY) - p5.js Tutorial
2015-09-04Coding Train Live 1: p5.js Video Lesson Recording Session
2015-09-011.3: Basics of drawing - p5.js Tutorial


Tags:
p5.js
javascript
conditional
boolean
Bouncing Ball
javascript bouncing ball
javascript bouncing balls
p5 js
p5js
javascript (programming language)
p5.js bouncing ball
bouncing ball javascript
moving ball canvas html5
bouncing ball p5.js
creative coding
programming
p5.js tutorial
p5js tutorial
control flow