Getting Photoshop to the height potential is a hard thing. Plug-ins, brushes, styles, illustrator shapes, they all came at a cost most of the time.

Have you ever tried to expand the capabilities of your Photoshop? I guess so. Have you ever wanted this for free? If so read on, because you will find 4 of the coolest resource sites that you can find out there.

Over the past 3 years, I have been using Photoshop for personal hobbies and now I am starting to use it as a way of earning online. In the last few months I have discovered something interesting. Meany times the quality of the design isn’t determined by the extra tricks (plug-ins). It is determined by the use of them. So rather than spending money on the paid resources that are available out there, I recommend that you try to use the free ones.
It is true that the quality free resources are harder to find. They have less advertising budget so you might be luck to find a really good site like that.

I have a list of over 100 resources sites, but right now we will talk only about 4 that I considered most useful in the last months.

I will start with the big bad popular Deviant Art. Brushes, Vector Arts, Textures, Tutorials all! One thing to keep in mind though, they have a lost of garbage there. Not all the submissions are of high quality.



A more select site that has only brushes and sometimes high quality ones is getBrushes.com. I used some of their brushes in my designs, and I was pleased by them. Not to pleased, but hey, It FREE!.



The last two are twins. One of those to has brushes, the other one vector graphics, and they both look alike. Brusheezy and Vecteezy. Those two sites have quality resources. I think that I can say they have the “Best of the Best Free Brushes Out There”.

So again, the 4 sites are:

• DeviantArt
• GetBrushes
• Brusheezy
• Vecteezy

Now start downloading your free resources and have fun and enjoy using them. I hope you found this useful for ya!

Labels: Basics, Ideas, Resources, Sites

This week some new ideas came in my mind. I received some feed back and suggestion via email from some readers telling me to try to get more personal here. That might be true, because in the last 2 weeks I’ve only written step-by-step tutorials. The real problem is time. I don’t have enough time to do all the things that I want for this blog.

I was thinking to try to create a unique style of writing, not just copying the other tutorial-like blogs/sites. After all a blog is more about MY style. So here’s what I’ve came up so far:

• Presenting the Main Idea, what I did, what was the outcome, what I have learned from this experience.
• The simplest introduction of the steps that will get the outcome.
• The Step by Step with the screenshots AND why I did that. Again, I think this a place where people read my opinion not some simple procedure.
• Closing thoughts, how good could this get, how funny it can be etc.

I was also thinking to make a pool where people can vote if they wanted more step-by-step tutorials or some other sort of help. The “basic” training curse is on the way, it will take some time to write a really good set of articles. The blog reached 600 unique visitors/day to times, so the pool idea should be helpful for both of us ( you the reader and me the blogger ). I made a small list of all the things that I could write about rather than spending my time on writing tutorials.

• Weekly Tutorial Discussion.

• I make a list of all the coolest tutorials that are written in that week and discus the tricks that were used where there is need to.
• You can also suggest some tutorials to this weekly article. If you do I will review it and see if it’s worth adding to the list or not.

• Weekly Xtreme Tutorial.

• A new tutorial every week. Only one/week. Yep, not 3 as they were this 2 week. I think that one that is good is far better than 3 that don’t have the same level of quality.
• You can suggest what kind of tutorial you want by emailing me.

• Resources of the Month.

• A big article that has a lost of links to quality resources and maybe some downloadable ones from a direct source.
• This article will be different from month to month since the people that create them don’t have a fixed number of “sets” that they make every month.

The list continues but these are all the articles that could be written periodically. The others are a bit secret so if you are interested then subscribe to the RSS Feed.

Labels: Ideas, News

In this tutorial you will learn how to create the navigation bar shown above. Almost all the effects are create using the Photoshop Layer Styles, so you will find this techniques really easy.

Let’s get started!

Step 1.

Create a new Photoshop Document (File->New) with 750 pixels width and 130 pixels height. Press Ctrl/Command I to invert the colors of the background. Now you should have a black background.

Create a new Layer (Ctrl/Command N). I named it “navbar”. Get the rounded rectangle tool (U) and with the path option selected (see screenshot below) draw a rectangle similar to the one shown below.

Right Click the path and chose fill. Fill it with “#ae005f”.

Time to add the Layer Styles (Layer->Layer Style):

Step 2.

We will add the glass effect now. Ctrl/Command Click the “navbar” layer icon from the layer pallet to select all the navigation bar. Using the Rectangular Marque Tool(M) hold Alt down and make a selection that goes over the bottom of the navigation bar.

Create a new layer (Ctrl/Command N). I named it glass. Fill the selection with white, on the new layer (Edit->Fill). Now set the opacity of it (the glass layer) to 15-25% (Layer->Layer Style->Blending Options).

Step 3.

Zoom In to 600-800% and make a small selection similar to this one. Create a new layer (Ctrl/Command N). I named it border.

Fill the selection with white on the new layer (Edit->Fill). This is the Border that we will use as delimitation between buttons. Feel free to move it around so that you have place to write the text that will be contained in the button.

Time to add the Layer Style (Layer->Layer Style):

Adding the text is easy right. Just use the Text Tool :).

Step 4.

Our buttons should have at least to states. We will now create the overstate or the disabled state. In this tutorial we will use only 2 states but you can play with the overstate a bit and get a lot of other possible states.

Ctrl/Command click the “navbar” layer. Now using the same technique used for the glass effect, deselect all the part that doesn’t belong to the first button. (Use the Rectangular Marquee Tool (M) and Hold Alt while drawing the selection.)

Create a new Layer. I called it “overstate”. Fill the selection (Edit->Fill) with black (#000000) and move the “overstate” layer under the “glass” layer.

Apply the following blending options to the “overstate” (Layer>Layer Style>Blending Options):

Now you are almost done. The next buttons are done in the same way. Just take a look at step 3 and 4 again and make the next buttons. Do note that you will have to duplicate the Border Layer a few times, to make the other buttons stand out. You can do that by pressing Ctrl/Command J with the Border layer selected and the moving the duplicates holding Ctrl/Command + Shift. Like that they will remain on the same horizontal position.

Step 5 (Optional).

Want to change the color? Maybe you don’t really like this girly color or you prefer green or blue… It’s very simple to change that! Select the top layer, the one that is on top of all the others then just go to Layer -> New Adjustment Layer -> Hue/Saturation and play with the Hue Slide.

I hope you enjoyed this tutorial and that you will find a grate way to use this tricks in your designs. If you want to stay in touch with this blog then Subscribe to RSS Feed. Thank you! :D

Oh and btw! If you want the PSD file here it is:
Download: Photoshop PSD File.

Labels: Step-by-step, Tutorials, Webdesign