Rachel's Digital Media Blog

Monday, March 27, 2017

Assignment #6: Self Insertion

For this assignment, we had to insert ourselves into a place we've never been by integrating two images on Photoshop. I decided to take a photo of myself, originally sitting on the hood of a Mustang, and put myself in the Amalfi Coast of Italy.

Tuesday, March 21, 2017

Assignment 5: ASCII- HTML 5 Coding

For this assignment, I chose to do the BMW logo because it seemed pretty simple for such a difficult project. "Just some circles and triangles, it will be easy!" Well, I thought wrong. The top image is the reference image and below is my version. As you can see, the letters are missing. This is because I had extreme difficulty writing code for the letters- slightly changing and tweaking each number and variable to see if I could get it to look right. Especially for the B, I tried to do a belzier curve for the two bubbles, and just couldn't figure out the code to get it to actually look like a B. You will see in the code where I was attempting to do this.

I think the most difficult aspect of this assignment was the numbers and math involved with first choosing the right points on the graph and then transferring that to the actual coding, where you will have to do more math to make changes and make shapes look smoother/ more accurate.

The triangles were difficult for me because it took a lot of messing with numbers for it to make like each separate triangle belonged together as part of a circle. I used a quadratic curve on each side of all 4 triangles. Additionally, getting the gradient in the black circle to look like the original was quite difficult for me.

<!DOCTYPE HTML>

<html>

<head>

window.onload = function() {

var canvas = document.getElementById("myCanvas");

var context = canvas.getContext("2d");

///////////////////////////////////// start below this line ~~~~~~~~~~~~~

var centerX = 400;

var centerY = 300;

var radius = 150;

var startX = 180;

var startY = 300;

var endX = 550;

var endY = 500;

context.beginPath();

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

var grd = context.createLinearGradient(startX, startY, endX, endY);

grd.addColorStop(0,'rgb(250, 250, 250)');

grd.addColorStop(.3,'rgb(0, 0, 0)');

context.fillStyle = grd;

context.fill();

context.lineWidth = 8;

context.strokeStyle = 'rgb(210, 210, 210)';

context.closePath();

context.stroke();

var controlX = 310;

var controlY = 210;

var endX = 400;

var endY = 200;

context.beginPath();

context.moveTo(400,300);

context.lineTo(300,300);

context.quadraticCurveTo(controlX, controlY, endX, endY);

context.lineTo(400,300);

context.lineWidth = 2.25;

context.fillStyle = 'rgb(0, 200, 245)';

context.fill();

context.closePath();

context.strokeStyle = 'rgb(0, 0, 0)';

context.stroke();

var controlX = 490;

var controlY = 210;

var endX = 500;

var endY = 300;

context.beginPath();

context.moveTo(400,300);

context.lineTo(400,200);

context.quadraticCurveTo(controlX, controlY, endX, endY);

context.lineTo(400,300);

context.lineWidth = 2.25;

context.fillStyle = 'rgb(250, 250, 250)';

context.fill();

context.closePath();

context.strokeStyle = 'rgb(0, 0, 0)';

context.stroke();

var controlX = 490;

var controlY = 390;

var endX = 400;

var endY = 400;

context.beginPath();

context.moveTo(400,300);

context.lineTo(500,300);

context.quadraticCurveTo(controlX, controlY, endX, endY);

context.lineTo(400,300);

context.lineWidth = 2.25;

context.fillStyle = 'rgb(0, 200, 250)';

context.fill();

context.closePath();

context.strokeStyle = 'rgb(0, 0, 0)';

context.stroke();

var controlX = 310;

var controlY = 390;

var endX = 300;

var endY = 300;

context.beginPath();

context.moveTo(400,300);

context.lineTo(400,400);

context.quadraticCurveTo(controlX, controlY, endX, endY);

context.lineTo(400,300);

context.lineWidth = 2.25;

context.fillStyle = 'rgb(250, 250, 250)';

context.fill();

context.closePath();

context.strokeStyle = 'rgb(0, 0, 0)';

context.stroke();

var controlX1 = 310;

var controlY2 = 190;

var controlX2 = 340;

var controlY2 = 190;

var endX = 300;

var endY = 250;

context.beginPath();

context.moveTo(300,250);

context.lineTo(275,210);

context.bezierCurveTo(controlX1, controlY1, controlX2, controlY2, endX, endY);

context.lineWidth = 2.25;

context.closePath();

context.strokeStyle = 'rgb(210, 210, 210)';

context.stroke();

//////////////////////////////////// end above this line ~~~~~~~~~~~~~~

};

</script>

</head>

<body>

</body>

</html>

Monday, February 27, 2017

Vector Illustration Project

This is my vector illustration of my dog, Luna. I tried to capture as much detail as possible, especially in the ears and eyes. The only thing I changed from the original photo was the background color because it was the same color as Luna's body, so it was hard to distinguish what was her body and what was the wall. Below is the original photo:

Wednesday, February 15, 2017

Exquisite Corpse Assignment: Ted

Tuesday, February 7, 2017

K9 Kingdom Logo

Monday, February 6, 2017

Assignment #2- Pitbull body outline caligramme

Sunday, January 29, 2017

Logo Critique

Starbucks Vs. Dunkin' Donuts

Starbucks' logo is unlike any other coffee shop, which makes it stand out. Their logo has been re-designed a few times, but since the 1970's, the siren woman has always been there. This gives the company a sense of history because of the origin of their logo. They decided to use the siren because it ties back to Seattle, a city with strong seaport roots, and where Starbucks was first created. Because of the company's successful brand awareness, their logo can be immediately recognized by almost anyone. Dunkin' and Starbucks may have the same target audience, which is coffee-drinkers across America, but they attract very different types of customers. Even though Starbucks does not have a coffee cup, say the word coffee, or even sometimes have the name of the company written on their logo, they have no trouble attracting customers to their stores because of this brand awareness. In addition, the green color they use seems to flow throughout the rest of the company from the interior designing of their stores to the relaxing energy they bring about. With that said, I would conclude that Starbucks' logo is very successful. I may be biased because I love Starbucks, but I think their logo is more successful that Dunkin' Donuts' logo.

Dunkin's logo is very different from Starbucks. To start off, the colors are completely different. Starbucks' green color is soothing and calm while Dunkin's bright orange and pink is bold and attention-catching. Although Dunkin is a well-known brand in America, even someone who doesn't know the company would know that they sell coffee because of the coffee cup in the logo. Their logo is to-the-point and has no historical meaning like Starbucks. The use of colors in the logo also is carried through in all of their stores.