Grafpedia

In this tutorial I will show you how to create a grunge personal portfolio.  With small modifications you can use this layout for a photography website or for a web design agency layout.

Register for an account to download ALL our resources including this PSD layout

Preview full size layout

For this layout you will need the following resources.

1. Download background texture image
2. Download notebook paper image
3. Download price tag image
4. Vector patterns: Halftone patterns
5. Brushes: Blood brushes
6. Icons:  Social bookmarking icons

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.

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.

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:

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.

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%

This is my result

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

Download the following image:

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

Now download the following stock image (Transparent PNG)

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

This is my result

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”

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

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.

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

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

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

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

I hope you like my result. As you can see this tutorial is very simple, and in my opinion it looks quite good. The reason is the usage of textures, and stock images.
If you want to download this PSD layout please register for a VIP account.  You will be able to download all our VIP resources