SEARCH
Newsletter
Subscribe to get design tips, latest trends, free stuff and more.
It doesn't look like an e-mail address

hosting

  Raster Graphics Fireworks Feathering in Adobe Fireworks

Feathering in Adobe Fireworks

blog.blue2x.com Fireworks Feb 29, 2012

img

Basically , feathering is changing the edge of fills , or the edge of your vector object to feather. By default the edge is set in Anti - Alias , but you can also change it to Hard or Feather. This is a very easy technique, but if done in the right way, could help  soften your images,  and add glows or highlights.

img

img

Suppose we have this setup , one rectangle with 3 circles of different sizes. How do we apply this technique properly on the background, to give it some shine, well first we must change each of the fills ( from Anti-Alias by default, to feather ).  When selecting Feather, a default amount of 10 is set, but the trick here is setting it to a higher level , lets say 74 to 100.  See the image below.

img

Too shiny ? Try experimenting on the amount of feather you will use in each circle, move them out a bit to the sides of the square, or even scale them bigger ,or you can also change its layer opacity as well. By default , each layer object's layer opacity is at full, or 100 percent, changing it 90 > below , could give you an effect like this. Play with different values for each layer object.

img

Now lets move to making a circle orb. Lets say we have one big black circle, and one smaller gradient circle. Take note , when dealing with gradients , have two colors which are different  ex : dark orange and light orange, to achieve its fullest effect. You must also practice moving the gradient handles, to which direction looks best.

img

We must change the inner circle's edge into feather , move the gradient to the top left, move the circle to the top left of the black circle, and make some adjustments to the feather amount. You can see the process below.

img

You can duplicate the gradient if you like ,2 or  more times, scale them down or try experimenting with different amounts on the circles , change the direction of the gradient or the layer opacity.

You can get something like the image below, if you think the feathered gradient is overlapping the circle, try moving it.

img

You can also use a radial gradient instead of the black circle, and following the steps above , you can get something like this.

img

Aside from changing the edge to feather, adding texture could also change the look of the image. When dealing withbackgrounds , pick the right texture that suits best , and also try experimenting on the texture amount.

img

I'm gonna use the sand texture,  and apply 61% amount of texture.

img

Apply feather with an amount of 83.

img

You can even try to duplicate the gradient feather and make it bigger, and move it downwards. You can get something like this.

img

The image looks good , but if you want to add some extra ohhmph factor , we use another texture. Try duplicating one of the bigger circles, change the texture to mesh , and try experimenting on which layer mode and or/ layer opacity value makes the image look even better.

Feathering in Adobe Fireworks

Well there you go, if you have questions about this adobe fireworks tutorial , please leave a comment below .

subscribe to newsletter