View Single Post
  #1 (permalink)  
Old 10-26-2006, 08:37 PM
admin's Avatar
admin admin is offline
Administrator
 
Join Date: Sep 2006
Posts: 1,385
Blog Entries: 2
admin has disabled reputation
31 Create professional patterns for navigation bar

Hello

This is the Tutorial number 31 from the 100 Marathon Tutorial
As i have told you i will try to add a tutorial each day.

Today i will show you how to create a nice pattern.

Open a new document in Photoshop
This document should be 40x40 pixels and with a transparent background.

Now create a new layer ( Press CTRL+SHIFT+ALT+N )
Select Paint Bucket Tool and fill this layer with black ( this layer we will delete at the end of the tutorial )

Now zoom your document to 1600 %

Create another layer ( press CTRL+SHIFT+ALT+N )

Select Pencil tool. Change the brush size to 1 pixel and make a diagonal line with a white color.
The next image is zoomed by 1600 %



Now create another layer and make another diagonal line like on the next image:
NOTE: It is very important to create this new layer because we will change the opacity for a nice effect.



Now i will continue this steps .

Please do not forget to create a new layer before you make a new diagonal line. then do not forget to change the opacity.

In the next image you will see how i will make the lines and you will see for each dot what is the opacity.



Then with the same technique make the following diagonal lines:



Now delete the Black background.

Go to Edit > define pattern...

Choose a name for your pattern and press ok.

I will show you now what you can make with this pattern.

First you can create nice navigation buttons:

Open a new document.
Fill it with what color you want.

With your Rectangle Tool draw something like this:



Then add this Layer Style:



For Inner Glow settings use the color #003399







Set the Gradient color for the left #66CCFF and for the right #0066CC





This will be your result:



Now we will apply the pattern we have created.

Then Hold the CTRL key down and with your left mouse click on the layer thumbnail like in the following image:



You will notice that you will have a selection around your navigation bar:



Create a new layer ( press CTRL+SHIFT+ALT+N )

Now go to Select > Modify > Contract , and choose contract by 4 pixels
You can use your own value here.

Now Select the Paint Bucket Tool and set choose your pattern:



Then click one time inside yor selection.
Click CTRL+D to deselect.
This is the result:



Now press on Add Layer Mask



Select Gradient Tool
Press D and after that draw a line exactly like in the following image ( instead of the red arrow )



I hope you find this tutorial useful.


3D Logo Creator + Mega Pack + Photoshop Designer's Pack = Only 148$ ( save 150 $ - use coupon code: talk )
Reply With Quote