Coding Challenge 183: Paper Marbling Algorithm

Channel:

The Coding Train

Subscribers:

1,750,000

Published on May 2, 2024 3:17:04 PM ● Video Link: https://www.youtube.com/watch?v=p7IGZTjC008

Duration: 32:10

81,407 views

3,418

All aboard as I attempt to simulate the artistic process of paper marbling. The algorithm is based on the paper 'Mathematical Marbling' by S. Lu, A. Jaffer, X. Jin, H. Zhao, and X. Mao. The code is written in JavaScript using the p5.js library. Code: https://thecodingtrain.com/challenges/183-mathematical-marbling

🚀 Watch this video ad-free on Nebula https://nebula.tv/videos/codingtrain-coding-challenge-183-paper-marbling-simulation

p5.js Web Editor Sketches:
🕹️ Mathematical Marbling: https://editor.p5js.org/codingtrain/sketches/fsw-rJrpr
🕹️ Dodecahedron: https://editor.p5js.org/codingtrain/sketches/frIcGeI8l
🕹️ Marbling Phyllotaxis: https://editor.p5js.org/codingtrain/sketches/xoK1M7K3-
🕹️ Marbling Mouse: https://editor.p5js.org/codingtrain/sketches/GlQ8BqbZ2
🕹️ Marbling Color: https://editor.p5js.org/codingtrain/sketches/ONPlawNRq
🕹️ Marbling Combs: https://editor.p5js.org/codingtrain/sketches/kUPncgjvO
🕹️ Marbling Raster Pixels: https://editor.p5js.org/codingtrain/sketches/5b29Taght
🕹️ Marbling Raster Pixels - Image: https://editor.p5js.org/codingtrain/sketches/nb5hSYsgX
🕹️ Marbling Raster Pixels - Video: https://editor.p5js.org/codingtrain/sketches/kVyT302xf
🕹️ Marbling Color - animate ink: https://editor.p5js.org/codingtrain/sketches/HtEtm1vii
🕹️ handPose Marbling: https://editor.p5js.org/codingtrain/sketches/EwQhSqGK5

🎥 Previous: https://youtu.be/6UlGLB_jiCs?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
🎥 All: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH

References:
🔗 Paper Marbling: https://en.wikipedia.org/wiki/Paper_marbling
🔗 Tokutaro Yagi: https://suminagashi.com/meet-the-artisan-tokutaro-yagi/
🔗 Digital Marbling: https://blog.amandaghassaei.com/2022/10/25/digital-marbling/
📄 Mathematical Marbling: https://doi.org/10.1109/MCG.2011.51
🔗 Mathematical Marbling: https://people.csail.mit.edu/jaffer/Marbling/

Videos:
🎥 The Hydrodynamics of Marbling Art: https://gfm.aps.org/meetings/dfd-2023/649b3ad8199e4c137897831b
🎥 https://youtu.be/O5wjXoFrau4

Related Coding Challenges:
🚂 https://youtu.be/OAcXnzRNiCY
🚂 https://youtu.be/BZUdGqeOD0w
🚂 https://youtu.be/alhpH6ECFvQ
🚂 https://youtu.be/IxdGyqhppis

Timestamps:
0:00 Introduction
1:47 Mathematical Marbling
2:16 Explain approach
3:20 Start Coding
4:20 Dropping paint
7:03 Add the circle vertices using polar coordinates
10:57 Add a marble function
13:24 Refine the algorithm
16:45 Add a tine function
19:46 Circle detail
24:50 Generalize the tine function
29:43 Possible variations
31:45 Outro

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

🚂 Website: https://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/

🎥 https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
🎥 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

#mathematicalmarbling #fluidsimulation #p5js #javascript