TUTORIAL - MULTIPLE CHOICE QUESTIONS

Step 1:

Open a new Flash file.

Step 2:

Select ‘Text Tool’ from the Tools Panel and from the Properties Panel at the bottom, select ‘Static Text’ for the text type. Then, type down “TEXT AND GRAPHICS”.

Step 3:

Repeat Step 2 for making the questions and its multiple answers.

Step 4:

Draw a circle using the ‘Oval Tool’.

Step 5:

Convert the circle into symbol by selecting Modify>Convert to Symbol and name it ‘button’.

Step 6:

Copy the circle ‘button’ for all of the multiple choice answers.

Step 7:

Create a dynamic text for the response if the selection answer is correct or wrong.

Step 8:

Write multiple choice answers of A, B, C and D inside the circle ‘button’.

Step 9:

Then, select the circle ‘button’ of the correct answer (here the correct answer is A) and add actionscript (look the figure below) to it so that when the user click the button, it will appear the response as well. 

Step 10:

For the wrong answer selection, click the button (here B, C and D) and add actionscript as below:

Step 11:

Lastly, before we publish this file, test it 1^st by selecting Control>Test Movie.

If the answer is right:

If the answer is wrong:

TOPIC 4 - TYPES OF INTERACTION

LEARNING ACTIVITY 4

Name:             NUR AMALINA BINTI ANUAR

Matric No:       MPP141188

1. Create a multiple choice questions that will provide a correct or incorrect response upon your answer. 

For the correct answer, the response will be:

,

For the wrong answer, the response will be:

# view the tutorial in here.

2. Create one application that allows users to type an input of the question provided. 

If user give the correct answer, the response will be:

If the user give the wrong answer, the response will be:

# view the tutorial in here.

3. Create a Main Menu that contain following actions:

• A button that navigate from one page to another.
• A button that navigate from one scene to particular frame on different scene.
• A button that navigate users to the webpage.

(# view the tutorial in here.)

4. Based on your own creativity, create a simple flash application that involves drag and drop function like an example below:

(# view the tutorial in here)

TUTORIAL- TRACING IMAGES WITH ONION SKIN TOOL

Step 1:

Open a new Flash file.

Step 2:

               

Import the image to be trace by selecting File>Import to Stage.

Step 3:

Resize image by using the Free Transform Tool.

Step 4:

To be able to trace the image, add another keyframe by selecting the frame next to the current keyframe and select Insert>Timeline>Keyframe.

Step 5:

On the 2^nd keyframe, delete the image and click on the onion skin tool.

Step 6:

                

Use the any Drawing Tools (I choose Pencil) and trace the image.

Step 7:

Remove the original image by selecting the 1^st keyframe>right click>select ‘Remove Frames’.

Step 8:

Turn off the onion by clicking the onion skin tool button.

REFLECTION ON MEETING 3 (7th NOVEMBER 2014)

TUTORIAL - ANIMATION (Frame by Frame)

Step 1:

Open a new flash file.

Step 2:

Draw any character in the stage.

Step 3:

Change the layer name to layer ‘cat’ by double-clicking on the word Layer 1.

Step 4:

Click on Frame 2 of the timeline. Select Insert > Timeline > Keyframe from the menu. This will put a new keyframe in Frame 2.

Step 5:

To create the animation, change the image in Frame 2, by adjusting the animal mouth by selecting the black arrow tool and moving it close to the mouth or other facial feature. It will change and you will be able to alter mouth or feature’s shape.

Step 6:

To check out the result of the animation, select Control > Test Movie.

The Result:

#   You can watch the tutorial of Animation (frame by frame) in here.

TUTORIAL - MOTION GUIDE (Ant Moving in The Tunnel)

Step 1:

Open a new flash file.

Step 2:

Select light brown colour for the background in the properties section.

Step 3:

Rename Layer 1 with the name: Background, by double-clicking on the text Layer 1.

Step 4:

Then, draw a large dark brown rectangle over the whole stage area by using the rectangle tool.

Step 5:

To make the tunnels in the nest, set the eraser to the largest size in the tool modifiers and rub out parts of the rectangle which will create a tunnel-like look similar to the image below:

Step 6:

Make a new layer on the timeline using the add layer button or by selecting Insert > Timeline > Layer. Name the new layer ‘Ant’.

Step 7:

On the ant layer, draw an ant. Then, select the ant and make it into a symbol in the library by choosing Modify > Convert to Symbol.

(7.1)

Name the ant symbol ‘ant’ and select the graphic option from the type options. Select the centre square in the Registration option.

(7.2)

Step 8:

To give guide to the ant, create a guide layer, then, select the ant layer on the timeline to add the guide layer. The timeline will look like this:

Step 9:

Using the pencil tool, draw the path for the ant to follow through the ant nest as the below example (the white line is the guide for the ant to follow, which referred as 'Motion Path' ):

Step 10:

Now, snap the ant to the guide by following these steps:
a)  Make sure the magnet icon in the tools options is pressed on.
b)  Select the ant on the frame 1 of the ant layer. Position the mouse on the centre of the ant where you will see a crosshair. Move the ant using the crosshair to the starting point of the guide.
c)  The ant is already positioned at the start of the guide. Now, position the ant at the end of the guide by Insert a Keyframe at the timeline (I positioned mine at frame 70 as below):

(10.1)

d) Click on frame 70 of the ant layer and drag the ant to the end of the guide. 

(10.2)

e) To make the ant move along the line, we need to add a motion tween. This can be done by; clicking between the two keyframes on the ant layer and select motion from the tween dropdown menu.

The result:

(The ant will move along the tunnel@white line.)

# You can watch the tutorial of Motion Guide in here.

TUTORIAL - SHAPE TWEEN (Text Form to Star Shape)

Step 1:

Open a new flash file.

Step 2:

Start by selecting Text Tool and then, type the text in it.

Step 3:

Break the text apart by selecting the text and choose Modify > Break Apart (this process will only break the word into individual letters. Therefore, you need to repeat the breaking apart process by once again selecting Modify > Break Apart).

(3.1)

(3.2)

Step 4:

Insert keyframe at the new frame that you selected (e.g. frame 50). At this new key frame, delete the letters that you made before and add new shape such as star.

After clicking at Polystar Tool at the properties panel, click Option > Style > Star > 

Number of Slide : 5 > OK. You can also choose different colour of the fill by clicking at 

Fill Colour.

 

Step 5:

If the shape has an outline, double click on the outline and remove it. It will make the 

Shape Tween look smoother.

Step 6:

Now, create the Shape Tween to morph the letters ‘FLASH’ into the star.

Click at any Frame between 1 and 50 and in the Properties panel at the bottom change Tween option from None to Shape.

#   You can watch the tutorial of Motion Tween in here.