Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Create a Grunge Personal Portfolio Layout

Create a Grunge Personal Portfolio Layout


Open the texture image inside Photoshop. On this document we will create our layout.
On the bottom right side of the layout I will create a yellow shape. I will use the following color: #faf591
I will create some lines with the following color: #cdd9be. I will try to create a nice note paper.
The lines you can create with Line Tool. After you fill the yellow shape with the lines, be sure you select all the layers (without the background layer) and press CTRL+E to merge all the layers into a single one. Select Eraser Tool and on the right side delete some parts of the note paper.

Img

I will download the following set of vector patterns: Halftone patterns

I will open some random eps files and I will place them over my layout. Click on the image to see better how I place the halftone vector files.

Img

Please note that you need to change the color for the vector to white. You can achieve this effect with a simple Color Overlay layer style:

Img

Download the following set of Brushes: Blood brushes

Load the brushes inside Photoshop, and on a new layer (press on CTRL+SHIFT+ALT+N to create a new layer) make some drawings with two different colors. You can create different layers if you want to modify the colors later.

Img

I will add each blood brush on separate layers; on for one layer I will change the blending mode to hard Light and the opacity value to 20%

Img

This is my result

Img

Over the note I will create a new white shape, and in the same time I will change the opacity value to 30%

Img

Open the image in Photoshop and place it over the layout.

Img

Place it on top of the layout, and in the same time you can add the following layer styles

Img

This is my result

Img

I will download the following set of Icons, and I will place some icons on the top part of the layout. The blending mode for all these icons is "soft light"

Img

I will select the layer with the price tag, and I will make a selection with Polygonal Lasso Tool

Img

I will press on CTRL+J to make a new layer via cut and then I will press on CTRL+D to deselect. I will move the new layer so you can see my result.

Img

I will duplicate one more time the layer and I will go to Edit - Transform - Flip Vertical

Img

I will place one layer under the other one and I will delete the bottom part of the shape with Eraser Tool (and with a smooth round brush). This is my final result. I will use these pieces of grunge paper for a button

Img

I will duplicate the layer a few times, and I will place the buttons on the right side of the layout

Img

Now I will add some images and the text. Please click on the following image to see the full size layout.

Img



Author's URL: grafpedia
Final results of our readers
New!
Passed through all the steps? Share your result!
Your result will be premoderated.
Please make sure you choose the right image.
 
 



Captcha

*Required fileds
Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos. More Web Layout Tutorials: Featured Materials | Fresh Materials | TutorialKit New Photoshop Tutorials


Like us to: