p5.js Coding Tutorial | Slime Molds (Physarum)

Опубликовано: 20 Июнь 2026
на канале: Patt Vira

15,263

697

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/
🔗 Slime Mold Code: https://editor.p5js.org/pattvira/sket...
🔗 Introduction to Creative Coding Playlist:    • START HERE: Creative Coding for Beginners

References:
🔗 Jeff Jone's paper: https://uwe-repository.worktribe.com/...
🔗 Sage Jenson's blog post: https://cargocollective.com/sagejenso...
🔗 Physarum close-up images from ‪@journeytomicro‬'s video:    • Slime Molds: When Micro Becomes Macro
🔗 Pixels p5.js Reference: https://p5js.org/reference/#/p5/pixels

Timestamps:
0:00 Intro
0:10 What is a slime mold?
1:16 Algorithm and approach
2:20 Create a Mold class
7:00 Create sensor variables
12:19 Explain how pixels array work and how to extract color values from it
19:16 Use pixels array to get sensing data from canvas
21:41 Compare sensors' values to determine direction to rotate
26:20 Use alpha value to diffuse trail map
31:02 Use modulo (%) to wrap around values