somewhere here
A coded poem and track
The Track:
Initiated on a piano, and realized on an OP-1 Field.
somewhere here
0:00
/101.30285714285715
The Visual:
Clean coded in p5js with p5sound - enjoy in fullscreen.
Click here for the visual with music - (CW: Strobing effects).
The Coded Poem (that makes the visual):
Play with the code on here. The variable names, meaning, and comments work together.
let somewhere; //within
let t = 0; //the time of here
let exist = []; //exist
let waves = []; // in waves of sound
let playBool = false; //that play
let spectrum = []; //on the spectrum of thought
function preload() {
somewhere = loadSound("https://assets.codepen.io/4559259/hexagonal.mp3");
//brought into being
}
function setup() {
userStartAudio(); //and enabled to breathe
createCanvas(windowWidth, windowHeight); //with an emptyness
describe(description); //accessible to all
fft = new p5.FFT(); //that is filled
spectrum = fft.analyze(); //with waves
waves = fft.waveform(); //of beauty
for (let i = 0; i < spectrum.length; i++) {
exist.push(new ChannelsOfFlowingThought(i, (width / 25) * 10)); //realized in channels individually flowing
}
}
function draw() {
background(40, 50, 60, 3); //with each moment the last fades
translate(width / 2, height / 2); //still centered
t += 0.001; //but ephemeral
if (playBool) {
//if it is to be
if (!somewhere.isPlaying()) {
somewhere.play(); //somewhere is here
}
} else {
somewhere.pause();
}
becoming(); //from an origin
push();
xS = 1 + 0.5 * cos(t); //from a horizon
yS = 1 + 0.5 * cos(t / 4); //from a sky
scale(xS, yS); //realized in perspective
for (let i = 0; i < exist.length; i++) {
exist[i].reveal(); //and revealed
}
pop();
initiate(); //but only if sought
}
function becoming() {
spectrum = fft.analyze();
waves = fft.waveform();
for (let i = 0; i < spectrum.length; i += 1) {
for (let j = 0; j < 7; j++) {
push();
noStroke();
rotate((j * 3120) / 7);
exist[i].incrementInTime(12 * cos(spectrum[i] / 12 - i), waves[i] * 100);
pop();
}
}
}
class ChannelsOfFlowingThought {
constructor(theta, r) {
this.theta = theta;
this.r = r;
this.r1 = r;
this.d = 0.1;
this.s = 1;
this.a = 0;
this.b = 0;
}
reveal() {
let f =
55 * abs(cos(this.d + this.r + this.a - t / 3)) + 40 * cos(this.a / 100);
let g = 120 + 50 * cos(t);
stroke(g / 2 + f * sin(this.a + t / 1000), g + f, 95 + f, 10);
strokeWeight(0.2 + this.b / 10);
for (let i = 0; i < 12; i++) {
push();
rotate((i * PI) / 6);
line(
this.s * this.r * cos(PI / 3 + t + this.theta / 12),
this.s * this.r * sin(PI / 3 + t + this.theta / 12),
this.s * this.r * cos(t + this.theta / 12) -
this.s * this.r * sin(t / 4 + this.theta / 12),
this.s * this.r * sin(t + this.theta / 12)
);
pop();
}
}
incrementInTime(a, b) {
this.s = cos(a / 15 + cos(b / 200));
this.d = b;
this.r = 20 + abs(this.r1 + 20 * cos(b * this.a));
this.a = a;
this.b = b;
}
}
function mousePressed() {
if (getAudioContext().state !== "running") {
getAudioContext().resume();
}
background(50, 60, 70);
playBool = !playBool;
return false;
}
function touchStarted() {
playBool = !playBool;
background(50, 120, 70);
return false;
}
let description =
"lines drawn sketchely in rotational symmetry that change, pulse, rotate, and move with music once started. the aspect changes over time to almost look like a galaxy spinning - there is blur that gives an almost water effect with the lines. It's a mandala that changes with sound with 12 rotations. ";
function initiate() {
if (!playBool) {
push();
fill(50, 60, 70);
translate(0, height / 2 - 50);
triangle(-20, -20, -20, 20, 20, 0);
pop();
}
}
Coded poem