How to embed swf files in blog post entry

I would like to share how to embed swf files in blog post entry. After trial and error many times, at last success to embed in blog entry. Googling just discover how to embed swf as banner in blog by insert widget html code. So, i try the html code in blog entry.

1. Upload swf file in sites google or mega swf or other sites.
2. Copy file location
3. Create new post.
4. In post entry editor select Edit HTML
5. Paste this code <div style="text-align: center;">
   <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,45,0" height="450" width="600"> <param name="movie" value="https://sites.google.com/site/hailizyusof/config/pagetemplates/flash-liz/AnswerQuestion.swf?attredirects=0" />
   <param name="quality" value="high" />
   <param name="menu" value="false" />
   <embed src="https://sites.google.com/site/hailizyusof/config/pagetemplates/flash-liz/AnswerQuestion.swf?attredirects=0" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="600" height="450"></embed> </object></div>
6. Edit the red code. Paste your swf location to replace the red text.
7. Publish post and view.
8. Now your swf file is appear on your blog post!

 GOOD LUCK!!

Week 14 : Assignment 2 Authoring System (Flash)

بسم الله الرحمن الرحيم

This week we got new assignment in flash. The assignment should have 4 types of animation, which is :

1. Montaj
2. Main menu
3. Question (Drag and drop, multiple choice question and text entry)
4. Ending

Here are a part of my project. The first one is my main page. In this project i use 2 swf files linking each other from main.swf to subfile.swf. Suppose the file can be run successful in offline mode. After upload the files, they can't recognize to link the files. This is main.swf and the other one is subfile.swf.

Week 13 : Apps 4 on i Pad

بسم الله الرحمن الرحيم

Today we learnt how to develop a kind of interactive question using flash. We learn trough Apps 4. In this apps we have exposed how to create multiple choices question, text entry question and drag and drop application. It's interesting and fun!

Here is swf file

Multiple Choice Exercise

How to do?

1. Create new flash file, save as mcq.fla.
2. Insert layers for question, answer, action, respons and button.
3. At the question's layer, create a question using static text.
4. At the answer's layer, create an answer choices using static text.
5. At the respons's layer, insert dynamic text for the respons of the user's answer. Set the var as respon at the properties.
6. At the action's layer insert action script : stop(); var respon; respon = ""
7. At the button's layer create an oval. Convert to symbol by right click>convert to symbol or F8. Select button symbol.
8. Double click the button symbol to set the button properties.
9. Behind of the right answer button, insert action script : on (release) { respon = "your answer is correct"; }.
10. Behind of the wrong answer button, insert action script : on (release) { respon = "your answer is incorrect"; }
11. Make sure untick the autokern.

How to do text entry question?

 1) Create new flash file, save asanswerquestion.fla with 6 layers wich is background, question, answer, respon, action and button.

2) At question's layer, put in the questions that you want to test the student. Remember, these text questions are of static text type.

3) At the answer layer, create the space for input text from the user using input text.

    Set the properties:

    - Embed -> all

    - Auto kern -> off (untick)

    - Options : Variable -> answer (this input text is defined as answer variable)

4) At the button layer. 

    Go to Windows --> Common Libraries --> Buttons

    Drag the button on to the stage.

5) Behind the button, create the action script.  Take note that the correct answer for this question is "oxygen".  All other answers will be taken as incorrect answer.

    The response will come out whenever the user press on the button or <Enter> button.

 on (release) { if (answer == "oxygen") {response = "Congratulations! Your answer is correct!";
   } else {
   response = "Incorrect. Your answer "+ answer +" is incorrect. Please try again.";
  }
  }

  on (release, keyPress "<Enter>") {

  if (answer == "oxygen") {response = "Congratulations! Your answer is correct!";
  } else {
  response = "Incorrect. Your answer "+ answer +" is incorrect. Please try again.";
  }
  }

6) At response layer, just create the dynamic text that will be labeled as response below the questions.

    Set the properties:

    - Embed -> all

    - Auto kern -> off (untick)

    - Options : Variable -> response (this dynamic text is defined as response variable)

 

7) At action layer, insert action script in the first frame of this layer, that is to stop the application, to define the answer and response variable, and to initialize the answer and response variable.

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

Drag and Drop

Version 1.0

How to do drag and drop application?

1) Create new flash file, save as appledrag.fla with 3 layers wich is Layer 1 - tree, Layer 2 - apples, Layer 3 - instruction.

2) At the tree's layer, draw the tree on the stage. Convert to graphic symbol.

2) At the apples's layer draw the apple and convert to movie symbol. Duplicate the apple.

3) Put Action Script behind each apple..

 on(press){

 startDrag(this, true);

}

on(release){
 stopDrag();
}

6) At the instruction's layer, put the instruction on the scene using static text.

Ctrl + enter.. See what happened with my apples? It's can't drag and drop properly.. Why???? It's because when i convert the apple into movie symbol, the registration properties should be select on the center. In this case, i've selected on up left registration.

Drag n drop version 2.0

How to do?

1) Create new flash file, save as basketballdrag.fla with ball layer.

2) Import basketball image on the stage.

2) Select the ball and break a part. I use pencil tool to break a part the ball into 4 part. Convert to movie symbol each part of the balls.

3) Put Action Script behind each ball's part..

 on(press){
 startDrag(this, true);
}

on(release){
 stopDrag();
}

Now test the movie by click ctrl+enter.

Week 12 : Apps 3

بسم الله الرحمن الرحيم

Today we expose to apps 3. For introduction we learn to do an animation using Adobe Flash CS3. In flash, it's some important things to know before work with it.

• Stage size : dimension of the stage. Default stage size is 550px x 400px. For banner size normally use 200px x 600px.
• Frame rate : speed at which animation is played or the playhead moves across a Timeleine-is measured in the number of frames displayed per second. Default frame rate is 12fps. Too slow frame rate means your animation might not be appear to be smooth. Too fast might negatively affect the performance, shorten the animation's duration too much or use a lot of user'scomputer processing power.
• Timeline : organizes and controls a document's over time in layers and frames. The major components of the timeline are layers, frames and the playhead.
• Layers : are like multiple filmstrips stack on top of one another, each containing a different images that appears on the stage.
• Frames : Contained in each layer appear in a row to the right of the layer name.
• Playhead : indicates the current frame displayed on the stage.
• Keyframes : a frame where a new symbol instance appears in the timeline.
• Motion tween : a series of frames containing tweened animation from 1 place to another or change size or color.
• Shape tween : animation to change from shape to another shape or to text.
• Motion guide : moving your symbol in a predefined path such as curves or circles. Good reference in learning motion guide click here.

This is my animation using motion tweening.

Steps to develop Liz's Pacman :

1. Create new flash file with 2.0 action script. Save as pacman.fla.
2. Draw Pacman's road in layer 1. I choose to draw using line tool.
3. Insert new layer and rename it as action. Draw  pacman face using primitive oval, edit for pacman's mouth.
4. Insert new layer and rename it as food. draw the food along the road.
5. In all layers insert new frame at frame 120.
6. On layer action insert keyframes on layers 120. Between this frames insert motion tween. Change pacman's location depend on road angle. This step refer to the playhead. Quite difficult to do but fun!
7. On food layer. Insert keyframe after pacman over the food then delete the food one by one. Repeat it untill the food is over.
8. On layer 1, insert text "Liz's Pacman". Convert to symbol movie clip. Double click the symbol. In frame 20 insert key frames. Change the color. Insert keyframe at frame 10 and change the text color.
9. Now you can text your animation by click CTRL + enter keys.. Taraaaaaa

Second animation i mixed together using motion tween, shape tween and motion guide.

There are the steps to develop animation using motion tween, shape tween. motion guide and frame by frame.

1. Create new flash file. Save as basketball.fla.
2. Rename layer 1 as courts. Draw the basketball courts. In this case i trace from other picture using onion tool. Draw using pen tool, line tool.
3. Insert new layer and rename as ball. I import picture into stage.
4. Insert keyframes in frame 25. Between these frame insert motion tween
5. Add motion guide. Draw the motion guide for the ball bouncing movement.
6. To do the shape motion, place the ball on frame 26 and break apart it 2 times.
7. Insert keyframe in frame 35. In frame 35, insert text "GOAL!". 
8. Between frame 25 to 35 insert motion, change shape in properties.
9. To create frame by frame animation, insert new layer and name it player. Import 6 series of different angle of hand position.
10. Insert keyframe in frame 35, drag the 1st picture.
11. Repeat on frame 36 until frame 41 and drag picture 2 to 6.
12. Copy frame 35 untill 41 and paste it on frame 42 untill frame 50.
13. Test the animation by clicking ctrl+enter.. :)

Week 11 : Knowing Adobe Flash CS3 using Apps 2

بسم الله الرحمن الرحيم

Today we learn Flash using Apps2 trough iPad. In this apps expose us to draw using Flash. We can draw using pencil tolll, brush tool, pen tool, tool line or shape tool. In shape tool, we can select rectangle, oval or polygon. Colouring method can be use brush tool, paint bucket, ink bottle tool or eyedropper tool to copy some colour area to another part. Here the outcome end of our class :

 

Continue colouring process at home as below :

 We can take home the iPad for a week to explore the Apps2. I'm sharing the iPad with Cikgu Mahfuz. In Apps2 have 12 videos in exploring Flash. The interesting tool i've been try is using onion skin tool which is to trace from other picture. Here my tracing picture.

After colouring

Before colouring

 

Week 10 : Learn Flash using Apps

بسم الله الرحمن الرحيم

Today we've exposed learning Adobe Flash using iPad Apps by Miss Nurul Farhana. She is PhD student in Education Technology. Before start the class, she have distributed us a questionnaire and the other one is question about Adobe Flash. Very nice learning trough apps but time is so short. I share the i pad with Masni.

 

In Knowing Flash apps, we learn the interface of Adobe Flash CS3. What application can developed using Flash and the examples. Each page very interactive and interesting to explore it more and more. Here is the user interface for Adobe Flash CS3 :

After 15 minutes we explore the apps, Miss Farhana distribute once again the same question paper to answer. This time i think the answer is better than previos (soppose) hehee.. Very long time left Flash.. Last time i've used Macromedia Flash 8 and Flash MX in year 2007. Hope after this i can work with this software much better than previous. InsyaAllah!