Coding Challenge #102: 2D Water Ripple

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


Duration: 17:17
120,483 views
3,223

In this coding challenge, I attempt to simulate 2D water ripples using Processing (Java). Code: https://thecodingtrain.com/challenges/102-2d-water-ripple

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

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

References:
πŸ““ 2D Water: https://web.archive.org/web/20160418004149/http://freespace.virgin.net/hugo.elias/graphics/x_water.htm
πŸ’Ύ Processing: http://processing.org

Videos:
πŸŽ₯ Cellular Automata: https://www.youtube.com/watch?v=DKGodqDs9sA
πŸ”΄ Livestream Archive: https://youtu.be/ORwIZCKJA-Q?t=7570s

Related Coding Challenges:
πŸš‚ #24 Perlin Noise Flow Field: https://youtu.be/BjoM9oKOAKY
πŸš‚ #85 The Game of Life: https://youtu.be/FWSR_7kZuYg
πŸš‚ #103 Fire Effect: https://youtu.be/X0kjv0MozuY

Timestamps:
0:00 Introduction
0:54 2D water ripples algorithm
1:38 Let's Code
2:14 Create a 2D Array
5:08 Find new current pixel value
7:54 Display new pixel value
9:31 Initialize array
10:06 Swap buffers
12:16 Add dampening
12:54 Correction: subtract current value
13:56 Add mousePressed
15:51 Add mouseDragged

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

#2dwaterripple #cellularautomata #processing



Other Videos By The Coding Train


2018-05-2816.11: Promises Part 1 - Topics of JavaScript/ES6
2018-05-26Live Stream #139: Linear Regression with TensorFlow.js
2018-05-25Live Stream #137.2: Promises in JavaScript - Part 2
2018-05-23Live Stream #137.1: Promises in JavaScript - Part 1
2018-05-23ITP Spring Show 2018
2018-05-19Live Stream Archive - ITP Spring Show 2018 (Better Audio)
2018-05-14Coding Challenge #103: Fire Effect
2018-05-13Live Stream #136: More Tensorflow.js + Fire Effect Challenge
2018-05-106.4: TensorFlow.js: Memory Management - Intelligence and Learning
2018-05-096.3: TensorFlow.js: Variables & Operations - Intelligence and Learning
2018-05-07Coding Challenge #102: 2D Water Ripple
2018-05-05Live Stream #135: May 4th Challenge + TensorFlow.js Continued
2018-05-04Coding Challenge #101: May the 4th Scrolling Text
2018-05-03Guest Tutorial #11: Hardware + JavaScript with noopkat
2018-05-016.2: TensorFlow.js: Tensors - Intelligence and Learning
2018-04-306.1: Introduction to TensorFlow.js - Intelligence and Learning
2018-04-28Live Stream #134: Introduction to Tensorflow.js
2018-04-24Coding Challenge #100: Neuroevolution Flappy Bird - Part 5
2018-04-23Coding Challenge #100: Neuroevolution Flappy Bird - Part 4
2018-04-19Coding Train Live 133: Neuroevolution Flappy Bird Continued
2018-04-18Coding Challenge #100: Neuroevolution Flappy Bird - Part 3


Tags:
programming
daniel shiffman
creative coding
coding challenge
tutorial
coding
challenges
coding train
the coding train
live stream
class
challenge
codingtrain
code challenge
2d water
2d water ripple
2d water simulation
2d water effect
2d water processing
2d water algorithm