John Whitney tribute

Hi, I coded the a part of John Whitney works : Matrix3.

John was a pioneer of computer graphics experiments, he worked with first analog computer in 60’s, 70’s.

You can find a lot of this work on youtube.

This thread can be a place to share code, thoughts, … related to John’s work.

Enjoy !

//first triangles part of Matrix3 by John Whitney
//coded by matheplica 
//16-10-2025
//press 'g' to start
import fip.*;
PShape[] tri = new PShape[16];
float[] theta = new float[tri.length];
float[] speed = new float[tri.length];
PShader[] shade = new PShader[2];
boolean go;
void setup() {
  size(640, 480, P2D);
  shade[0] = loadShader(FIP.gaussianBlur);
  shade[1] = loadShader(FIP.edgePreservingSmooth);
  for (int i=0; i<tri.length; i++) {
    tri[i] = createShape();
    tri[i].beginShape();
    for (float j=0; j<TAU; j+=TAU/3.0) {
      float x = sin(j)*(i+1)*7;
      float y = cos(j)*(i+1)*7;
      tri[i].vertex(x, y);
      theta[i] = HALF_PI;
      speed[i] = (i+1)*0.0005;
    }
    tri[i].endShape(CLOSE);
    tri[i].disableStyle();
  }
}
void draw() {
  noStroke();
  fill(0);
  rect(0, 0, width, height);
  noFill();
  strokeWeight(2);
  strokeJoin(ROUND);
  translate(width>>1, height>>1);
  for (int i=tri.length-1; i>0; i--) {
    if (go) theta[i]-=speed[i];
    float x2 = sin(theta[i])*120;
    float y2 = cos(theta[i])*120;
    stroke(255, 0, 0, 199);
    shape(tri[i], x2, y2);
  }
  for (int i=tri.length-1; i>0; i--) {
    float x1 = sin(-theta[i])*120;
    float y1 = cos(-theta[i])*120;
    stroke(255);
    shape(tri[i], x1, y1);
  }
  for (int i=0; i<2; i++) filter(shade[i]);
}
void keyPressed() {
  if (key=='g') go  =! go;
}

5 Likes

I recommend watching this animation but you will need to install the FIP library via the contribution manager and press the g key to start the animation.

The effect of the filters seemed to soften the lines but I think I preferred the version without using them.

Anyway I enjoyed watching the triangles move, it was quite relaxing :sleeping_face:

3 Likes