Feathering in Adobe Fireworks

feathering header

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.

panel

3bigcircles

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.

3bigcircles2

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.

3bigcircles3

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.

radial1

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.

radial12

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.

radial123

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

radial1234

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.

texture1

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

texture12

Apply feather with an amount of 83.

texture123

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

texture1234

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.

texture12345

Well there you go, if you have questions above feathering in fireworks , please leave a comment below .

Share and Enjoy:
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Technorati
  • Live
  • Google Bookmarks
  • blogmarks
  • Blogosphere News
  • Furl
  • MisterWong
  • MySpace
  • Netvibes
  • Ping.fm
  • TwitThis
  • Yahoo! Buzz
  • email
  • FriendFeed
  • LinkedIn
  • Mixx
  • RSS
  • StumbleUpon
  • Tipd
  • Tumblr
  • Twitter
  • Yahoo! Bookmarks
This entry was posted in tutorials and tagged , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

2 Comments

  1. Prasanna Raja J
    Posted December 22, 2009 at 5:02 pm | Permalink

    How to give feather for an image

  2. Vlood
    Posted January 2, 2010 at 10:04 pm | Permalink

    select image – in the Properties select Edge – change from Anti-alias to Feather – give it a higher value.

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>