Fireworks Skills
This word sheet is designed to help you boost your skills on Fireworks. Work through the sheet and you will have enough skills to help you when you come to do your own graphics for Unit 21.
Open up Macromedia Fireworks. The shortcut on your desktop will look like this.
Once you have opened the program, the following window will appear.
Select the size to 500 x 500 and click ok.
Your Guide to the tool bar!
Basic Skills
Here are the very basic’s that you will need to know in Fireworks.
The toolbar is on the left hand side of the canvas. The canvas is the white area where you do your work. The box along the bottom is the properties option. You then have your main windows options such as File along the top.
Drawing a shape
To draw a basic shape, you need to click on the shape tool. If you want a shape which is not the option selected then you need to click and hold the shape option.
Select the circle tool – this is called the Ellipse tool. Then on the canvas draw a circle.
You now have a circle. If you want to resize the circle after you have drawn it that we can do this in the properties tab at the bottom of the screen.
Change the numbers in the W & H boxes so that they say 200 X 200. This will change the size of your circle.
Changing the colour of a shape
Now we want to change the colour of your circle. The colour will automatically be selected as the last colour you used in Fireworks. If you haven’t used it for a while it will probably be grey.
To change the colour, click on the circle. In the properties box next to where you have just changed your size there is a box with a little paint bucket. Click on this and it will bring up the colour options.
Choose the colour you want and click it. This will give you a filled circle with no line round. If you want to change the line use the tool next to it that looks like a pencil (it will probably be a white box with a red line through) and again choose your colour. To change the line weight, use the number in the box below and make it bigger.
Adding Text
Adding text in to the shape you use the text tool which is the
T under the tool bar.
Draw the box in your circle. Then write the text you want in.
Write the word BALL in the box. The text
will be really small so now we need to change the size of it. Again this is in the properties tab at the bottom of the screen. First highlight the text so that the writing looks highlighted in blue (or another colour)
Here we can change the size of the text, the font style and make the text bold italic or underlined.
Change the font style to Bookman Old style, size 60 and make it Italic.
Making the shape move
Now we have a shape, we want to make the shape move. To do this we need to add another state. This may not always be visible so you will probably have to find it. If you have the window down the right hand side then look for the one with pages on it. If the tool bar is not on the right hand side then go to WINDOW and make sure the PAGES option is ticked. Then you need to click on the tab that says STATES. This is where you will make the basics of your animation.
We are going to make the ball bounce down the screen. We want to duplicate the screen which we already have because the ball is not going to change. Click and hold on the option that says State 1 and drag it into the symbol in the centre.
It will then create a State 2. If you click between the two states they will both look the same – this is because state 2 is a copy of state 1.
Now on state 2, move your ball slightly down your canvas. Highlight the ball and use the down arrow to make it go in a perfectly straight line. Now duplicate State 2 so you have a State 3. Keep going until you have 5 States and your ball is at the bottom of the canvas.
Now you can press the play button and watch what your animation looks like. The play button is located just above the property menu bar.
Click the play button and watch your creation.
Now you may notice that the ball is moving quite fast. To slow the speed down you need to change the speed that the state is moving. In the state box on the right hand side, double click on the number – which is currently 7.
The rule to remember is that if you want to make it faster – make the number smaller. If you want to make it slower, make the number bigger.
As we are trying to make the ball go slower we are going to make the number bigger – change the number to 10.
Now press play again.
More Advanced Skills
Now we are going to look at some more advanced skills. We want to make a traffic light system that when you roll over the lights they will change colour.
Creating a simple roll over
Using the skills you have just learnt – draw the image below. You will need 2 different states.
Now we are going to add the roll over.
Clicking on State 1 – you need to find the slice tool. This is used to create rollovers (useful if you want to change the colour of your button when you roll over it).
The slice button is on the left tool bar. Once the slice tool is selected you need to ‘slice’ over your lights.
Using the slice tool, draw a box around the light at the top. It will create a green box around it.
Now you need to right click on the centre of the green circle where the target is so you get a list of options. Choose the add simple roll over behaviour. Now repeat for the other 2 lights.
Once you have done this, click on the F12 button on your keyboard. This will let you it in internet explorer.
Roll over the 3 lights and they should change colour one at a time.
Now you have created a simple roll over.
Text Features
Now we are going to try and create some text like this.
To do this you first need to write the text using the tools you learnt in the first section.
Now to do the text features, you need to play with the filters of the text.
The filters options are found in the properties menu when you select the text.
Select the plus tool and it will give you another window of options.
The best thing to do is to play with the options. Play focus on the following ones:
-Shadow and Glow
-Bevel and Emboss
Have a mess about with the different settings – remember you can always press Ctrl & Z if you do something you don’t like.
Getting rid of a background you don’t want!
There is nothing worse that when you are trying to make a logo, banner or button and you want to use an image from the internet that when you copy it in, has a white or different coloured background!
For example – I have this picture I have found on the internet but have decided that I do not want the white background that is on it so that I can put it on a coloured background.
To get rid of the background, you use the magic wand tool. Use the tool to get rid of the colour that you don’t want by selecting the colour with the wand and then pressing the delete button.
Now if we change the canvas colour in Fireworks we can see that the white background has gone.
Some shortcuts for you
Copy – Ctrl & C
Paste – Ctrl & V
Select All – Ctrl & A
Deselect All – Ctrl & D
Transform (make things bigger & smaller & rotate) – Ctrl & T (after Ctrl & A)
Zoom In – Ctrl & =
Zoom Out – Ctrl & -
Undo – Ctrl & Z
Re Do – Ctrl & Y