Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Interior Design Layout

Interior Design Layout


Create a new document 850x1300 pixels, fill your background layer with the color black. Select the rectangular marquee tool and create two rectangles on top of each other using the colors #2e2e2e and #202020.

Interior Design Layout image 1

Leave a 1 pixel gap inbetween each rectangle, place the rectangles at the very top of your canvas, merge both rectangles into one layer. Now goto "filter > noise > add noise" use the settings below.

Interior Design Layout image 2

Now add a layer mask to your layer, set forground and background to black and white, select the gradient tool using a linear gradient start from the bottom of the rectangle and drag up. Right-click your mask on the rectangle layer and goto "apply layer mask". Repeat the steps above only this time from the top of the rectangle.

Interior Design Layout image 3

Continuing using the same process as above only this time select a reflected gradient, set forground color to white and this time drag from the middle of the rectangle towards the edge either left or right, choice is yours. You should then have something like this.

Interior Design Layout image 4

Add your site title and logo, the pink color i used is #ff0072 and the font is used is "swatch it".

Interior Design Layout image 5

Underneath your background jazz and site title add your navigation text. On this navigation im going to use a two tier one, so i add a rectangle around one of the navigation items then add a long rectangle underneath.

Interior Design Layout image 6

The little arrow on the 2nd navigation was made using the pen tool. For this next part your going to need some interior design stock images. Add a nice looking interior design stock image underneath your navigation, add a 1 white pixel stroke to the image.

Interior Design Layout image 7

On top of our big image add two black rectangles towards the bottom. Also add a 1 pixel white stroke to each of the rectangles then lower the "fill" to 60%.

Interior Design Layout image 8

Fill these boxes with some information of your choice. Underneath the big image add a further two interior design style images and then a black square at the end, add a 1 pixel white stroke to each of them.

Interior Design Layout image 9

In the end box add some more information, then select the rounded rectangle tool and create an equal square rectangle.

Interior Design Layout image 10

Fill your rectangle with the color black then add these two layer styles.

Interior Design Layout image 11

Interior Design Layout image 12

Now hide ALL YOUR LAYERS apart from the rectangle one, create a new blank layer above it then goto "layer > merge visable" make sure you have the rectangle layer selected. UNHIDE all your other layers. Add a layer mask to your rectangle and blend it in from the left side. Now duplicate your rectangle layer 3 times and place like the image below.

Interior Design Layout image 13

Fill these rectangles with some products related to interior design. Now for the footer duplicate your background jazz, site title and logo then move right the bottom of your canvas, add your copy right information.

Interior Design Layout image 14

Your end product should looke something like this.

Interior Design Layout Tutorial: Final Result



Author's URL: Hv-Designs.co.uk
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

Advance your current skills or acquire new skills in Photoshop by creating projects using our step-by-step tutorials. More Tutorials: Most Popular Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

Add comments to "Interior Design Layout"

Only registered users can write comment

No comments yet...