Monday, April 4, 2016

Collage

For the collage, I used a few different images to create a dream like wave. I used a quote from the song Strawberry Fields Forever by The Beatles. The first layer is a photo I took in the city in Chicago last year. I wanted a city background and this was the highest quality one because it was taken by me. The wave on the bottom and the strawberries on top are from google, the girl from flickr, and then the second layer of sky is from instagram. Since I used the blur tool and selected a paint brush style, it eliminated any look of pixelation. I had a wispy look to the brush to make the dream like state feel even more real. I also edited some of the colors like in the waves, the girl, and the strawberries to make them match up by lowering some of the contrast.

Wednesday, March 30, 2016

Magazine Cover

Here I have my friend Courtney as the feature with a monkey, my boyfriend with a puppy because why not and of course myself because we had to and my dog because she definitely is the cutest. I thought that the pictures on the side were fun to add and also made it to where I could easily throw in a caption that real magazines tend to do. But I also included a barcode for authenticity and although some of the tools gave me trouble, it really was not as hard as I thought it would be. I think that the hardest part was cutting out my friend with the monkey and trying to make that look realistic but all it took was a combination of the lasso, polygonal and magnetic tool to get her onto the background section by section.

Tuesday, March 29, 2016

Mini Assignment

I found a picture of myself sitting on a wall by bayshore and thought that it was a perfect fit so that I could place myself sitting down somewhere. Although I don't know exactly the name of this location, it is a castle somewhere in Ireland. It was hard trying to get myself to match up to the color of the rest of the vibrant scene, but I think the sun coming in from the same angle as the photo and enhancing the colors helped to match to the Irish scenery.

Monday, March 21, 2016

HTML Design

<!DOCTYPE HTML>
<html>
<head>
<script>
window.onload = function() {
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");

////////////////////////////////////// start below this line ˇˇˇˇˇˇˇˇˇˇ

//context.bezierCurveTo(controlx1, controly1, controlx2, controly2, endx, endy);

//background
context.beginPath();
context.rect(0, 0, 800, 600);
var grd = context.createLinearGradient(0, 300, 800, 300);
grd.addColorStop(0, 'rgb(0, 255, 255)');
grd.addColorStop(.4, 'rgb(255, 255, 255)');
grd.addColorStop(1, 'rgb(255, 0, 255)');
context.fillStyle = grd;
context.fill();
context.stroke();



//top half//
context.beginPath();
context.moveTo(155, 200);
context.quadraticCurveTo(146, 209, 195, 175);
context.quadraticCurveTo(225, 150, 245, 115);
context.quadraticCurveTo(255, 97, 280, 70);
context.quadraticCurveTo(300, 46, 345, 38);
context.quadraticCurveTo(375, 35, 395, 60);
context.quadraticCurveTo(407, 80, 406, 80);
context.quadraticCurveTo(445, 46, 480, 45);
context.quadraticCurveTo(520, 48, 542, 80);
context.quadraticCurveTo(560, 100, 570, 130);
context.quadraticCurveTo(600, 176, 645, 200);
context.lineWidth = 1;
context.fillStyle = 'rgb(255, 0, 0)';
context.fill();

//small corner
context.quadraticCurveTo(655, 210, 648, 230);
context.quadraticCurveTo(600, 268, 575, 300);
context.quadraticCurveTo(540, 350, 515, 400);
context.quadraticCurveTo(478, 472, 450, 485);
context.quadraticCurveTo(435, 496, 400, 498);


//bottom half
context.quadraticCurveTo(300, 410, 245, 370);
context.quadraticCurveTo(200, 282, 182, 247);
context.quadraticCurveTo(168, 230, 157, 220);
context.quadraticCurveTo(150, 210, 155, 200);
//150, 205);
context.fillStyle = 'rgb(255, 0, 0)';
context.fill();
context.stroke();

//tongue
context.beginPath();
context.moveTo(324, 200);
context.quadraticCurveTo(300, 203, 255, 225);
context.quadraticCurveTo(225, 250, 198, 279);
context.quadraticCurveTo(168, 318, 151, 350);
context.quadraticCurveTo(141, 375, 138, 400);
context.quadraticCurveTo(130, 445, 151, 500);
context.quadraticCurveTo(148, 499, 174, 525);
context.quadraticCurveTo(200, 548, 245, 555);
context.quadraticCurveTo(285, 560, 324, 552);
context.quadraticCurveTo(347, 550, 370, 532);
context.quadraticCurveTo(395, 515, 405, 496);
//line gets thicker//
context.quadraticCurveTo(420, 465, 430, 422);
context.quadraticCurveTo(440, 398, 460, 350);
context.quadraticCurveTo(470, 325, 495, 301);
context.quadraticCurveTo(514, 277, 553, 250);
context.quadraticCurveTo(575, 229, 550, 218);
context.quadraticCurveTo(530, 205, 510, 207);
context.quadraticCurveTo(475, 203, 450, 219);
context.quadraticCurveTo(425, 225, 400, 229);
context.quadraticCurveTo(350, 248, 325, 275);
context.quadraticCurveTo(285, 325, 258, 403);
context.fillStyle = 'rgb(255, 0, 0)';
context.fill();
context.stroke();

context.beginPath();
context.moveTo(258, 403);
context.quadraticCurveTo(265, 350, 280, 310);
context.quadraticCurveTo(300, 274, 326, 249);
context.quadraticCurveTo(365, 225, 335, 203);
context.quadraticCurveTo(335, 203, 324, 200);
context.fillStyle = 'rgb(255, 0, 0)';
context.fill();
context.stroke();

//teeth
context.beginPath();
context.moveTo(265, 165, 297, 135);
context.quadraticCurveTo(325, 135, 348, 149);
context.quadraticCurveTo(375, 165, 400, 157);
context.quadraticCurveTo(425, 150, 450, 148);
context.quadraticCurveTo(476, 150, 500, 168);
context.quadraticCurveTo(532, 205, 515, 220);
context.quadraticCurveTo(500, 225, 473, 205);
context.quadraticCurveTo(465, 213, 430, 215);
context.quadraticCurveTo(404, 208, 395, 198);
context.quadraticCurveTo(373, 203, 348, 208);
context.quadraticCurveTo(325, 202, 310, 172);
context.quadraticCurveTo(277, 182, 265, 165);
context.fillStyle = '#FFFFFF';
context.fill();
context.stroke();

//white circle 1
context.beginPath();
context.moveTo(315, 95);
context.quadraticCurveTo(312,73, 330, 58);
context.quadraticCurveTo(348, 46, 376, 59);
context.quadraticCurveTo(395, 75, 387, 88);
context.quadraticCurveTo(374, 109, 352, 98);
context.quadraticCurveTo(348, 95, 350, 95)
context.quadraticCurveTo(330, 105, 315, 95)
context.fillStyle = '#FFFFFF';
context.fill();
context.stroke();

//white circle 2
context.beginPath();
context.moveTo(450, 85);
context.quadraticCurveTo(440, 65, 470, 59);
context.quadraticCurveTo(495, 56, 515, 70);
context.quadraticCurveTo(528, 82, 522, 99);
context.quadraticCurveTo(510, 108, 498, 105);
context.quadraticCurveTo(484, 100, 477, 90);
context.quadraticCurveTo(454, 98, 450, 85);
context.fillStyle = '#FFFFFF';
context.fill();
context.stroke();

//tongue oval 1
context.beginPath();
context.moveTo(301, 250);
context.quadraticCurveTo(278, 252, 256, 275);
context.quadraticCurveTo(232, 300, 218, 321);
context.quadraticCurveTo(200, 349, 190, 375);
context.quadraticCurveTo(180, 400, 182, 400);
context.quadraticCurveTo(176, 420, 184, 430);
context.quadraticCurveTo(212, 423, 217, 400);
context.quadraticCurveTo(225, 375, 236, 350);
context.quadraticCurveTo(245, 325, 262, 300);
context.quadraticCurveTo(287, 253, 278, 292);
context.quadraticCurveTo(280, 289, 301, 250);
context.fillStyle = '#FFFFFF';
context.fill();
context.stroke();

//tongue oval 2
context.beginPath();
context.moveTo(476, 252);
context.quadraticCurveTo(470, 253, 450, 270);
context.quadraticCurveTo(420, 296, 415, 305);
context.quadraticCurveTo(400, 325, 387, 350);
context.quadraticCurveTo(372, 375, 360, 399);
context.quadraticCurveTo(345, 425, 335, 450);
context.quadraticCurveTo(326, 467, 328, 478);
context.quadraticCurveTo(343, 500, 363, 479);
context.quadraticCurveTo(373, 467, 378, 450);
context.quadraticCurveTo(387, 424, 400, 400);
context.quadraticCurveTo(414, 368, 425, 350);
context.quadraticCurveTo(434, 325, 445, 310);
context.quadraticCurveTo(455, 290, 476, 252);
context.fillStyle = '#FFFFFF';
context.fill();
context.stroke();

//inside mouth
context.beginPath();
context.moveTo(266, 166);
context.quadraticCurveTo(248, 179, 236, 188);
context.quadraticCurveTo(215, 198, 200, 205);
context.quadraticCurveTo(210, 210, 216, 215);
context.quadraticCurveTo(238, 240, 240, 240);
//context.fillStyle = '#000000';
//context.fill();
context.stroke();








////////////////////////////////////// end above this line ˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆ

};

</script>
</head>
<body>
<canvas id="myCanvas" width="800" height="600"></canvas>
</body>
</html>








////////COMMENTS///////////

This project turned out to be a lot harder than I thought it would be but it really just took more time than anything. I simplified the Rolling Stones logo a little because the bold lines around the tongue just didn't seem to look well with coding as it was difficult to generate the flow like the original. I also took out the black back in the mouth area but only because i felt like it looked better this way. I used quadratic curves the entire time which was also difficult but once I realized that all I needed to do was plot the points closer, it manipulated the image more easily. I attached some of the graph photos too to show how many little points I had to graph. I tried to keep up with the numbers on the graph and in the coding but not all of them match up because it was hard to keep up with. Too many number started to make my head hurt. This project was interesting to say the least, I like my end result a lot more than I thought I would but now I know that coding is not my specialty.

Wednesday, February 17, 2016

Exquisite Corpse

The exquisite corpse project was really cute and a lot of fun to make! I thought it was cool because it was my first time really creating something on Illustrator. I tried to make the "arena" look like a circus one with people watching but that was a little hard to make a silhouette audience as my first time using illustrator. The only issues i really ran into were on the legs when the shapes would run into each other and stop me from completely filling the rest in. It took some re-doind and some trial and error but there weren't too many other difficult tasks for this project.