
Processing-Tutorial: Exploring Wave-Figures
In this spontaneous Processing coding-session, I solve one of the assignments from my online course “Bauhaus Coding Workshop” available on my website. Here some very important concepts like loops, waves and mapping come together.
The Code
void setup() {
size(1200, 900);
background(0);
}
void draw() {
translate(width/2, height/2);
float mag = 400;
float s = 15;
noStroke();
for (int i = 0; i < 100; i++) {
float w = map(sin(radians(frameCount)), -1, 1, -100, 100);
float wave1 = map(tan(radians(frameCount * 0.8 + i + w)), -1, 1, -100, 100);
float wave2 = map(tan(radians(frameCount + i)), -1, 1, -mag, mag);
float c = map(sin(radians(frameCount * 5 + i)), -1, 1, 0, 255);
fill(c);
rect(wave1, wave2, s, s);
}
}
Related

I challenged Daniel Shiffman and here’s his response
Tutorials

Processing-Tutorial: A Grid of Arcs
Tutorials

Interactive Grid System (Livestream)
Tutorials

Processing-Tutorial: Render Videos with the Movie Maker
Tutorials

Processing-Tutorial – Programming Posters
Tutorials

Bauhaus 101 – A beginners Processing Tutorial
Tutorials

How to use p5.js with Visual Studio Code
Tutorials

The Magic Triangle
Tutorials

Processing-Tutorial: Rasterize 3D
Tutorials

Processing-Tutorial: Image-Rasterizer
Tutorials

Processing-Tutorial: WAVES pt. 1
Tutorials

Processing-Tutorial: Kinetic Typography 1
Tutorials

Processing-Tutorial: Video Export
Tutorials
