Final In Design

Animation 4/25

I made a video about what a girl should wear on her birthday and how her roommate can be critical on what she should wear. I used photos in photoshop using a timeline. I first took a picture of my roommates room so the background was the same. Then I took a bunch of pictures of myself facing all directions in all different outfits so I can have free range to move myself around the background. I then took a picture of my roommate indicating yes or no. I extracted my roommate, the folding screen and myself and put it in the background. I also recorded myself for the dialogue and imported the voices for the video. I really enjoyed this project, it was fun to manipulate the images to make it seem like they were moving. 

Storyboard Sketches

I'm going to do a girl trying to find a birthday outfit. She tries on all pretty outfits and her roommate keeps saying "NO!" and until finally she comes out with a ridiculous outfit on and her roommate loves it and says "YES!". She keeps going behind a curtain and shows up with a different outfit when she returns. I'm going to use photoshop and use pictures but not stop motion. I'm excited for this project. 

Collage Environment 4/6

I used the song lyrics from the song "I'll be" by Edwin McCain for my collage inspiration. This song is a love song but this set of lyrics made me think of a father-daughter bond. I took pictures from google and personal pictures of family to have the years of their lives throughout the landscape. I first have a newborn in the back, then age 5 on the bench, a teenager in the middle, a young women at her wedding and then finally the daughter all grown up waiting to meet her Dad again in heaven. I wanted to use a mixture of a black and white filter and a sepia tone filter to set the emotion and scene. I also decided to use the lyrics in the photo so that it didn't look like just a bunch of people in the park and show that it's stages of one persons life. I liked this project because I liked using a song for inspiration and had fun extracting all these photos and putting it into one. 

Magazine Cover

So I decided to do a magazine cover about my roommates and I. I used the original In Touch Magazine layout but added "with West Cass" since that is our old street name. I used the $19.05 amount because that number is what people refer to us as "1905", as a group. I used all headlines for each roommate as the total opposite of what's going on in their lives. Brittany is moving home to New York for her boyfriend and is leaving her job here in Tampa. Maya is a workout fanatic and would never give up working out or "lifting". Sam has been dating her boyfriend for 4 years and he would never say no to formal. Abby is obsessed with her nephew and can't not bring him up every minute so I said she was charged with kidnapping him as a joke. Our lease is ending and myself and Brittany are moving back to New York so we don't know what is next for all of us. As for using photoshop, I absolutely loved it. I'm familiar with the program because I use it for work but I had a lot of fun mimicking an actual magazine cover. The biggest trouble I came across was getting the banner across Brittany's bubble to have the same edges as the circle because it was originally a rectangle. I just used the eclipse and inverted the image and used the eraser to erase around the edges to make it round. This was my favorite project thus far. Enjoy! Below are my original images.

Self Insertion 3/23

I used a photo of myself from halloween when I was dressed as a WWE Diva. I inserted myself in the WWE ring in the middle of a match. I used eraser and lasso tool to cut me out of the original photograph and then used the Free Transform tool to resize myself as well as turning me so I stood level to the floor. I also used the Blending option tool to give myself a shadow that matched the girl lying on the floor. I also brightened the photo of myself to match the light tones of the skin of the other two girls and added a little contrast. This was a fun assignment for me because I have used Photoshop before but not for something like this.

ASCII HTML

I wanted to do a old Nintendo controller because I felt coding would look cool with having an out of date reference photo. I first Googled an image of the controller and put it on the graph shell in Photoshop. I printed it out and proceeded to write all of the x,y coordinates. I followed the HTML template guide under Professor Corrigans blog, which helped a lot. Making the rectangles is what I found easiest to do, especially the four in the middle because they all of the same code so it was easy to duplicate all four of those but just moving down the Y coordinates. The most trouble I had was with the gradient color scheme for the Nintendo controller itself and with the bezier curve. It took a lot of playing around with coordinates to make everything just right and how I wanted it. I liked this project because I would have never learned how to do this otherwise but it was just really time consuming. Hope you enjoy! See reference photo below.

 

CODING

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

////////////////////////////////////// start below this line ˇˇˇˇˇˇˇˇˇˇ
//Background
context.beginPath();
context.rect(0,0,800,600);
var grd = context.createLinearGradient(0,600,800,0)
grd.addColorStop(0,'rgb(255,255,255)');
grd.addColorStop(1,'rgb(0,0,0)');
context.fillStyle=grd;
context.fill();
context.stroke();

//bezier cord
context.beginPath();
context.moveTo(400, 400);
context.bezierCurveTo(240, 780, 870, 270, 750, 900);
context.lineWidth=11;
context.stroke();

//Outer edge council
context.beginPath();
context.rect(50,150,700,300);
context.lineWidth=5;
context.fillStyle= "Gray";
context.fill();
context.stroke();


//inner edge council
context.beginPath();
context.rect(75,180,650,240);
var grd = context.createLinearGradient(0,600,800,0)
grd.addColorStop(0,'rgb(100,100,100)');
grd.addColorStop(1,'rgb(0,0,0)');
context.fillStyle=grd;
context.fill();
context.stroke();

//direction buttons
context.beginPath();
context.moveTo(165,262);
context.lineTo(165,310);
context.lineTo(125,310);
context.lineTo(125,350);
context.lineTo(165,350);
context.lineTo(165,390);
context.lineTo(210,390);
context.lineTo(210,350);
context.lineTo(250,350);
context.lineTo(250,310);
context.lineTo(210,310);
context.lineTo(210,265);
context.lineTo(165,265);
context.fillStyle= "Gray";
context.fill();
context.stroke();

//button 1
context.beginPath();
context.rect(510,330,70,70);
context.fillStyle= "Gray";
context.fill();
context.stroke();

//button 2
context.beginPath();
context.rect(605,330,70,70);
context.fillStyle= "Gray";
context.fill();
context.stroke();

//circle in button 1
context.beginPath();
context.arc(545,365,30,0,2*Math.PI,false);
context.fillStyle= "red";
context.fill();
context.stroke();

//circle in button 2
context.beginPath();
context.arc(640,365,30,0,2*Math.PI,false);
context.fillStyle= 'rgb(215,0,0)';
context.fill();
context.stroke();

//middle rectangles
context.beginPath();
context.rect(325,200,150,25);
context.fillStyle= "Gray";
context.fill();
context.stroke();

context.beginPath();
context.rect(325,250,150,25);
context.fillStyle= "Gray";
context.fill();
context.stroke();

context.beginPath();
context.rect(325,300,150,25);
context.fillStyle= "Gray";
context.fill();
context.stroke();

context.beginPath();
context.rect(325,350,150,50);
context.fillStyle= "gray";
context.fill();
context.stroke();

//tiny buttons in middle
context.beginPath();
context.rect(350,368,38,15);
context.fillStyle= "Gray";
context.fill();
context.stroke();

context.beginPath();
context.rect(410,368,38,15);
context.fillStyle= "Gray";
context.fill();
context.stroke();

//start button
context.font = 'Bold 25px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("S", 350, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('S', 350, 272);

context.font = 'Bold 25px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("T", 370, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('T', 370, 272);

context.font = 'Bold 25px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("A", 390, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('A', 390, 272);

context.font = 'Bold 25px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("R", 410, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('R', 410, 272);

context.font = 'Bold 25px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("T", 430, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('T', 430, 272);

//B button
context.font = 'Bold 18px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("A", 570, 417);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('A', 570, 417);

//A button
context.font = 'Bold 18px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("B", 665, 417);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('B', 665, 417);

//Nintendo Name
context.font = 'Bold 40px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("N", 530, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('N', 530, 272);

context.font = 'Bold 40px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("i", 550, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('i', 550, 272);

context.font = 'Bold 40px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("n", 560, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('n', 560, 272);

context.font = 'Bold 40px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("t", 580, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('t', 580, 272);

context.font = 'Bold 40px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("e", 590, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('e', 590, 272);

context.font = 'Bold 40px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("n", 610, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('n', 610, 272);

context.font = 'Bold 40px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("d", 630, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('d', 630, 272);

context.font = 'Bold 40px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("o", 650, 272);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('o', 650, 272);

//R circle
context.beginPath();
context.arc(680,240,10,0,2*Math.PI,false);
context.lineWidth=2;
context.strokeStyle = 'red';
context.stroke();


context.font = 'Bold 18px Impact';
context.fillStyle = 'rgb(215,0,0)';
context.fillText("R", 675, 247);
context.strokeStyle = 'white';
context.lineWidth = 1;
context.strokeText('R', 675, 247);

//chip quadratic
context.beginPath();
context.moveTo(300, 148);
context.quadraticCurveTo(400, 50, 500, 148);
context.fillStyle= "Gray";
context.fill();
context.strokeStyle = 'black';
context.lineWidth = 5;
context.stroke();





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

};

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

Vector Illustration

I picked to do my illustration on my little cousin's Christmas Photo. See below for original photograph. I enjoyed this project very much because I liked the challenge of trying to make my illustration look realistic. 

Exquisite Corpse

Final Logo

I chose to use a directors chair since my company would be a film making company called "Make A Tape". I wanted to keep the regular colors of a directors chair so that my companies logo would be taken seriously and to draw in customers. I uploaded my original 5 sketches to my Blog and the directors chair was one of them. I freehanded my sketch on illustrator but used a Google image to stare at while I used the tools on illustrator. (Did not trace). Google image as seen below. My ".ai" original document is on the student server. :)

Caligramme

I chose a silhouette of a girl dancing because I'm a dance teacher back at home. I filled the silhouette of this girl doing a leap with the lyrics by Donna Summer called "Last Dance". This song is significant to me because my dance friends and I danced to this our last year performing as seniors. 

Logo Critique

                           

FedEx is a very well known company. Their current logo was created in 1974 by Lindon Leader. FedEx has won over 40 awards for their logo because of the recognition and optical illusion it has. If you look between the E and the X there is an arrow that is hidden. This arrow projects forwardness or speediness that the company tries to depict in their company, which is very sought after when it comes to customer's wants and needs in the courier service. The target audience is adults since it is more common for them to use a delivery service and going back to my point before it definitely reaches that audience with the arrow intending speed and precision. The color choices really catch your eye because there isn't any distraction and they go well together. They actually have different sets of colors for their logo, depending on the sector of the company, which is different. I think the simplicity of it but having an optical illusion, that many people don't catch, makes it a successful logo.

Baskin Robbins is an ice cream place that has 31 delicious flavors. They originally had a different logo but when they did an entire brand refresh in 2005 they re-made the logo as seen above. Baskin Robbins markets on their infamous "31 flavors" so they made the "BR" in different colors to create an illusion of a "31" being there. The target audience would be younger children because they can recognize it anywhere even if they just spotted the letters "BR" they would relate that to 31 flavors. The color choices are fun and bubbly which is also relatable to young children. The logo is definitely successful because Baskin Robbins is the largest chain of ice cream specialty shops. 

Tostitos is a chip brand owned by PepsiCo. This is a clever logo because they used their actual product in the logo but it isn't that noticeable at first glance. They created the two "T"'s as people and the "I" as salsa. This is a genius logo idea because it is so recognizable and different. The target audience would be a family or people who are hosting a televised game. I associate it most with football. This definitely draws the target audience in because what's game day without chips and salsa! The color choices blend so well together. In the other two logo's I discussed, there wasn't a background color but here there is a light blue with the name of the brand overlapping it. The colors don't clash and it works nice with each other because it makes the name "pop" and doesn't take away from the two figures dipping their chip into salsa. This logo wasn't always this creative with the illusion but since 2003 it has definitely evolved and made a name for itself. 

Comprehensive Health Care is a nursing home located throughout Florida. Their main goal is to promote preventative health programs to maintain the highest quality of life but yet this logo doesn't really address that. Their target audience would be elders or family members of elders but their logo doesn't look too inviting. People are trusting you with their care but yet they have a house blocking the entryway. The color choices are just as dull as it is strange. If they are trying to sell health care then I think this logo isn't to successful in depicting that. Their website doesn't show this logo anymore and now just has a rose but that may be in result to the negative comments they got on it.

Formula 1 is a car racing organization. They took the sport and tied it into their logo. The "F" represents the word formula and the fire represents speed but in between the "F" and the fire design they have an illusion of a "1" being there. This is clever and makes it stand out from other logos. They took advantage of the negative space and made something creative out of it. The target audience is racers and fan's of car racing and I feel like this would definitely catch their attention. The black and red shows intensity, just like racing has. The style also shows that it relates to racing just with the fast motion of the fire and track marks. This is named one of the most famous logos with hidden messages so it most certainly made a name for itself and is successful. 

Logo Sketches for "Make A Tape"

Ideas for a Fictional Company

1. Melissa's Mural- This would be for a photography business. The logo would have a small image of a camera on the left hand corner and then have a rectangle and a image of a girl inside laying upright with her hand over her head. Have the women in a dramatized posing position.

2. Make a Tape- This would be for anyone to hire this company to make a professional looking video for them, whatever the occasion might be. The logo would have a black shadow of an old camcorder with the name "Make A Tape" scripted inside in white lettering.

3. M. Dance Company- This would be for a dance studio. The logo would have the "M" in three different silhouettes of people in a well-known dancing position to form the "M" and then have the "Dance Company" in a black script writing, right next to it. The logo would all be in one line.

4. Fit & Sit- This would be a women's fitness gym but also connected to a healthy snack and coffee shop. The gym and coffee shop would have the same ambiance throughout so that it ties together well. The logo would be something that fits that, which I see as a high end looking logo. It would be a silhouette of a young women with a ponytail sitting down in a cafe chair with a dumbbell in one hand and a coffee in another. Maybe have a another women joining her at a table mocking the same pose so that it would attract girls/women to have outings at the gym but also can catch up with friends after at the coffee shop.

5. Burt's Bologne- This would be a deli. The logo would have a huge long sub with a overweight Italian looking man sitting on it eating a tinier sub while smiling. This logo would be in color and would have a lot of meat and toppings on the sub to really catch a viewers attention.

About Me

I'm Melissa Joannou and I am a Senior at the University of Tampa. My major is in Business Management, since I've worked as an Executives Assistant for seven years, but I have a huge passion for cinematography. I intern for a Cinematographer/Photographer and find it absolutely amazing. I also make "Music Videos" with my entire family for special occasions like my Grandpa's 80th Birthday and featured all 57 family members in it! I can't wait to learn more about digital arts since everything I have ever learned was self taught so I'm sure my love for the arts will just grow more after this class. Thanks in advance Professor!

(Here is a screen shot of some of my videos on my YouTube Channel.)