Serial Output into P5.js

Can you guess what’s wrong with this picture? I didn’t until the end of the Lab. Haha.

I thought I had set this up perfectly, everything aligned with the right digital pins and I checked the anode and cathode ends of the LED to make sure there were in the correct wells, so I went ahead with the programming portion of the Lab.

When I first entered the lines of code into Arduino, the lines used the name “inByte” instead of “outByte.” When I looked at the code for p5.js, there was no named variable “inByte” but all the lines that talked to Arduino said outByte, so I changed the variable in Arduino to outByte.

When I migrated lines of code over from the Lab instructions to p5.js, there were also a couple errors I noted and fixed. The “serial” variable was not defined so running the code returned an error. I looked back at the previous serial input lab and it had this “const serial = new p5.WebSerial ()” line defined globally along with other variables, so I copied that over.

I also remembered that in the previous lab there was a line within the code that said “let inData = “ even though inData was defined globally above, so I found this line again and deleted the “let” so “inData” was left defined globally.

I tested the p5.js code and it seemed to return values as expected as I moved the mouse around, so I ran it with my circuit connected. It did not work :( .

The p5 code was correct, and the Arduino seemed correct too…so I felt like it needed to be the circuit board, and sure enough…

Originally, I had the green ground wire going into the ground well located on the top half of the breadboard, but I have a breadboard that is split in half so the long wells on the side do not connect all the way down. I just moved this ground wire to the lower half so that it did have a connection point, and…

Success!

The LED never really goes “off” which is kind of strange, but it does respond to interaction from p5. Yay!