Design an amazing 3d hosting layout

If you want to create a web page for representing web hosting company of any kind you have to follow this tutorial step by step.
You will be able to build a professionally looking and competitive online presence which will be highly evaluated by your customers.

With some modifications this layout can be used also for another type of Internet business.

Create a new document with any size you want. The width is more important than the height. It is recommended to use a value for the width between 920 and 1000 pixels. This width will fit well an all type of modern monitors. Select your Paint Bucket Tool, and fill your background with the following color: #141414
Select the background layer, and press on CTRL+J. This shortcut will duplicate the background layer. You will see a new layer above the original background layer.
Select the second layer, and go to Filter > Noise > Add noise
In the Add noise window use the following values

Download the following honeycomb pattern. Right click on the image and choose “save image as”

Open the image in Photoshop, and then go to Edit > Define pattern. Choose a name for this pattern and click ok

You can now close this small image, and you can return to work on the hosting layout.
Create a new layer on top of all layers. (The easy way is to press simultaneous on the following keystrokes: SHIFT+CTRL+ALT+N)
Select Rectangular Marquee Tool and create a selection on top of the layout

Select Paint Bucket Tool, and select the pattern we just create a few seconds ago/

Press one time inside your selection with Paint Bucket Tool, and then press on CTRL+D to deselect. This is my result

With Rectangle Tool I will create a black shape.

After that I will create another shape in the same spot but with a white color

I will right click on the layer and I will select Rasterize layer

I will select Eraser Tool, and with a smooth round brush I will delete the left side and the right side of the white shape. This is my result

I will create a new layer and I will place it on top of all layers. I will select Brush Tool, and I will create 2 simple points over my layout

I will change the blending mode for this layer to “Soft Light”

This is the result so far

I will select Rounded Rectangle Tool, and I will set the radius of the corner to 20

I will create a few shapes on the layout. Click on image to see the full size layout.

For the first fours shapes from the top I will add the same layer styles

This is my result so far

For the bottom shape I will add the following layer styles

This is how the footer of the hosting layout will look like

Now comes the funny part. I will add some sort of lights to create a 3D look for all these shapes.
Select Line Tool and with White color create a horizontal line.

Right click on the layer in your layer palette and choose Rasterize layer and then with Eraser Tool delete the left side and the right side of the line

Duplicate this layer and move it up with a few pixels

After you have this line go to Filter > Blur > Gaussian blur, and use the following settings

Duplicate this blurred line 2 times (press on CTRL+J to duplicate)
This is my result so far

With the same technique I will create the same lights on side of the shape

And of course I will add the same lights on all the shapes from my layout. It will be good if you click on the following image to see the full size result.

On top I will create a navigation bar. I will use Rounded Rectangle Tool to add this shape. Please note that I have changed the corner radius to 9 pixels.

I will add the following layer styles for this navigation bar.

This is the result

I will duplicate this shape and I will add the following layer styles

This is the result

I will duplicate this shape one more time, and after that I will select both layers inside my layer palette. I will press on CTRL+E to merge all the layers into a single one. This action will rasterize the shape and it will allow me to delete the corners of the shape.
So please select Eraser Tool, and with a smooth round brush delete the corners of the shape

Now I will add another shape with Rounded Rectangle Tool. I will place this shape right under the navigation bar.

Now I will move forward and I will create a shape like in the following image.

To create the shape from above you have to create a simple shape with Rounded Rectangle Tool. You will have to Rasterize the shape, and then you can delete the top part of the shape.
For this shape I will add the following layer styles.

This is my result

I will duplicate this layer, and I will select in my layer palette both layers and then I will merge them into a single layer. With Eraser Tool I will delete the extremities of the shape

Then I will highlight this area with a white line. You know how to achieve this effect, so I will not explain you anymore

I will place the same details on the other 2 boxes.
The next step is to add a logo. I will use a text logo for this tutorial. I will write the word Grafpedia on top of the layout with the following font: Myriad Pro (Bold Italic)

Bow I will add the following layer styles

This is my result so far

My final step is to add some text over this layout and in the same time some images. Please click on the following image to see the final result of this hosting layout.