Wednesday, June 9, 2010

Final Mockup- LunaF

Green: #06720d

Red:# fc0404

Black:# 000000

White:# ffffff

White pink:# f9e2e2

I used the magic wand and pen tool to select the different artwork pieces from the original as well as myself in the picture. I put them on a new background and used a gradient. After I made it look like a collage I used the Artistic Cutout Filter. I created a moon shape and used a silver gradient and made it a clipping mask, I also added my name and aligned it along the shape of the moon.

The header was made with a gradient that made the black burst shape. I added a red target shape to the center of the gradient. I used the splashed paint shape and made that red.

The navigation bar was made with gradient and I added lines to make the different sections of where the text was going to go. Some of the paint splatter shape goes down into the navigation bar. For the gallery widget I set it to color burn so the red could be darker at the bottom.

This project was fun to do because I got to create a mock up of a site I would maybe like to do. The gradient tool is my favorite because it creates a style I like, and is simple to use.

Final Project Mockup --- sampa


I had a lot of fun by recreating the mockup. First I collected all the pictures, then created a rough draft with the help of pencil tool, rectangle tool and horizontal type tool. Then I started creating the actual mock up.

Background: I created the background with an (1200*900) image size and then painted it with the paintbrush tool. I used Gradient Lens Flare filter to give a shiny effect to the background. I created a big text with a company name and used stroke to give an effect to the text. I used that text for my background feature.

Banner: My banner is combination of a header, search and menu bar.
Header: In the header I created a logo and a header detail with the Elliptical marquee tool, Pattern Stamp tool and horizontal type tool. For the background effects, I used Neon Glow filters and lighting effects for the header detail and thus created an eye-catching header.
Search: I used Rectangular marquee tool, horizontal type tool and Custom shape tool to create the search Portion.
Menu bar: I used Layer comps to create a rollover and rollout menu bar. First I used Rounded rectangle tool to create a shape then copied and pasted and created another four buttons for the menu bar. I chose styles from the styles layer. For roll out or normal menu bar I used Blue glass Style. That very much matches with my background mockup.
For roll over I used chiseled sky style.

Left side bar: I used Rounded rectangle tool, Paint bucked tool for left side bar. There are two parts, one is Category and another one is Category detail. I used the Pattern Stamp tool and horizontal type tool to create Category Part and I used the Gradient fill for blending the text with the background. For Category detail I used horizontal type tool and used Lens Flare effects, Stroke and Curve mask for blending. I also Added a diamond picture to the left side bar, which I cut it by using Quick selection tool from the original picture. For blending purpose I used Lens Flare.

Content: I created the content part by using the Rounded rectangle tool, Paint bucked tool, and horizontal type tool. I used Stroke for the blending purpose. I used a picture, which I created before. This picture is combination of two pictures. I cut one from its background by using Extract tool and added that to another picture. I created a paragraph for the content and used clipping mask to blend the paragraph with the red flower picture.

Footer: I used the rectangle tool, Paint bucket tool and horizontal type tool to create the footer. I used clipping mask to blend the text with the red flower picture.
The following colors are what I used for the project.
Projects colors
# 27254f -- Dark blue
#2e256f -- blue
# 625a9d -- light purple
#530306 – Dark red
#5c1969 -- Purple
#a3d39c --Pastel yellow green
#a1a1a1 -- Gray
#636363 -- 75% Gray
#0b0a0a -- Black

Tuesday, June 8, 2010

Final ~ Suki

Colors I used:
140d04
d19e3d
836e46
fec04b
975f20
ac853c
Tada! Here's my final project! I had a blast putting this together! Man! Now I want to make it an actual page!!! Alas, I have more homework to do. Of course, I totally went off on a wild tangent and didn't do exactly what we're supposed to do. Um, hope it works anyway.

Boy, where do I start? I found a cool image for the background and went from there basically. For this project I went for a clean look. Haha! As far as layers go, the background itself is like 5, let alone all the rest of it. I have to admit, I didn't actually adjust the background image at all color-wise. To get the treble clef to poke out like that, I literally used it as a clipping mask on like 3 layers of color and black.

Haha! I crack myself up. I made my own scrollbar. :)

It was fun playing with the text. I haven't actually had much experience with what fonts to use etc, but I'm starting to get the hang of it.

To get the faint image of the girl on the album cover, I found a photo online. Her hair didn't contrast much with the background, and since I knew she was going to be a faint image on the album, I did some weird stuff to her color-wise. Some of the tools I used were color saturation and the burn tool, among several others. the burn tool actually was pretty much able to pull her hair off the background. Then I used the extract filter, and on the mockup I actually painted a mask around the edges using some grunge brushes. Then I put a texture on her using the canvas texturizing filter.

I adjusted the color of the bridge picture actually to be more opposite the color of the page than it was originally by increasing the blue and decreasing the reds and greens.

Believe it or not, the frame around the boxes was the hardest to make. I wanted a hairline outline a couple pixels away from the edge, but it was a bit harder than I thought it would be. I had to make a path and add a stroke to it, but once I did that, I couldn't change it at all! And with the blending effects I didn't know what color I had so I couldn't quite duplicate it for the main box. So basically I used the content aware scale, and it only stretched the top. Then I used the rectangle tool to paint black as a mask leaving behind a hairline border at the top. Is there an easier way to do that??? Oh, and the other problem with the look I wanted is that it requires me to slice the buttons, which is against the instructions for the project. I did it anyway, but I'm thinking the other way to do it is to put the border on the background. Maybe I'm thinking too much about how to make the website for real and less about following instructions and making a nice mockup?

Ok, I used quite a bit of the dodge tool on the lady on the album cover.

I applied a filter to her to add some texture.
Goodness I used blend modes all over the place! Overlay, screen, multiply, differing opacities, the works!

I used gradients for the buttons and the scrollbar.

So there ya have it! Again, I had a blast putting this one together. I would absolutely love to figure out how to make this webpage work! :) Have a great summer everyone!!!

Final Project :: Sangeeta


Hexadecimal Code
#9cbad6
#305f97
#d26152
#c1d4e4
#f2f6fa
#9d5667
#3d78b2

Final Project!! For this I used the above mentioned colors. Few images are used for this project, but there was only one image, hot air balloon, that was removed from its original image. I used Magic wand tool to do so. To create header I used two images, for heading I used clipping mask and for the background used Gradient Overlay blending tool. There were two images on each side of the header I wanted to give the feel that there is a link between the two, so to show connection I used prominent colors of two images and created a new gradient and used that on the base layer.
The tools that I used in this project are:
Gradient tool to create affect in the header
Artistic filter for base layer of Buttons
Polygon tool to create 3 content areas and buttons
Gradient Overlay blend mode

kelvens mock up


(My Hex Codes:
#000000
#DB0600
#FFFFFF
#262626)

so on my mock up the 5 tools i used were the dodge and burn which i used on the nav bar tapes. i used it to give them a distressed look(or at least thats what i see.) I used blend modes on a couple of layers, such as the soft light on the grunge layer. i used the luminosity on the hands holding the main content area.as far as filters i used the sharpen filter on the tapes to make them more crisp then they were to begin with. On the hands i also used the magic wand to help cut them out from there picture.there is a gradient used on the picture of me which blends from full color to invisible.(really liked that effect).

on this project i did a bit with the masks on making the tapes. i watched a couple of tutorials which were great at helping me bring it all together.i overall am a pen tool advocate for getting precise cutouts but i do like the extract for the hair pics.i had no idea what i wanted to do with this project to start. i knew i needed a page for myself so this fit the bill pretty good and whats better than learning while applying your skills? Im going to end up making this a template and setting up a site where music will be posted along with videos. The gradient tool is a very fun thing when you start playing around with it. when i found out about blending from solid to transparent i was happy about it. I also used it on my logo at top. Yea overall i see why the masks are so powerful and useful. I really didnt use them before but i will be alot more now.

midterm update



so with my update i didnt do too much except threw a filter onto the banner words to make the black and i did this with using the vivid light filter. i really liked my setup from the beginning and the way that i designed mine made editing a little more difficult since i couldnt do rollover images or any of that with my Polaroids not being straight up and down so i could slice them.

final Mockup Abel Rodriguez



#ffffff
#ffccc
#cc6666
#336699

On my images i used to remove it and place it on the content and also on the button backgrounds along with a color overlay.
i used the burn tool on the image because there was a camera flash on it that i wanted to darken to try and remove part of the flash. I also used to blend mode alot on the text along with the buttons i added a drop shadow along with inner glow on text. the filter mode was used on the boxes i used the lens flare along with the lighting effect to create a more visual appealing header. the magic wand was used to get the buttons without a background. the gradient was used for the background.
I sliced up the header along with the footer and content boxes. with basic name for those so i can easily find them later.
This project was by far the most fun i had. I enjoyed having the creatve ability to do what i wanted. I also learned quite a bit on this project i enjoyed the video. it taught me alot on creating this for the basis of a web site and how to integrate it to a website. my most favorite tools were the spot heal the burn tool and the magic wand to use. i enjoyed being able to fix pictures we all have a few pictures we can fix. with my wedding this month i will put these techniques to use.

Saturday, June 5, 2010

Updated Midterm


I updated the rollover image. I used a gradient to create the green target shape in the original, so for the new version of it I used the quick select tool and highlighted the green parts. Once it was selected I used another gradient over it and set it to darker color and overlay. So it changed the color of the green.
I only added star shapes with gradients and clipping mask to the Project graphics. There wasn’t much change from the original. I did change the Header logo.
The banner didn’t change much either, I used the technique where an area of a shape is cut out when you hold down ALT and place another shape on top. I did that for the pink star, and I added another different star to the other side of the banner. I decreased the percentage of opacity so that I would look faded. I removed a lot of random brushstrokes and shapes from the banner making it look less crowded, and also added a black and white gradient to the back.
I did not modify the graphics for my links in a big way. It was more of a subtle change. I used gradients and shapes like the originals, but this time using the clipping masks. I liked the originals so I didn’t want to change it dramatically.
I learned about using templates in Dreamweaver, I didn’t necessarily like the template I used for this site because I couldn’t get the content to stay aligned where I wanted it to be, and I was having issues with the widths and placement of objects. I liked creating the graphics for my webpage, because it gives it a more personal look. I plan on making better graphics as I continue to develop my skills. Overall I liked the clipping mask tool; it has become my favorite tool to use.

Friday, June 4, 2010

Midterm after making changes: Sangeeta


Here is the midterm site after making changes. I made changes to the header and to the rollover image.

Thursday, June 3, 2010

Web Page Mockup


For my color scheme I used:
#d4d099
#4c671b
#f4b6a5
#c7cce2
To remove an image for my banner I used the crop tool. In the banner I used the burn tool to darken it a bit, blend mode to darken, filter sharpen, the polygon tool for a shape, and the gradient tool to change the color of the sky. The slicing was really easy and seems like a useful tool.

I had some trouble darkening the image of my banner with out losing the rainbow in it. The dodge and blend tools worked well to darken the sky but not too much. I really enjoy playing with the gradients. With different color schemes and opacity settings one can completely change the feel of an image or picture.

Updated Midterm


Here is my updated Midterm. I changed the banner with some filters and also changes the rollover pics with filters. My goal was to make it look strange.

Wednesday, June 2, 2010

New Midterm Project -- Sampa


I had a lot of fun by recreating the whole site again. I created the banner with the brush tool and used soft direct light filters for the background effects. With the blending options such as: drop shadow, bevel and emboss, pattern overlay, and stroke, I created an eye-catching title. To give a different shape to my title, I used the wrap text and the wrap tool. By applying a clipping mask, I combined a shape and a picture that was made to make the banner.
I have used Gradient overlay in difference mode for the hover and link state. Then for the Hover I have used Accented edge filter and for the link I used Ink Outline filter.
I changed body and footer color also. I used all hexadecimal colors.
I added Project one through 6 on to the site, which includes all the pictures and blog text for each project.
I recreated this site again because I wanted to create a much more attractive site than before.
The following colors are what I used for the project.
Projects colors
#a72a97 -- Light Puple
#5a84ff -- Light blue
#9F59AF -- light purple
#217e69 -- light green
#BF8A49 -- yellow
#A45597 -- mauve
#f6ee08 -- yellow
#8832c3 -- purple
green
silver
Here is my link to the new midterm project.
New Midterm Project

Monday, May 31, 2010

Project 6 Abel Rodriguez


I did a filter on both images that was water color. The original chair picture had a little cartoonish feel to it already so i added the water color to make them fit. I decided to add the drop shadow to both texts because of the tree with the drop shadow so i added a feel that went throughout the entire picture I also added a drop shadow to the chair. I decided to use the text to promote a fictious website where you would book trips.

Project 6 Luna F


I changed the original background with the gradient tool and made it colorful. I also used Levels and Curves. It was difficult for me to find a font I wanted that would look like it belonged to the image. I aligned the paragraph so that it would be even on the sides. I added a brass colored gradient to the PDX logo with a clipping mask. The text was curved like an arc and placed over the globe. From this project I learned how to align paragraphs, and created the Pdx Logo out of shapes.


Project6 -- Sampa



It was a great experience with this project. I have select two pictures as a background for this project. Besides color correcting for the background image for this project, I have used Extract tool to cut one portion (young boy) of the picture and mixed up with another picture. I have used Brush tool to blend up two pictures and created a single picture.
Created an eye-catching title for this project. I have used Rough Pastels, Film grain and Stained glass filters and used Screen mode to give a different kind of effects and look for the title. Created a paragraph, which describes about the theme of this project. Changed the paragraph to a shape and used both kerning and leading to create a space between characters and lines. I have used custom shape tool to create the shapes and then used Hard light mode and Drop shadow to blend with the whole picture. Created a gradient mask and soft light mask to give an effect to my picture.

Project 6 ~ Suki

Well, here's a bit of contrast from previous assignments. Haha! For the record, I'm not a gardening fan, though I do enjoy beautiful gardens. Perhaps it has to do with having such a busy schedule? So I was putting this together and realized that sometimes less is more. I can't put any texture on the text because it's already quite stylized. I did play with the kerning etc on the text in the upper right corner. When I changed the font where it says "dirt" the size of the font was too big and the spacing around the word wasn't quite right. I also had to change the spacing on the word "art" when I increased the size of the font. The background picture I found online and cropped. I also added a dry brush filter after adjusting the color. Again, less is more, so I opted to add only two shapes - the butterfly and the swirly thing under the word "art." (Hope I don't lose points for having no shape around the paragraph text) For the darker corners I added a layer, filled it with white (whatever works), and added a gradient overlay and set it to radial. By default the gradient is centered which didn't work for this project. I found, however, that if I drag the layer and fill it again it essentially moves the center of the gradient. Then I set both the gradient overlay and the general settings to multiply and changed the opacity of the general settings.

Project 6 :: Sangeeta


Interesting project! For this project I used couple of layers – for Title heading I used Wrap tool to create an arc effect and Texture Filter to show Mosaic tiles effect. For text about rose parade I used Ellipse tool and set a path to write it in a circle. After couple of trial and errors I was able to do it right. I had to create the circular path once and I was able to use it again for the second line. Two shapes a cloud and flower were used in a separate layer with the use of free form tool. Initially when I created the shape there was just an outline but there is a seperate setting called fill pixels that create a shape with filled color. I used Vactor mask to create an overlay on cloud and another Vactor mask with soft light effect to create a shadow effect on the image.

Sunday, May 30, 2010

kelven's project 6

well with this project i did have some fun that surprised me. i liked this all except for the having to add the shapes. they didnt really fit to me but i guess it works. now on the text layer for the title i used drop shadow and outer glow. i also used the wave warp effect to give the text a slight curve and used the smooth. i also used leading to tighten up the space between the font(which im glad i learned about). i used the soft light feature on my gradient layer which gave a cool effect on jordan which darkened him alot. i like how with the text i made the paragraph like a 2 in one if you read the red words its another little quote of encouragement. I used bold font to make those words stand out a bit. i think ill take the shapes off and make this a background for laptop cuz its pretty encouraging to me personally.

Project 6 Andy Gooch



For my background image I used auto contrast and auto color to bring out the blues and give it a grainy feel. For my title I used several filters including cross hatch and smudge stick. For my paragraph text I chose a color and a font that I thought would stand out well against the background. I modified the shaped with varying degrees of success. The rainbow gradient put a good "other-wordly" feel to this project.

Saturday, May 29, 2010

Project5 Luna F


For the layer composite image I cut out a telephone pole and used the soft light tool to make it look like it is under the water. The text has a gradient mask and faded. I used the luminance blending tool with the painting on the bridge. The rest of the objects were cut out of their original images with the lasso tool. I had problems with the clipping masks and gradients, because I couldn’t think of any way to apply them to the images. I feel like I wasn’t being very creative with this project.



I used the Artistic Dry Brush filter for the image of the Waterfront. This filter makes the image look like it was painted.

Monday, May 24, 2010

kelven's project 5



































so to start with the pics of my son that i used filters on.I used the smart sharpen filter, the artistic colored pencil, and also the sketch chalk and charcoal filter. i played with the levels a bit and i like the outcome. its different but something about it make me want to put it up in my room which is black and white themed. now with the picture of the summertime cover i did i used a few different things as far as the layers. I used a gradient overlay on the background. then for the blending of the women into the image i used color burn on the layer to make it seem like it was transparent yet blended.I used a screen filter on the layer with the beach scene which i liked the blend effect. i used the wave style on my text to give it the look it has which i think goes with the concept of heat and beaches...( heat waves and the beach has waves..lol)..