Back to Browse

p5.js Coding Tutorial | Lava Lamp (Marching Squares)

3.3K views
Jan 1, 2024
33:54

✨ Get your 'Basic toolkit to Getting Started with Creative Coding' on my website: https://www.pattvira.com. Let me know if you find it useful! ✨ — Links: 🔗 p5.js editor: https://editor.p5js.org/ 🔗 Marching Squares Code: https://editor.p5js.org/pattvira/sketches/rk3vy7vvx 🔗 Introduction to Creative Coding Playlist: https://youtube.com/playlist?list=PL0beHPVMklwgMz4Z-mNp4_udo9mjBk7pn&si=XhvQaojd6cIrxvdn References: 🔗 Jamie Wong's article on Metaballs: https://jamie-wong.com/2014/08/19/metaballs-and-marching-squares/ Timestamps: 0:00 Intro 0:36 Approach 2:33 Calculating location of circles relative to a point 13:34 Calculating location of circles relative to each cell on a grid 18:55 Setting value of each corner based on location calculations 22:22 Mapping each cell to a contour 27:56 Interpolating points to get smoother contours

Download

1 formats

Video Formats

360pmp454.2 MB

Right-click 'Download' and select 'Save Link As' if the file opens in a new tab.

p5.js Coding Tutorial | Lava Lamp (Marching Squares) | NatokHD