Welcome to Fiery Darts. We are striving to be your home for learning what you can about Adobe Photoshop by providing uniqe, timely and regular tutorials. Please take a moment to bookmark our site.

Creating a Curtain Style Navigation Header

Filed under: Web Graphics — Fiery Darts @ 8:40 pm

Creating a Curtain Style Navigation Header
Start by creating a rectangle in a new file.
Press Ctrl+T. Right click and select warp.
Adjust nodes as shown.
Create a new small vertical rectangle.
Press Ctrl+T. Right click and select perspective.
Adjust nodes as shown.
Press Ctrl+T. Right click and select warp. Adjust nodes as shown.
Apply gradient overlay layer style using following settings.
Duplicate and scale down the layer.
Duplicate these layers flip horizontally and place it on the other side.
Duplicate the background rectangle, fill with a darker shade of red. Rasterize the layer.
Using eraser tool and a big radius feathered brush setting remove the bottom portion of this layer.
Press Ctrl+T. Right click and select distort. Move the corner handles up.
Duplicate the background rectangle, fill with a darker shade of red. Rasterize the layer.
Using eraser tool and a big radius feathered brush setting remove the top portion of this layer.
Merge all layers. Create a new file with header size. Drag the curtain layer from previous file to this new file. Duplicate and place according to the image below. Make the curtain overlap each other.
Fill background with black color.
Create a rounded rectangle. Move it below the curtain layer.
From filter menu select render>>lighting effect. Select five lights down style and adjust settings as shown.
Move the curtain layers up.
Select the rectangle layer. Press Ctrl+U and adjust settings as shown.
Type the link name over curtain. Insert the company logo.
Insert a relevant image and place it on the right side. Change the layer mode of the image as required.
« Creating and Animating A Jack In the Box   Tutorial PSD files now available! »

13 Comments »

  1. its cool..

    Comment by Pulse — February 25, 2006 @ 4:06 am

  2. i really like this tutorial..
    thanx

    Comment by BLUSH — February 25, 2006 @ 9:54 am

  3. awesome tut. very original.

    Comment by moi — February 25, 2006 @ 1:58 pm

  4. Simply Great

    Comment by john — February 26, 2006 @ 4:01 pm

  5. my god, great!

    Comment by lipo — February 26, 2006 @ 10:48 pm

  6. When my wife found me searching frantically for some thing,”what on earth, you’re searching honey?”, she asked. “words words, I wanna thank this guy for giving such a nbeautiful tute” I said and started again searching.

    Comment by rambabu — February 27, 2006 @ 12:53 am

  7. Wow that’s great!!!

    Comment by Alvin — March 4, 2006 @ 3:56 am

  8. grea tut
    well done :)

    Comment by Laurence — March 8, 2006 @ 1:44 pm

  9. very nice tut !!! Effects are excellent, very good job !!!

    Comment by Wamilton — March 9, 2006 @ 4:17 am

  10. That`s very… very good and funny ;)

    Comment by MarcuS — March 11, 2006 @ 5:42 am

  11. fantastic! superb! most beautiful header i’ve seen. photoshop put to best use.

    million thanks

    Comment by kory — March 23, 2006 @ 4:11 pm

  12. very nice tutorial. THANKS

    Comment by X~pelled — March 23, 2006 @ 5:07 pm

  13. So cool…

    Comment by Made — October 23, 2006 @ 11:11 am

RSS feed for comments on this post. | TrackBack URI

Leave a comment

XHTML ( You can use these tags): <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong> .