Design the Pirates Layout using Photoshop

Watching once again on TV the Pirates of the Caribbean, I got the idea to create a Template around this movie. In this way, I used several pictures able to create a dark theme with help of wood and rock texture. The final result is perfect for a webmaster with a pirate spirit!

The psd of this layout is available, to download it, click on the blue button. Or susbscribe now to a VIP Account and download the collection.

Before to start this tutorial, see below the final result of this Photoshop tutorial.

All is now ready to begin. Open your Photoshop software.

STEP1 Creation of a new document

Go to menu File>New and after, enter the name and the sizes, now press on the Validate button. A new document appears on screen.

To create the texture of the background of this theme, go to this page: http://www.grafpedia.com/stock-images/product/cement/#r and download the cement texture.

Create a new fill layer (menu Layer>Fill Layer>Solid colour) with this colour : #2e210c.

Reduce the layer of the texture to 40% and fill the background layer with this colour: #151005.

STEP 2 Create the menu

Create a new group you name The menu. Import the papyrus.png file into your document.

Select the layer Papyrus and go to menu Layer>Layer styles>Drop shadow.

Go to this page : http://freewallpaperspot.com/pirates-of-the-caribbean-background-1.html then, download one of these pictures. Look for the Death head logo and cut it out. Put it above your theme, over the papyrus.

Create a new layer and put it under the Death head. Use the Brush Tool (B) with the black colour and a diffuse form to create a shadow.

Go to this page and download this font : http://www.dafont.com/pieces-of-eight.font. Install the font on your computer. Use now the Text Tool (T) to add some links into your menu. Add a drop shadow onto the text.

Use agian the Text Tool (T) to create the titlte of your wbesite. Add three layer styles on this text: drop shadow, gradient overlay and pattern overlay.

STEP 3 Create the carousel

Go to this page and after, download the wood texture:http://steves3dblog.blogspot.fr/2008/12/september-scene.html, and import it into your document.

Go to menu Layer> Layer Mask> Reveal all. Then, use the Brush Tool (B) with a hard shape and the black colour to create a frame as below.

Duplicate the fill layer already used for the background and after, place it over the frame. Right click with your mouse on the layer and select Create clipping mask.

Go to Google to look for a picture regarding the movie and then, import it into your document (under the wood frame). Add an inner shadow to the picture.

ETAPE 4 Creation of the torches

To begin the creation of the torches, open first this picture in your Photoshop software: http://freewallpaperspot.com/wallpapers/pirates-of-the-caribbean-wallpaper-8.jpg , then enter the Rectangular Marquee Tool (M) to select the fire of the right side and copy it into your picture. Use now the Eraser Tool to cut out the Torch.

Create a new layer and select the Brush Tool (B), select a soft shape, reduce the opacity of the tool to 20% and update the foreground with the white colour. Use now the brush over the fires to create some blur.

Create now two new layers and put them under the torch. Use now the Brush Tool (B) to create a white glow on the foreground, and orange on the second. Change the opacity mode to overlay for these two layers.

Group all layers regarding the first torch into a group. Duplicate this group. Select it and go to the menu Edit>Transform>Flip horizontal. Use the Move Tool (V) to place the torch of the left side of the frame.

STEP 5 Creation of the events blocks

Create a new group and name it the treasure. Use again the wood texture to create a small board (see the picture below). Add the brown fill layer over and do not forget to change it to a clipping mask.

Add to the board the same drop shadow that the one previously used on the menu.

Use the Text too l(T) to create the title of the block, here an invitation to a game.

Cut out the safe and the Death head from the picture below and add them over your title : http://freewallpaperspot.com/wallpapers/pirates-of-the-caribbean-9.jpg

Create now a new layer and place it under the wood board. Use the Brush Tool (B) with the black colour and a soft shape to create a shadow under the safe and the death head.

Use same method to create a second title. The death header with the peak is located on the previous picture. The map is on this page: http://mymetaldetector.blogspot.fr/2011/05/old-maps-of-florida-usa.html

See below the result of your work.

STEP6 Create the videos

To create the videos, create first a new group and name it box movie 1. Use the same wood texture to create a small borad. Use the Eraser Tool to cut out the borders and to work them.

Duplicate three times this board and create a frame as below.

Add the Fill layer (clipping mask mode) and add the same drop shadow as the one used for the menu.

Use the Ellipse Tool (U) to create a round on the first side of the wood boards and add three layer styles on the shape: a drop shadow, a gradient overlay and a stroke.

Duplicate this round three times and use the Move Tool (V) to put the copies all around the wood boards.

Add behind the frame a picture from the movie, then add the same inner shadow as the one used in the carousel.

Create a new group and name it le player, then put it over the wood frame. With the Ellipse Tool (U), create a round (with this colour #453522).

Add now these layer styles on the round.

To finish, use the Customized Shape (U) with the triangle shape to create the Play icon. (use the colour #14110b).

Duplicate three times the group Box movie 1. Use now the Move Tool (V) to place all different videos all along the Template width.

STEP 7 Complete the carousel

This small step is useful to complete the carousel adding a play icon over the big picture. To do it, duplicate the play icon once again and place the copy over the picture. Select now the document and press on the Ctrl+T keys to activate the free transform. Keep the Upper case key and increase the icon size. Apply a soft update on the round.

STEP 8 Create the block of newsletter

It is already the last step of this Photoshop tutorial. You are going to create a block which will be used to retrieve the mails of your visitors, to be able to send them a newsletter. To do it, use for the last time the wood texture to create a wood board all along the document width. Add over, the brown fill layer (clipping mask mode).

Duplicate the rounds used on the board borders in the videos groups and place a round on each side of the board.

Use the Text Tool (T) to add the title of the block, then add a drop shadow on the text.

Create a new layer, then using the Brush Tool to create brown rectangle #0e0b06. Create imperfect borders to simulate the wood.

Add now these layer styles: Drop shadow and inner shadow.

Use the Text Tool (T) to add the label of the form field.

Use the wood texture to create a small wood rectangle and add two layer styles on it : drop shadow and external shadow. This operation is useful to create the submission button of the small form.

Use the Text Tool (T) to add the title of the button. Use same styles as them used for the title located on the left side of the board.

STEP 9 The Copyright

The Template is already full of elements; it is why I decided to create a simple Copyright, only adding a small text. Use then the Text Tool (T) to create the Copyright, and use same styles as the styles added to the title from the top of your document.

That's all, all is finished now!

I remind you, you can download the psd file of this theme, by a click on the blue button below. You need to be connected to your Premium account to activate the link. You are not a member? Click here to create a Grafpedia's account.

I you like this Photoshop tutorial, Do not hesitate to share it on your social networks, click on the buttons from the top of your screen. Thank you very much to you all.