"Back To The Future Hearts"

I had a really hard time with this project, because this is a completely different language for me. I had no idea where to start, or what to do, and I was very  lost. So I decided to follow the instructions, make and abstract image, and have ten shapes. The image is up for interpretation. The bright colors looked nice against the black, and it reminded me of glow in the dark, or laser tag. And since today is October 21, 2015, also known as "Back To The Future" day; I thought I would give this a retro essence. It is fun and playful; yet could be seen as dark and lonely. There are many vacant spaces within the sort-of triangle I created. You could interpret that there is enough space for these objects to leave, but they don’t. Some are on top of one another, and some layover one another. It could be interpreted that they are individuals that have each other, and that is just enough, they are comfortable where they are. It could be interpreted that the objects isolating themselves; yet still within the bigger triangle, represent fear of people, or socialization, but the need to be accepted and conform within a group. There are many interpretations this abstract image could draw out. 

context.beginPath();
      context.rect(50, 13, 575, 530);
      context.fillStyle = 'black';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'blue';
      context.stroke();


context.beginPath();
      context.moveTo(88, 50);
      context.quadraticCurveTo(188, 200, 100, 150);
      context.lineWidth = 8;

      // line color
      context.strokeStyle = 'pink';
      context.stroke();
     
      context.beginPath();
      context.moveTo(100, 150);
      context.lineTo(450, 50);
      context.lineWidth= 3;
      context.stroke();
// line color
      context.strokeStyle = 'aqua';
      context.stroke();
     
     
context.beginPath();
      context.moveTo(250, 350);
      context.lineTo(450, 50);
      context.lineWidth= 3;
      context.lineCap = 'butt' ;
      context.stroke();
   
     
// line color
      context.strokeStyle = 'purple';
      context.stroke();
     
      context.beginPath();
      context.moveTo(230, 345);
      context.bezierCurveTo(200, 200, 205, 200, 200, 105);
      context.lineWidth = 5;

      // line color
      context.strokeStyle = 'green';
      context.stroke();
     
      context.beginPath();
      context.rect(150, 213, 75, 30);
      context.fillStyle = 'orange';
      context.fill();
      context.lineWidth = 1;
      context.strokeStyle = 'blue';
      context.stroke();

    context.beginPath();
      context.arc(275, 200, 70, 20, Math.PI, false);
      context.closePath();
      context.lineWidth = 5;
      context.fillStyle = 'red';
      context.fill();
      context.strokeStyle = 'pink';
      context.stroke();
     
      context.beginPath();
      context.moveTo(-350, -200);
      context.lineTo(250, 350);
      context.lineWidth = 3;
      context.strokeStyle = 'red'
      context.stroke();
     
      context.beginPath();
      context.arc(299, 125, 13, 100, Math.PI, false);
      context.closePath();
      context.lineWidth = 2;
      context.fillStyle = 'purple';
      context.fill();
      context.strokeStyle = 'blue';
      context.stroke();
     
     context.beginPath();
      context.arc(375, 100, 13, 100, Math.PI, false);
      context.closePath();
      context.lineWidth = 2;
      context.fillStyle = 'purple';
      context.fill();
      context.strokeStyle = 'blue';
      context.stroke();
   
   
     
   
      var x = canvas.width / 4;
      var y = canvas.height / 4.8;
      var radius = 50;
      var startAngle = 2 * Math.PI;
      var endAngle = 1.9 * Math.PI;
      var counterClockwise = false;

      context.beginPath();
      context.arc(x, y, radius, startAngle, endAngle, counterClockwise);
      context.lineWidth = 10;

      // line color
      context.strokeStyle = 'aqua';
      context.stroke();
     
   
      var x = canvas.width / 2.5;
      var y = canvas.height / 3.5;
      var radius = 20;
      var startAngle = 1.9 * Math.PI;
      var endAngle = 2.9 * Math.PI;
      var counterClockwise = false;

      context.beginPath();
      context.arc(x, y, radius, startAngle, endAngle, counterClockwise);
      context.lineWidth = 7;

      // line color
      context.strokeStyle = 'magenta';
      context.stroke();