Scribd Logo
Upload

Welcome to Scribd!

  • 18 views

    Lab #2

    Uploaded by

    Alex Der
    This document contains code for drawing a scene in p5.js that includes: - Clouds moving across the sky - A sun rising over the horizon - A cartoon animal character with a body, horns, head, eyes, ears, nose, and text identifying the artist - Additional decorative details are added to the character like circles and lines The code uses variables, functions, basic shapes, arcs, ellipses, rectangles, text, and transformations to render the scene.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    Lab #2

    Uploaded by

    Alex Der
    18 views4 pages
    This document contains code for drawing a scene in p5.js that includes: - Clouds moving across the sky - A sun rising over the horizon - A cartoon animal character with a body, horns, head, eyes, ears, nose, and text identifying the artist - Additional decorative details are added to the character like circles and lines The code uses variables, functions, basic shapes, arcs, ellipses, rectangles, text, and transformations to render the scene.

    Original Description:

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    This document contains code for drawing a scene in p5.js that includes: - Clouds moving across the sky - A sun rising over the horizon - A cartoon animal character with a body, horns, head, eyes, ears, nose, and text identifying the artist - Additional decorative details are added to the character like circles and lines The code uses variables, functions, basic shapes, arcs, ellipses, rectangles, text, and transformations to render the scene.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    18 views4 pages

    Lab #2

    Uploaded by

    Alex Der
    This document contains code for drawing a scene in p5.js that includes: - Clouds moving across the sky - A sun rising over the horizon - A cartoon animal character with a body, horns, head, eyes, ears, nose, and text identifying the artist - Additional decorative details are added to the character like circles and lines The code uses variables, functions, basic shapes, arcs, ellipses, rectangles, text, and transformations to render the scene.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    of 4

    let cloudx = 100;

    let cloudy = 100;


    let sunx = 100;
    let suny = 100;
    var a = 0.0;
    var s = 0.0;

    function setup() {
    createCanvas(700, 500);
    }

    function draw() {
    background(51, 255, 255);

    makeCloud(cloudx, cloudy-30);
    makeCloud(cloudx-75, cloudy+125);
    makeCloud(cloudx + 400, cloudy + 100)
    fill(95, 160, 0);
    noStroke();
    arc(250, 500, 800, 400, PI, 0);
    fill(102, 204, 0)
    arc(75, 525, 450, 300, PI, 0);
    fill(76, 170, 0);
    arc(350, 525, 550, 250, PI, 0);
    cloudx+=0.1;

    /////////////////////////////////////////////////

    strokeWeight(3);
    stroke(0);

    //BODY
    fill(255, 255, 255);
    square(315, 300, 400, 20);
    //decor
    fill(0,0,0);
    circle(715, 340, 80);
    circle(695, 495, 150);
    circle(415, 410, 160);
    ///////////////////////////////////////////////////////

    //HORNS
    fill(255,128,0);
    //right
    beginShape();
    curveVertex(200, 75);
    curveVertex(200, 75); //x,y(1)
    curveVertex(195, 50);
    curveVertex(205, 10); //Top
    curveVertex(225, 50);
    curveVertex(245, 75); //x,y(2)
    curveVertex(245, 75);
    endShape();

    //left
    beginShape();
    curveVertex(497, 75);
    curveVertex(497, 75); //x,y(1)
    curveVertex(503, 50);
    curveVertex(495, 5); //Top
    curveVertex(470, 35);
    curveVertex(430, 75); //x,y(2)
    curveVertex(430, 75);
    endShape();
    //////////////////////////////////////////////////////////////

    //HEAD
    fill(255,255,255);
    rect(200, 75, 300, 310, 10, 10, 0, 0);
    //decor
    fill(0, 0, 0);
    arc(200, 310, 100, 155, PI+HALF_PI, HALF_PI);
    arc(500, 250, 100, 232, HALF_PI, PI+HALF_PI);
    arc(350, 75, 150, 100, TWO_PI, PI);
    ////////////////////////////////////////////////////////////////

    //EYES
    //right
    ellipseMode(RADIUS);
    fill(255);
    ellipse(300, 175, 35, 35); //eyeball
    ellipseMode(CENTER);
    fill(0);
    ellipse(310, 175, 20, 20); //pupil
    //left
    ellipseMode(RADIUS);
    fill(255);
    ellipse(395, 177, 32, 32); //eyeball
    ellipseMode(CENTER);
    fill(0);
    ellipse(385, 177, 20, 20); //pupil

    ////////////////////////////////////////////////////////////////

    //EARS
    //right
    fill(255, 255, 255);
    beginShape();
    curveVertex(199, 82);
    curveVertex(199, 82); //x,y(1)
    curveVertex(199, 79);
    curveVertex(150, 125); //1st fold
    curveVertex(80, 175); //Top
    curveVertex(150, 190); //Bottom
    curveVertex(190, 115); //2nd fold
    curveVertex(199, 105); //x,y(2)
    curveVertex(199, 105);
    endShape();

    //left
    fill(255, 255, 255);
    beginShape();
    curveVertex(501, 79);
    curveVertex(501, 79); //x,y(1)
    curveVertex(515, 82);
    curveVertex(600, 135);
    curveVertex(645, 145); //Top
    curveVertex(635, 175); //Middle
    curveVertex(580, 185); //Bottom
    curveVertex(520, 115);
    curveVertex(501, 105); //x,y(2)
    curveVertex(501, 105);
    endShape();
    ///////////////////////////////////////////////////////////////////

    //NOSE
    fill(255,110,255);
    arc(350, 386, 300, 140, 0, PI);
    fill(0, 0, 0);
    strokeWeight(30);
    point(310,410,25);
    point(390,410,25);
    //////////////////////////////////////////////////////////////////

    //Ear's Decor
    noSmooth();
    line(120, 179, 140, 180);
    strokeWeight(23);
    line(144, 182, 160, 157);
    line(570, 129, 595, 146);
    line(600, 148, 616, 151);
    ///////////////////////////////

    //Text
    noStroke();
    textSize(21);
    textAlign(LEFT);
    text('Михайлова Наталья IBM-222', 5, 495);
    ///////////////////////////////////////////////////

    makeSunrise(sunx, suny);

    function makeCloud(cloudx, cloudy) {


    fill(230);
    noStroke();
    ellipse(cloudx, cloudy, 100, 80);
    ellipse(cloudx + 10, cloudy + 10, 100, 80);
    ellipse(cloudx - 20, cloudy + 10, 100, 80);
    }

    function makeSunrise(sunx,suny){
    fill(226, 213, 30);
    noStroke();
    a = a + 0.04;
    s = cos(a)*1.5;
    translate(750, 0);
    scale(s);
    circle(50, 0, 150);
    }

    You might also like