Categories

Partners
  • Website Templates

  • Design Feeds

  • Adobe Photoshop Tutorials

  • Website Templates, WordPress Themes

  • Website Templates

  • Flash Web Sites

  • Photoshop Templates

  • Photo Contests

  • Photo Tips
  • Search


    Advanced Search


    Partner Links
  • Adobe Photoshop Tutorials

  • Free Stock Photos and Images



  • Website Templates

    Creative Studio Web Page
    Published  10/28/2008 | Web Layout
       
    Creative Studio Web Page - part 1


    In this detailed tutorial we will learn how to create impressive layout for Creative Studio.

    Begin your work by creating a new file of 845x900 px and 72 dpi. Select after that the Paint Bucket Tool (G) to give it the color #151616

    Create Creative Studio Web Page in Photoshop CS3

    Using the Rectangle Tool (U), try to represent a kind of illumination on the background’s top part.

    Create Creative Studio Web Page in Photoshop CS3

    Select for this layer the parameters from below: Fill 0%
    Blending Options>Gradient Overlay


    Create Creative Studio Web Page in Photoshop CS3

    Gradient’s parameters:

    Create Creative Studio Web Page in Photoshop CS3

    Create Creative Studio Web Page in Photoshop CS3

    Introduce now the site’s name, keeping the next shown demands:

    Create Creative Studio Web Page in Photoshop CS3

    creative

    Create Creative Studio Web Page in Photoshop CS3

    studio

    Create Creative Studio Web Page in Photoshop CS3

    The layer’s parameters: Blending Options>Drop Shadow

    Create Creative Studio Web Page in Photoshop CS3

    Blending Options>Gradient Overlay

    Create Creative Studio Web Page in Photoshop CS3

    Gradient’s parameters:

    Create Creative Studio Web Page in Photoshop CS3

    Create Creative Studio Web Page in Photoshop CS3

    Using the Line Tool (U), try to make a horizontal line, colored with #323537

    Create Creative Studio Web Page in Photoshop CS3

    The layer’s parameters: Blending Options>Drop Shadow

    Create Creative Studio Web Page in Photoshop CS3

    Create Creative Studio Web Page in Photoshop CS3

    Make a copy of the last made layer and select the Free Transform option to situate the copy the same way indicated below:

    Create Creative Studio Web Page in Photoshop CS3

    Now it’s time for drawing the buttons on the site’s header. In this case we’ll select the Rounded Rectangle Tool (U) with a radius of 10 px. But firstly we need to represent just one button colored with #3D4A4E

    Create Creative Studio Web Page in Photoshop CS3

    Then we’ll make two copies of the last made button and select again the Free Transform option to place the copies the same way demonstrated next picture. Just one copy should be left without any changes. For the other button we’ll apply the color #1194FC

    Create Creative Studio Web Page in Photoshop CS3

    Insert now the name of the buttons for the site’s menu:

    Create Creative Studio Web Page in Photoshop CS3

    Create Creative Studio Web Page in Photoshop CS3

    Using the Rounded Rectangle Tool (U) (radius of 10 px) lower, try to make the primary layer of the basic web site’s panel:

    Create Creative Studio Web Page in Photoshop CS3

    Create Creative Studio Web Page in Photoshop CS3 Creative Studio Web Page
    In this detailed tutorial we will learn how to create impressive layout for Creative Studio.