My circuit connects a potentiometer to my Arduino's 5V source, ground, and A0 pin!
Arduino Code:
My firmware reads the data coming from my Arduino and prints it to the serial monitor! The values printed change when the potentiometer is turned.
p5.js Code:
My webpage's p5.js code reads a single byte of data coming in from the Arduino and assigns it to a circleSize variable. After setting circleSize to the data coming in from the Arduino, my sketch draws a particular sized gold circle on a purple background, where the size of the circle depends on potentiometer reading (i.e. how much it is turned).
My schematic shows a simple circuit with a potentiometer connected to power and ground on one side, and connected to pin A0 on the other.
This GIF shows how turning the potentiometer affects my webpage. By setting the potentiometer to different resistances, my webpage will display a different sized circle!