Table of Content: - KOLEJ MARA KUALA NERANG

Table of Content:
MULTIMEDIA
TOPIC
Macromedia Director Interface
Creating Movie
Creating Text
Creating Text Presentation
Creating Graphic
Creating Graphic Presentation
Creating Simple Animation (Cast To Time)
Creating Simple Animation (Reverse Sequence)
Creating Simple Animation (Keyframe)
Creating Text Animation as Video file
Creating Simple Presentation
Storyboard Example
Development Phase (Based on Storyboard Example)
Usage of Effect Channels
Using Transitions
Adding Audio (Sound Effect) and Importing Video
Building The Projector
Multimedia Project
Proposal
Figure A: Navigation Maps
Figure B: Storyboard
PAGE
2
7
9
11
13
16
18
19
20
21
23
34
35
41
42
43
44
45
46
48
49
ADDITIONAL NOTES
TOPIC
Creating Simple Animation (Real-Time Recording)
Creating Simple Animation (Tweening Setting)
Creating Navigation (Link Using Hypertext)
Creating Simple Animation Using Behavior (Push Button)
Creating Simple Animation Using Behavior (Turn Towards Mouse)
Creating Simple Animation Using Behavior (Blinking Cursor)
Creating Simple Interactive Presentation (Objective Questions)
Creating Simple Interactive Presentation (Dropdown List)
Creating Simple Interactive Presentation (Exit Message)
1
PAGE
50
51
52
53
54
55
56
59
60
MACROMEDIA DIRECTOR MX
Reminder:
To save your file, after you choose ‘SAVE’, then choose ‘SAVE & COMPACT’.
(This is to compress your file).
You are advised to frequently save your file.
STAGE WINDOW
CAST WINDOW
Display the presentation
To store all the data /
object
SCORE WINDOW
To build / create
presentation
CONTROL PANEL
To control the
presentation
2
Control Panel
Rewind
Stop
Frame
Play
Frame per second
Stage Window
3
Loop playback
Cast Window
Cast view style
Next Cast Member
Previous Cast Member
Cast Member Name
Cast Member Number
Cast Member Script & Properties
4
Score Window
Transition Channel
Sound Channel 1
Palette Channel
Sound Channel 2
Frame
Cast Member Properties
Tempo Channel
Script Channel
Frame ruler
Sprite Channel
Sprite
5
Cell
Markers
Channel
Playback Head
Paint Window
Previous Cast Member
New Cast Member
Filled Ellipse
Cast Member Name
Next Cast Member
Foreground &
Background Color
Line
Brush
Paint Bucket
Text Window
Text Format
Text Area (Arrange able)
6
Creating Movie
1. Choose menu FILE > NEW > MOVIE
Setting The Stage Size & Movie Background Color
1. Choose menu MODIFY > MOVIE > PROPERTIES
7
Stage size
Stage location
Stage color
8
Creating TEXT
1. Open CAST window, select any empty cast member.
2. Choose menu WINDOW > TEXT
3. You will get TEXT window.
Type the text below;
MULTIMEDIA  Font color ‘WHITE’ size ‘35’
4. Label the cast member name as “Title”.
Font size 24
5. Click ‘+’ icon to add new cast text.
6. Type the text below;
Multimedia is the integration or combination of the five basic media elements
which are text, graphics, animation, sound and video.
7. Label the cast member name as “Text 1”
9
8. Repeat step number 5 and type the text below;
Font color ‘WHITE’ size 24
Text is considered the most basic and popular layer of a multimedia
application.
Graphics are integral to multimedia application as they enhance the impact
of the overall message.
Animation are a series of graphic images that are sequenced together to
create motion in an application.
Sound makes a silent presentation become alive and is very stimulating to
audiences.
Video is comprised of photographic images that provide the appearance of
motion in real time.
9. Label the cast member name as “Text 2”
10. Choose menu MODIFY > CAST MEMBER > PROPERTIES
11. You will get Property Inspector
Choose Scrolling for Framing option
10
Creating TEXT Presentation
1. Open CAST, SCORE and STAGE windows.
2. Activate the CAST window
3. Drag the cast members to SCORE window as follows;
o “Title”  frame 1, Channel 1
o “Text 1”  frame 1, Channel 2
o “Text 2”  frame 1, Channel 3
4. Activate the SCORE window
5. Click on the “Title” sprite.
6. Change INK option to BACKGROUND TRANSPARENT
11
7. Repeat step number 6 for “Text 2”
8. Close SCORE and CAST windows.
9. Arrange all the sprites on your STAGE as follow;
10. Save your file as ‘TEXT’.
11. Play your presentation by click Rewind and Play button.
12. Press ALT + CTRL + 1 simultaneously to view the presentation in full screen.
12
Creating GRAPHIC
1. Create a new Director movie.
2. Activate CAST window and choose ah empty cast member.
3. Choose menu WINDOW > PAINT and draw a sun as shown below;
4.
Use the FILLED ELLIPSE tool (to draw the circle), BRUSH 1 (to draw the
sun’s ray) and GRADIENT COLORS (to pick the sun’s color)
5. Label the cast member name as “SUN”
6. Select another empty cast member
13
7. Choose menu WINDOW > VECTOR SHAPE and draw a vector shapes as
shown below;
8. Label the cast member name as “VECTOR G”
9. Select another empty cast member
10. Choose menu FILE > IMPORT and choose the desired image.
Example: C > PROGRAM FILES > MICROSOFT OFFICE > CLIPART >
PUB60COR > Choose your own graphic file. Label as “UNIKL”
11. Choose menu WINDOW > TEXT
12. Type GRAPHICS  Font color ‘YELLOW’ size ‘35’
12. Label the cast member name as “Title”.
13. Click ‘+’ icon to add new cast text
14. Type BITMAP GRAPHIC 1 Font color ‘YELLOW’ size ‘24’
15. Label the cast member name as “Bitmap 1”
16. Click ‘+’ icon to add new cast text
17. Type BITMAP GRAPHIC 2 Font color ‘YELLOW’ size ‘24’
18. Label the cast member name as “Bitmap 2”
14
19. Click ‘+’ icon to add new cast text
20. Type VECTOR GRAPHIC  Font color ‘YELLOW’ size ‘24’
21. Label the cast member name as “Vector”
15
Creating GRAPHIC Presentation
1. Open CAST, SCORE and STAGE windows.
2. Activate the CAST window
3. Drag the cast members to SCORE window as follows;
a. “Title”  frame 1, Channel 1
b. “Sun”  frame 1, Channel 2
c. “VECTOR G”  frame 1, Channel 3
d. “UNIKL”  frame 1, Channel 4
e. “Bitmap 1”  frame 1, Channel 5
f. “Bitmap 2”  frame 1, Channel 6
g. “Vector”  frame 1, Channel 7
4. Activate SCORE window.
5. Click on the “Title” sprite; for INK Option, choose “REVERSE”
6. Click on the “Sun” sprite; for INK Option, choose “GHOST”, 70%
7. Click on the “UNIKL” sprite; for INK Option, choose “MATTE”, 80%
8. Other sprites; for INK Option, choose “BACKGROUND TRANSPARENT”
16
9. Arrange the cast on STAGE as shown below;
10. Save your file as ‘GRAPHIC’
17
Creating Simple ANIMATION  CAST TO TIME
1. Open ‘PAINT’ window, create:
 cast 1
 cast 2
 cast 3
 cast 4
2. Select All:
i)
Open ‘CAST’ window, click on the first cast
ii)
Press and hold ‘SHIFT’ key, click on the last cast
iii)
Choose MENU MODIFY  CAST TO TIME
iv)
Click ‘PLAY’
v)
vi)
CHANGE MOVEMENT SPEED:
a) Open ‘SCORE’ window
b) Drag the cast on the score to the right side.
Repeat step (iv)
3. Save your file as ‘ANIMATION CAST TO TIME’
18
Creating Simple ANIMATION  REVERSE SEQUENCE
1. Create text and bullet
2. Open ‘CAST’ and ’SCORE’ window, click on the item and drag from cast to
score window. Arrange the item as follow:
i)
Put the text on the first frame channel 1.
ii)
Open ‘STAGE’ window, click on the text inside the score window. Back to
the stage window, place the text from where it will begin to move
iii)
Back to the score window, click on left side of the text item. Choose MENU
INSERT  KEYFRAME
iv)
Back to the stage window, click and hold the text and drag to anywhere inside
the stage.
v)
Back to the score window, Copy the text by right click on the text and choose
copy, then paste at the right side of the original text.(make those text combine
together)
vi)
Click on the text, choose MENU MODIFY  REVERSE SEQUENCE
vii)
Repeat above steps for setting the bullet.
3. Save your file as ‘ANIMATION REVERSE SEQUENCE’
19
Creating Simple ANIMATION  KEYFRAME
Create three texts and three bullets.
1. Open ‘CAST’ and ’SCORE’ window, click on the item and drag from cast to score
window. Arrange the item as follow:
i) Put the first bullet on the frame 3 channel 1. Change the end frame to 90.(select
from the sprite toolbar)
ii)
Put the first text on the frame 3 channel 2. Change the end frame to 90.(select
from the sprite toolbar)
Put the second bullet on the frame 30 channel 3. Change the end frame to 90.(select from
the sprite toolbar)
iii) Put the second text on the frame 30 channel 4. Change the end frame to 90.(select
from the sprite toolbar)
iv) Put the third bullet on the frame 60 channel 5. Change the end frame to 90.(select
from the sprite toolbar)
v) Put the second text on the frame 60 channel 6. Change the end frame to 90.(select
from the sprite toolbar)
3. Close ‘CAST’ window and open 'STAGE' and ‘SCORE’ windows:
i)
Click on the first text inside the score window. Back to the stage window, place
the text from where it will begin to move
ii)
Back to the score window, click on left side of the text item. Choose MENU
INSERT  KEYFRAME
iii) Click on the first text at frame 30. Choose MENU INSERT  KEYFRAME
iv) Back to the stage window, click and hold the text and drag to anywhere inside
the stage.
v) Repeat above steps for setting another text.
2. Save your file as ‘ANIMATION KEYFRAME’
20
Creating Text Animation as Video file.
1.
2.
3.
4.
5.
Open new Director Movie.
Set movie size according to your own desire size.
Open CAST window, select any empty cast member.
Choose menu WINDOW > TEXT
You will get TEXT window. Type your text content.(Resize your text area
according to your movie size).
6. Close TEXT window.
7. Open SCORE window.
8. Drag your text from cast to score.
9. Adjust your text sprite from 1 to your own desire sprite length.
10. Highlight the text sprite.
11. Open STAGE window.
12. Arrange the location for the text to begin the movement point.
13. Back to SCORE window.
14. Click on the last frame of text sprite. Insert Keyframe.
15. Back to STAGE window.
16. Arrange the location for the text to end the movement point.
17. Save your file.
18. Choose WINDOW > FILE > EXPORT. Follow step 1, 2 and 3 as shown
below;
3
1
2
21
19. Save your VIDEO file in your folder.
20. Ready to Export. Click OK.
21. Follow step 1and 2 as shown below;
2
1
22. Now, the TEXT video is ready to use. Import the file to your multimedia
presentation file.
22
Creating SIMPLE presentation
1.
2.
3.
4.
Create a new Director movie.
Activate CAST window and choose any empty cast member.
Choose menu WINDOW > TEXT
Type the text below:
MULTIMEDIA  Font color ‘BLACK’ size 38
5. Label the cast member name as “menu_title”.
6. Click ‘+’ icon to add new text cast.
7. Type the text below;
TEXT  Font color ‘BLUE’ size 18 to 24
8. Label the cast member as ‘text’.
9. Click ‘+’ icon to add new text cast.
10. Type the text below;
GRAPHIC  Font color ‘BLUE’ size 18 to 24
11. Label the cast member as ‘graphic’.
12. Close TEXT window and open PAINT window.
13. Create single button as shown below;
14. Label the cast member as ‘button’.
15. Close PAINT window.
16. Activate CAST window and you will have multimedia elements in your cast
window as shown below;
23
17. Open SCORE window and drag your cast members to score window as follows;
 ‘menu_title’  frame 1, channel 1 – sprite consist of 30 frames.
 ‘button’  frame 1, channel 2 – sprite consist of 30 frames.
 ‘button’  frame 1, channel 3 – sprite consist of 30 frames.
 ‘text’  frame 1, channel 4 – sprite consist of 30 frames.
 ‘graphic’  frame 1, channel 5 – sprite consist of 30 frames.
18. Close CAST and SCORE window. Activate STAGE window.
19. Arrange cast on the stage as shown below;
24
20. Activate CAST window and choose any empty cast member.
21. Choose menu WINDOW > TEXT
22. Type the text below:
TEXT  Font color ‘BLACK’ size 38
23. Label the cast member name as “text_title”.
24. Click ‘+’ icon to add new text cast.
25. Type the text below;
Text text text text text text text text text text text text text
text text text text text text text text text text text text text text
text text text text text text text text text text text text text text
text text text text text text text text text text  Font color ‘RED’ size
18 to 24
26. Label the cast member as ‘content’.
27. Click ‘+’ icon to add new text cast.
28. Type the text below;
MENU  Font color ‘BLUE’ size 18 to 24
29. Label the cast member as ‘menu’.
30. Close TEXT window and open PAINT window.
31. Create single button as shown below;
32. Label the cast member as ‘button1’.
33. Close PAINT window.
34. Activate CAST window and you will have multimedia elements in your cast
window as shown below;
25
35. Open SCORE window and drag your cast members to score window as follows;
 ‘text_title’  frame 35, channel 1 – sprite consist of 30 frames.
 ‘content’  frame 35, channel 2 – sprite consist of 30 frames.
 ‘button1’  frame 35, channel 3 – sprite consist of 30 frames.
 ‘button1’  frame 35, channel 4 – sprite consist of 30 frames.
 ‘menu’  frame 35, channel 5 – sprite consist of 30 frames.
 ‘graphic’  frame 35, channel 6 – sprite consist of 30 frames.
36. Close CAST and SCORE window. Activate STAGE window.
37. Arrange cast on the stage as shown below;
26
38. Activate CAST window and choose any empty cast member.
39. Choose menu WINDOW > TEXT
40. Type the text below:
GRAPHIC  Font color ‘BLACK’ size 38
41. Label the cast member as ‘graphic_title’.
42. Close TEXT window.
43. Select another empty cast member.
44. Choose menu FILE > IMPORT and choose the desired image.
45. Eg: C > MY DOCUMENT > MY PICTURES > SAMPLE PICTURES >
Choose your own graphic file. Label as “picture”.
46. Activate CAST window and you will have multimedia elements in your cast
window as shown below;
47. Open SCORE window and drag your cast members to score window as follows;
 ‘graphic_title’  frame 70, channel 1 – sprite consist of 30 frames.
 ‘picture’  frame 70, channel 2 – sprite consist of 30 frames.
 ‘button1’  frame 70, channel 3 – sprite consist of 30 frames.
 ‘button1’  frame 70, channel 4 – sprite consist of 30 frames.
 ‘menu’  frame 70, channel 5 – sprite consist of 30 frames.
 ‘text’  frame 70, channel 6 – sprite consist of 30 frames.
27
48. Close CAST and SCORE window. Activate STAGE window.
49. Arrange cast on the stage as shown below;
50. Control the presentation flow. Hold movement of the playback head at every
slide on the last frame for the slide.
A. SLIDE 1 (MENU); end frame is frame number 30.
B. Choose MENU WINDOW  LIBRARY PALETTE.
C. Click on “LIBRARY LIST’, select NAVIGATION
28
D.
E.
F.
G.
H.
I.
J.
K.
L.
M.
N.
O.
Choose HOLD ON CURRENT FRAME behavior from the list.
Click and hold the behavior, drag to ‘EFFECT CHANNEL’  SCRIPT on
the last frame for slide 1 which is frame number 30.
SLIDE 2 (TEXT); end frame is frame number 64.
Choose MENU WINDOW  LIBRARY PALETTE.
Click on “LIBRARY LIST’, select NAVIGATION
Choose HOLD ON CURRENT FRAME behavior from the list.
Click and hold the behavior, drag to ‘EFFECT CHANNEL’  SCRIPT on
the last frame for slide 2 which is frame number 64.
SLIDE 3 (GRAPHIC); end frame is frame number 99.
Choose MENU WINDOW  LIBRARY PALETTE.
Click on “LIBRARY LIST’, select NAVIGATION
Choose HOLD ON CURRENT FRAME behavior from the list.
Click and hold the behavior, drag to ‘EFFECT CHANNEL’  SCRIPT on
the last frame for slide 3 which is frame number 99.
SCRIPT CHANNEL
HOLD ON CURRENT FRAME BEHAVIOR
51. Create links USING FRAME.
A. Open SCORE window. Click on the text sprite for slide 1.
B. Choose MENU WINDOW  LIBRARY PALETTE
C. Click on ‘LIBRARY LIST’ select NAVIGATION
D. Choose GO TO FRAME X BUTTON behavior from the list.
E. Click and hold the behavior, drag to text sprite (highlighted sprite)
F. For ‘PARAMETER FOR GO TO FRAME X BUTTON’, Go To Which
Frame on mouseup?(Type) 35 (which is the beginning of the slide 2 
TEXT slide)
G. Click on the graphic sprite for slide 1.
H. Choose MENU WINDOW  LIBRARY PALETTE
I.
Click on ‘LIBRARY LIST’ select NAVIGATION
J.
Choose GO TO FRAME X BUTTON behavior from the list.
29
K.
L.
Click and hold the behavior, drag to graphic sprite (highlighted sprite)
For ‘PARAMETER FOR GO TO FRAME X BUTTON’, Go To Which
Frame on mouseup?(Type) 70 (which is the beginning of the slide 3 
GRAPHIC slide)
52. Create links USING MARKER.
A. Open SCORE window.
B. Click on the marker area at frame 1 (which is the beginning of Slide 1 
MENU slide)
C. Change ‘new marker’  MENU
D. Click on the marker area at frame 35 (which is the beginning of Slide 2 
TEXT slide)
E. Change ‘new marker’  TEXT
F. Click on the marker area at frame 70 (which is the beginning of Slide 3 
GRAPHIC slide)
G. Change ‘new marker’  GRAPHIC
H. Click on the menu sprite for slide 2.
I.
Choose MENU WINDOW  LIBRARY PALETTE
J.
Click on ‘LIBRARY LIST’ select CONTROLS
K. Choose JUMP TO MARKER BUTTON behavior from the list.
L. Click and hold the behavior, drag to menu sprite (highlighted sprite)
M. For ‘PARAMETER FOR JUMP TO MARKER BUTTON’, On mouseup,
jump to marker  MENU, Jump Mode  Go To.
N. Click on the graphic sprite for slide 2.
O. Choose MENU WINDOW  LIBRARY PALETTE
P. Click on ‘LIBRARY LIST’ select CONTROLS
Q. Choose JUMP TO MARKER BUTTON behavior from the list.
R. Click and hold the behavior, drag to graphic sprite (highlighted sprite)
30
S.
For ‘PARAMETER FOR JUMP TO MARKER BUTTON’, On mouseup,
jump to marker  GRAPHIC, Jump Mode  Go To.
53. Create links TO ANOTHER DIRECTOR FILE (MOVIE).
A. Activate CAST window and choose any empty cast member.
B. Choose menu WINDOW > TEXT
C. Type the text below:
ANIMATION  Font color ‘BLACK’ size 18 to 24
D. Label the cast member as ‘animation’
E. Close TEXT window.
F. Activate CAST window and you will have multimedia elements in your cast
window as shown below;
31
G.
Open SCORE window and drag your cast members to score window as
follows;
o ‘animation’  frame 1, channel 7 – sprite consist of 30 frames.
o ‘button’  frame 1, channel 6 – sprite consist of 30 frames.
H.
Close CAST and SCORE window. Activate STAGE window.
Arrange cast on the stage as shown below;
I.
32
J.
K.
L.
M.
N.
O.
P.
Q.
Close STAGE window and open SCORE window.
Click on the animation sprite for slide 1.
Choose MENU WINDOW  LIBRARY PALETTE
Click on ‘LIBRARY LIST’ select NAVIGATION
Choose PLAY MOVIE X behavior from the list.
Click and hold the behavior, drag to animation sprite (highlighted sprite)
For ‘PARAMETER FOR PLAY MOVIE X’, Play which movie on
mouseup?  type the name of your desired movie here.
SAVE YOUR FILE.
33
STORYBOARD EXAMPLE:
FRAME NO:
1
TITLE:
INFORMATION (ABOUT)
ABOUT
TEXT1
PIC1
X
PIC2
PROGRAMMER FIELD:
PIC1  Mouse ENTER, show INFO on X area
PIC1  Mouse LEAVE, INFO dissolves
34
COMMENT
1. When mouse pointer move over
PIC1, text INFO will appear on the
X area. TEXT1 will automatically
blur
2. When mouse pointer leave PIC1,
text INFO will automatically
disappear and TEXT1 change back
to normal view.
DEVELOPMENT PHASE ( based on storyboard example):
1. Open new Director movie.
2. Create director movie with the content as what you design in the storyboard.
3. Director movie stage base on the storyboard example;
4. Cast member with the elements;
35
5. Score window with the sprites arrangement;
6. PROBLEM SOLVING FOR POPUP INFO AS INTERACTIVE
PRESENTATION
i. Arrange other elements in SCORE as shown below;
36
ii. Right click on the PIC1 sprites, choose BEHAVIORS.
iii. Click on the new behavior; Type the name for new behavior.
37
iv. Click on EVENT POPUP, select MOUSE ENTER
v. Click on ACTION POPUP, select NAVIGATION > GO TO
FRAME
38
vi. Type your POPUPINFO sprite beginning FRAME.
vii. Click on EVENT POPUP, select MOUSE LEAVE
viii. Click on ACTION POPUP, select NAVIGATION > GO TO
FRAME
39
ix. Type your Presentation sprites beginning FRAME.
x. Repeat process / step ii until ix for PIC2.
7. CREATING TRANSITION DURING PRESENTATION
i. Open SCORE window, Right click the first frame in the TRANSITION
CHANNEL
ii. Choose your desire Transition Pattern, click OK.
iii. Repeat process/step i & ii for the beginning of sprite POPUPINFO and
POPUPINFO2.
8. Save your file.
40
Usage Of The EFFECT CHANNELS
EFFECT CHANNELS
EFFECT CHANNEL
FUNCTION
Tempo
Assigning the tempo to the chosen frame
Palette
Stores the color setting that was used on the object
Transition
Creating effects in between the frame changes
Sound 1, Sound 2
Add audio into the movie
Script
Writing the script for the chosen frame to produce the
interactive effect for the movie
41
Using TRANSITIONS
1. You can add transition to the score to fade or wipe between one point in your
movie to another. There is a transition channel in the score’s effect channels.
2. Double click on a frame at the transition channel ( the transition must take place
on the first frame of the change).
3. This will open the transition window giving you a whole ream of options. Select
your choice.
42
Adding AUDIO as SOUND EFFECTS
1. To add sound effect to the movie, you have to import the audio file into the cast as
one of the cast member.
Audio file
2. Drag the cast member (audio) into the EFFECT CHANNEL (SOUND) in the
SCORE window.
3. The sound will act as background sound.
Importing VIDEO
1. To insert a video into your presentation, you have to import the video file into the
cast as one of the cast member
Video file
2. Drag the cast member (video) into the sprite channel (as required) in the SCORE
window.
43
Building The PROJECTOR
1. Open the desired director file (if more then 1 director file, choose the first file to
be executed)
2. Choose menu FILE > CREATE PROJECTOR
3. In the window ‘Create Projector’, select the desired director file then click the
create button.
4. In the window ‘Save Projector As’ type your desire name for the new executable
director file.
5. Now the file can be execute without open Macromedia Director MX application
software.
44
MULTIMEDIA PROJECT ( 30 Marks):
You have to create a multimedia project about subject matter FIST UniKL (you have to
choose only one topic) using Macromedia Director:
Example:
Solar System
Project Phases:
1. Submit the proposal that include navigation map and storyboard BEFORE/ON
THE DATELINE GIVEN
2. Develop multimedia project
3. Submit the project BEFORE/ON THE DATELINE GIVEN.
45
PROPOSAL
DEVELOP MULTIMEDIA PROJECT ABOUT
SOLAR SYSTEM
Developer:
En. Amir Zakwan Bin Mohd Ali Hanafiah
KNFT0000001
T01
Date:
31 FEBRUARY 20XX
Kolej MARA Kuala Nerang
06300 Kuala Nerang
Kedah
46
MULTIMEDIA PROJECT NAME:
SOLAR SYSTEM
Purpose:
This project aims to expose the Pulau Pangkor Island to be known all Malaysian citizens
and also to other people around the world.
Objectives:
1. To expose all the unique things inside the Pulau Pangkor
2. To deliver some information about the wonderful places and events in Pulau
Pangkor
3. To give some information about the facilities in Pulau Pangkor.
Target Audience:
1. All Malaysian citizen
2. Foreign tourist.
Navigation Map:
-
Refer to Figure A
Storyboard:
-
Refer to Figure B
Conclusion:
Pulau Pangkor Island is the most beautiful and wonderful place for recreation and
relaxation. In order to make people to come and enjoy the place, this multimedia
presentation can help them to have some information and view about the place…….
FIGURE A: NAVIGATION MAP
47
PANGKOR ISLAND
HOTELS
ATTRACTIONS
MAPS
EXIT
EVENTS
HOTELS
HOTELS
?
?
HOTELS
48
FIGURE B: STORYBOARD
Frame Number:
1
Comment:
Title: Pangkor Island (Main Menu)
1. Mouse pointer will
blinking when
entering the page.
2. Button Hotels,
Attractions, Maps
and Events will
change the color
when mouse pointer
moving across.
3. ----------------4. ----------------5. -----------------
PANGKOR ISLAND
Hotels
Attractions
maps
events
EXIT
Programmer field:
Button Hotels, Attractions, Maps and Events  Mouse Enter, Change color
Mouse Leave, Change to previous color
49
ADDITIONAL NOTES:
Creating Simple ANIMATION  REAL-TIME RECORDING
1. Open ‘PAINT’ window, create an object.
2. Open ‘CAST’ and ‘STAGE’ window. Drag the object from cast to stage.
3. Close ‘CAST’ window and activate ‘SCORE’ window. Click on the left side of the
sprite for that object.
4. Double click on the ‘red box’ and hold. Drag to the right side of the sprite until the
last frame.
5. Open ‘CONTROL PANEL’ window. Click on ‘selected frame only’ and a single
green line will appear on the selected sprite. Change ‘TEMPO’ from 15 (default) to 5
6. Choose MENU CONTROL  REAL-TIME RECORDING
7. Return to ‘STAGE’ window, move the object around.(THE MOVEMENT OF THE
OBJECT WILL BE RECORDED)
8. Click ‘PLAY’
9. Save your file as ‘ANIMATION REAL TIME RECORDING’
50
Creating Simple ANIMATION  TWEENING SETTING
1. Open ‘PAINT’ window, create 2 object (every single object on a different cast).
2. Open ‘CAST’ and ‘STAGE’ window. Drag the object from cast to stage.
3. Close ‘CAST’ window and activate ‘SCORE’ window. Click on the selected sprite
for tweening.
4. Click on the frame number 7, choose MENU INSERT  KEYFRAME
5. Return to ‘STAGE’ window, click and hold the object and move around.
6. Repeat steps 4 & 5 for frame number 14 and 21
7. Choose MENU MODIFY  SPRITE  TWEENING, click on ‘continuous at
endpoint’ and adjust ‘curvature’
8. Click ‘OK’
9. Return to ‘STAGE’ window. Click ‘PLAY’.
10. Save your file as ‘ANIMATION TWEENING SETTING’
51
Creating NAVIGATION ( LINK USING HYPERTEXT )
1.
Open ‘TEXT’ window, type four texts. Make sure that first and second text will be the
title which is MULTIMEDIA and GRAPHIC. Third and fourth text will be the content for
each title as given:
Content for THIRD TEXT:
PLEASE REFER TO HANDOUTGIVEN
Content for FOURTH TEXT:
PLEASE REFER TO HANDOUT GIVEN
2.
Open 'CAST' and 'SCORE' windows, click on the item and drag from cast to score
window. Arrange all items as follow:
a. Place text 1 on the 'frame 1' 'channel 1'.
“Make sure that the sprite consists of 15 frames.”
b. Click on the text 1. Open 'STAGE' window.
c. On the ‘STAGE’ window, arrange position for text 1.
d. Place text 2 on the 'frame 30' 'channel 1'.
“Make sure that the sprite consists of 15 frames.”
e. Click on the text 2. Open 'STAGE' window.
f. On the ‘STAGE’ window, arrange position for text 2.
g. Place text 3 on the 'frame 1' 'channel 2'.
“Make sure that the sprite consists of 15 frames.”
h. Click on the text 3. Open 'STAGE' window.
i. On the ‘STAGE’ window, arrange position for text 3.
j. Place text 4 on the 'frame 30' 'channel 2'.
“Make sure that the sprite consists of 15 frames.”
k. Click on the text 4. Open 'STAGE' window.
l. On the ‘STAGE’ window, arrange position for text 4.
3.
Close 'CAST' window, Back to 'SCORE' window, Click on the 'MARKER' area at
frame 30. Change 'new
4.
Open 'TEXT’ window, edit cast for THIRD text : Select (highlight) word (text) from the
content, choose
TEXT. For
text
5.
Choose
Type "skrip LINGO' as below:
on exitframe me
go to the frame
end
on hyperlinkclicked me, Link
go to frame (Link)
end
6.
Close 'SCORE’ window.
7.
Open 'CONTROL PANEL' window, click 'PLAY’
52
Creating Simple ANIMATION USING BEHAVIOR ( PUSH BUTTON )
Open ‘PAINT’ window, create:
BUTTON
1
BUTTON
2
BUTTON
3
1.
Open ‘CAST’ and ‘SCORE'’ window, click on "button 1" and drag from cast to
score
2.
Back to 'SCORE’ window, choose MENU WINDOW  LIBRARY PALETTE
3.
Click on ‘LIBRARY LIST’, choose CONTROL
4.
Select PUSH BUTTON behavior.
Click and hold the behavior, drag to the 'sprite' ‘Button 1’ in the score window.
5.
For "PARAMETER FOR PUSH BUTTON", click 'OK’
6.
Close ‘LIBRARY PALETTE’ and ‘SCORE’ windows
7.
Open "CONTROL PANEL' window, click ‘PLAY’
8.
Save your file as ‘ANIMATION BEHAVIOR PUSH BUTTON’
53
Creating Simple ANIMATION USING BEHAVIOR (TURN TOWARDS MOUSE)
1.
Open ‘PAINT’ window, create:
mata
muka
Open ‘CAST’ and ‘SCORE'’ window, click on the item and drag from cast to score.
2.
Close "CAST' window and open 'STAGE' window, Arrange the place of ‘mata’
item.
3.
Back to 'SCORE’ window, choose MENU WINDOW LIBRARY PALETTE
4.
Click on ‘LIBRARY LIST’, choose ANIMATION  INTERACTIVE
5.
Select TURN TOWARDS MOUSE behavior
Click and hold the behavior, drag to the 'sprite' ‘mata’ in the score window.
6.
For "PARAMETER FOR PUSH BUTTON", turn  towards the mouse 
always. Othervise  remain in the new position. Click 'OK’
7.
Repeat step 7 & 8 for second ‘mata’
Close ‘LIBRARY PALETTE’ and ‘SCORE’ windows
8.
Open "CONTROL PANEL' window, click ‘PLAY’
9.
Save your file as ‘ANIMATION BEHAVIOR TURN TOWARDS MOUSE’
Creating Simple ANIMATION USING BEHAVIOR ( BLINKING CURSOR )
54
Open ‘PAINT’ window, create:
Pointer 1
Pointer 2
Pointer 3
Pointer 4
1. Open 'CAST’ window. Choose MENU INSERT  MEDIA ELEMENT 
CURSOR
2. For ‘CURSOR PROPERTIES EDITOR’ click ‘ADD’ button in order to insert all
the pointer inside the ‘CURSOR FRAME’
3. Click on the ‘PREVIEW’ button. Click 'OK'
4. Back to ‘CAST’ window, Now you will have CURSOR in the cast item.
Click on the cursor. for CAST MEMBER NAME, type Pointer
5. Select MENU WINDOW  INSPECTORS  BEHAVIOR.
Select Behavior Inspector  Behavior Popup  New Behavior
6. For Name Behavior, type Cursor In, click ‘OK’
7. Select Behavior Inspector  Event Popup  mouse Enter
8. For Behavior Inspector  script Window. Type the following script:
on mouseEnter me
cursor member “Pointer”
end
9. Repeat step 6.
10. for Name Behavior, type Cursor Out, click ‘OK’
11. Select Behavior Inspector  Event Popup  Mouse Leave
12. Select Behavior Inspector  Action Popup  Cursor  Restore Cursor
Open "CONTROL PANEL' window, click ‘PLAY’
55
13. Save your file as ‘ANIMATION BEHAVIOR BLINKING CURSOR’
Creating Simple Presentation OBJECTIVE QUESTIONS
1. Choose MENU WINDOWS  TEXT. Type your question. Named the cast as
Question1.
2. Choose MENU INSERT  CONTROL  PUSH BUTTON. Insert multiple
answer 1
3. Repeat step 2 for multiple answer 2 & 3.
4. Arrange all the multiple answer using MENU MODIFY  ALIGN  LEFT
5. Place Question1 on frame 1 channel 1.
6. Place every multiple answer on the next channel frame 1. (Make sure every sprite
consist of the same frame.)
7. Create MARKER at the first frame sprite Question1 as Q1.
8. Choose MENU WINDOWS  LIBRARY PALETTE  Hold on current frame.
Place on the channel script at the same frame number with the last sprite Question1.
9. Choose MENU WINDOWS  TEXT. Type feedback for the selected answer
which is a text for the correct answer and another text for the wrong answer.
10. Place the feedback for correct answer on the frame after sprite Question1. Create
MARKER at the first frame sprite correct answer text as C1.
11. Place the feedback for wrong answer on the frame after sprite correct answer text.
Create MARKER at the first frame sprite wrong answer text as W1.
12. Open CAST window. Select empty cast, choose MENU WINDOWS  FIELD.
Named the field as A1
13. Repeat step 1 until 12 for Question2. Change Q1  Q2 , CI  C2 , Wl  W2 , A1
 A2
14. Repeat step 12 for marks. Change A1  marks
15. Open CAST window. Select empty cast, choose MENU
Type:
on startmovie
put empty into cast “A1”
put empty into cast “A2”
56
.
put empty into cast “marks”
end
16. Open SCORE window, click on right button for the correct answer Q1, choose script
and type:
on mouseup me
put 1 0 into cast “A1”
go to “C1”
end
17. Repeat step 16 for every single wrong answer, type:
on mouseup me
go to "W1”
end
18. Double click channel script at the end of sprite feedback for CORRECT and
WRONG answer, type:
on exif frame me
go to "Q2"
end
19. Repeat step 18 for feedback CORRECT and WRONG answer (last question)
change the script with:
on exif frame me
go to "count"
end
20. Repeat step 9 until 11 for Question2
21. Repeat step 16 until 19 for Question2
22. Open TEXT window, type message (text) to count marks. Named it as CMarks.
Place on the frame after sprite Question2.
23. Choose MENU INSERT  CONTROL  PUSH BUTTON. Insert count marks
text. Place on the channel 2 below CMarks sprite.
24. Create MARKER at the first frame sprite CMarks as count
25. Place cast member marks below sprite CMarks
26. Place "hold on current frame" at the end of sprite CMarks
27. Right click on sprite button CMarks. Select script, type:
on mouseup me
57
put value (the text of cast "A1") + value (the text of cast "A2") into cast
“marks”
end
28. Choose MENU WINDOWS  CONTROL PANEL. Click on play button.
29. Save Your file as ‘OBJECTIVE QUESTIONS’
58
Creating Simple DROPDOWN LIST
1. Choose MENU WINDOWS  FIELD. Type word pilihan. Named the field as
pilih
2. Choose MENU WINDOWS  TEXT, type any thing as the content for the text.
Named the cast as T1.
3. Repeat step 2 and named the cast as T2.
4. Open SCORE window, place pilih sprite on channel 1 frame 1.
5. Place sprite T1 on channel 1 after frame sprite pilih and sprite T2 after frame sprite
T1
6. Create MARKER at the first frame sprite pilih as pilihan.
7. Create MARKER at the first frame sprite T1 as Topic1
8. Create MARKER at the first frame sprite T2 as Topic2
9. Choose MENU WINDOWS  LIBRARY PALETTE  Hold on current frame.
Place on the script channel at the same frame number with the last sprite pilih.
10. Repeat step10 for sprite T1 and T2
11. Choose MENU WINDOWS  LIBRARY PALETTE  CONTROL 
"dropdown list". Click and drag to the sprite pilih.
12. For parameters for "dropdown list", change to Current contents of the field 
Marker in this movie and Select: return the selected item when called 
Execute: go movie | go marker | do selectedline. Click OK.
13. Choose MENU WINDOWS  CONTROL PANEL. Click on play button.
14. Save your file as ‘DROPDOWN LIST’
59
Creating Simple EXIT MESSAGE
1. Choose MENU MODIFY  MOVIE  PROPERTIES. Arrange movie size to be
smaller that actual movie.
2. Choose MENU WINDOWS  TEXT. Type your desire message to be display.
Named it as message. Place on the channel 1 frame 1.
3. Choose MENU INSERT  CONTROL  PUSH BUTTON. Type 'YES’. Place
on the channel 2 below sprite message.
4. Repeat step 5 for button ‘NO’. Place on the channel 3 frame 1.
5. Right click on sprite button 'YES'. Select script, type:
On mouseup me
Global answer
Set answer to "YES"
Close window “named the movie for exit message.dir”
Quit
End
6. Repeat step 7 for button 'NO'. Change the script as below:
On mouseup me
Global answer
Set answer to "NO"
Close window “named the movie for exit message.dir”
End
7. Place "HOLD ON CURRENT FRAME" at the end of the sprite message.
8. Choose MENU FILE  SAVE. Type the named for your exit message movie.
(Make sure that you named it as the same name you type in the script).
9. For the movie with the EXIT button, right click on the sprite button. Select script,
type:
On mouseup me
Set the windowType of window “name of the exit message.dir” to 1
Open window “name of the exit message.dir”
End
10. Choose MENU FILE  SAVE AND COMPACT. Choose MENU FILE 
CLOSE. Choose MENU FILE  NEW  MOVIE
60
61