
1. Arduino - setting up the circuit
First, I would like to introduce Arduino. For those of you familiar with Arduino, feel free to skip this section. Here is a description of Arduino taken from their website:
Arduino is an open-source electronics platform based on easy-to-use hardware and software. Arduino boards are able to read inputs - light on a sensor, a finger on a button, or a Twitter message - and turn it into an output - activating a motor, turning on an LED, publishing something online. You can tell your board what to do by sending a set of instructions to the microcontroller on the board.

For this project, the physical setup isn't extremely difficult so don't worry if this is your first time with Arduino. To set up the Arduino, you will need the following items:
- Arduino board (green board on the left in the picture)
- breadboard (white board on the right in the picture)
- potentiometer (blue/white little gadget sitting on the breadboard)
- knob (that attaches to the potentiometer)
- some wires
- USB cable to connect the Arduino to your computer
Before we dive into anything, let's first discuss what a breaboard is.

Now let's build our circuit.
First, we need to power our circuit by connecting a wire from the Arduino's 5V pin (on the left of the board) to the (+) strip on the breadboard. Now, to create the high-to-low energy gradient, we will need to ground our circuit by connecting the GND pin (right below the 5V pin on the Arduino board) to the (-) strip of the board. It is common practice to use a red wire for power and a black wire for ground.
Now that we have our basic setup complete, it's time to add components to our circuit. Referring to the picture above, the potentiometer+knob is the white/blue little gadget placed on rows 21-23 of the breadboard. The potentiometer has 3 terminals -- the outer terminals connect with the electric circuit and the middle one communicates with the Arduino board as it adjusts the voltage. Notice how the potentiometer's outer legs are connected to (+) and (-) so that it completes a circuit. The middle pin, which is sitting on row 22 and column g, connects to the Arduino's A0 port, designed to be one of the analog input pins that read in signals.
Now we are ready to move onto our next step: programming our Arduino using the Arduino IDE.
2. Arduino - coding our program
Let's click on the link above and download and install the Arduino IDE. Once installed and opened, you will realize there are 2 functions already set up for you.

void setup() { // put your setup code here, to run once: Serial.begin(9600); } void loop() { // put your main code here, to run repeatedly: int potentiometer = analogRead(A0); int mappedPot = map(potentiometer, 0, 1023, 0, 30); Serial.write(mappedPot); delay(1); }
In our setup function, we first make a connection to the serial port. Serial is used for communication between the Arduino board and a computer/other devices. 9600 is a number that specifies the rate at which data is sent (bps).
Now in our main loop function, we read the signal sent from the circuit to the Arduino board with the Arduino function called analogRead();
. Because we connected our wire to the A0 input pin, we specify that we want to read the signal input from the A0 pin.
Now we call another Arduino function called map()
where it takes 5 arguments -- signal you want to map, min signal, max signal, min mapped signal, max mapped signal. Then we code Serial.write(mappedPot)
to send this mapped potentiometer reading to the serial (to our computer).
That's it for the coding part! We are done setting up our Arduino. In the next post, I'll talk about how to set up things on the p5.js end.