Patt Vira | p5.js Coding Tutorial | Spiral Betty @pattvira | Uploaded September 2024 | Updated October 2024, 7 hours ago.
💛 Suggest an Idea: pattvira.com/ideas
--
LET'S CONNECT
✨ Sign up for my newsletter at pattvira.com
✨ Instagram: instagram.com/pattvira
✨ Twitter: twitter.com/pattvira
--
Links:
🔗 p5.js editor: editor.p5js.org
🔗 Spiral Betty Code: editor.p5js.org/pattvira/sketches/-VoHCBGmx
🔗 Introduction to Creative Coding Playlist: youtube.com/playlist?list=PL0beHPVMklwgMz4Z-mNp4_udo9mjBk7pn&si=XhvQaojd6cIrxvdn

References:
🔗 Spiral Betty: spiralbetty.com
🔗 Zenozeng's p5.js - svg library: github.com/zenozeng/p5.js-svg
🔗 GUI Functions:
🔗 createSlider: p5js.org/reference/p5/createSlider
🔗 createColorPicker: p5js.org/reference/p5/createColorPicker
🔗 createSelect: p5js.org/reference/p5/createSelect
🔗 createButton: p5js.org/reference/p5/createButton
🔗 input: p5js.org/reference/p5/input
🔗 createGraphics: p5js.org/reference/p5/createGraphics

Timestamps:
0:00 Intro
0:21 Spiral Betty and Archimedean spiral
0:59 Create a spiral pattern
4:37 Set spiral line thickness based on brightness values
9:43 Create a GUI to manipulate each parameter
22:02 Export an image file