Creating a Web 2.0 style badge in Fireworks

Badges are very useful on a design project whether if it’s for print or for web. You can use a badge to indicate something new, a release status (e.g. beta, 1.0) perhaps or anything you can just think of. There are many web 2.0 badge designs out there and this tutorial will teach you how [...]

Creating a Web 2.0 Shiny Text in Fireworks

You may notice that Web 2.0 logos uses a lot of gradients on their text to create a “shiny” effect.
In this tutorial, you will learn how to create something like the image on the right. I got it from G3 Fusion and the author calls the effect “Soft Floating Font” for who knows [...]

Creating shiny web 2.0 buttons with Fireworks

Shiny web 2.0 buttons have been around for quite some time but they still look classy and lots of sites still use them. Here’s an example:

There are lots of Photoshop tutorials out there for this button effect but this guide is made for Fireworks which I think is more suitable for web design. I’m using [...]

Creating the “Aqua Sphere” effect in Fireworks

If you don’t know what “Aqua Spheres” are, it’s the shiny sphere with the translucent effect at the bottom popularized by Apple once again. The Aqua effect was first seen on the Mac OS buttons. If you add the effect on a shiny sphere then you’d get Aqua Sphere just like the sphere (without the [...]

Creating the “reflection” effect in Fireworks

I’ve been seeing a lot of this “reflection” effect popping up in different websites but I think Apple was the one who popularized it when they launched iPod years ago.

Basically, you just make a copy of your image, flip it and apply gradient opacity. The effect is so sleek and sexy and it works well [...]