Page 3 - Making the search button.

Now we are going to make the search button, first make a new layer (CTRL+SHIFT+N) also here we will do it simple and use the same techniques as on the text! Change to ?Rounded Rectangle Tool?. Make a small rectangle on your right side with this color ?#4E890E?.

Now hold down CTRL and click on the new layer! Now go to: (SELECT -- > MODIFY -- > CONTRACT), contract it by 3px, and fill in the new area with a lighter green I used ?#4E890E?.

Select half of your button with the rectangle tool.



You se how I made the colors and the border, then just make the selection. When you have done that! Make a new layer (CTRL+SHIFT+N) and fill in the selection with white color and change the layer style to overlay and opacity to ?25%?.
(I just added some text to show you how It will look like, but you will used that as an input background on your coding so the text will be there when a user enters it you don?t need to add any text just move on the buttons! )

Now we are done with that part, well for now find your background layer on your right side. (Layer 1) with the black and white part we made. Make a new layer just below it. Click on background layer, and then press (CTRL + SHIFT + N). Now take the Rounded Rectangle tool and make a selection like you se below on my preview image.



Fill in that area with the gradient tool with colors (#4D4D4D -- > #383838).
Following the same steps as on the button. Make a new layer; use the RECTANGLE TOOL to make a selection on the half of the banner. Make a new layer and fill it with white, change the layer style to OVERLAY and opacity: 31%.



Well now you?re all done! I just played a little with the bottom area text to se add some text! I would just use the same method as on your main ?SkillTuts.com? text make the main text, duplicate the layer, flip it, and make the necessary adjustments.

Well here is my final product:



EXTRAS

How to add more rounded look on the text and the sign I added a small touch to it.
I added ?Bevel and Emboss? to those two layers. With these settings:
Style: Inner Bevel
Technique: Smooth
Depth: 71%
Size: 5
Soften: 2



For educational reasons here is the .psd file for you to look at to learn! NOT COPY!

Download the .psd