11
AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3 Practical 3: Layer and timeline Add or delete layers 1. Click t he laye r in the timel ine that you want to ap pear bel ow the new laye r. 2. Click the Insert Layer button. Layers added: 3. Cli ck t he la yer you want to delete. 4. Cl ick the Del et e Lay er bu tt on Adobe Flash CS3 1

Flash CS3 Practical 3

Embed Size (px)

Citation preview

Page 1: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 1/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

Practical 3: Layer and timeline

Add or delete layers

1. Click the layer in the timeline that you want to appear below the new layer.

2. Click the Insert Layer button.

Layers added:

3. Click the layer you want to delete.4. Click the Delete Layer button

Adobe Flash CS3 1

Page 2: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 2/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

A Layer (Layer 3) deleted:

Set Layer Properties

1. Click the layer for which you want to set controls.

2. Click  Modify (from menu bar ).3. Click  Timeline.

4. Click  Layer Properties.

5. Type a distinctive name for the layer in the Name text box.

6. Change the desired layer property.

Adobe Flash CS3 2

Page 3: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 3/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

7. Click OK.

Rename a Layer

1. Double-click the layer name.

2. Type a new name.3. Press Enter.

Hide a Layer

1. Select a layer you want to hide.

2. Click beneath the column

Adobe Flash CS3 3

Type a distinctive

name for the layer in

the Name text box.

To make the layer 

visible in the Timeline,

leave the Show check 

 box checked.

To lock the layer 

to preventchanges, select theLock check box.

You can select a layertype.

You can select a layer

height.

The layer’s

name changed.

Page 4: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 4/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

Lock a Layer

1. Select the layer you want to lock.

2. Click the layer bullet ( change to )

Stack Layers

1. Click the layer you want to move.2. Drag the layer up or down to its new location in the stack.

3. Release the mouse button.

Adobe Flash CS3 4

The backgroundis invisible.

Click here to

hide or unhide

objects on layer.

The layer 

“Love” is

now locked.

The layer in its new

 position

Page 5: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 5/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

Organize Layers into Folders

Create a Folder

1. Click the Insert Layer folder 

Add a Layer to a Folder

1. Click the layer you want to move into a folder.

2. Drag the layer over the folder.3. Release the mouse button.

Rename a Folder

1. Double-click the layer folder name you want to rename.2. Type a new name.

3. Press Enter.

Adobe Flash CS3 5

 New folder added

Page 6: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 6/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

Collapse a Folder

• Click the layer folder’s Expand icon. ( Changes to )

Add Guide Layers

• There are two types of guide layers: Plain and Motion

• A plain guide layer can help in positioning an object on the Stage, but it does not

appear in the final movie.

Add a Plain Guide Layer 

1. Click the layer that you want to appear below the new guide layer.

2. Click (Insert Layer)

3. Click Right-click the new layer name.

4. Click Guide (The layer becomes a guide layer, noted by its icon. You can placeobjects on the layer or use it to create a layout.)

Adobe Flash CS3 6

Page 7: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 7/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

Add a Motion Guide Layer

1. Click the layer that you want to link to a motion guide layer.

2. Click the Add Motion Guide icon.

* Flash adds the motion guide layer to the Timeline and links it to the layer you selected.

Adobe Flash CS3 7

Page 8: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 8/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

Create Mask layers• The mask layer is to hide various elements on underlying layers.

• Flash links masked layers to layers and exports them in the final movie file.

Add a Mask Layer

1. Click the layer to which you want to add a mask.2. Click (Insert Layer)

3. Right-click the new layer’s name.

4. Click Mask.• Flash marks the layer as a mask layer, locks it against any changes and links it to the

layer below.

Adobe Flash CS3 8

You can now

see the

Page 9: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 9/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

Create a Mask 

1. Unlock the mask layer ( changes to )

2. Draw a fill shape on the Stage over the area you want to view in the layer below.(The rectangle fill shapes are used as window-like mask.)

3. Lock the mask layer 

Adobe Flash CS3 9

You can now see the

masking effect.

Page 10: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 10/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

Customize the Timeline

Change the Timeline Position

1. Click the Panel Menu button .

2. Click Placement.3. Click a placement option.

Change Frame Size

1. Click the Panel Menu button

2. Click a frame size.

Adobe Flash CS3 10

Page 11: Flash CS3 Practical 3

8/8/2019 Flash CS3 Practical 3

http://slidepdf.com/reader/full/flash-cs3-practical-3 11/11

AACS1193 WEB DESIGN AND DEVELOPMENT Tutorial 3

* Large frames appear in the Timeline.

Adobe Flash CS3 11