Building Tools

Up to this point, you have changed all the parameters in your sketches directly in the code. This will get you very far if you are working alone on a project and it remains purely experimental. As soon as you want other people to work with your sketches, it makes sense to create a user interface with which certain parameters can be changed. This not only makes your sketch accessible to other creatives, but also allows you to define visual boundaries and explore the visual system from different perspectives.

In this course I will show you how to turn any p5.js sketch into a tool with a graphical user interface (GUI). With a little bit of HTML and CSS we will make sure everything looks good and sits in the right place.

Ready? Let’s go!