I’m thinking of starting a new series where I write code for ten minutes at a time in bite sized pieces, usually to answer a question online. Welcome to the first one!

Reddit user u/doc415 asked how to draw a 3D moebius strip in Processing.

I built it in several stages so that

• I could test each step and
• I wouldn’t lose the code from one step while making the next step.
• All without having to start a git repository, etc etc.
``````// moebius is built around a circle.  the circle has this radius.
// the strip has this thickness.
float thickness = 50;

// click a mouse button to change mode and see each step of development.
int mode=0;

void setup() {
size(500,500,P3D);
}

void mouseReleased() {
mode = (mode+1)%3;
}

void draw() {
background(0,0,0);
// move to center of screen
translate(width/2,height/2,0);
// rotate shape based on mouse movements
rotateX(mouseX*0.05f);
rotateY(mouseY*0.05f);

switch(mode) {
default: drawPointsInACircle();  break;
case 1: drawLinesAroundACircle();  break;
case 2: drawMoebiusStrip();  break;
}
}

void drawPointsInACircle() {
for(float a=0;a<360;a+=10) {
// c is unit vector from center to point on circle
float z = 0;
// color and draw
stroke(abs(x)*255f,abs(y)*255f,a*255f/360f);
}
}

void drawLinesAroundACircle() {
for(float a=0;a<360;a+=10) {
// c is unit vector from center to point on circle
float cz = 0;
PVector c0 = new PVector(cx,cy,cz);
PVector c1 = new PVector(0,0,1);
// a unit vector along the plane of the strip
);
// scale vectors
PVector f = PVector.mult(d,thickness/2f);
// put it all together
PVector p1 = PVector.sub(e,f);
// color and draw
stroke(abs(cx)*255f,abs(cy)*255f,a*255f/360f);
line(
p0.x,p0.y,p0.z,
p1.x,p1.y,p1.z);
}
}

void drawMoebiusStrip() {
beginShape(TRIANGLE_STRIP);

for(float a=0;a<=360;a+=10) {
// c is unit vector from center to point on circle
float cz = 0;
PVector c0 = new PVector(cx,cy,cz);
PVector c1 = new PVector(0,0,1);
// a unit vector along the plane of the strip
);
// scale vectors
PVector f = PVector.mult(d,thickness/2f);
// put it all together