www.PhotoshopTower.com
Return Home Tutorials About Us Services we offer Contact Us Affiliates Site Search
Hot Extras
Tutorial Spotlight:
Pattern Text Effect Learn a very easy and cool text effect, with uncomplicated steps! Must See! read more...
Join our Mailing List to receive:
  • Site Updates
  • Photoshop Tutorials
  • Webmaster Tips
  • Hot Site Reviews
  • & much more...

  • Mailing List: Privacy Policy


    Affiliates
    Your Link Here

    www.VidPit.com: Funny, Cool & Sexy videos!



    PSD HOUSE / Photoshop Tutorials







    Link to us
    ( Link to PhotoshopTower.com )



    wholesale computers

    PhotoshopForce.com - Photoshop Tutorials

    Site By: Coastal Web Innovations

    Some web hosting solutions you can find yourself on WHG and a list of
    web hosting companies.
    Quick Layout
    In this tutorial l will show you how to create this clean corporate layout that works great for a sleek professional look. Using these techniques you can quickly create dozens of website layouts in no time at all.


    The techniques used in this tutorial are professional grade tips and tricks that are used all over the world, l hope you're ready to learn.

    Page 1 of 1

    Step 1.)
    Open a new document that is 770 x 500 and fill the background with white



    Step 2.)
    Create a new layer & get out the pencil tool, and set it to 1 pixel in diameter.


    Now using the pencil tool, draw 4 lines all the way across the top of your canvas like so:

    The order of colors l used are:
    1 - #E4E3D6 (top)
    2 - #D2CFC0
    3 - #A3A090
    4 - #8F8D84 (bottom)





    Step 3.)
    Create a new layer: Now using the rectangular marquee tool, make a selection on the canvas as l have done here:
    , and fill this selection with black.

    Now double click on the layer, and apply the following blending options:
    Gradient Overlay




    Stroke


    Result:






    Step 4.)
    Create a new layer: Again, using the rectangular marquee tool make a selection like this: Notice it is directly bellow the previous box we'd made:


    Fill this selection with #: 375A80 and press CTRL + D to deselect.


    Double click this layer, and apply the following blending options:
    Gradient Overlay:




    Result:






    Step 5.)
    Create a new layer: Get out the rectangular marquee tool, and make a selection directly bellow this box like so:


    Fill this selection with: #FFFFFF (white) and press CTRL + D to deselect.

    Double click this layer, and apply the following blending options:
    Gradient Overlay:




    Result:






    Step 6.)
    Now set your foreground color to: #C8CED8, get out the pencil tool and set it up like so:

    (2 pixel width)

    Now draw a 2 pixel line at the bottom of the new box we just made that spans the entire width of the canvas:






    Step 7.)
    Now set the foreground color to: #FFFFFF (white), and set the pencil tool to 1 pixel instead of 2:


    Now draw a 1 pixel line across the canvas about 1/4 inch above the bottom of this box like so:






    Step 8.)
    Now change the thickness of the pencil tool to 4 pixels, and draw two vertical lines up this box to separate it as l've done here:


    This separates our content areas for the layout.





    Step 9.)
    Create a new layer, using the rectangular marquee tool make a selection like so for the header:
    Fill this selection with #FFFFFF, and press CTRL + D to deselect.





    Step 10.)
    Using the previous box as a guide, place an image into the header area. You can use a Render, or whatever you'd like. I've used a photo of a city street with a massive black tinted glass windows all over it.


    Finishing Touches:
    At this point you want to continue to refine your header, adding small details. Here l've added a "swooping" overlay and applied a company logo.


    This concludes the tutorial. What you'd want to do here is continue to add small details to the layout to make it your own. Here's what l ended up with after adding text, and a few minor details:


    I hope you've enjoyed this tutorial and have learned a few things along the way!





    Related Tutorials:
        View Interface Vents Interface Vents
    This tutorial will show you how to add a techno depth to your layouts with the u ...
        View Render Layout Tutorial vol. 5: Content Boxes Render Layout Tutorial vol. 5: Content Boxes
    In this tutorial you will learn how to create an entire layout by using an exsis ...
        View Render Layout Tutorial vol. 4: Button Creation Render Layout Tutorial vol. 4: Button Creation
    In this tutorial you will learn how to create an entire layout by using an exsis ...


    Home | Tutorials | About Us | Services | Contact Us | Affiliates | Search | SM | Top^