project10-zhuoyinl

sketch

//Zhuoying Lin
//zhuoyinl@andrew.cmu.edu
//section a 
//project 10

var terrainSpeed1 = 0.0005;
var terrainSpeed2 = 0.0001;
var terrainSpeed3 = 0.0002;
var waterSpeed1 = 0.0001;
var terrainDetail1 = 0.005;
var terrainDetail2 = 0.02;
var terrainDetail3 = 0.05;
var waterDetail1 = 0.001;
var angle = 10;
var birds= [];


function setup() {
    createCanvas(400, 600);
     for (var i = 0; i < 10; i++){
        var rx = random(width);
        var ry = random(0,height/4);
        birds[i] = makeBirds(rx,ry);
    }
    
    frameRate(10);
}
 
function draw() {

    //draw background color
    for (var i=0;i<30;i++) {
        strokeWeight(15);
        stroke(255-i);
        line(0,i*15,width,i*15);
    }
   
    //far mountains
    push();
    fill(220); 
    beginShape(); 
    noStroke();
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail3) + (millis() * terrainSpeed1);
        var y = map(noise(t), 0,1, height/4, height*3/4);
        vertex(x, y); 
      
    }
    vertex(width, height);
    vertex(0,height);
    endShape();
    pop();

    //middle mountains
    push();
    fill(205); 
    beginShape(); 
    noStroke();
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail2) + (millis() * terrainSpeed3);
        var y = map(noise(t), 0,1, height*3/8, height*3/4);
        vertex(x, y); 

      
    }
    vertex(width, height);
    vertex(0,height);
    endShape();
    pop();

    //close mountains
    push();
    fill(190); 
    beginShape(); 
    noStroke();
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail1) + (millis() * terrainSpeed2);
        var y = map(noise(t), 0,1, height/2, height);
        vertex(x, y); 

      
    }
    vertex(width, height);
    vertex(0,height);
    endShape();
    pop();

    //river
    noFill(); 
    beginShape(); 
    strokeWeight(1);
    stroke(255);
    //stroke(134,179,194);
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail1) + (millis() * terrainSpeed1);
        var y = map(noise(t), 0,1, height*8/9, height);
        vertex(x, y);


    }
    endShape();
    beginShape(); 
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail1) + (millis() * terrainSpeed1);
        var y = map(noise(t), 0,1, height*8/9, height);     
        vertex(x, y+10);   
    }
    endShape();
     beginShape(); 
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail1) + (millis() * terrainSpeed1);
        var y = map(noise(t), 0,1, height*8/9, height);     
        vertex(x, y+20);   
    }
    endShape();
     beginShape(); 
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail1) + (millis() * terrainSpeed1);
        var y = map(noise(t), 0,1, height*8/9, height);     
        vertex(x, y+30);   
    }
    endShape();
     beginShape(); 
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail1) + (millis() * terrainSpeed1);
        var y = map(noise(t), 0,1, height*8/9, height);     
        vertex(x, y+40);   
    }
    endShape();
     beginShape(); 
    for (var x = 0; x < width; x++) {
        var t = (x * terrainDetail1) + (millis() * terrainSpeed1);
        var y = map(noise(t), 0,1, height*8/9, height);     
        vertex(x, y+50);   
    }
    endShape();

    updateAndDisplaybirds();
    removebirds();
    addbirds(); 
    //makeBoat(mouseX,random(520,525));

    push();
    translate(mouseX, random(500,505));
    noStroke();
    fill(255);
    beginShape();
    vertex(-20,-15);
    vertex(20,-15);
    vertex(10,0);
    vertex(-10,0);
    endShape();
    pop();
}


function updateAndDisplaybirds(){
    // Update the bird's positions, and display them.
    for (var i = 0; i < birds.length; i++){
        birds[i].move();
        birds[i].display();
    }
}

function removebirds(){
    var birdsToKeep = [];
    for (var i = 0; i < birds.length; i++){
        if (birds[i].x > 0) {
            birdsToKeep.push(birds[i]);
        }
    }
    //birds = birdsToKeep; // remember the surviving birds
}

function addbirds() {
    // With a very tiny probability, add a new bird to the end.
    var newBirdLikelihood = 0.005; 
    if (random(0,1) < newBirdLikelihood) {
        birds.push(makeBirds(width,random(0, height/2)));
    }
}

function birdsMove() {
    this.x += this.speed;
    this.y += random(-this.speed,this.speed);
}

function birdsDisplay() {
    translate(this.x,this.y);
    noStroke();
    fill(100);

    //body
    ellipse(0,0,20,10);

    //head
    triangle(-5,3,-15,0,-5,-3);

    //tail
    beginShape();
    vertex(8,-2);
    vertex(14,-3);
    vertex(14,3);
    vertex(8,2);
    endShape();

    //wings
    beginShape();
    vertex(-5,0);
    vertex(0,-10);
    vertex(12,-12);
    vertex(3,0);
    endShape();

}

function makeBirds(birthLocationX,birthLocationY) {
    var birds = {x: birthLocationX,
              y : birthLocationY,
                speed: -random(.5,1),
                move: birdsMove,
                display: birdsDisplay}
    return birds;
}

For this assignment I try to create an ink painting style graphic. The mountains and birds and rivers are all randomly produced.I made the sky a gradians of grey to increase the sense pf hierarchy. the three layers of mountains are moving with different speeds, and with different steepness.