p5.js Coding Tutorial | Bouncing Wave Typography
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/
🔗 Bouncing Wave Typography Code: https://editor.p5js.org/pattvira/sket...
🔗 Introduction to Creative Coding Playlist: • START HERE: Creative Coding for Beginners
References:
🔗 Easing Functions: https://easings.net
Timestamps:
0:00 Intro
0:10 Draw text on canvas
3:37 Create Text and Wave classes
8:28 Write a method to move a Text object
11:35 Add interesting movement using easing functions
14:02 Reverse movement direction
16:49 Control total distance traveled for each Text object
19:39 Create multiple Wave objects
20:51 Create wavy and bouncy effects