Tuesday, February 27, 2018



This definetly wasnt an easy task to overcome, and was most definetly a learning process. I wanted to make it as best as i could due to the fact of how serious the topic is. I started out with just having my face with all the words and i felt i was missing something. I decided i was going to put names of just some of the schools, who have suffered mass shootings; because this isnt just about one school shooting this is about evoking chnage and realizing this is an epidemic. I am so happy i decided to do this because it really pulled my piece all together. I am also very please with the font i chose for the backround, i wanted to go for something that looked like student/childrens writing, because thats where these horrible tragedies occured. im defiently pleased with the turn out overall.


at No comments:

Thursday, February 8, 2018



The Extraterrestrial Gothic. This is my spin off of the classic painting, The American Gothic. This most definitely wasn't an easy task to take on, and certainly consumed a lot of time, but I am so happy with the outcome of it. I knew when i came up with the idea, that i wanted it to be simple enough so when you looked at it you knew exactly what painting it was inspired by; but also detailed enough that it was this beautiful amazing thing to look at. Overall I am so happy with the turn out!



//// >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> YOUR CODE STARTS HERE





//BACKROUND
    var myGradient = context.createLinearGradient(800,0,800,600,1);

    myGradient.addColorStop(0,"rgba(70,0,111,1)");
   
   
    myGradient.addColorStop(0.5,"rgba(0,2,102,1)");
    myGradient.addColorStop(0.6,"rgba(0,2,102,1)");
    myGradient.addColorStop(0.7,"rgba(0,2,102,1)");
    myGradient.addColorStop(.2,"rgba(0,0,9,1)");
    myGradient.addColorStop(1,"rgba(151,64,19,1)");
    myGradient.addColorStop(.9,"rgba(125,64,0,1)");
    myGradient.addColorStop(.8,"rgba(159,128,82,1)");
   
   
    context.beginPath();
    context.rect(0,0,canvas.width,canvas.height);
   
    context.closePath();
   
    context.fillStyle = myGradient
    context.fill();
   
    context.stroke();
   
    ///bottom left planet
   
    var myGradienth = context.createRadialGradient(100,300,20,400,325,405);
    myGradienth.addColorStop(0,"rgba(104,0,237,0.5)");//white
    myGradienth.addColorStop(1,"rgba(28,194,148,0.5)");//green
    myGradienth.addColorStop(0.5,"rgba(224,205,29,0.5)");//purple
    myGradienth.addColorStop(0.85,"rgba(247,93,74,0.5)");//dark brown
    myGradienth.addColorStop(0.25,"rgba(255,255,255,0.5)");
   
    context.beginPath();
   
        context.arc(125,300,125,0,Math.PI*2,true);
   
    context.closePath();
    context.fillStyle= myGradienth
    context.fill();
   
   
   
   
   
    //topright
   
    context.beginPath();
    var myGradient3 = context.createRadialGradient(400,550,50,200,450,400);
    myGradient3.addColorStop(0,"rgba(24,224,5,1)");//white
    myGradient3.addColorStop(1,"rgba(123,194,0,1)");//green
    myGradient3.addColorStop(0.5,"rgba(237,227,0,1)");//purple
    myGradient3.addColorStop(0.85,"rgba(0,247,82,1)");//dark brown
    myGradient3.addColorStop(0.25,"rgba(3,92,70,1)");
   
        context.arc(400,250,95,0,Math.PI*2,true);
   
    context.closePath();
    context.fillStyle= myGradient3
    context.fill();
   
    context.stroke();

   
    ////stars
   
   
    context.beginPath();
   
        context.arc(150,80,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
   
        context.arc(145,10,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
   
        context.arc(250,60,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
   
        context.arc(200,180,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
        context.arc(210,90,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
   
        context.arc(190,40,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
   
        context.arc(230,20,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
    context.arc(175,125,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
context.arc(145,160,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
    context.beginPath();
    context.arc(300,125,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
    context.arc(305,15,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.beginPath();
    context.arc(325,40,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   

   
   
        context.beginPath();
    context.arc(40,160,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
        context.beginPath();
    context.arc(30,215,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
        context.beginPath();
    context.arc(70,185,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
        context.beginPath();
    context.arc(125,135,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
        context.beginPath();
    context.arc(270,75,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
        context.beginPath();
    context.arc(240,245,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
        context.beginPath();
    context.arc(245,135,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
        context.beginPath();
    context.arc(245,35,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
        context.beginPath();
    context.arc(350,100,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
   
        context.beginPath();
    context.arc(375,50,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
        context.beginPath();
    context.arc(420,85,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
        context.beginPath();
    context.arc(415,5,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
        context.beginPath();
    context.arc(225,15,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
        context.beginPath();
    context.arc(425,35,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
        context.beginPath();
    context.arc(450,15,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
    context.arc(455,105,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
   
    context.arc(470,35,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.arc(480,95,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.arc(520,15,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
   
    context.arc(500,55,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
   
    context.arc(10,355,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
   
   
   

   
   
    context.arc(275,190,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
   
   
   
   
   
   
   
    context.arc(250,280,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.arc(275,360,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
   
   
   
   
    context.arc(775,400,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
    context.arc(770,290,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
    context.arc(795,200,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.arc(775,250,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
    context.arc(765,230,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
    context.arc(775,350,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
    context.arc(325,400,2,0,Math.PI*2,true);
    context.fillStyle= "rgba(237,227,0,1)"
    context.fill();
context.closePath();
   
   
   
   
   
   
   
////////// end of stars    
   
   
   
   
   
   
   
    /////planet
context.beginPath();

    var myGradientl = context.createRadialGradient(650,200,00,400,350,600);
    myGradientl.addColorStop(0,"rgba(50,25,245,1)");//white

    myGradientl.addColorStop(0.5,"rgba(67,60,245,1)");//purple
   
    myGradientl.addColorStop(0.25,"rgba(200,116,80,1)"); //red
       
    context.beginPath();
   
        context.arc(650,100,150,0,Math.PI*2,true);
   
    context.closePath();
    context.fillStyle= myGradientl;
    context.fill();
   
   

   
   
   
    //HOUSE OUTLINE
    var myGradient4 = context.createRadialGradient(450,650,50,400,350,400);
    myGradient4.addColorStop(0,"rgba(159,151,93,1)");//white
    myGradient4.addColorStop(1,"rgba(159,158,146,1)");
   
   
    context.beginPath();
    context.moveTo(350,450);
    context.lineTo(350,200);
    context.lineTo(550,100)
    context.lineTo(750,200)
    context.lineTo(750,450)
    context.closePath();
    context.fillStyle = myGradient4
    context.fill();
    context.strokeStyle ="white"
    context.fill();
   
   
    //roof of housse
   
    var myGradient1 = context.createRadialGradient(500,313,98,750,320,50);
    myGradient1.addColorStop(0,"rgba(83,47,0,1)");//white
    myGradient1.addColorStop(1,"rgba(83,35,0,1)");
   
    context.beginPath();
    context.moveTo(475,250);
    context.lineTo(350,300);
    context.lineTo(750,300);
    context.lineTo(625,250);
   
    context.closePath();
    context.fillStyle = myGradient1   
    context.fill();
    context.strokeStyle =myGradient1
    context.fill();
    context.stroke();
   
    //lines on roof
   
    context.beginPath();
    context.moveTo(475,250);
    context.lineTo(400,300);
   
    context.closePath();
   
    context.strokeStyle = "black"
    context.fill();
    context.stroke();
   
    context.beginPath();
    context.moveTo(500,250);
    context.lineTo(450,300);
   
    context.closePath();
   
    context.strokeStyle = "black"
    context.fill();
    context.stroke();
   
    context.beginPath();
    context.moveTo(550,250);
    context.lineTo(550,300);
   
    context.closePath();
   
    context.strokeStyle = "black"
    context.fill();
    context.stroke();
    //left ot center
    context.beginPath();
    context.moveTo(520,250);
    context.lineTo(500,300);
   
    context.closePath();
   
    context.strokeStyle = "black"
    context.fill();
    context.stroke();

    //third to last
    context.beginPath();
    context.moveTo(575,250);
    context.lineTo(600,300);
   
    context.closePath();
   
    context.strokeStyle = "black"
    context.fill();
    context.stroke();
   
    //second to last far right
    context.beginPath();
    context.moveTo(600,250);
    context.lineTo(650,300);
   
    context.closePath();
   
    context.strokeStyle = "black"
    context.fill();
    context.stroke();
   
    //farright
   
    context.beginPath();
    context.moveTo(625,250);
    context.lineTo(700,300);
   
    context.closePath();
   
    context.strokeStyle = "black"
    context.fill();
    context.stroke();
   
   
   
   
   
    ////second floor window
   
   
   
   
    context.beginPath();
   
    context.moveTo(520,150);
    context.lineTo(520, 220);
    context.lineTo(575, 220);
    context.lineTo(575, 150);
   
   
    context.closePath();
    context.fillStyle= "black"
    context.fill();
   
    context.stroke();
   
    ///lines on window vertical
    context.beginPath();
   
    context.moveTo(550,150);
    context.lineTo(550,220)
   
   
   
    context.closePath();
    context.strokeStyle = "white"
    context.fill();
    context.stroke();
   
    //line on window horizontal
   
    context.beginPath();
   
    context.moveTo(520,185);
    context.lineTo(575,185)
   
   
   
    context.closePath();
    context.strokeStyle = "white"
    context.fill();
    context.stroke();
   
   
   
    ///DOORS
    context.beginPath();
   
    context.moveTo(470,330);
    context.lineTo(470,450);
    context.lineTo(620,450);
    context.lineTo(620,330)
   
   
   
    context.closePath();
    context.strokeStyle = "white"
    context.fill();
    context.stroke();
   
    ///DETAILS ON DOOR<
    context.beginPath();
   
    context.moveTo(470,330);
    context.lineTo(550,450);
    context.lineTo(620,330);
   
   
   
   
    context.closePath();
    context.strokeStyle = "white"
   
    context.lineWidth = 2
    context.stroke();
   
    //cross to top
    context.beginPath();
   
    context.moveTo(470,450);
    context.lineTo(550,330);
    context.lineTo(620,450)
   
   
   
   
   
    context.closePath();
    context.strokeStyle = "white"
   
    context.lineWidth = 2
    context.stroke();
   
    ///Center line of door
   
    context.beginPath();
    context.moveTo(550,330);
    context.lineTo(550,450)
   
    context.closePath();
    context.strokeStyle = "white"
    context.stroke();
   
   
    ///CORNER PLANET
    //corner planet
   
    var myGradient4 = context.createRadialGradient(0,0,20,400,325,405);
    myGradient4.addColorStop(0,"rgba(93,9,2,0.5)");//white
    myGradient4.addColorStop(1,"rgba(28,194,148,0.5)");//green
    myGradient4.addColorStop(0.5,"rgba(224,205,29,0.5)");//purple
    myGradient4.addColorStop(0.85,"rgba(247,93,74,0.5)");//dark brown
    myGradient4.addColorStop(0.25,"rgba(255,255,255,0.5)");
   

context.beginPath();
   
        context.arc(50,50,75,0,Math.PI*2,true);
   
    context.closePath();
    context.fillStyle= myGradient4
    context.fill();
   

   
   
    ///Behind ALIENS HEAD
   
    context.beginPath();
    var myGradient3 = context.createRadialGradient(400,550,50,200,450,400);
    myGradient3.addColorStop(0,"rgba(24,224,5,1)");//white
    myGradient3.addColorStop(1,"rgba(123,194,0,1)");//green
    myGradient3.addColorStop(0.5,"rgba(237,227,0,1)");//purple
    myGradient3.addColorStop(0.85,"rgba(0,247,82,1)");//dark brown
    myGradient3.addColorStop(0.25,"rgba(3,92,70,1)");
   
        context.arc(400,250,95,0,Math.PI*2,true);
   
    context.closePath();
    context.fillStyle= myGradient3
    context.fill();
   
    context.stroke();

   
    //criclesaroundtopright
   
    context.beginPath();
   
        context.arc(400,250,115,0,Math.PI*2,true);
   
    context.stroke();
    context.strokeStyle= "rgba(3,92,70,1)"
    context.lineWidth=2

   
    context.beginPath();
   
        context.arc(400,250,100,0,Math.PI*2,true);
    context.strokestyle= "rgba(123,194,0,1)"
    context.linewidth= 2
    context.stroke();

    context.beginPath();
   
        context.arc(400,250,110,0,Math.PI*2,true);
    context.strokeStyle= "rgba(237,227,0,1)"
    context.stroke();
   
    //ALIENS ARM
        var myGradientc = context.createRadialGradient(400,300,20,400,350,200);
    myGradientc.addColorStop(0,"rgba(250,25,40,1");
   
    myGradientc.addColorStop(1,"rgba(0,0,0,1)"); //red
       
    context.beginPath();
    context.moveTo(275,400);
    context.lineTo(320,600);
    context.lineTo(500,600);
   
    context.closePath();
    context.fillStyle= myGradientc;
    context.fill();
   
   
   
    ////PITCH FORK
   
   
    context.beginPath();
    context.moveTo(235,350);
    context.lineTo(235,600);
    context.lineTo(245,600);
    context.lineTo(245,350);
   
    context.closePath();
    context.fillstyle= myGradientf
    context.fill();
   
   
    //PITCH FORK  rangs
   
    context.beginPath();
   
    var myGradientf = context.createLinearGradient(800,0,800,600,1);

    myGradientf.addColorStop(0,"rgba(100,100,100,1)");
   
   
   
    context.moveTo(205,350);
    context.lineTo(275,350);
    context.lineTo(270,200);
    context.lineTo(265,300);
    context.lineTo(265,340);
    context.lineTo(245,340);
    context.lineTo(240,200);
    context.lineTo(235,340);
    context.lineTo(215,340);
    context.lineTo(210,200);
    context.lineTo(205,300);
    context.closePath();
    context.fillStyle= myGradientf
    context.fill();
    context.strokeStyle = "rgba(0,0,0,1)"
    context.stroke();
    //hand
   
        context.beginPath();
    context.moveTo(275,410);
    context.lineTo(230,410);
    context.lineTo(230,425);
    context.lineTo(275,425);
   
   
   
    context.fillStyle= "rgba(255,5,85,1)"
    context.fill();
    context.closePath();
   
   
   
   
   
    //aliens habd sleve
   
        var myGradientc = context.createRadialGradient(400,300,20,400,350,200);
    myGradientc.addColorStop(0,"rgba(250,25,40,1");
   
    myGradientc.addColorStop(1,"rgba(0,0,0,1)"); //red
       
    context.beginPath();
    context.moveTo(275,400);
    context.lineTo(200,500);
    context.lineTo(300,450);
   
    context.closePath();
    context.fillStyle= myGradientc;
    context.fill();
   
   
   
    //ALIENS BODY
   
    var myGradientc = context.createRadialGradient(400,300,20,400,350,200);
    myGradientc.addColorStop(0,"rgba(250,5,90,1");
   
    myGradientc.addColorStop(1,"rgba(1,0,0,1)"); //red
       
    context.beginPath();
    context.moveTo(400,300);
    context.lineTo(300,600);
    context.lineTo(500,600);
   
    context.closePath();
    context.fillStyle= myGradientc;
    context.fill();
   
    ///LEFT ALIENS FACE
   
   
    context.beginPath();
   
    var myGradienta = context.createRadialGradient(550,400,50,400,350,400);
    myGradienta.addColorStop(0,"rgba(250,25,245,1)");//white
    myGradienta.addColorStop(1,"rgba(0,130,60,1)");//green
    myGradienta.addColorStop(0.5,"rgba(67,6,145,1)");//purple
    myGradienta.addColorStop(0.85,"rgba(40,27,2,1)");//dark brown
    myGradienta.addColorStop(0.25,"rgba(250,20,45,1)"); //red
    context.moveTo(400,420);//a
    //context.quadraticCurveTo(200,305,400,200);//CP1 B
    //context.quadraticCurveTo(600,300,400,420);
   
    context.bezierCurveTo(200,305,300,200,400,200);//CP1 B
    context.bezierCurveTo(500,200,600,300,400,420);
   
   
    context.closePath();
    context.fillStyle = myGradienta
    context.fill();
    context.strokeStyle= "black"
    context.fill();
   
   
    ///ALIEN EYE
    context.beginPath();
   
   
    var myGradientb = context.createRadialGradient(400,300,1,400,290,50);
    myGradientb.addColorStop(0,"rgba(255,0,0,1)");
    myGradientb.addColorStop(0.25,"rgba(0,0,0,1)");
    myGradientb.addColorStop(0.5,"rgba(0,0,0,1)");
    myGradientb.addColorStop(1,"rgba(0,0,255,1)");
    //starting coordinates
    context.moveTo(350,290);
    //quad requires cp1x, cp1y, bx,by=ending point
    context.quadraticCurveTo(400,200,450,290);//firstbump
   
    //close shape
    context.quadraticCurveTo(400,350,350,290)
   
   
    context.closePath();
   
    context.fillStyle = myGradientb;
    context.fill();
   
    context.stroke();
   
    ///PINK ALIENS MOUTH
   
    context.beginPath();
    context.moveTo(370,350);
    context.lineTo(425,350);
    context.lineTo(370,360);
    context.lineTo(425,360)
   
    context.closePath();
    context.fill();
    context.strokeStyle ="white"
    context.stroke();

   
   
   
   
   
   
    //right aliens body
   
    var myGradiente = context.createRadialGradient(650,300,20,650,450,175);
    myGradiente.addColorStop(0,"rgba(10,190,20,1");
   
    myGradiente.addColorStop(1,"rgba(0,0,0,1)"); //red
       
    context.beginPath();
    context.moveTo(650,350);
    context.lineTo(550,600);
    context.lineTo(750,600);
   
    context.closePath();
    context.fillStyle= myGradiente;
    context.fill();
   
   
    ///Right ALIEN HEAD
   
   
   
    context.beginPath();
   
    var myGradientd = context.createRadialGradient(650,380,50,400,350,400);
    myGradientd.addColorStop(0,"rgba(110,153,3,1)");//white
    myGradientd.addColorStop(.5,"rgba(62,83,8,1)");//green
   
    myGradientd.addColorStop(0.85,"rgba(0,159,2,1)");//dark brown
    myGradientd.addColorStop(0.25,"rgba(30,159,20,1)");
    context.moveTo(650,420);//a
   
    context.bezierCurveTo(450,300,600,200,650,200);//CP1 B
    context.bezierCurveTo(700,200,850,300,650,420)
   

   
   
   
    context.closePath();
    context.fillStyle = myGradientd
    context.fill();
    context.strokeStyle= "black"
    context.fill();
   
   
   
    ///right green aliens left eyes
    var myGradientq = context.createRadialGradient(610,300,25,600,290,10);
    myGradientq.addColorStop(0,"rgba(0,0,0,1)");
    myGradientq.addColorStop(0.5,"rgba(140,0,0,1)");
   
    context.beginPath();
   
    //starting coordinates ax ay
    context.moveTo(620,320);
   
    //bezier curve
    //cp1x cp1y cp2x cp2y bx by
    context.bezierCurveTo(500,250,650,250,620,320)
   
    context.closePath();
   
    context.fillStyle = myGradientq;
    context.fill();
   
   
   
    //right eye
   
    var myGradientr = context.createRadialGradient(690,300,25,690,290,10);
    myGradientr.addColorStop(0,"rgba(0,0,0,1)");
    myGradientr.addColorStop(0.5,"rgba(140,0,0,1)");
   
    context.beginPath();
   
    //starting coordinates ax ay
    context.moveTo(680,320);
   
    //bezier curve
    //cp1x cp1y cp2x cp2y bx by
    context.bezierCurveTo(650,250,780,250,680,320)
   
    context.closePath();
   
    context.fillStyle = myGradientr
    context.fill();
   
   
   
    ////right aliens mouth
   
    context.beginPath();
   
    //starting coordinates ax ay
    context.moveTo(625,370);
   
    //bezier curve
    //cp1x cp1y cp2x cp2y bx by
    context.bezierCurveTo(550,350,750,350,690,370)
   
    context.closePath();
    context.fillstyle= myGradient
    context.fill();
   
   
    context.stroke();
   
    //// <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< YOUR CODE ENDS HERE


at No comments:
Subscribe to: Posts (Atom)

Portfolio examples

https://www.cdysong.com/ https://www.manasparadkar.com/#/no-more/ https://nerdcloud.com/portfolio/gmail-minimalist

  • (no title)
    I was inspired by the David Bowie album to tale my picture into color. i really enjoyed this task, Definetly  see where there is room ...
  • (no title)
    This project definitely taught me alot about photoshop, while at the same time allowing me to be very creative. I chose to put myself i...
  • (no title)
    This was my poster, It was a 90s inspired theme.