We are one of the leading web designers in the industry who offers most excellent & unique graphics, websites, logo designs and icons with help of Macromedia Fireworks. With the fundamental tips from us it is really simple & easy for you to design swap images, rollovers, image effects, animated gifs and also other designs with fireworks.

Enjoy Simple Tips & Tricks on Macromedia Fireworks to Design your Unique Ideas:

1. Rollover Images



Rollover images are usually added to a website as a fun element to enhance the magnificence of the layout. It is really effortless to create rollover images using fireworks and our essential tips. Make sure that you are with exceptional rollover buttons for your websites, as we assure you; users like to find unique rollovers over the site layouts.

 

HOW TO GET IT DONE

 

ROLLOVER BUTTONS:

 

Learn fast how to create appealing rollover buttons in Fireworks:

While working with fireworks, behaviors palette are used to create rollover.

1. The very first step is to get your images and rollovers designed in Fireworks.  Confirm that your unique rollovers are in the exact position as your rollovers.  Position your images in one layer and the rollovers in other layer.
2. Now two frames are required.  Frame 1 for the actual images & Frame 2 for the rollover images.
3. Insert slices on every images (Insert>Slice) and name them respectively for a hassle free reference.
4. Now click on the slice and move on to Window>Behaviors.
5. Click on the ‘+’ button and select Simple Rollover.
6. Now click on OK.
7. Repeat the same steps for each and every slice.
8. Now you have reached the last step which is to export the file.  You need not have to worry about programming to convert the rollovers to JavaScript & html as fireworks will do it automatically.  Only thing you need to focus on is on your design and fireworks will do all the programming.  While you export your file, you to need consider two factors:
   • Under slicing, you must select ‘Use slice objects’
   • Under HTML style, select Dreamweaver (2.0 or 3.0)

Subsequently fireworks export an .htm file to the specified directory.  Now you can browse the .htm file from IE or Netscape and can watch your unique swap image working magnificently the way you always wished to have.

 

We hope that you enjoyed our tutorial.

 

2. Swap Images

Just like creating rollover images in fireworks is simple and easy. Working on swap images on fireworks too is only if you follow our step to step instructions. Swap images helps to craft a site layout appealing with a professional touch and enhance interactivity with the users when they rollover an image or a link.

 

HERE IS HOW TO GET IT DONE:

 

It’s very easy to create swap images in fire works. Swap images are fun and are very much interactive and interesting. We will here provide you the tutorial of step by step instructions on how to design web sites using swap images. It is only required that you need a Fireworks - the best web design too. Here are the steps for swap images.


1. First you just design the swaps and your rollover buttons. Place the graphics at exact location. Place the swap images in different layers like the common elements in the first layer, the rollover images in the second layer and the swap images in separate layers after that.


2. After putting the swaps in separate layers you need to put them into frames. The swaps should be in different frames and the number should be same as the number of swap images in each frames it comes only a ‘structure and swap'. Only one swap images will be available in each frame and all the common elements. If you also need rollovers along with swap then that layer is open in Frame 2.


3. Then next is to slice up the images. The images are sliced and are named for easy reference.  And it should be noted that the swap has only one slice.


4. Next is the step from which the swap starts. To make swap images or rollovers use 'Behaviors' found in Fireworks.


             1.   Click on the slice for swap1 and then go to Insert> Behavior
             2.   Next click on the '+' button and click on Simple Rollover
             3.    Click on OK
             4.    Repeat for all the buttons


5. Then finally export the entire file. Swaps are automatically converted to javascript and html. You need only to do the designs and Fireworks will do the programming for you. When you export the file you need to take care of two things.

 

1. slicing you need to choose 'Use slice objects'
2. HTML style choose Dreamweaver 2.0

 

You can export an .htm file to the directory and you'll see your swap images working beautifully. So concentrate on designing great swap images with Fireworks.

 

3. Paste Inside

 

This is another interesting feature in fireworks. Do you need a picture to be in a particular shape, it is very easy to do it with Fireworks.


Here are the steps for the paste inside in fireworks.

1. Just create the shape using the ordinary shape tools found in your toolbar
2. Place the photograph or image where you want it.
3. Select the image and cut it.
4. Then select the shape and click on Edit>Paste Inside (
5. The picture is now placed within the shape.

 

4. Rounded Edges/Curves

Fireworks can be used to create pounded edges and curves. In the options palette you need to do is a double click on the square tool and enter a number for the curved edge. 0 would be for no curve and 100 would give you a circle.

Square Tool:

 

 

 

5. Feather

In Fireworks 'Feather' are used to get soft edges and a clean finish to images that you edit




 






LEARN HOW TO GET IT DONE IN FIREWORKS

Editing pictures is very easy in fireworks. Feather is a property of the Fireworks to get some really cool images. Using the Feather property in Fireworks you can edit images easily getting a softer, smoother and professional finish. Here is the step for getting soft edges and a clean finish to images that you edit.

• Select the part of the image that you want with lasso tool found in the Fireworks toolbar for editing an image.
• After selecting the part of the image that you want make softer, click on Edit>Feather. Enter the number of pixels in the pop up screen. The number of pixels you enter will determine the softness of the picture sharp images is now changed to a softer finish.
  

6. Photo Optics





 

PhotoOptics is another cool feature in fireworks on photo editing. The brightness, color, contrast and more can be adjusted using this feature. All you need to do is, select the image, go to XTras > PhotoOptics and play around with the options given.

 

7. Animated Gifs

The making of animated gift is very much easy and enjoyable with fireworks



 

HOW TO GET IT DONE


Animations give attractions and add movement and interactivity to your site. Here is the tutorial to learn how to create animated gifs for the web. Here are the steps for doing the animation work in fireworks.

 

1. Make a design of your animation and place each object in a different frame. This for getting the templates one after the other. Open the Frames panel from Windows/Frames and start inserting your images on different frames.

 

Now preview your animation by using the play button and you can change the speed of templates by double-clicking on the default value '7' near the frame name.


The final step is to optimize and export the image. Open the Optimize panel and choose Animated Gif from the drop down options. Then click File/Export and export the image to the appropriate folder. To view the image Open the file in Internet Explorer and the animation should work fine.

 

8. Transparency

Fireworks can be used to make the picture transparent. It is done by reducing the opacity of a photograph and it can be used to blend many images together to design great looking collages. First design the work and the apply feathering and give different percentages of opacity to produce an attractive good looking work.

 

9. Effects

To make your graphics look professional and attractive use the Effects palette in fireworks. You can try out the drop shadow, inner bevel, outer bevel and glow. Use different effects in one picture to get something different.