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 Dark Corporate Lgayout

Create a Dark Corporate Lgayout


Open a new document with the following size: 960x900 pixels. For the background color I will use a dark color: #4d4d4d. I will select Rounded Rectangle Tool, and I will create 2 shapes.

image 1

I will duplicate these two shapes. To duplicate a shape you need to select it first in your layer palette, then press on CTRL+J . You will see the layers above the original ones. Right click on each copy and choose Rasterize layer.

image 2

Then for the top layer please add the following layer styles.

image 3

image 4

And for the bottom one use the same layer styles as above, but check the " Reverse " checkbox

image 5

Here is my result so far

image 6

I will load the selection for the top shape. To load the selection please hold down your CTRL key, then press on the Thumbnail for the top layer

image 7

Go to Select > Modify > Contract... and modify with 1 pixel

image 8

Create a new layer above all layers ( press CTRL+SHIFT+ALT+N ), then go to Edit > Transform > Stroke

image 9

Press on CTRL+D to deselect, then you will have the following result

image 10

I will select Eraser Tool, and with a big smooth brush I will delete some parts of this line

image 11

I will change the blending mode to Overlay, and I will reduce also the opacity to 50%

image 12

Please keep in mind how you have achieved this effect, because I will use several times in this tutorial. I will create the same thing border for the bottom shape.

image 13

I will create other shapes with Rounded Rectangle Tool

image 14

I will add the following layer styles for all the white shapes

image 15

image 16

This is my result

image 17

Above these layers I will create other ones.

image 18

I will rasterize all this white shapes, and I will delete the bottom part of the shape

image 19

I will add the following layer styles for all these shapes

image 20

image 21

image 22

image 23

image 24

This is my result

image 25

I will create other shapes with Rounded Rectangle Tool. I will place the shapes under the previous one

image 26

I will Merge all the white shapes., and I will delete the bottom part

image 27

Then I will add the following layer styles for this shape

image 28

This is my result

image 29

I will create some buttons with Rounded Rectangle Tool

image 30

The same I will merge all the buttons into a single layer ( press CTRL+E ) , then I will add the following layer styles

image 31

image 32

image 33

image 34

This is my result

image 35

I will add right now some circles with Ellipse Tool

image 36

For all the small circles please add the following layer styles

image 37

image 38

This is my result so far

image 39

Now I will add some text, and after that I will add also some images

image 40

On the right side I will add some shapes with Rectangle Tool

image 41

I will lower the opacity for all these layers, and I will place some text

image 42

The next step is to create on a new layer. On this layer I will use Brush Tool, to create a few white points

image 43

Change the opacity for this layer to 40% , and the Blending Mode to Soft Light. This is My final result. I hope you like it

Create a dark corporate layout



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: