Adobe 38039927 User Guide - Page 245

Editing animation symbols

Page 245 highlights

ADOBE FIREWORKS CS3 240 User Guide 2 Select Modify > Animation > Animate selection. 3 Enter the desired settings in the dialog box. For more information on settings, see "Editing animation symbols" on page 240. Animation controls appear on the object's bounding box, and a copy of the symbol is added to the library. Editing animation symbols You can manipulate the properties of animation symbols to make your website come alive. You can change a variety of properties in a symbol, from the animation speed to the opacity and rotation. By manipulating these properties, you can make a symbol appear to rotate, speed up, fade in and out, or any combination of these. A key property for any animation symbol is number of frames. This property determines how many steps it takes the symbol to complete its animation. When you set the number of frames for a symbol, Fireworks automatically adds the required number of frames to the document to complete the action. If the symbol requires more frames than currently exist in the animation, Fireworks asks if you want to add extra frames. Changing animation properties You can change animation properties using either the Animate dialog box or the Property inspector. Animation symbol properties in the Property inspector You can edit any of the following properties for an animation symbol: Frames is the number of frames you want to include in the animation. Although the slider limits you to a maximum of 250, you can enter any number you wish in the Frames text box. The default is 5. Move is the distance, in pixels, that you want each object to move. This option is available only in the Animate dialog box. Although the default is 72, you can enter any number you wish in the Move text box. Movement is linear, and there are no keyframes (unlike in Flash and Adobe Director). Direction is the direction, in degrees, in which you want the object to move. Values range from 0 to 360º. This option is available only in the Animate dialog box. You can also change Movement and Direction values by dragging the object's animation handles (see "Editing symbol motion paths" on page 241). Scaling is the percent change in size from start to finish. Although the default is 100%, you can enter any number you wish in the Scaling text box. To scale an object from 0 to 100%, the original object must be very small; vector objects are recommended. Opacity is the degree of fading in or out from start to finish. Values range from 0 to 100, and the default is 100%. Creating a fade in/fade out requires two instances of the same symbol-one to play the fade in, and the other to play the fade out. Rotation is the amount, in degrees, that the symbol rotates from start to finish. Values range from 0 to 360º. You can enter higher values for more than one rotation. The default is 0º. CW and CCW indicate the direction in which the object rotates. CW indicates clockwise and CCW indicates counterclockwise rotation.

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95
  • 96
  • 97
  • 98
  • 99
  • 100
  • 101
  • 102
  • 103
  • 104
  • 105
  • 106
  • 107
  • 108
  • 109
  • 110
  • 111
  • 112
  • 113
  • 114
  • 115
  • 116
  • 117
  • 118
  • 119
  • 120
  • 121
  • 122
  • 123
  • 124
  • 125
  • 126
  • 127
  • 128
  • 129
  • 130
  • 131
  • 132
  • 133
  • 134
  • 135
  • 136
  • 137
  • 138
  • 139
  • 140
  • 141
  • 142
  • 143
  • 144
  • 145
  • 146
  • 147
  • 148
  • 149
  • 150
  • 151
  • 152
  • 153
  • 154
  • 155
  • 156
  • 157
  • 158
  • 159
  • 160
  • 161
  • 162
  • 163
  • 164
  • 165
  • 166
  • 167
  • 168
  • 169
  • 170
  • 171
  • 172
  • 173
  • 174
  • 175
  • 176
  • 177
  • 178
  • 179
  • 180
  • 181
  • 182
  • 183
  • 184
  • 185
  • 186
  • 187
  • 188
  • 189
  • 190
  • 191
  • 192
  • 193
  • 194
  • 195
  • 196
  • 197
  • 198
  • 199
  • 200
  • 201
  • 202
  • 203
  • 204
  • 205
  • 206
  • 207
  • 208
  • 209
  • 210
  • 211
  • 212
  • 213
  • 214
  • 215
  • 216
  • 217
  • 218
  • 219
  • 220
  • 221
  • 222
  • 223
  • 224
  • 225
  • 226
  • 227
  • 228
  • 229
  • 230
  • 231
  • 232
  • 233
  • 234
  • 235
  • 236
  • 237
  • 238
  • 239
  • 240
  • 241
  • 242
  • 243
  • 244
  • 245
  • 246
  • 247
  • 248
  • 249
  • 250
  • 251
  • 252
  • 253
  • 254
  • 255
  • 256
  • 257
  • 258
  • 259
  • 260
  • 261
  • 262
  • 263
  • 264
  • 265
  • 266
  • 267
  • 268
  • 269
  • 270
  • 271
  • 272
  • 273
  • 274
  • 275
  • 276
  • 277
  • 278
  • 279
  • 280
  • 281
  • 282
  • 283
  • 284
  • 285
  • 286
  • 287
  • 288
  • 289
  • 290
  • 291
  • 292
  • 293
  • 294
  • 295
  • 296
  • 297
  • 298
  • 299
  • 300
  • 301
  • 302
  • 303
  • 304
  • 305
  • 306
  • 307
  • 308
  • 309
  • 310
  • 311
  • 312
  • 313
  • 314
  • 315
  • 316
  • 317
  • 318
  • 319
  • 320
  • 321
  • 322
  • 323
  • 324
  • 325
  • 326
  • 327
  • 328
  • 329
  • 330
  • 331
  • 332
  • 333
  • 334
  • 335
  • 336
  • 337
  • 338
  • 339
  • 340
  • 341
  • 342
  • 343
  • 344
  • 345
  • 346
  • 347
  • 348
  • 349
  • 350
  • 351
  • 352
  • 353
  • 354
  • 355
  • 356
  • 357
  • 358
  • 359
  • 360
  • 361
  • 362
  • 363
  • 364
  • 365
  • 366
  • 367
  • 368
  • 369

ADOBE FIREWORKS CS3
User Guide
240
2
Select Modify > Animation > Animate selection.
3
Enter the desired settings in the dialog box. For more information on settings, see “Editing animation symbols”
on page 240.
Animation controls appear on the object’s bounding box, and a copy of the symbol is added to the library.
Editing animation symbols
You can manipulate the properties of animation symbols to make your website come alive. You can change a variety
of properties in a symbol, from the animation speed to the opacity and rotation. By manipulating these properties,
you can make a symbol appear to rotate, speed up, fade in and out, or any combination of these.
A key property for any animation symbol is number of frames. This property determines how many steps it takes
the symbol to complete its animation. When you set the number of frames for a symbol, Fireworks automatically
adds the required number of frames to the document to complete the action. If the symbol requires more frames
than currently exist in the animation, Fireworks asks if you want to add extra frames.
Changing animation properties
You can change animation properties using either the Animate dialog box or the Property inspector.
Animation symbol properties in the Property inspector
You can edit any of the following properties for an animation symbol:
Frames
is the number of frames you want to include in the animation. Although the slider limits you to a maximum
of 250, you can enter any number you wish in the Frames text box. The default is 5.
Move
is the distance, in pixels, that you want each object to move. This option is available only in the Animate dialog
box. Although the default is 72, you can enter any number you wish in the Move text box. Movement is linear, and
there are no keyframes (unlike in Flash and Adobe Director).
Direction
is the direction, in degrees, in which you want the object to move. Values range from 0 to 360º. This option
is available only in the Animate dialog box.
You can also change Movement and Direction values by dragging the object’s animation handles (see “Editing
symbol motion paths” on page 241).
Scaling
is the percent change in size from start to finish. Although the default is 100%, you can enter any number
you wish in the Scaling text box. To scale an object from 0 to 100%, the original object must be very small; vector
objects are recommended.
Opacity
is the degree of fading in or out from start to finish. Values range from 0 to 100, and the default is 100%.
Creating a fade in/fade out requires two instances of the same symbol—one to play the fade in, and the other to play
the fade out.
Rotation
is the amount, in degrees, that the symbol rotates from start to finish. Values range from 0 to 360º. You can
enter higher values for more than one rotation. The default is 0º.
CW and CCW
indicate the direction in which the object rotates. CW indicates clockwise and CCW indicates counter-
clockwise rotation.