Stylish Black Button

What I am going to teach you to make in Fireworks is a stylish shiny (glossy, even lol) black button for a website or blog or whatever you may decide to use it for. The button is similar to that of Brightcove.com.

This is what it will look like.


Step One
Create a new document and make the canvas size 800x600. You will not need all this area it jut provides more workspace. Draw a rectangle by selecting the rectangle tool or pres U. Draw the rectangle 150(w)x30(h) pixels.
> Set its background to Gradient -> Linear and put the background line like I did. See the colors shown here.
> Set its border to Basic -> Soft rounded, border color to #999999, tip size 1.
* Set rectangle roundness to 20.
* In the properties toolbar, go to Effects + -> Shadow and Glow -> Glow and set all values like they’re shown here.

Step Two
Select the rectangle tool again and draw one 148(w)x15(h) pixels.
> Set the background of this rectangle to Gradient like step one.
> Set the opacity to 50%
> Place this rectangle over the first one, one pixel below the top border.


Step Three
Select the text tool (or press T) and write some text.
> Set font to Trebuchet ms (or some other you want), size to 24, color to #E8E8E8, bold.
> Place that text in the middle of your newly created button.


If you want to make the text exactly in the middle of the button both vertically and horizontally you can do so by:
> Highlighting all the parts to the square (not selecting the text) and press Ctrl G. Then with that grouped object still selected, hold shift and select the text as well.
> Now go to Window / Align and click the centering buttons. Shown below.


Now you have created a professional style button for any website or blog.


If you have issues please make a new forum topic with the same title as this tutorial and either me or someone from the site will help you. ;)