www.PhotoshopTower.com
Return Home Tutorials About Us Services we offer Contact Us Affiliates Site Search
Hot Extras
Tutorial Spotlight:
Modern Contemp In this tutorial l will explain how l created this contemp layout for a travel agency 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!



    the Minty Ferret - Fresh Photoshop tutorials, freebies, resources, and more!

    LooseMoose52





    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.
    Unique Technology Layout



    In this tutorial l will show you step by step how l created this mock layout for a technology website. This layout would work great for a company that develops software, or hardware. Or offers specific internet/customer relations services. If you're ready to get started, we'll begin.
    Go To Page: [ 1 2 3 ]
    Page 3 of 3

    Step 13.)
    Next add the text for your buttons as l've done here. The font l used is: Tahoma with a size of 13pt color: #FFFFFF.


    I also applied the following blending options to each of the button text layers, (double click the layer that your text is on and apply these settings)


    Result:






    Step 14.)
    We're getting there. Now lets add a sidebar on the right for news updates, a search bar and other information. Create a new layer, get out that rectangular marquee tool again, and make the following selection:

    Fill this selection with #E4E9E3
    Result:






    Step 15.)
    Now create another layer on top of the last one, and make the following selection with the rectangular marquee tool. This will be an area for the search field.


    Fill this selection with: #404642
    Result:


    Now double click this layer, and apply the following blending options:
    Inner Glow:


    Stroke:


    Result:






    Step 16.)
    Create a new layer, get out the rectangular marquee tool and make a selection like so:


    And fill this selection with #69725A
    Result:


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

    Now double click this layer, and apply the following blending options:
    Inner Glow:


    Gradient Overlay:


    Stroke:


    Result:






    Step 17.)
    Next l placed a stock photo of some business people bellow the "logo container" box we'd made earlier in the tutorial.


    At this point the layout of the design is pretty much finished. Here l added a logo, company name, and slogan to the layout:


    I also decided to add some trendy arrows next to the navigation bar, and lighten the background of the nav bar a bit:


    Here's how the overall layout looks:


    and after adding content, and refining here's the final result:

    I hope you enjoyed this tutorial, and have learned some good techniques the process. Please be sure the check out the rest out great tutorials.





    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^