Commit to your Final Project Proposal, include the following explanations in your blog post:
-
- Finalized concept for the project
- Design and description of what your Arduino program will do with each input and output and what it will send to and/or receive from P5
- Design and description of what P5 program will do and what it will send to and/or receive from Arduino
- Start working on your overall project (document the progress)
The finalized concept for my project is essentially an experimental simulation which visualizes the specific heart-rate pattern of the person interacting with it, produces experimental music in coordination with that data representation in real-time, and allowing for the user to interact with the simulation.
Serial connection: From arduino to p5.js. (one way)
Links for music (not mine) and if time allows, I might create my own music, but this is the current set of ambient and experimental music:
https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.2/p5.min.js
https://cdnjs.cloudflare.com/ajax/libs/tone/14.8.49/Tone.min.js
function mousePressed() {
for (let btn of buttons) {
if (mouseX > btn.x && mouseX < btn.x + btn.w && mouseY > btn.y && mouseY < btn.y + btn.h) {
if (btn.action === "back") {
currentSeqIndex = (currentSeqIndex - 1 + sequences.length) % sequences.length;
sequence.stop();
sequence = new Tone.Sequence((time, note) => {
arpSynth.triggerAttackRelease(note, "16n", time);
polySynth.triggerAttackRelease([note, note + "2"], "2n", time);
shapes.push({
x: random(width),
y: random(height),
size: random(50, 150),
sides: floor(random(3, 8)),
hue: (bpm + currentSeqIndex * 60) % 360,
rot: 0,
type: currentSeqIndex % 2 ? "polygon" : "circle"
});
}, sequences[currentSeqIndex], "4n");
if (!buttons[1].paused) sequence.start(0);
} else if (btn.action === "pause") {
btn.paused = !btn.paused;
btn.label = btn.paused ? "Play" : "Pause";
if (btn.paused) {
Tone.Transport.pause();
} else {
Tone.Transport.start();
sequence.start(0);
}
} else if (btn.action === "forward") {
currentSeqIndex = (currentSeqIndex + 1) % sequences.length;
sequence.stop();
sequence = new Tone.Sequence((time, note) => {
arpSynth.triggerAttackRelease(note, "16n", time);
polySynth.triggerAttackRelease([note, note + "2"], "2n", time);
shapes.push({
x: random(width),
y: random(height),
size: random(50, 150),
sides: floor(random(3, 8)),
hue: (bpm + currentSeqIndex * 60) % 360,
rot: 0,
type: currentSeqIndex % 2 ? "polygon" : "circle"
});
}, sequences[currentSeqIndex], "4n");
if (!buttons[1].paused) sequence.start(0);
}
}
}
}
To emphasize the user interaction and fine-tune the functionality, the mouse pressed function alters the algorithm in which the music is produced.
I faced several issues with this TypeError:
TypeError: Cannot read properties of undefined (reading ‘time’)
I am currently using a placeholder variable for the input (heart rate) from this pulseSensor. The reason for that is that I need to solder the piece on the right (the metal wires) to create a connection so that I may connect the arduino to the pulseSensor. I am not experienced with soldering and I will ask for further help to continue this stage.

Next Step: My next step is to solder the wires and to start testing the sensor and implement it into the project. From this, I will test which patterns I can identify to produce the required data visualization. This is a large part of the project so at the current phase it is 30% complete.
Here is my p5.js so far, with a working and interactive algorithm to select preferred ambient music, and functionality based on the heart rate (simulated and dummy variable controlled with slider).
For the arduino uno, I will use this code:
#include <PulseSensorPlayground.h>
#include <ArduinoJson.h>
const int PULSE_PIN = A0;
const int BTN1_PIN = 2;
const int BTN2_PIN = 3;
const int BTN3_PIN = 4;
PulseSensorPlayground pulseSensor;
StaticJsonDocument<200> doc;
void setup() {
Serial.begin(9600);
pulseSensor.analogInput(PULSE_PIN);
pulseSensor.setThreshold(550);
pulseSensor.begin();
pinMode(BTN1_PIN, INPUT_PULLUP);
pinMode(BTN2_PIN, INPUT_PULLUP);
pinMode(BTN3_PIN, INPUT_PULLUP);
}
void loop() {
int bpm = pulseSensor.getBeatsPerMinute();
if (!pulseSensor.sawStartOfBeat()) {
bpm = 0; // Reset if no beat detected
}
doc["bpm"] = bpm;
doc["btn1"] = digitalRead(BTN1_PIN) == LOW ? 1 : 0;
doc["btn2"] = digitalRead(BTN2_PIN) == LOW ? 1 : 0;
doc["btn3"] = digitalRead(BTN3_PIN) == LOW ? 1 : 0;
serializeJson(doc, Serial);
Serial.println();
delay(100); // Send data every 100ms
}
and I will test it and document my progress in debugging as well.
Design considerations of the physical presentation of the project:
I am still thinking through different forms of cases, designs such as bracelets or medical tape to make the connection between the sensor and the person interacting with the program.
The design requires technical consideration, as the connection between the sensor and the radial artery would be already slightly weak (with a margin of error) I need to document this as well and consider my design after the implementation of the pulseSensor.
For the buttons, I am planning to make them on some form of platform (something similar to the platform that the breadboard and arduino are attached to.
Fullscreen for the best experience.