Creative Coding Week 11: Connecting Arduino to P5
Finally, this is the week when everything comes together and forms a big fat mess of codes! This week, we are using p5.serialcontrol to connect our Arduino boards to p5.js sketches.
I am going to be fully honest, after watching the videos for this week, which are all super detailed, I still did not know how I can make everything work. So I decided to go a bit easy on myself and just make an adaptation of one of the examples presented in the videos.
First, I set up a simple circuit with one potentiometer on my board, and then I uploaded the Arduino codes to the board. However, it didn’t work the first time around because I didn’t connect my potentiometer to power, so I wasn’t getting any data from the board. I fixed my setup with some help from Scott and data started showing up in the serial monitor. The rest was pretty easy, I hooked my board up with the p5 sketch I created for week 1, and then modified the code so that the shapes would rotate according to the value of the potentiometer.
The code is here: https://editor.p5js.org/blurrycory/present/BRBo0uHu3
Here’s a video of me controlling it with my Arduino: https://vimeo.com/483622104
Some extra notes:
I tried to make things more complex by bringing in another potentiometer so that I can use two controls to rotate different shapes. I was able to get the board working on Arduino, but I didn’t know how to parse the two values on p5, so I eventually went with only one potentiometer.
I will definitely come back to this assignment in the future and potentially make it with two controls and make the control/data less sensitive/noisy so that the shapes aren’t jittering when I’m turning the knob.
