Friday, February 18, 2011

Week 7 : 18 February 2011 (Reflection)...

On week 6, we continue our lesson with text entry question.

1. Create several layers as following and rename each of the layer with an appropriate name.



2. In layer bg, draw an object to acts as a background of the application. For example, you can draw 3 rectangles to act as a background as the followings.




3. In layer text1, type the following text:




4. In layer text2, type the following text:




5. In layer step, type the following text:




6. In layer question, type the question.




7. Please use the following types of Text for each text field in layer question:








8. In layer button, drag two buttons from the Button Library as followings:










9. In layer stop, type the following actionscript:

    var respon;
     var answer;
     respon = ""
     answer = ""
     stop ();




10. Behind Pause button, type the following actionscript:


on (release) {if (answer == "carbon monoxide and other hydrocarbons")
{respon="Correct";
         } else {
         respon="Incorrect. Your answer "+answer+"is incorrect";
}
}




11. If you want your application accept Enter key press, edit the script as following:


on (release, keyPress "<Enter>") {if(answer=="carbon monoxide and other hydrocarbons") {respon="Correct";
         } else {
         respon="Incorrect. Your answer "+answer+"is incorrect";
}
}


12. Behind Play button, type the following actionscript:


on(release) {gotoAndPlay("Scene1");
}




The script will bring the application to the first scene if you have the scene!


13. Test the movie an you will get the following view:



Self Review : (Class Activity 5) -Part 3-



Tutorial 3 : Personalise your flash games using input & dynamic text boxes


Let's learn how to do it...


1. Open a new file in flash by selecting File > New.


2. Select the Text Box tool from the tool box and draw a text box on the stage.


3. Make sure the properties panel is visible at the bottom of the screen. Let's look through the different options for text in Flash.


4. In step 2, create a text box. Convert the text box to an Input text box. (the type of text box that the person using game/flash)


Click text book > Select the Input text option (from the Text Type drop down Menu)


5. Next, make this box as variable. In variable name cell > enter a name.


6. Ensure the border tool button is selected.


7. Select the Text Tool. Draw another text box on the stage.


8. Select Dynamic Text option from the types menu.


9. In the Variable Name Cell in the properties panel, enter the same name as Input Text box.


    Var  : name

10. Control > Test movie

Self Review : (Class Activity 5) -Part 2-

Tutorial 2 : Developing multiple choice questions

1. Create a question and answer

2. Convert the answer A & B into symbol with press F8. 

3. Insert layer STOP and type the action script stop();

4. Insert layer CORRECT and insert keyframe at Frame Number 5. Type the text for correct answer with using Text Tool. At keyframe Frame Number 5, type the action script stop(); 

5. Next, insert layer INCORRECT and insert keyframe at Frame Number 10. Type the text for incorrect answer with using Text Tool. At keyframe Frame Number 10, type action script stop(); also.

6. Then, type action script for button a & b.

7. Test the movie with press Ctrl + Enter.

Sunday, February 13, 2011

Self Review : (Class Activity 5) -Part 1-

Tutorial 1 : Make a simple interactive environment with buttons

Planning your environment

1. Decide on the context of environment. Ex: farm.

2. Make a list or a storyboard that contains the contents of the background and the objects / parts that you are going to make interactive.

Let's getting started

1. Open a new file. File > New

2. In the timeline, double click on the name of this layer and type in background.

3. On this layer, draw the background for your interactive environment.

4. Lock the character layer by clicking on the white dot that is underneath the lock symbol on the character layer.

5. Add a layer by selecting the Add New Layer button. 

6. Double click on the text Layer 2 and rename it objects.

7. Click on the first keyframe on the object layer. Using the draw tools provided, draw your first object. (Alternatively, select File > Import > Import to stage)

8. Select object and press F8 to convert your object to a symbol.Type in the name of your object and ensure you select the button behaviour option Click OK.

9. Click on the object you just converted to a button and click your right mouse button to open up the context menu. Select Edit in Place from the menu.

10. Now editing the button symbol. The timeline for this button symbol only has four frames - one for each of the button states.

UP-when the mouse isn't over the button
OVER-when your mouse is over the button
DOWN-when you click your mouse on the button
HIT-the active area that is the button-the region the user can hit or roll over.

11. Add a keyframe to the Over state by selecting the frame under the word Over and selecting Insert > Timeline > Keyframe from the menu.

12. Click on this new keyframe to ensure that it is the frame you are editing. Change your object to include the name or whatever you wanted to add or remove to make your object interactive.

Ex: Simply added a rounded rectangle and a text box containing the text 'sheep'.

13. Add a keyframe to the Down state by selecting the frame under the word Down and selecting Insert > Timeline > Keyframe from the menu.

14. Click on this new keyframe to ensure it is the frame you are editing. Change the object as required.

Ex: Added a sound file that I have recorded and edited.

15. To add a sound to the Down state keyframe. Select File > Import > Import to library

16. Open the library select Window > Library or press F11.

17. Drag the sound onto the stage.

18. The sound has been added to the frame because a blue horizontal line will appear across the frame. This is a graphical representation of a sound wave.
Select Scene 1 above the timeline to return to the main stage.

19. Select Control > Test movie

20. File > Save

21. Turn flash into a game. Select File > Publish Settings.

22. Tick the file format. Click Publish button.










Saturday, February 12, 2011

Week 6 : 11 February 2011 (Reflection)...

Hello guys....See U again...Hope you all have abundance energy after one week semester break (Week 5 : 1 - 6 Feb 2011) ...

On 5th week, we continue our lesson about:

1. Make a simple interactive environment with buttons

2. Developing multiple choice questions

3. Personalize flash games using input & dynamic text boxes



Self Review : (Class Activity 4) -Part 3-

Tutorial 3 : Integrating Sound and Video into flash

Let's follow the steps below.

1. Download the sound and video file from e-learning system. Extract the latar.zip file into hardisk.

2. Then open any flash that created before.

3. Add a new layer in the timeline.

4. Rename it as music.

5. Click  File > Import file to the library. Choose the sound file.

6. Drag the sound file from library into the music layer.

7. Save file and test movie.

8. For video, download any video file from the internet.

9. Add a new layer in the timeline.

10. Rename it as video.

11. Click at File > Import file to library. Choose the video file. Click next.

Self Review : (Class Activity 4) -Part 2-

Tutorial 2 : Scene concept in flash


1. Choose the Background Color. Then, rename this scene as Introduction. Where to edit this scene? Go to Window menu > Other Panels > Scene OR Shift + F12 > double click at Scene 1 > type Introduction.

2. 

Self Review : (Class Activity 4) -Part 1-

Tutorial 1 : Basic Actionscript


In flash, we will insert Actionscript either in a frame in a Timeline or behind a button.


a) If we insert an Actionscript in a frame, the timeline will look like this.


b) If we insert an Actionscript behind a button, we cannot see any changes on the Timeline and stage.


Actionscript - stop


How to stop Scene 1 from running?


1. Open class activity2.fla file


2. Activate Scene 1.


3. Add a new layer on top of all layers in Scene 1. Rename it as action.


4. Right click on any frame in the new layer and choose Action.


5. When the action window is opened, click at Add icon (+) and choose Global Functions > Timeline Control > Stop


6. Close the action window > Test movie.
(If your Scene 1 consists of animation, you can't see it anymore. This is because; the stop action is in frame 1. Therefore to make sure that you still can see the animation in Scene 1, you have to move the stop action from frame 1 in action layer to the last frame)


7. Click at frame 1 in action layer.


8. Holf Shift key and drag the first frame of action layer to the last frame.


9. Save your file > Add the stop action in all of your scenes if required.




Actionscript - gotoAndPlay


1. Add a new layer above action layer. Rename it as button.


2.Open button library through window > Common libraries > Buttons.


3. Double click classic buttons and Playback.


4. Drag gelRight button to the stage in layer button.


5. Click at the button on stage and right click to open action window.


6. Click at Add icon (+) and choose Global Functions > Movie Clip Control > On


7. Then choose release.


8. Move the blinking cursor in {symbol and click Add > Global Functions > Timeline Control > gotoAndPlay


9. In a bracket type the name of the scene you want to jump "Scene 2".


10. Save your file > Test the movie. Add button more in the following scene if required.

Week 4 : 28 January 2011 (Reflection)...

On 4th week, we continue our lesson about:

1. Basic Actionscript
2. Scene concept in flash
3. Integrating Sound and Video into Flash