Unit 65 – Digital Web Animation Assignment 3 – Checklist
Explain how you used the following:
Range
Workspace: stage, timeline,
menu bar, toolbar, library,
colour palettes, properties,
preferences, help.
How Used Screenshot evidence
Stage:
The stage shows me a preview of the web
banner before it has been published.
To change the size of the Stage I needed to go
to ‘Property Inspector’ and then I needed to go
to ‘Movie’. I could then change the stage size. I
changed the stage size to 1200x200 at the
beginning.
I can drag and drop assets from the Cast onto
the stage. I changed the size of images on the
stage by clicking on the image and then dragging
the black squares that appeared around the side
of the image.
I also used a grid to move and adjust the assets
that where on the Stage. The grid can be applied
by going to ‘View’ and then ‘Guides and Grids’
and then by selecting ‘Show Grid’. (There is a
short cut for applying the grid – press ‘Ctrl’, ‘Alt’,
‘Shift’, and then ‘G’.)
When adding effects to the assets, I could drag
and drop them from the Library on to the asset
on the Stage. I did this when adding the fade
onto the logos. I dragged and dropped the ‘Fade
In Out’ option onto the logo.
Timeline:
The timeline shows the duration of the assets.
Assets could be dragged onto the Timeline from
the Cast List. They would then automatically
appear on the Stage. By dragging and dropping
assets onto the Timeline and not the Stage
meant that I could place the assets directly
where I wanted them instantly.
Assets that I wanted to appear on the stage I
would place in one of the channels. I would then
change the sprite length by extending the
purple line that represented the asset.
At the end of the line there is usually a white
rectangle. If an animation was added (by
dragging the yellow line showing the path of the
image) then the white rectangle would become
a white circle.
I could add effects by dragging and dropping
them from the ‘Library’ to the sprite in the
Timeline. I did this when adding rollovers on to
the tickets.
Menu Bar:
In Director, the Menu Bar is at the top of the
screen.
I used File when I wanted to save the web
banner, import assets, and when I wanted to
publish the project at the end. I would click on
File and then Save As to save the project
initially. When I had done this, I had to find the
place where I wanted to save it. After that I
would click on Save to add information to the
original copy.
At the beginning of the project I needed to click
on File and then Import. I then found the files in
my Personal Space and then clicked on Import
to make them appear in the Cast List. This then
meant that I could use them with in the web
banner.
At the end of the project I needed to publish the
final product. I went onto File and then Publish
Settings. I selected the option of Windows
Projector and then clicked on Publish at the side
of the box.
When I wanted to add a grid to the Stage so that
I could be more accurate when placing the
assets, I went onto View and then Guides and
Grids. I then selected the option of Show Grid.
Toolbar:
In Director, the Tool Bar is at the left-hand side
of the screen. Every time I went back onto
Director I had to make sure that I had set the
settings from ‘Default’ to ‘Classic’.

I mostly used the Arrow Tool, which allowed me

to select assets that where on the Stage and
move and adjust them. For example, I used it
when adding and moving the ghost characters in
the final scene. I used it when I added the
animations to the assets. It allowed me to select
the cluster of circles in the centre of the image
and then drag the image to set the path that it
would take when the web banner was played.
I used the Text Tool on the final scene so that I
could write instructions on how to find out the
ticket prices. I selected the tool and then clicked
on the Stage to create a text box. I then typed in
the instructions. I then clicked on the box using
the Arrow Tool to move and adjust the box.
Library:
In Director, I used the library to find the effects
that I wanted to use.
When I wanted to add a 'Fade In' on one of the
features (such as the logo at the beginning of
the web banner), I went to the Library and went
to Behaviors, and then Animation, and then
Automatic. Under this heading there was the
option called 'Fade In Out'. I then dragged and
dropped the option onto the asset that I wanted
to apply it to and then changed the settings in
the box that appeared after dropping it.
When I wanted to apply rollovers to the tickets
on the final scene I went to the Library and then
I went to Interactive and then dragged and
dropped the option 'Rollover Member Change'
on to a one ticket at a time. When I had
dropped the option on to the asset, I had to
choose an image to rollover onto from the drop-
down menu. Only images that where in the Cast
List could be chosen.
Colour Palettes:
In Director, I did not use the colour Palette. I did
use the colour palette in Photoshop. The colour
palette is at the top right-hand side of the
screen. When I was creating the logo, I needed
to colour in the base of the character’s foot
black. To do this I went to the colour palette and
changed the colour to black by dragging the
small circle to the lower left-hand corner of the
palette. I then used the Brush Tool to apply the
colour that I had selected.
Properties:
I did not use the Properties bar during this
project.
Preferences:
I did not use the Preferences bar during this
project.
Help:
I did not use the Help bar during this project.
Basic tools: drawing, eg
pencil, line, pen, brush,
shapes; free transform, eg
rotate, skew, distort, scale,
envelope, ruler and
guidelines; editing, eg lasso,
eraser, undo, copy, paste,
duplicate, insert, delete,
aligning, grouping,
ungrouping
Drawing:
• Brush Tool:
I used the Brush Tool in Photoshop. I used it
when I was creating the logo. I needed to colour
in the bottom of the character’s foot in black. I
selected the Brush Tool and changed the colour
to black in the Colour Palette.
To change the size of the Brush Tool I used the
shortcut method of pressing ‘[‘ to make the
brush smaller and ‘]’ to make the brush larger.
This could also be done by selecting Brush
Preset Picker.
• Scale:
When changing the scale of something in both
Director and Photoshop, I would press the Shift
key to keep the proportion consistent.
In Director, to change the scale of something I
would click on the asset and then drag one of
the grey squares that appeared on the outside
of the asset either inwards or outwards. I
changed the scale of most assets that I put in to
the project. For example, I changed the scale of
the logo when I put it on to the first scene.
In Photoshop, to change the scale of an image, I
would press Ctrl and T to Free Transform the
image. I would then drag the corners either
inwards or outwards.
• Ruler and Guidelines:
I used guidelines in both Photoshop and
Director to allow me to align assets properly and
to change the size of assets more accurately. I
Director I set Guidelines by selecting View and
then Guides and Grids. I then selected the
option of Show Grid. In Photoshop I selected
View, Show, and then Grid. I also used the short
cut method of pressing Ctrl and then ‘.
I only use the Ruler in Photoshop. I went onto
View and I then selected Rulers. I used them
when creasing the logo. When I was painting the
character’s foot I clicked on the ruler and then
dragged down. A line appeared and I positioned
it next to the base of the foot where I would
finish painting.
Editing:
• Lasso Tools:
I used the Polygonal Lasso Tool to when painting
the character’s foot on the logo. I used the
Polygonal Lasso Tool to select the bottom part
of the foot. I then used the Brush Tool to paint
that area more accurately because the
Polygonal Lasso Tool made sure that I only
painted the selected area.
• Undo:
I used Undo in both Director and Photoshop. I
would press Ctrl and Z to undo an action that I
had just completed. In Photoshop, I would press
Ctrl and Alt and Z to undo several moves. In
Photoshop, I could also select Edit and then
Undo or Step Backwards to undo an action. In
Director, I could select Edit and then Undo.
• Duplicate:
In Photoshop, I would duplicate something by
selecting the layer that had the thing that I
wanted to copy and then pressing Ctrl and Alt.
The duplicated object would then be in a new
layer with the name of the duplicated layer with
the words Copied added on (e.g. Layer 1 Copy).
• Delete:
In Director, I deleted an item of the Stage by
selecting it in the Timeline and then pressing the
Delete key. This is because sometimes if I
deleted the asset straight from the Stage, it
would also delete it from the Cast List as well. If
I wanted to delete something from the Cast List
I would click on it in the Cast List and then press
Delete. I mainly used this when arranging assets
on the Stage. In the final scene, there are
several pixel ghosts, I had originally made the
first one very big and I decided to add more of
this asset. I deleted this asset from the Timeline
because I wanted all the pixel ghosts to be the
same size (I was not going to change their size of
them when they were on the Stage).
• Aligning:
In Photoshop, to align images together properly
I used the grid and I would also press the Ctrl
key when I was moving it. By pressing the Ctrl
key, it displayed the distances between the
asset that was being moved and the other
assets around it. I did this when creating the
text on the tickets. I wanted to make sure that
the text was central on the tickets.
In Director, to align assets on the Stage I would
use the grid. I would select View and then
Guides and Grids. I then selected the option of
Show Grid. I used the grid for the whole of the
project.
Objects: symbols, eg
instances, duplicating
symbols, swapping symbols,
editing, grouping
Colour tools: eg colour
properties, eyedropper,
creating custom colours,
colour swatches, stroke and
fill
Text tools: text, eg editing,
moving, rotating, reshaping,
scrolling, creating text blocks,
Editing Grouping:
When I created the logo in Photoshop I had to
use several different images. To make sure that I
could edit and move parts separately I would
make sure that the different parts where placed
in different layers. Sometimes ta new layer was
automatically added. But when adding paint, I
needed to select the symbol at the bottom of
the screen that looks like a piece of paper with
the corner folded over.
Colour Swatches:
In Photoshop, when I was creating assets I
would change the colour using the colour
palette (e.g. when I was painting the bottom of
the foot of the character). The colour that I had
selected was then kept in the Swatches tab. This
meant that I could then find a colour that I had
recently used instead of trying to recreate it in
the colour palette.
Brush Tool:
When I had selected a colour that I wanted to
use in Photoshop, I would apply it using the
Brush Tool. To apply the colour more accurately
I would zoom in very far and work with a small
brush size, or I would select an area using the
Polygonal Lasso Tool. This Tool would then
make sure that I did not paint beyond the edges.
Text:
• Editing:
converting text to shapes To edit text in Director I would select the Text
Tool and then click on the screen. This would
create a text box. I would then type in what I
wanted. I used the Text Tool to create the
tickets. I was also able to make the text box
bigger by dragging its corners. If the text box
was not big enough then not all the text would
be shown. If I wanted to go back and then edit
text halfway through creating an asset, I would
select the Text Tool and then click on the text. I
would then edit the text.
In Director, I would select the Text Tool and
then click on the Stage. I would then type in
what I needed to. If I wanted to go back and
then edit text, I would double click on the text. I
would then edit the text. I used the Text Tool at
the end of the web banner to give the user
instructions on how to find out the price of the
ticket.
• Moving:
To move the text in Photoshop, I needed to
select the Move Tool and then select the text. I
was then able to move the text. I did this when
creating the tickets. I moved the text into the
centre of the ticket.
To move the text in Director, I needed to select
the Arrow Tool and then I would need to select
the text. I moved the text telling the user how to
find out the ticket prices in to the centre of the
Stage.
• Rotating:
I did not rotate the text in Photoshop or in
Director. To rotate the text, I would need to
press Ctrl and T to Free Transform the text. I
would then hover over the corner of the text

Manipulating objects:
manipulating vector shapes;
single layer vector shape
interaction;
transforming and grouping
vector shapes
Animation: frame label;
frame rate; timeline
(playhead, layers, frames,
frame rate,
keyframes, onion skinning,
markers); frame
manipulation, eg copying,
deleting, reversal;
testing movies; frame by
frame animation; tweening
(shape, motion)
and then move the corner up or down. The text
would then rotate with the movement.
• Reshaping:
I changed the size of the text in Photoshop
when creating the tickets by pressing Ctrl and T
to Free Transform the text. I would then select a
corner and then either drag it inwards or
outwards. This would make the text larger and
smaller.
I did not reshape the text in Director.
Manipulating Vector Shapes:
In photoshop I created a vector shape when I
painted the bottom of the character’s foot in
the logo. I made sure that it was in a separate
layer so that I could add more paint and so that I
could use the Erase Tool to get rid of parts
without changing the rest of the layers.
Frame Label:
I did not change the frame label in Director
because all the imported assets where already
named. However, to change the frame label all I
needed to do was to select the asset and then
type a name in the bar at the top of the Cast
List.
Frame Rate:
Director works at 12 frames per second. When I
was extending the sprite lengths on the Timeline
I needed to know the frame rate so that I could
make sure that the scene was the right length. I
would multiply the number of second that the
web banner would be at by 12 each time. The
frames where then labelled at the top of the
Timeline.
Timeline:
• Playhead:
I used the playhead to make sure that I was
extending and moving sprites to the right places
on the Timeline. The playhead is the red line
that shows the frame that the web banner is at,
at that point. When I was extending the sprite
length of the assets on the Timeline, I would set
the playhead at the frame and then move the
sprite. The Stage would show where the
playhead was at. This meant that I could go
between scenes to edit assets.
• Layers:
I changed the layers on the final scene. I wanted
to make sure that the text was visible at all time.
So, I moved the sprite of the text below the
sprite for the pixel ghosts. This meant that when
the web banner played, the pixel ghosts would
slide down behind the text.
• Frames:
The frames are listed at the top of the Timeline.
Every 5th frame was numbered. The rest of the
frames where represented by dashes. On the
Timeline, each rectangle represented a frame. I
used the frames to plan how long the sprite
length would need to be when I extended it.
• Markers:
I used a marker to make sure that the web
banner stopped and waited on the final scene. I
double clicked on the panel above the 915th
frame on the Timeline. A dialogue box then
opened appeared. I then typed the words ‘go to
the Frame’. I closed the dialogue box and then
played the web banner through to make sure
that it worked.
Frame Manipulation:
 • Deleting:
When I was creating the web banner, I often
had to move and remove frames. I would select
the Frame in the Timeline and then press the
Delete key on the keypad. This made sure that it
was deleted off the Stage and not the Cast List
(this could happen if the frame was deleted on
the Stage).
Tweening:
• Motion:
When I created an animation, I would click on
the asset on the Stage. I would then click on the
cluster of circles that appeared in the centre of
the asset and I would drag it to the place that I
wanted the animation to finish. A path was then
represented by a yellow line. I did this when
creating the animation on the pixel ghosts on
the final scene.
Assets: importing, eg raster
images, vector images, sound
files, video files, movie clips;
resizing; bitmap to vector
conversion; asset libraries
Advanced tools: scenes;
guide layers; masking, eg
mask layers, animated masks;
timeline effects, eg blur, drop
shadow, expand, explode,
Importing:
I went on to ‘File’ and then ‘Import’. I then
found my asset file and then selected the
images and the video and the music file that I
wanted to import and then clicked ‘Import’.
For all the images, I needed to click ‘OK’ on the
‘Image Options’ that appeared.
All the assets that I had just imported then
appeared in the Cast List with the same name as
they had in the Personal Space.
Resizing:
In Director, I had to change the size of the assets
when I had put them on to the Stage. For
example, when I put the logo onto the Stage at
the start I need to make it smaller. I clicked on
the image and then dragged the corners
inwards. I pressed the Shift button at the same
time to make sure that the image kept its
proportions consistent.
Asset Libraries:
The asset library in Director is the Cast List.
When I had imported all the assets they
appeared in the Cast List. I was then able to drag
and drop them onto the Stage and the Timeline.
I was also able to rename them and add effects
to them such as fade ins.
I did not use any advanced tools when creating N/A
the web banner.
transform, transition; nesting
movie clips
Interactivity: scripting;
behaviours; actions; triggers;
buttons; rollovers; playback
control;
preloaders
Scripting:
I used scripting to make sure that the web
banner stopped and waited on the final scene. I
double clicked on the panel above the 915th
frame on the Timeline. A dialogue box then
opened appeared. I then typed the words ‘go to
the Frame’. I closed the dialogue box and then
played the web banner through to make sure
that it worked.
Behaviors:
I included a 'fade in'. I found this option in the
'Library' under 'Behaviors', 'Animation', and
'Automatic'. I dragged and dropped the option
onto the asset. I used this on the logo at the
start (it fades on to the screen), and the logo on
the scene with the video (however I set the fade
on this asset to be fairly quick).
I included rollovers. I found this option in the
'Library' under 'Behaviors', and 'Interactive'. I
dragged and dropped the option on the assets
that I wanted to have the rollover and then
selected the image that it would rollover onto
from the 'Cast List'. I add a rollover on to the
tickets at the end of the web banner. The tickets
had the categories on then (e.g. student, over
18) and then the when the user’s curser
hovered over the ticket it would change to the
ticket price for that category.