Life as Clay

Archive for October 2009

Finger painting

leave a comment »

Written by Clay

October 31, 2009 at 15:10

Posted in daily cartoon

Tagged with

Orbital motion is a pretty flower

leave a comment »

I was tired last night and therefore unable to spend the time thinking about what I really wanted to achieve. I tackled the problem this morning — I didn’t end up with exactly what I wanted (that will take more work), but I did end up with a functioning orbital system. The pathway shown here is similar to what the path of an object that is orbiting another object that is orbiting a larger object would take. In other words, this should look similar to what the path that the moon takes around the sun looks like (since the moon orbits Earth..) but with a slower period.

simple moon orbit

But, hey… why stick with boring white when you can display colors? Here are a few variations, in color:

color orbit 1

color orbit 2You may notice what looks like a hollow core on the last one. I followed the orbit of the colored ball with the orbit of a smaller black ball and it left the trail. Incidentally, the trail is visible because the transparency of the colored ball is at 40% or so.

The fun part is changing the orbital period…

the whole system

faster periodfast color periodHere’s the code that I used for the last one. Click here to see it in motion.

int centerX = 200;
int centerY = 200;
float ballX;
float ballY;
int ballRadius = 20;
int radius = 100;

// For the orbital period of the "Earth"
float angle = 0;
float speed = 0.01;

// For the orbital period of the "moon"
float passedAngle = 0;
float passedSpeed = 0.3;

void setup() {
  size(400,400);
  background(0);
  fill(255);
  stroke(255);
  smooth();
  frameRate(60);
}

void draw(){

  // Determines the orbiting position of the "Earth"
  ballX = centerX + sin(angle) * radius;
  ballY = centerY + cos(angle) * radius;

  // Calls the function to create the "Earth" and "Moon"
  drawAtom(ballX,ballY,ballRadius,passedAngle);
  // drawAtom(ballY,ballX + 50,ballRadius);

  angle += speed;
  passedAngle += passedSpeed;

}

void drawAtom(float ballX, float ballY, int radius, float angle) {
  float newBallX;
  float newBallY;

  newBallX = ballX + sin(angle) * radius;
  newBallY = ballY + cos(angle) * radius;

  // Creates the invisible "Earth"
  noStroke();
  noFill();
  ellipse(ballX,ballY,1,1);

  // Creates the "moon"
  fill(random(255),random(255),random(255),random(255));
  ellipse(newBallX, newBallY,10,10);

  // Try adding another "moon"!

}

Written by Clay

October 30, 2009 at 14:07

Posted in Code, Processing

Tagged with , ,

Tangent to a busy day

leave a comment »

Today was busy. I didn’t crack open the book today, but instead, just tried to create something interesting based on what I remembered, and playing with sine, cosine, and tangent. I found, interestingly, that if I tried to move the center point of an ellipse using random(-10,10) for both the x and y coordinates, that it ultimately would move toward the origin. That movement produced these:
yellow

red

aquaI like the last one… primarily for the color. :)

I changed to color variation and a line drawn using a random number based on the tangent of the center of the circle (for each iteration). It resulted in this:

staticErgly, as my high school Chinese teacher used to say, but interesting in that it tended towards the origin again. What’s up with the random() function that it tends towards the origin? Here the code for the last picture:

int z;
int x = 200;
int y = 200;

void setup() {
  size(400,400);
  background(0);
  noFill();
  strokeWeight(1);
}

void draw() {
  z = int(random(200));
  ellipseMode(CENTER);
  stroke(random(255),random(255),random(255),100);
  ellipse(x,y,z,z);
  
  x += random(-1,2);
  y += random(-1,2);
  
  stroke(random(255),random(255),random(255),100);
  line(width/2,height/2,tan(x)*random(400),tan(y)*random(400));
  
}

It ain’t gonna win me no prizes, but at least I’m learning.

 

Written by Clay

October 30, 2009 at 02:36

Posted in Code, Processing

Tagged with , ,

Woven

with one comment

I kept playing with code and the sine wave. Interestingly, when I set y = height/2, the first dot always appears at (0,0). That’s because it initializes before I set the size of the screen, I think. Anyhow, I hard coded it at 200 for the purpose of pasting it here:

woven

int x = 0;
float y = 200;

void setup() {
  size(400,400);
  background(0);
  noStroke();
  smooth();
}

void draw() {
  fill(random(255),random(255),random(255));
  ellipse(x,y,5,5);
  
  x += 2;
  y = (200) + (20*sin(x));
}

Written by Clay

October 29, 2009 at 01:54

Posted in Code, Processing

Tagged with , ,

Circle Circle Dot Dot Dot

with 2 comments

I promised myself that, when feasible, I would do something with Processing every day and post the results to this blog. Tonight was a little busy, so my post for today consists of three images that I generated based on code in the book that I’m reading. I shifted a few of the variables to create the variations. :)

Book CodeBook code variationDot matrixHere’s the code for the last one:

float r;
float g;
float b;
float a;

float diam;
float x=0;
float y=0;

void setup() {
  size(400,400);
  background(0);
  smooth();
}

void draw() {
  r = random(255);
  g = random(255);
  b = random(255);
  a = random(255);
  diam = 8;

  noStroke();
  fill(r,g,b,a);
  ellipse(x,y,diam,diam);

  if (x>400) {
    x = 0;
  } else {
    x = x + 10;
  }

  if (x>400) {
    y = y + 10;
  }

}

Written by Clay

October 29, 2009 at 01:07

All manner of distractions…

leave a comment »

I’ve had 4 books about Processing sitting on my shelves for over a year. I flip through them daily, but I’ve never sat down to lear the language. That’s not true. I did, once, and I started by typing out the code to generate a tree from one of the books. The picture I ended up with did not resemble the picture in the book. I hit a mental block and could not proceed. Convinced that I made a typo, I spent several hours going over the code and eventually closed the book and didn’t open it again. (I’m a perfectionist, duh.)

I bought these books after being wowed by the work of Robert Hodgin, who maintains the blog “flight 404.” I ripped off the phrase “all manner of distractions…” from him for this post. He makes cool things out of code. Just check some of it out. He recently left me wondering why one shouldn’t clean up blood after being cut by a band saw. Haven’t figured that one out yet.

Nevertheless, one of the books that I own is “Learning Processing,” by Daniel Shiffman, who also makes cool things out of code. Upon receipt of the book, just by flipping through it, I automatically proclaimed it to be the clearest book on programming that I had ever seen (out of about 10 others that I actually had seen). The exercise on page 15 is to write code to make your own Zoog. Here’s my Zoog:

zoog

Bernie probably would be a better name...

Never the less, I’ve decided to start again. Anybody who follows this blog (all 2 of you, judging by the stats) knows that I have dabbled with several other programming languages, primarily Ruby. You know, Ruby is great and all, but I REALLY need visual feedback for what I’m doing. I recently read through several Ruby books and while I feel that I understand the concepts, I just don’t feel drawn to Terminal.app, so I end up bored and directionless.

Terminal.appFor a long time I thought that I wanted to be able to make dynamic websites with Ruby and Rails. Well, I do, but not enough to stare at Terminal.app for long periods of time. At least not yet. I need to learn the basics of programming and receive immediate visual feedback before I’m able to abstract from the terminal to the ideas floating in my head. That day will come, but it ain’t here yet, so I’m switching to Processing.

And with that, here’s my Zoog code. I hope to put time towards this daily, so we’ll see what happens. Cheerio.

background(255);
size(400,400);
smooth();

// Body
fill(200,0,0);
rect(150,150,50,100);

// Head
stroke(0);
fill(255);
ellipse(175,150,60,75);

// Nose
noStroke();
fill(0,0,0,80);
ellipse(175,150,10,20);

// Left Eye
fill(0);
ellipse (165,130,10,10);

// Right Eye
fill(0);
ellipse (185,130,10,10);

// Mouth
stroke(0);
strokeWeight(2);
line(160,165,190,165);

// Left Arm
line(150,190,110,220);

// Right Arm
line(200,190,240,220);

// Left Leg
strokeWeight(6);
line(165,250,165,270);

// Right Leg
strokeWeight(6);
line(185,250,185,270);

Written by Clay

October 27, 2009 at 22:15

Mechanical Greeting

leave a comment »

 

 

 

Written by Clay

October 27, 2009 at 11:19

Posted in daily cartoon