Kevin Thies – Dynamic Drawing

sketch

var deg = 0; // Degrees to Rotate
var x = 0; // Offset from origin
var r = 255; // Rgb Code
var b = 0; // rgB  Code
var dim = 10; // Circle Dimension

function setup() {
  createCanvas(640,480);
}

function draw() {

    angleMode(DEGREES); // This makes things easier for later
    background(220, 220, 220, 90);

    push();
    fill(r, 0, b); // changes fill color as mouse moves
    noStroke();

    translate(320, 240); // moving origin to center of screen
    rotate(-deg); // 6 Counter Clockwise circles
    ellipse (0 + x, 0, dim, dim);

    rotate(60);
    ellipse (0 + x, 0, dim, dim);

    rotate(60);
    ellipse (0 + x, 0, dim, dim);

    rotate(60);
    ellipse (0 + x, 0, dim, dim);

    rotate(60);
    ellipse (0 + x, 0, dim, dim);

    rotate(60);
    ellipse (0 + x, 0, dim, dim);



    rotate(deg * 2); // 6 Clockwise Circles
    ellipse (0 + x, 0, dim, dim);

    rotate(-60);
    ellipse (0 + x, 0, dim, dim);

    rotate(-60);
    ellipse (0 + x, 0, dim, dim);

    rotate(-60);
    ellipse (0 + x, 0, dim, dim);

    rotate(-60);
    ellipse (0 + x, 0, dim, dim);

    rotate(-60);
    ellipse (0 + x, 0, dim, dim);

    rotate(-60);
    ellipse (0 + x, 0, dim, dim);

    pop();

    /* As mouseX Increases, make the circles
        - Rotate CW and CCW
        - Move further away from origin
        - Change Color
        - Grow larger
        All of these don't want to go completely offscreen
        255 is a convienient number as it's used for standard rgb
        To make something change slower, mouseX needed to be
            ivided by a larger numbers
    */

    deg = constrain (mouseX/3, 10, 255);
    x = constrain (mouseX/3, 10, 255);
    r = constrain (mouseX/3, 10, 255);
    b = constrain (mouseX/3, 10, 255);
    dim = constrain (mouseX/6, 10, 50);
}

I really liked the image shown on the project page, and it made me think about loading icons. We’d just covered a lot of rotation, and a lot of loading icons are rotations, so I just followed those ideas and took a stab at it.