Tuesday, February 23, 2016

MorphX

I really did not like this project. Finding a picture of me alone was hard, because all my pictures are at home/ I am in them with my brothers. Once I found a picture that worked, the file was small, so in MorphX it comes out blurry. Even though I like the program, I did not like the final outcome.


Posted by at No comments:

Thursday, February 18, 2016

Art Project

The Last Supper- Leonardo da Vinci

The Last Supper + Kim


The Scream- Edvard Munch

Kim

The Scream + Kim
 

Marilyn Monroe

Kim Original Photo

Original Photo B&W

Kim + Marilyn Monroe


Posted by at No comments:

Tuesday, February 16, 2016

Where in the world?

Original Background: Honokalani Black Sand Beach, Maui
Original picture: Spring Break 2015. Venice, FL
Final: Kim in Maui for vacation.

The final result JPG is very blurry. I think this is because the original image is 1444x1500. Overall, I really liked this project and I am proud of what I was able to do with blurring and the shadows.
Posted by at No comments:

JPG

100% JPG

75% JPG

50% JPG

0% JPG

Origional JPG

Gif 1: 2 colors, dither 77%, grey color shifted, 450 x 800, 22.53K

Gif 2: 8 colors, dither 10%, 50.06k

Gif 3: 256 colors, dither 0%, lossy 99%, web snap 100%, 44.73K
Gif 4: 32 colors, 70% dither, websnap 68%, lossy 18%, 91.45k

Gif 5: 8 colors, 38% dither, web snap 14%, lossy 37, 43.37k
Posted by at No comments:

Thursday, February 11, 2016

Autoscopy

began with

then
finished product

I decided to make my biggest weakness my addiction to shopping. Obviously, this is a problem because no one has enough money to buy everything they may want. I often get in fights with my parents about my spending problems. So, I decided to depict my problem by showing some of my favorite brands on top of my selfie.
Posted by at No comments:

Tuesday, February 9, 2016

PHOTOSHOP bw_color







I really enjoyed creating this project because I liked my original picture. Overall, I found the Photoshop program to be a bit simpler than Dreamweaver, but I believe my Dreamweaver project was overall more successful. Being that this is my first Photoshop attempt, I think it is alright.
Posted by at No comments:

Thursday, February 4, 2016

Canvas Final: Volleyball



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

//
var rdg2 = context.createLinearGradient(0,0,800,800);
rdg2.addColorStop(0, 'rgba(255, 30, 30, 0.75)');
rdg2.addColorStop(0.5, 'rgba(0, 0, 0, 0.90)');
// left pole
context.beginPath();
context.rect (0,0,800,600);
context.fillStyle = rdg2
context.fill();
context.stroke();
context.closePath();

 //VOLLEYBALL grad
var rdg = context.createRadialGradient(400,300,150,400,300,200);
rdg.addColorStop(0, 'rgb(253, 251, 252)');
rdg.addColorStop(0.5, 'rgba(249, 249, 249, 0.94)');
rdg.addColorStop(1, 'rgba(193, 193, 193, 0.99)');
//volleyball
  context.beginPath();
 context.arc(500, 450, 100, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'rgba(0, 0, 0, 1)'
 context.fillStyle= rdg
 context.fill();
 context.stroke();
context.closePath();
// TOP left middle LINE
context.beginPath();
 context.moveTo(401,430);
 context.quadraticCurveTo(450,370,503,400);
 context.stroke();
 context.closePath();
 // TOP  left bottom LINE
context.beginPath();
 context.moveTo(401,470);
 context.quadraticCurveTo(440,410,500,440);
 context.stroke();
 context.closePath();
// TOP top LEFT LINE
context.beginPath();
 context.moveTo(413,400);
 context.quadraticCurveTo(450,350,505,365);
 context.stroke();
 context.closePath();

 // bottom top LINE
context.beginPath();
 context.moveTo(413,500);
 context.quadraticCurveTo(480,400,599,460);
 context.stroke();
 context.closePath();

  // bottom bottom LINE
context.beginPath();
 context.moveTo(470,545);
 context.quadraticCurveTo(515,500,565,525);
 context.stroke();
 context.closePath();

  // bottom middle LINE
context.beginPath();
 context.moveTo(438,530);
 context.quadraticCurveTo(500,450,590,492);
 context.stroke();
 context.closePath();

 // right center (most left) LINE
context.beginPath();
 context.moveTo(510,350);
 context.quadraticCurveTo(490,430,520,438);
 context.stroke();
 context.closePath();

 // right side middle LINE
context.beginPath();
 context.moveTo(545,360);
 context.quadraticCurveTo(525,430,569,448);
 context.stroke();
 context.closePath();

  //
context.beginPath();
 context.moveTo(580,390);
 context.quadraticCurveTo(575,430,600,450);
 context.stroke();
 context.closePath();

// left pole
context.beginPath();
context.rect (50,100,25,600);
context.fillStyle = 'rgb(46, 49, 50)'
context.fill();
context.stroke();
context.closePath();
  
// right pole
context.beginPath();
context.rect (750,100,25,600);
context.fillStyle = 'rgb(46, 49, 50)'
context.fill();
context.stroke();
context.closePath();

//net grad
var grd = context.createLinearGradient(350,120,350,250);
grd.addColorStop(0, 'rgb(253, 251, 252)');
grd.addColorStop(0.5, 'rgba(249, 249, 249, 0.99)');
grd.addColorStop(1, 'rgb(147, 147, 147)');


// net
context.beginPath();
context.rect (75,100,675,200);
context.fillStyle = grd
context.fill();
context.stroke();
context.closePath();

//going left
context.beginPath();
context.moveTo(75,250);
context.lineTo(125,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(75,200);
context.lineTo(175,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(75,150);
context.lineTo(230,300);
context.lineTo(75,300);
context.stroke();
context.closePath();


//going left
 context.beginPath();
context.moveTo(75,100);
context.lineTo(280,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(125,100);
context.lineTo(330,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(175,100);
context.lineTo(380,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(225,100);
context.lineTo(425,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(275,100);
context.lineTo(475,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(315,100);
context.lineTo(515,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(360,100);
context.lineTo(560,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(400,100);
context.lineTo(600,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(450,100);
context.lineTo(650,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(500,100);
context.lineTo(700,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(550,100);
context.lineTo(750,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(550,100);
context.lineTo(750,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(750,250);
context.lineTo(600,100);
context.lineTo(750,100);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(750,200);
context.lineTo(650,100);
context.lineTo(750,100);
context.stroke();
context.closePath();
// going left
 context.beginPath();
context.moveTo(750,150);
context.lineTo(700,100);
context.lineTo(750,100);
context.stroke();
context.closePath();

// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(700,300);
context.lineTo(750,250);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(650,300);
context.lineTo(750,200);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(600,300);
context.lineTo(750,150);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(550,300);
context.lineTo(750,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(500,300);
context.lineTo(700,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(450,300);
context.lineTo(650,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(400,300);
context.lineTo(600,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(350,300);
context.lineTo(550,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(300,300);
context.lineTo(500,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(250,300);
context.lineTo(450,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(200,300);
context.lineTo(400,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(150,300);
context.lineTo(350,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(100,300);
context.lineTo(300,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(75,100);
context.lineTo(75,280);
context.lineTo(250,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(75,100);
context.lineTo(75,230);
context.lineTo(200,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(75,100);
context.lineTo(75,170);
context.lineTo(150,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(75,100);
context.lineTo(75,130);
context.lineTo(110,100);
context.stroke();
context.closePath();

// t
context.beginPath();

context.moveTo(150,510); // STARTING POINT
context.lineTo(150,450);
context.lineTo(125,450);
context.lineTo(150,510);
context.lineTo(125,510);
context.lineTo(125,450);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();


// t
context.beginPath();

context.moveTo(175,450); // STARTING POINT
context.lineTo(100,450);
context.lineTo(100,435);
context.lineTo(175,435);
context.lineTo(175,450);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

//b
  context.beginPath();
 context.arc(215, 455, 23, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'white'
 context.fillStyle= 'white'
 context.fill();
 context.stroke();
context.closePath();
//b
  context.beginPath();
 context.arc(215, 490, 25, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'white'
 context.fillStyle= 'white'
 context.fill();
 context.stroke();
context.closePath();

// b
context.beginPath();
context.moveTo(190,513); // STARTING POINT
context.lineTo(190,434);
context.lineTo(212,434);
context.lineTo(204,513);
context.lineTo(190,513);
context.lineTo(212,513);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

//b
  context.beginPath();
 context.arc(215, 490, 7, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = rdg2
 context.fillStyle= rdg2
 context.fill();
 context.stroke();
context.closePath();

//b
  context.beginPath();
 context.arc(215, 455, 7, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = rdg2
 context.fillStyle= rdg2
 context.fill();
 context.stroke();
context.closePath();

// v
context.beginPath();
context.moveTo(280,515); // STARTING POINT
context.lineTo(255,435);
context.lineTo(270,435);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'rgb(255, 255, 255)'
context.fillStyle= 'rgb(255, 255, 255)'
context.fill()
context.stroke();
context.closePath();

// v
context.beginPath();
context.moveTo(285,480); // STARTING POINT
context.lineTo(270,435);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

// v
context.beginPath();
context.moveTo(280,515); // STARTING POINT
context.lineTo(290,515);
context.lineTo(315,435);
context.lineTo(300,435);
context.lineTo(285,480);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'rgb(255, 255, 255)'
context.fillStyle= 'rgb(255, 255, 255)'
context.fill()
context.stroke();
context.closePath();

//v
// v
context.beginPath();
context.moveTo(280,515); // STARTING POINT
context.lineTo(285,480);
context.lineTo(280,470);
context.lineTo(270,470);
context.lineTo(270,470);
context.lineTo(275,480);
context.lineTo(280,500);
context.lineTo(270,440);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'rgb(255, 255, 255)'
context.fillStyle= 'rgb(255, 255, 255)'
context.fill()
context.stroke();
context.closePath();

//b
  context.beginPath();
 context.arc(355, 455, 23, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'rgb(255, 255, 255)'
 context.fillStyle= 'rgb(255, 255, 255)'
 context.fill();
 context.stroke();
context.closePath();
//b
  context.beginPath();
 context.arc(355, 490, 25, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'rgb(255, 255, 255)'
 context.fillStyle= 'rgb(255, 255, 255)'
 context.fill();
 context.stroke();
context.closePath();


//b bottom circle cut out
  context.beginPath();
 context.arc(355, 490, 7, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = rdg2
 context.fillStyle= rdg2
 context.fill();
 context.stroke();
context.closePath();

//b
context.beginPath();
context.moveTo(330,510); // STARTING POINT
context.lineTo(330,434);
context.lineTo(355,434);
context.lineTo(330,513);
context.lineTo(352,513);
context.lineTo(330,513);
context.lineTo(337,509);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'rgb(255, 255, 255)'
context.fillStyle= 'rgb(255, 255, 255)'
context.fill()
context.stroke();
context.closePath();

//b bottom circle cutout
 context.beginPath();
 context.arc(355, 455, 7, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = rdg2
 context.fillStyle= rdg2
 context.fill();
 context.stroke();
context.closePath();

//underline
context.beginPath();
context.moveTo(100,550);
context.bezierCurveTo(250,485,200,615,390,550);
 context.lineWidth=10;
  context.strokeStyle = 'rgb(255, 255, 255)'
  context.fillStyle = 'clear'
 context.fill();
 context.stroke();
context.closePath();
//// <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< YOUR CODE ENDS HERE


Posted by at No comments:

Tuesday, February 2, 2016

Final Canvas project...so far...

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title> ART 210 - CANVAS PROJECT </title>
<style type="text/css">


body,td,th {
font-family: Helvetica, Arial, sans-serif;
font-size: 12px;
color: rgba(0,0,0,1);
}


body {
background-color: rgba(255,255,255,1);
}


#myCanvas { border: rgba(102,0,255,1) medium dashed; }


</style>


</head>

<body>

<canvas id="myCanvas" width="800" height="600"></canvas>

<script>


var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');

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

//
var rdg2 = context.createLinearGradient(0,0,800,800);
rdg2.addColorStop(0, 'rgba(255, 30, 30, 0.75)');
rdg2.addColorStop(0.5, 'rgba(0, 0, 0, 0.90)');
// left pole
context.beginPath();
context.rect (0,0,800,600);
context.fillStyle = rdg2
context.fill();
context.stroke();
context.closePath();

 //VOLLEYBALL grad
var rdg = context.createRadialGradient(400,300,150,400,300,200);
rdg.addColorStop(0, 'rgb(253, 251, 252)');
rdg.addColorStop(0.5, 'rgba(249, 249, 249, 0.94)');
rdg.addColorStop(1, 'rgba(193, 193, 193, 0.99)');
//volleyball
  context.beginPath();
 context.arc(500, 450, 100, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'rgba(0, 0, 0, 1)'
 context.fillStyle= rdg
 context.fill();
 context.stroke();
context.closePath();
// TOP left middle LINE
context.beginPath();
 context.moveTo(401,430);
 context.quadraticCurveTo(450,370,503,400);
 context.stroke();
 context.closePath();
 // TOP  left bottom LINE
context.beginPath();
 context.moveTo(401,470);
 context.quadraticCurveTo(440,410,500,440);
 context.stroke();
 context.closePath();
// TOP top LEFT LINE
context.beginPath();
 context.moveTo(413,400);
 context.quadraticCurveTo(450,350,505,365);
 context.stroke();
 context.closePath();

 // bottom top LINE
context.beginPath();
 context.moveTo(413,500);
 context.quadraticCurveTo(480,400,599,460);
 context.stroke();
 context.closePath();

  // bottom bottom LINE
context.beginPath();
 context.moveTo(470,545);
 context.quadraticCurveTo(515,500,565,525);
 context.stroke();
 context.closePath();

  // bottom middle LINE
context.beginPath();
 context.moveTo(438,530);
 context.quadraticCurveTo(500,450,590,492);
 context.stroke();
 context.closePath();

 // right center (most left) LINE
context.beginPath();
 context.moveTo(510,350);
 context.quadraticCurveTo(490,430,520,438);
 context.stroke();
 context.closePath();

 // right side middle LINE
context.beginPath();
 context.moveTo(545,360);
 context.quadraticCurveTo(525,430,569,448);
 context.stroke();
 context.closePath();

  //
context.beginPath();
 context.moveTo(580,390);
 context.quadraticCurveTo(575,430,600,450);
 context.stroke();
 context.closePath();

// left pole
context.beginPath();
context.rect (50,100,25,600);
context.fillStyle = 'rgb(229, 249, 254)'
context.fill();
context.stroke();
context.closePath();
 
// right pole
context.beginPath();
context.rect (750,100,25,600);
context.fillStyle = 'rgb(229, 249, 254)'
context.fill();
context.stroke();
context.closePath();

//net grad
var grd = context.createLinearGradient(100,100,200,400);
grd.addColorStop(0, 'rgb(253, 251, 252)');
grd.addColorStop(0.5, 'rgba(249, 249, 249, 0.99)');
grd.addColorStop(1, 'rgba(193, 193, 193, 0.99)');


// net
context.beginPath();
context.rect (75,100,675,200);
context.fillStyle = grd
context.fill();
context.stroke();
context.closePath();

//going left
context.beginPath();
context.moveTo(75,250);
context.lineTo(125,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(75,200);
context.lineTo(175,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(75,150);
context.lineTo(230,300);
context.lineTo(75,300);
context.stroke();
context.closePath();


//going left
 context.beginPath();
context.moveTo(75,100);
context.lineTo(280,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(125,100);
context.lineTo(330,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(175,100);
context.lineTo(380,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(225,100);
context.lineTo(425,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(275,100);
context.lineTo(475,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(315,100);
context.lineTo(515,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(360,100);
context.lineTo(560,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(400,100);
context.lineTo(600,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(450,100);
context.lineTo(650,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(500,100);
context.lineTo(700,300);
context.lineTo(75,300);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(550,100);
context.lineTo(750,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(550,100);
context.lineTo(750,300);
context.lineTo(75,300);
context.stroke();
context.closePath();

//going left
 context.beginPath();
context.moveTo(750,250);
context.lineTo(600,100);
context.lineTo(750,100);
context.stroke();
context.closePath();
//going left
 context.beginPath();
context.moveTo(750,200);
context.lineTo(650,100);
context.lineTo(750,100);
context.stroke();
context.closePath();
// going left
 context.beginPath();
context.moveTo(750,150);
context.lineTo(700,100);
context.lineTo(750,100);
context.stroke();
context.closePath();

// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(700,300);
context.lineTo(750,250);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(650,300);
context.lineTo(750,200);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(600,300);
context.lineTo(750,150);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(550,300);
context.lineTo(750,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(500,300);
context.lineTo(700,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(450,300);
context.lineTo(650,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(400,300);
context.lineTo(600,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(350,300);
context.lineTo(550,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(300,300);
context.lineTo(500,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(250,300);
context.lineTo(450,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(200,300);
context.lineTo(400,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(150,300);
context.lineTo(350,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(750,300);
context.lineTo(100,300);
context.lineTo(300,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(75,100);
context.lineTo(75,280);
context.lineTo(250,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(75,100);
context.lineTo(75,230);
context.lineTo(200,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(75,100);
context.lineTo(75,170);
context.lineTo(150,100);
context.stroke();
context.closePath();
// going right
 context.beginPath();
context.moveTo(75,100);
context.lineTo(75,130);
context.lineTo(110,100);
context.stroke();
context.closePath();

// t
context.beginPath();

context.moveTo(150,510); // STARTING POINT
context.lineTo(150,450);
context.lineTo(125,450);
context.lineTo(150,510);
context.lineTo(125,510);
context.lineTo(125,450);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();


// t
context.beginPath();

context.moveTo(175,450); // STARTING POINT
context.lineTo(100,450);
context.lineTo(100,435);
context.lineTo(175,435);
context.lineTo(175,450);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

//b
  context.beginPath();
 context.arc(215, 455, 23, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'white'
 context.fillStyle= 'white'
 context.fill();
 context.stroke();
context.closePath();
//b
  context.beginPath();
 context.arc(215, 490, 25, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'white'
 context.fillStyle= 'white'
 context.fill();
 context.stroke();
context.closePath();

// b
context.beginPath();
context.moveTo(190,510); // STARTING POINT
context.lineTo(190,435);
context.lineTo(206,435);
context.lineTo(206,510);
context.lineTo(190,510);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

//b
  context.beginPath();
 context.arc(215, 490, 7, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'black'
 context.fillStyle= 'black'
 context.fill();
 context.stroke();
context.closePath();

//b
  context.beginPath();
 context.arc(215, 455, 7, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'black'
 context.fillStyle= 'black'
 context.fill();
 context.stroke();
context.closePath();

// v
context.beginPath();
context.moveTo(280,515); // STARTING POINT
context.lineTo(255,435);
context.lineTo(270,435);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

// v
context.beginPath();
context.moveTo(285,480); // STARTING POINT
context.lineTo(270,435);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

// v
context.beginPath();
context.moveTo(280,515); // STARTING POINT
context.lineTo(290,515);
context.lineTo(315,435);
context.lineTo(300,435);
context.lineTo(285,480);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

//v
// v
context.beginPath();
context.moveTo(280,515); // STARTING POINT
context.lineTo(285,480);
context.lineTo(280,470);
context.lineTo(270,470);
context.lineTo(270,470);
context.lineTo(275,480);
context.lineTo(280,500);
context.lineTo(270,440);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

//b
  context.beginPath();
 context.arc(355, 455, 23, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'white'
 context.fillStyle= 'white'
 context.fill();
 context.stroke();
context.closePath();
//b
  context.beginPath();
 context.arc(355, 490, 25, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'white'
 context.fillStyle= 'white'
 context.fill();
 context.stroke();
context.closePath();


//b bottom circle cut out
  context.beginPath();
 context.arc(355, 490, 7, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'black'
 context.fillStyle= 'black'
 context.fill();
 context.stroke();
context.closePath();

//b
context.beginPath();
context.moveTo(330,510); // STARTING POINT
context.lineTo(330,435);
context.lineTo(350,435);
context.lineTo(330,512);
context.lineTo(348,512);
context.lineTo(330,508);
context.lineWidth=6
context.lineCap = 'round';
context.lineJoin= 'round'
context.strokeStyle= 'white'
context.fillStyle= 'white'
context.fill()
context.stroke();
context.closePath();

//b bottom circle cutout
 context.beginPath();
 context.arc(355, 455, 7, 0*Math.PI, 2*Math.PI,false)
 context.lineWidth=2;
  context.strokeStyle = 'black'
 context.fillStyle= 'black'
 context.fill();
 context.stroke();
context.closePath();

//underline
context.beginPath();
context.moveTo(100,550);
context.bezierCurveTo(250,485,200,615,390,550);
 context.lineWidth=10;
  context.strokeStyle = 'white'
  context.fillStyle = 'clear'
 context.fill();
 context.stroke();
context.closePath();
//// <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< YOUR CODE ENDS HERE


// CHANGE THE CREDITS

context.beginPath();
context.font = 'bold 20px Arial';
context.fillStyle = "rgba(200,255,0,1)";
context.fillText('ART 210 - CANVAS PROJECT', 20, 550);
context.closePath();

</script>


</body>
</html>



Posted by at No comments:
Subscribe to: Posts (Atom)