Monday, December 11, 2017

Tama River Redone Image and Link to Behance Profile -Extra Credit

This project was to recreate an image, which was the Tama River in the Musashi Province in a new and different way. I recreated the image focusing on the details over the water and the stems of the the trees by changing the image.
 Original Image
Link to Behnace https://www.behance.net/gallery/59776851/BB-8-Created-with-Star-Wars-Words-and-a-song

Sunday, December 10, 2017

Stop Motion - Baseball is more than a Game

This stop motion video was made to illustrate how real friends in the world won't leave a friend behind, but if you are left behind then that person might not really be your friend. The baseball is used as a symbol to illustrate this friendship.



Wednesday, November 15, 2017

Civil War General Painting - Face Replaced

Using an original painting of a civil war general, I replaced his face with mine by blending and using effects to make my face look like it was painted at the same time, unfortunately the generals skin was much lighter than mine.

Monday, November 13, 2017

Where was I when I was younger?

I used an old image when I was much younger when I dressed up as a outlaw and I used an original image from a mine in Nevada to make it look as if I was there right on the mine.

Autoscopy, I'm a Tree?

Using a picture of myself, in Photoshop I put myself onto a tree and blended the texture as if I was part of the tree.

Wednesday, November 1, 2017

Self Portrait

Using a photo of myself when I went fishing, I recreated a majority of my face and for the background I included the major cities that I have lived within driving distance throughout my life. This include Detroit Michigan, Denver Colorado, Brussels, Belgium, Chicago Illinois, and currently Tampa Florida.

Gradient Mesh - Cherry

Using Adobe Photoshop to create an image, I took a picture of a cherry from home and used gradient mesh to recreate the cherry digitally. 

Tuesday, October 17, 2017

Business Card

Using the logos I've created I made a business card to illustrate myself. Using the aspect of me being surrounded by the world, similar to how the sun is the center of our solar system.

Thursday, October 12, 2017

5 Logos Finished Final Versions

These are final versions of my logo, that I created for myself based on different aspects of my personality including my love for nature, fishing, sports especially baseball, being an American, and my how we are just one planet in our solar system and that we can be the center of the people around us.

Tuesday, October 10, 2017

Logo Sketches and Final Versions

Using different aspects of my personality I sketched different ways to create my nickname from childhood, Wowie, to create a logo to express and symbolize myself so I can use the different versions towards my future career. My interests include sports, a republican, travel, nature, fishing, and space. These are the sketches I created to reach my final versions.










Wednesday, October 4, 2017

Image with Song and Words


I used the song Everyday People by Sly & The Family Stone because it tells how everyone is the same no matter what race or skin color, or where your from. Everyone is a human and everyone deserves equal rights and freedom. I chose BB-8 to illustrate how in Star Wars he is a droid but the people around him like Poe, Rey, and Finn treat him as a friend. (The song is the outline and black figure, the grey coloring is R2-D2, the dark grey is Star Wars, and the orange is BB-8. The background is from the original image with slight alterations around BB-8.

Sunday, October 1, 2017

Final Canvas Project

This assignment was to illustrate our knowledge of coding to create a picture. With my fascination of space I created the rocket ship flying away from earth. ART 210 - CANVAS PROJECT

Canvas Final Project Code

 <!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 solid;}


</style>


</head>

<body>

<canvas id="myCanvas" width="1000" height="750"></canvas>

<script>


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

//// >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> YOUR CODE STARTS HERE
 var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      context.rect(0, 0, canvas.width, canvas.height);

      // create radial gradient
      var grd = context.createRadialGradient(650, 70, 50, 800, 150, 500);
      // light blue
      grd.addColorStop(0, '#2549B8');
      // dark blue
      grd.addColorStop(1, '#0B1639');

      context.fillStyle = grd;
      context.fill();
/// Background ^

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(50,50,4,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(300,400,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(150,150,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(250,450,4,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();
///
context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(550,300,4,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(300,400,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(40,230,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(350,220,4,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();
///

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(700,600,4,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(600,10,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(700,870,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(30,600,4,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(700,150,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(500,600,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(440,650,2,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(750,250,4,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();
///
context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(820,230,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(6340,330,3,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(400,750,2,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();

context.strokeStyle = "#000000";
context.fillStyle = "#FFFF99";
context.beginPath();
context.arc(750,250,4,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.fill();
/// Stars ^
var context = canvas.getContext('2d');
      var centerX = 0;
      var centerY = 0;
      var radius = 6;
      context.save();
      context.translate(canvas.width / 2, canvas.height / 2);
      context.scale(4, 2);

      context.beginPath();
      context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
      context.restore();

   
      context.fillStyle = "FF7F50";
      context.fill();
 
context.closePath();
//
/// Earth Imahe

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

      imageObj.onload = function() {
        context.drawImage(imageObj, 585, -145);
      };
      imageObj.src = 'http://images.clipartpanda.com/earth-clipart-Earth-clip-art-8.png';

/// ^ Earth Image

/// Rocket Ship v

var context = canvas.getContext('2d');
      var centerX = 1;
      var centerY = 135;
      var radius = 55;
      context.save();
      context.translate(canvas.width / 4, canvas.height / 4);
      context.scale(4, 2);

      context.beginPath();
      context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
      context.restore();

   
      context.fillStyle = "black";
      context.fill();
      context.lineWidth = 0;

   
context.closePath();





var context = canvas.getContext('2d');
      var centerX = 1;
      var centerY = 135;
      var radius = 50;
      context.save();
      context.translate(canvas.width / 4, canvas.height / 4);
      context.scale(4, 2);

      context.beginPath();
      context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
      context.restore();

   
      context.fillStyle = "grey";
      context.fill();
      context.lineWidth = 0;

   
context.closePath();


 context.beginPath();
 context.moveTo(360,400);
 context.lineTo(530,350);
 context.lineTo(530,450)
 context.lineWidth = 0

 context.fillStyle = "black"
 context.fill();
 context.closePath();


 context.beginPath();
 context.moveTo(320,400);
 context.lineTo(500,350);
 context.lineTo(500,450)
 context.lineWidth = 0

 context.fillStyle = "grey"
 context.fill();
 context.closePath();



context.beginPath();
 context.moveTo(360,520);
 context.lineTo(530,470);
 context.lineTo(530,570)
 context.lineWidth = 0

 context.fillStyle = "black"
 context.fill();
 context.closePath();

context.beginPath();
 context.moveTo(320,520);
 context.lineTo(500,470);
 context.lineTo(500,570)
 context.lineWidth = 0

 context.fillStyle = "grey";
 context.fill();
 context.closePath();

context.beginPath();
 context.moveTo(5,460);
 context.lineTo(70,400);
 context.lineTo(70,520)


 context.fillStyle = "black";
 context.fill();
context.closePath






context.fillStyle = "#F6F876";
context.beginPath();
context.arc(140,400,10,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.lineWidth = 8;
    context.strokeStyle = 'black';
    context.stroke();
context.fill();

context.fillStyle = "#F6F876";
context.beginPath();
context.arc(140,430,10,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.lineWidth = 8;
    context.strokeStyle = 'black';
    context.stroke();
context.fill();

context.fillStyle = "#F6F876";
context.beginPath();
context.arc(140,460,10,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.lineWidth = 8;
    context.strokeStyle = 'black';
    context.stroke();
context.fill();

context.fillStyle = "#F6F876";
context.beginPath();
context.arc(140,490,10,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.lineWidth = 8;
    context.strokeStyle = 'black';
    context.stroke();
context.fill();

context.fillStyle = "#F6F876";
context.beginPath();
context.arc(140,520,10,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.lineWidth = 8;
    context.strokeStyle = 'black';
    context.stroke();
context.fill();



context.beginPath();
      context.arc(120, 460, 73, 4.7, Math.PI*.5, true);

      context.closePath();
      context.lineWidth = 8;
      context.fillStyle = '#3D3D3D';
      context.fill();
      context.strokeStyle = 'black';
      context.stroke();
     





context.beginPath();
 context.moveTo(170,450);
 context.lineTo(350,400);
 context.lineTo(350,500)
 context.lineTo(450,450)
 context.lineWidth = 0



context.fillStyle = "3D3D3D";
 context.fill();
context.closePath

context.fill();
context.beginPath();
context.arc(280,455,40,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.lineWidth = 18;
    context.strokeStyle = 'black';
    context.stroke();
context.fill();

context.fillStyle = "#127EBC";
context.beginPath();
context.arc(280,455,20,0,Math.PI*2,true);
context.closePath();
context.stroke();
context.lineWidth = 18;
    context.strokeStyle = 'black';
    context.stroke();
context.fill();

var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      var x = canvas.width / 2;
      var y = canvas.height / 2;
      var radius = 450;
      var startAngle = 2.3 * Math.PI;
      var endAngle = 2.5 * Math.PI;
      var counterClockwise = false;

      context.beginPath();
      context.arc(530, 100, radius, startAngle, endAngle, counterClockwise);
      context.lineWidth = 7;


   
      context.strokeStyle = 'red';
      context.stroke();
 context.closePath

 var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      var x = canvas.width / 2;
      var y = canvas.height / 2;
      var radius = 450;
      var startAngle = 2.3 * Math.PI;
      var endAngle = 2.5 * Math.PI;
      var counterClockwise = false;

      context.beginPath();
      context.arc(530, 100, radius, startAngle, endAngle, counterClockwise);
      context.lineWidth = 7;


   
      context.strokeStyle = 'red';
      context.stroke();
 context.closePath



 var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      var x = canvas.width / 2;
      var y = canvas.height / 2;
      var radius = 450;
      var startAngle = 2.3 * Math.PI;
      var endAngle = 2.5 * Math.PI;
      var counterClockwise = false;

      context.beginPath();
      context.arc(530, 80, radius, startAngle, endAngle, counterClockwise);
      context.lineWidth = 7;


   
      context.strokeStyle = 'red';
      context.stroke();
 context.closePath

  var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      var x = canvas.width / 2;
      var y = canvas.height / 2;
      var radius = 450;
      var startAngle = 2.3 * Math.PI;
      var endAngle = 2.5 * Math.PI;
      var counterClockwise = false;

      context.beginPath();
      context.arc(530, 60, radius, startAngle, endAngle, counterClockwise);
      context.lineWidth = 7;


   
      context.strokeStyle = 'red';
      context.stroke();
 context.closePath

  var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      var x = canvas.width / 2;
      var y = canvas.height / 2;
      var radius = 290;
      var startAngle = 2.3 * Math.PI;
      var endAngle = 2.5 * Math.PI;
      var counterClockwise = false;

      context.beginPath();
      context.arc(530, 140, radius, startAngle, endAngle, counterClockwise);
      context.lineWidth = 7;


   
      context.strokeStyle = 'red';
      context.stroke();
 context.closePath

  var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      var x = canvas.width / 2;
      var y = canvas.height / 2;
      var radius = 250;
      var startAngle = 2.3 * Math.PI;
      var endAngle = 2.5 * Math.PI;
      var counterClockwise = false;

      context.beginPath();
      context.arc(530, 160, radius, startAngle, endAngle, counterClockwise);
      context.lineWidth = 7;


   
      context.strokeStyle = 'red';
      context.stroke();
 context.closePath

 var canvas = document.getElementById('myCanvas');
      var context = canvas.getContext('2d');
      var x = canvas.width / 2;
      var y = canvas.height / 2;
      var radius = 200;
      var startAngle = 2.3 * Math.PI;
      var endAngle = 2.5 * Math.PI;
      var counterClockwise = false;

      context.beginPath();
      context.arc(530, 190, radius, startAngle, endAngle, counterClockwise);
      context.lineWidth = 7;


   
      context.strokeStyle = 'red';
      context.stroke();
 context.closePath



/// Rocket Ship ^



   
     

//// <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< YOUR CODE ENDS HERE


// CHANGE THE CREDITS

context.beginPath();
context.font = 'bold 20px Arial';
context.fillStyle = "white";
context.fillText('Ben Bohenick', 20, 720);
context.closePath();

</script>


</body>
</html>

Monday, September 18, 2017

Project 1 Canvas Object Code

<html>
<head>

<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 height="600" id="myCanvas" width="800"></canvas>

<script>


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

//// >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> YOUR CODE STARTS HERE
 context.beginPath();
 context.moveTo(270,260);
 context.lineTo(300,150);
 context.lineTo(550,250)
 context.lineWidth = 0
 context.stroke();
 context.fillStyle = "black"
 context.fill();
  context.strokeStyle = "black";
 context.closePath

 context.beginPath();
 context.moveTo(470,260);
 context.lineTo(400,150);
 context.lineTo(550,250)
 context.lineWidth = 0
 context.stroke();
 context.fillStyle = "black"
 context.fill();
 context.strokeStyle = "black";
 context.closePath();
     
 context.beginPath();
 context.moveTo(300,350);
 context.lineTo(200,450);
 context.lineTo(575,345)
 context.lineWidth = 0
 context.stroke();
 context.fillStyle = "black"
 context.fill();
 context.strokeStyle = "black";
 context.closePath();

  context.beginPath();
 context.moveTo(300,350);
 context.lineTo(500,450);
 context.lineTo(310,230)
 context.lineWidth = 0
 context.stroke();
 context.fillStyle = "black"
 context.fill();
 context.strokeStyle = "black";
 context.closePath();

 context.beginPath();
 context.moveTo(100,160);
 context.lineTo(290,285);
 context.lineTo(95,450)
 context.lineWidth = 3
 context.stroke();
 context.strokeStyle = "blue"
 context.fill();
 context.closePath();

 var context = canvas.getContext('2d');
      var centerX = 0;
      var centerY = 0;
      var radius = 50;
      context.save();
      context.translate(canvas.width / 2, canvas.height / 2);
      context.scale(4, 2);

      context.beginPath();
      context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
      context.restore();

   
      context.fillStyle = "black";
      context.fill();
      context.lineWidth = 0;
      context.strokeStyle = "white";
      context.stroke();
 context.closePath();

 context.beginPath();
context.arc(520,265,25,0,2*Math.PI);
 context.fillStyle = "White"
 context.fill();
context.stroke();

 context.beginPath();
context.arc(533,265,10,0,2*Math.PI);
 context.fillStyle = "black"
 context.fill();
context.stroke();

  context.beginPath();
context.arc(533,260,4,0,2*Math.PI);
 context.fillStyle = "white"
 context.fill();
context.stroke();

context.beginPath();
context.arc(670,150,25,0,2*Math.PI);
 context.fillStyle = "blue"
 context.fill();
context.stroke();

 context.beginPath();
context.arc(679,138,5,0,2*Math.PI);
 context.fillStyle = "white"
 context.fill();
context.stroke();

context.beginPath();
context.arc(670,275,25,0,2*Math.PI);
 context.fillStyle = "blue"
 context.fill();
context.stroke();

 context.beginPath();
context.arc(679,264,5,0,2*Math.PI);
 context.fillStyle = "white"
 context.fill();
context.stroke();

 context.beginPath();
context.arc(600,205,25,0,2*Math.PI);
 context.fillStyle = "blue"
 context.fill();
context.stroke();

 context.beginPath();
context.arc(593,193,5,0,2*Math.PI);
 context.fillStyle = "white"
 context.fill();
context.stroke();

 context.beginPath();
      context.moveTo(580, 600);
      context.quadraticCurveTo(450, 400, 560, 410);
      context.lineWidth = 10;
   
      context.strokeStyle = 'green';
      context.stroke();

context.beginPath();
      context.moveTo(100, 600);
      context.bezierCurveTo(500, 600, 300, 500, 400, 600);
      context.lineWidth = 10;

   
      context.strokeStyle = 'green';
      context.stroke();

 context.beginPath();
 context.moveTo(650,400);
 context.lineTo(700,300);
 context.lineTo(500,400);
 context.lineTo(600,400);
  context.fillStyle = "yellow";
 context.fill();
 context.closePath();


 context.beginPath();
 context.moveTo(50,400);
 context.lineTo(50,300);
 context.lineTo(30,400);
 context.lineTo(50,400);
  context.fillStyle = "blue";
 context.fill();
 context.closePath();


context.moveTo(79, 93.5625);
context.bezierCurveTo(20, 16, 26, 14, 17, 240);
context.stroke();

context.beginPath();
context.moveTo(350,250);
context.quadraticCurveTo(50,500,40,690);
 context.lineWidth = 7;
context.stroke();

//// <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< YOUR CODE ENDS HERE


// CHANGE THE CREDITS

context.beginPath();
context.font = 'bold 20px Arial';
context.fillStyle = "rgba(0,0,0,1)";
context.fillText('Ben Bohenick Project 1', 20, 550);
context.closePath();

</script>


</body>
</html>

Project 1 Canvas Object

In this assignment we focused on creating objects using code, while learning the software Dreamweaver.