www.PhotoshopTower.com
Return Home Tutorials About Us Services we offer Contact Us Affiliates Site Search
Hot Extras
Tutorial Spotlight:
User Submitted Tutorial! Learn how to create an awesome Force Lightning Effect to can easily be added to your images, and creations! Very Cool! 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!



    FreeTimeFoto.com

    PixelXS.com - A quality tutorial and render website





    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 2 of 3

    Step 7.)
    Create a new layer, set your foreground color to: #D9D9E1
    Get out the pencil tool and set it to 2 pixels in width. and draw a 2 pixel line along the side of the green box we'd just made like so:


    Next set your foreground color to #000000 (black) set the pencil tool to 1 pixel this time, and draw a 1 pixel black line in right beside the line you just created like so:
    (close up - draw this line all the way down the image)






    Step 8.)
    Create a new layer. With the rectangular marquee tool, make a selection like so:


    And fill this selection with white (#FFFFFF)
    Result:






    Step 9.)
    Next we'll make a space for our company name, and logo. Create a new layer, and make the following selection with the rectangular marquee tool:


    Fill this selection with white (#FFFFFF).

    Double click this layer, and add a slight dropshadow to it in the blending options:


    Result:






    Step 10.)
    Now we'll create a section for our navigation/links. Create a new layer, get out that handy rectangular marquee tool, and make a selection like so:


    Set your foreground color to #000000 (black), and your background color to white (#FFFFFF)


    Get out the gradient fill tool, and set it up like so:


    Now fill in this selection with the gradient tool, from black to white:


    Change the 'blending option' of this layer to "Overlay", and set the opacity down to around 73 percent


    Result:






    Step 11.)
    Now we'll put some dividers on the navigation box. Go ahead and create a new layer, get out the pencil tool. Set it to 1 pixel, and set your foreground color to: #000000 (black). Now draw 1 pixel lines across the navigation area. Attempt to make the distances between these lines equal.
    Result:






    Step 12.)
    Now set your foreground color to #5B5C5B, and draw another line right bellow each of these lines. This gives us a great looking "bevel effect" on our navigation bar.




    Go To Page: [ 1 2 3 ]
    Page 2 of 3
    Tutorial Index



    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^