Patt Vira | p5.js Coding Tutorial | Egg-phabet 🍳 (Generative Typography Tool) @pattvira | Uploaded February 2024 | Updated October 2024, 24 minutes ago.
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
🔗 Egg-phabet Code: editor.p5js.org/pattvira/sketches/6i540YsK0
🔗 Introduction to Creative Coding Playlist: youtube.com/playlist?list=PL0beHPVMklwgMz4Z-mNp4_udo9mjBk7pn&si=XhvQaojd6cIrxvdn

Related Videos:
🔗 Intro to textToPoints Function: youtu.be/eZHclqx2eJY
🔗 Oscillation (Coding Math): youtu.be/CIl8xSg3HbA
🔗 Breathing Jellyfish 🐙 w Sliders and Buttons: youtu.be/YULQUdTSVkQ

References:
🔗 Guide to Styling Sliders: brennaobrien.com/blog/2014/05/style-input-type-range-in-every-browser.html

Timestamps:
0:00 Intro
0:34 Get an array of points from textToPoints() Function
4:50 Use oscillation equation to create wavy motion
9:29 Create sliders using createSlider() to control values
20:33 Create a drop-down list using createSelect() to manage message options
24:08 Style sliders in style.css