33000 Premium resources for designers

Create a horror portfolio PSD layout in Photoshop

in Designing, Tutorials, Web layouts by Razvan on April 15th, 20097 Comments

horror-layout

PSD Horror Layout

Hello my friends.
Today I will create for you another type of layout. You will not see these types of layouts very often. I will create this layout because sometimes you try to impress your audience. I don’t know if you will like my layout, but I am sure you will learn some new Photoshop techniques if you follow my tutorial.

Preview the full size layout

I will create a new document with the following sizes: 960×900 pixels. The background color doesn’t matter. We will add a wood texture very soon. Before you start this tutorial you will need the following images:

Window image
Small rat

Owl
Skull
Cat
Gramophone – An old style Gramophone isolated on a white background

Blood brush set from Grafplus

I will provide you a background image I’ve made for you

wood-texture

Open this image in Photoshop, then go to Edit > define pattern. Select Paint Bucket Tool, and be sure you have the pattern we just created selected.

120

Then click one time on your canvas. The wood texture I’ve made for you it is a seamless wood texture. Duplicate this layer ( press CTRL+J ), then go to Image > Adjustments  > Brightness / Contrast. Use my settings

218

This is my result so far

316

Duplicate this layer one more time, then go to Edit > Transform > Perspective

415

Press on CTRL+T, and rotate the layer like in my following image. I will place a red border. You will see my result better.

514

Duplicate this layer (press CTRL+J), and then go to Edit > Transform > Flip Horizontal
With Move Tool, I will place the image like in the following image.

66

I will remove the red stroke, and then in my layer palette, I will select both layers.

75

I will press on CTRL+E to merge the layers.

85

I will select Rectangular Marquee Tool, and I will make a selection on my layout.

96

I will hit delete on my keyboard, and then i will press on CTRL+D to deselect. Click on the following image to see better my result.

104

For this layer I will add a layer styles

1110

This is my result

125

I will select Brush Tool, and with a big smooth brush I will add some white spots on my layout

135

I will change the blending mode to Overlay

145

This is my result

155

I will select one more time Brush Tool, and I will make some black drawings with the same smooth brush. I will make the drawing on the margins of my layout. The reason I am doing this is because it will look nicer when you try to code this layout. You can see the full size image if you click on the following image.

165

I will download the following stock image with the open window

http://www.sxc.hu/photo/1163496

I will open this image in Photoshop, and I will make a selection like in the following image.

175

Then I will press on CTRL+J (this will cut the image, and place it on another layer). Drag this layer on your layout. In the same time you can cut also the glass window.

185

Duplicate this layer, and go to Edit > Transform > Flip Horizontal. With Move Tool, place this layer on the right side of the layout.

195

You can see a “small gap“ on the window. We will fill this in a few seconds. If you don’t know already there is a tool in Photoshop Single Column Marquee Tool. It will allow you to create a selection of one pixel.

205

After you have the selection, be sure you have the layer with the right side of the windows selected, and then press on CTRL+J. Imediately press on CTRL+T and with Move Tool, press on move the transformation controls points to the left.

219

Select all the 3 layers in your layer palette, and then merge all the layers into a single one.

225

I will go to Image > Adjustments > Desaturate.
Then I will go to Image > Adjustments > Brightness/Contrast

235

I will duplicate this layer (press CTRL+J) and I will go to Filter > Noise > Add Noise

245

For this last layer I will add a small shadow

255

This is my result so far. Click on the image to see the real size

265

I will need right now the images. I will open all the images and I will select all the animals. You can use any tool you want to extract each animal. On the following image you can see the where I placed the rat, the owl, the cat and the skull.
NOTE: You can use Magnetic Lasso Tool, if you want to make almost perfect selections.

275

You can see small imperfections around each animal. This is no problem right now. We will delete them with a small brush. First let’s change the colors for the cat.
The first step is to desaturate the layer with the cat ( SHIFT+CTRL+U )
Then go to Image > adjustments . Brightness/Contrast, and use the following values

286

This is how my cat looks like.

294

Now you can go to Filer > Sharpen > Sharpen
Than press CTRL+F (this shortcut will apply the last filter one more time).
This is my result

304

I will do the same for all the other animals, and also for skull.

317

I will select the layer with the skull, and with Dodge Tool I will draw on the left side of the skull. Then with Burn Tool, I will add some shadows on the right side.

322

I will create a new layer (press CTRL+SHIFT+ALT+N) , and with Brush Tool I will add some red eyes for all my animals

332

I will download another image with a gramophone

http://www.sxc.hu/photo/762071

I will extract the gramophone from that image, and I will use the same technique when I try to change the color. I will desaturate the skeleton first and then I will change the value for in the Brightness/ Contrast window.

342

Now I will add a image inside the window.

352

With Horizontal Type Tool I will add some text under the window, and I will add also some small thumbnails. The thumbnails are from my last tutorials.

362

I will download the following set of Blood brushes.

http://www.grafplus.com/brushes/blood-brushes/

I will create a new layer (press CTRL+SHIFT+ALT+N), and with Brush Tool, I will add some splats. I will use the following color: #8b0103

372

Then I will change the blending mode for this layer to Overlay. I am almost ready with this layout. I will add a text logo on the top. And under the cat I will add a shadow. This is my final result

383
Want to download the PSD file for each tutorial including this one ? Join our VIP membership. For 9.95 $ you can download all premium resources from Grafpedia

Download Demo

Responses to “Create a horror portfolio PSD layout in Photoshop”

Trackbacks

  1. psaddict.com
  2. 40 best photoshop tutorials for web layouts | Best Tutorials Around the World

Leave a reply