Look Something





Cari Uang Di Internet Dengan Cara Mudah....
SilahKan Click Disini

Sabtu, 03 Januari 2009
Simple & Stylish Green Search Button

In this very easy Photoshop tutorial, I’m going to be teaching you how to design a simple and stylish ‘green search button.’

Simple & Stylish Green Search Button

1. New Document / Settings

Firstly, create a new document in Photoshop. For this tutorial, designing a button for the web, I used a relatively small document size of 400 x 120 pixels. Use all of the default settings, such as 72 DPI/Resolution.

After creating your new document, create a new layer (Layer > New > Layer…) call this layer ‘base’ if you like, since it will be the base of our button.

2. Button Shape

This is rather an easy part, all you have to do is get out the Rounded Rectangle Tool and make your button shape. But to make sure I’ve included all of my settings, etc. below.

Rounded Rectangle Tool

Rounded Rectangle Settings

Be sure you’ve set up your tool as shown above, then draw a little button on your canvas, note that the color you use for your shape doesn’t matter.

Rounded Rectangle Button Shape

3. Apply Effects / Layer Styles

Time to style our button. Right-click your ‘base’ layer in the layer’s palette then go into the Blending Options. Apply the following layer styles:

  1. Inner Shadow
  2. Gradient Overlay
  3. Stroke

The colors I used for my gradients in the Gradient Overlay and Stroke layer styles were: #e1e817 and #88a707. Note: if you had any trouble following the layer styles, you’ll be able to download the PSD file from this tutorial at the end anyway, so don’t fret!

This is what our button is looking like now:

Layer Styles Applied to Button

Looking good now, hey? You may want to mess around with the layer style settings a little bit, to get a more interesting effect of your own liking.

4. Adding Text

This is a very short step actually, all you have to do is add some text to your button then add a simple Drop Shadow layer style. Start by getting out your Horizontal Type Tool (just the regular type tool) and writing out ‘Home’ on your button.

Simple Text Added to ButtonIn the above image I’ve used Arial as my font of choice, and a size of 12 pt.

Type Tool SettingsAfter you’ve written out your text in white, you may want to add a simple Drop Shadow to the text to make it stand out a little bit more against the button. Your choice though!

Added Drop Shadow Layer Style

5. Taking it further

There’s not much more we can do, but I duplicated my button and changed the colors to red, this could be used as another button or a rollover for the first button, remember to be creative!

Simple & Stylish Green Search Button

Thank you for visiting PhotoshopStar and reading this tutorial, I hope you enjoyed it. It really was just a simple tutorial, hopefully it can teach the new Photoshop users how to make shapes using the shape tools, and how to apply layer styles.

If you found a part of this tutorial difficult, don’t worry, you can download the PSD file from this tutorial from below.

Download Simple and Stylish Button PSD file
(50kb)

Label:

posted by Make Some Better @ Sabtu, Januari 03, 2009  
0 Comments:
Posting Komentar
<< Home
 
Clock


Semarang Weather
Search
Google




Send a Greeting Card
Retrieving an E-Card?
Enter Card Pick-up ID below:
Get your Free E-cards
by bravenet.com
About Me

Name: Make Some Better
Home: Semarang, Indonesia, Indonesia
About Me: Manusia Hanya Bisa Berdoa dan Berusaha Namun Allah SWT yang menentukan
See my complete profile
Previous Post
Archives
Shoutbox

Page Rank
Visitor
Blog Bookmarks
oggix.com : <a href=http://oggix.com> Free Shoutbox & Complete Blog Tools</a>
Blog Bookmarks
Counter
Banner


KapanLagi.com Game



KapanLagi.com Face



KapanLagi.com



KapanLagi.com Image Hosting



KapanLagi.com Clubbing



KapanLagi.com Trailer


My Friends Banner

tutorial photoshop





Musik-Bank

pulsa murah
Powered by

BLOGGER

Free Shoutbox Technology Pioneer