TECHNOLOGY AND MEDIA DESIGN

The Respiratory System

Hye guys!!!

First of all, in term of instructional element this video was applied constructive approach whereby at the beginning of the video it shows why, where, what and how respiration in our daily life. Basically, this video was tried to build up student's prior knowledge on what they understand about respiration and what respiratory system is all about. After they ask audience to relate the topic with daily life activity, it comes to the part how our respiratory system works and what organs involve during respiration process.

Advantages of the video
1) it is easy for student to understand on what is respiratory system and how it works by using graphic and animation. 
2) graphic and image used in this video is clear and it is similar to human body since it is hard to look at the real human body inside. 
3) this video also shows how the flow of oxygen blew in through nose, and last will blew out carbon dioxide. 
4) beside, this video also show how all organ in respiratory system works and what is their function in respiration system. 
5) this animation, graphic, audio and etc. help students to learn about respiration process. 

Disadvantages of the video
1) this video does not provide any activity to be conducted in class for student to be more understand about the topic.
2) maybe the audio is to fast so student need to be more focus on what had been talk about or teacher need to explain more in order to help student to understand the video. 

❤ Project 2: Learning Courseware ❤

hye guys!!! arini aku nk upload pasal project 2 group aku (me, jannah and mas)..hehe

last entry aku dah update pasal project 1 kitorng kan? ok, untuk project kali nie pulak aku nk story the morry cket pasal project 2 kitorng..

for this project, kitorng diminta untuk membina learning courseware menggunakan ADOBE FLASH sebagai platform. hurm, kalo nk diikutkan pengalaman eden nie, eden ade la buat learning courseware waktu eden degree dulu..tp itu eden gune kan Ms. Power Point as a platform. so kali nie agak mencabar sket lah..sbb gune kan FLASH. so after bincang mengenai tajuk yang kitorang nk buat, lastly we all decide nk buat learning courseware untuk English subject which is the subtitle is about preposition. learning courseware kitorang terbahagi kepada 4 menu utama. 

1- Learning

2- notes

3- exercise

4-portal

secara umumnya, kitorang divide keje..aku buat part exercise..tp aku akan cite semua stage eh..dun worry..hehehe (aicehh, mcm terer je)

for those yang gune learning courseware nie, at first diorang kene enter diorang punye name pada front page of the courseware..untuk buat entering name, use text tool, but on the properties panel should change into input text where user can enter their name. after put their name, click button enter, and it will direct to the main menu of the courseware. kat sini lah nanti user akan nmpak 4 button utama iaitu:

1-Learning

2- Notes

3- Exercise

4- Portal

here, user boleh pilih which menu they want..every button has its own function and its own description. untuk button learning, when they click on that button, it will direct to the learning page..here it is a description on what they will learn on this learning courseware. After that, if they want to go back to the main menu, they need to click on the button back. 

Untuk notes pulak, ade disediakan notes mengenai preposition of place and preposition of direction. untuk notes nie, kitorng just gune text tool to type in the notes. And also buttons for user to go to the next page and go back to the main menu. 

Part yang paling mencabar adalah part exercise. untuk exercise nie, aku apply ketiga-tiga types of interaction yang aku blaja dalam kelas Flash. Lets make it clear so that all of you understand what i meant by that..untuk Exercise, actually aku sub kan kepada 3 sub..meaning that ade 3 exercise..setiap exercise adalah berbeza..

Exercise 1- Drag n Drop Interaction

Exercise 2 - Multiple Choice Question

Exercise 3 - Input Text Question

Untuk setiap exercise nie, ade instruction page aku sediakan so that user boleh faham mcm mane diorang nk buat untuk menjawap soalan. Untuk drag n drop question, aku apply action script yang berkenaan dgn koordinasi. so that if student drag in ke tempat yang betul akan keluar tanda right..

Action script yang terlibat adalah:

on(press){

startDrag(this);

}

on(release){

stopDrag();

if((this._x>=Lowest value of X)&(this._x<=Highest value of x)&(this._y>=Lowest value of Y)&(this._y<=Highest value of Y))

{

_root.box1.gotoAndStop (2);

}else{

_root.box1.gotoAndStop (1);

this._x=origin coordinate of X;

this._y=origin coordinate of Y;

}

}

Untuk exercise yang kedua adalah berkenaan multiple choice question..cara nk buat MCQ nie same mcm yang aku dah state pade entry yang lepas..cume bezanye aku ade insert picture..image yang aku amik nie semua aku dah import ke library..hehe cara nk import picture ke library, click File, Choose Import, Choose import to library, then pilih la pic mane yg nk import ke library..hehehe

Untuk action script pulak adalah seperti dibawah:

on (release) {

respon = "Congrats, your answer is correct!!!";

}

*untuk jawapan yang betul action script as above, untuk jawapan yang salah action script as below:

on (release) {

respon = "Your answer is incorrect";

}

Lastly untuk text entry question..step nye same mcm yang aku terangkan pade entry yang lepas..cume bezanye aku masukkan gambar je..^_^ (pic as usual amik kat library..hehe)

Action script yang aku apply adelah seperti dibawah..

on (release) {if (answer == "opposite") {respon = "Correct!";

}else {

 respon = "Incorrect, Your answer "+ answer +" is wrong";

 }

}

on (release, keyPress "<Enter>") {if (answer == "opposite") {respon = "Correct!";

}else {

 respon = "Incorrect, Your answer "+ answer +" is wrong";

 }

}

nie contoh action script yang aku copy paste dari one of the question untuk exercise yang aku buat dalam learning courseware nie.. ^_^

Ok guys, since kitorang buat asing2 mengikut task yang diagihkan..kitorang kene link kan dari satu file ke satu file..untuk link kan .swf file aku n .swf file kwn2 aku, aku apply action screen seperti dibawah..

on (release) {

loadMovieNum("name of the .swf file", no. of frame)

sbg contoh tgk actionscript yang kat bawah nie..^_^

on (release) {

loadMovieNum("seq1.swf",1);

}

So secara overview, nie lah yang group aku buat..kitornag banyak men button je dengan action script..still lagi budak baru belaja..hehehe kalo salah tolong lah tunjukkan ye...hehehe ok guys, last but not least, this is our humble project..maybe project kitorng nie xsehebat project group lain..tp kitorang bangga since kitorang dapat apply ape yang kitorang belaja dengan jayanye dalam kelas...thanks to much to Dr. Zaida yang banyak ajar dalam kelas..

thanks to sis Farhana yang assist kitorang kat fb..hehe

thanks a lot...^_^ 

❤ Last Class ❤

korang mesti hairan kan nape aku sedeyh? sbb nye kelas authoring dah abes..tinggal nk exam je lagi...here i would like to say a lot of thanks to Dr. Zaida yang banyak teach, guide, assits, and give us so much input about this subject...at first masuk kelas nie umpama bayi yang baru lahir, at last after dicorakkan, dapatlah skill2 yang sgt bermanfaat..hehehe from '0' to hero lah katekan..hehehe tp xde lah hero mane sgt pun...still in learning..thanks jugak to dr. zaida for once again sebb belanje kitorang satu kelas donut yang sedap n ari kotak..hehehe n thanks jugak to sis Farhana yang selalu assists kitorang dlm kelas especially dlm discussion through fb if all of us face a problem bile nk siapkan activity..hehehe..jasamu xdapek den lupekan..hehehe tp nnt if ade prob n kemusykilan yang nk ditanye sy 'serang' fb ye,,hehehe exam just around the corner, so kene prepare a lot for exam nnt..if not abes lah aku..xleh lah nk dpt A+ nnt..sgt risau tauuu....wish me all the best yaa...n gud luck korang semua untuk paper nnt..mmuuuaaaahhhhhh

wassalam...~~~

❤ Class activity: Drag n drop ❤

Sawadikappp kap kun kappp...(ntah ape je aku merepek nih)

ok guys, nie aku nk update pasal activity terakhir aku dalam kelas authoring untuk sem nie..hehehe untuk activity terakhir adalah berkenaan dgn drag n drop jugak cume beza sket pd aplikasi n action script nye..hehehe for instance, if we drag the object to the right place, the right mark will appear..but if we drag the object to the wrong place, it will back to the origin place. so my question is how to do that? erm meh aku explain kan carenye ye..hehehe

Create drag n drop application:

1. First of all we need to create the 'place' where we want to drag the object. 

2. Click on Menu 'Insert', and choose 'New Symbol'. Name it as place and choose movie clip and click Ok.

3. Choose rectangular shape to create the box.

4. Right click on the keyframe and choose 'Actions' and type action script.

stop ( );

5. Right click on the second frame and choose insert keyframe.

6. Import any ✔ symbol to the library, and put it at the corner of the box. 

7. Right click and choose action and type action script:

stop ( );

8. go back to scene, and drag the place to the stage and i named the layer as a response.

don't forget to name it the box. for my activity i name it as box1 and box2 at the instace name. 

9. Click on insert new layer, name it as shape. then i draw circle and rectangular and convert it into symbol by choosing movie clip.

10. at the circle and rectangular, i've insert an action script for each. the action script for this type of interaction is differ from the earlier drag n drop interaction. 

the action script as below;

on(press){

startDrag(this);

}

on(release){

stopDrag();

if((this._x>=* lowest value for x in the box*)&(this._x<=*highest value for x in the box*)&(this._y>=*highest value for y in the box*)&(this._y<=*highest value for x in the box*))

{

_root.box2.gotoAndStop (2);

}else{

_root.box2.gotoAndStop (1);

this._x=*the origin value for x*;

this._y=*the origin value for y*;

}

}

untuk action script nie korang kene tahu coordinate (sebut perkataan nie teringat waktu degree dulu blaja coordination chemistry..rindunye kat dr. rusmidah..hehehe) object dalam box untuk korang place kan object. kene tahu koordinat paling tinggi and koordinat paling rendah sbb nye if korang drag n drop korangnye object in between of that coordinate kire jawapan diterima la..huhu dan jugak koordinat asal object sebelum di drag sbb nnt of korang drag ke tempat n salah the object will back to its original place. dah dapat baru masukkan nilai dlm actionscript. 

11. after dah insert sume action script, insert a new layer n name it as stop. right click on the frame and choose action and type the action script as below:

stop ( );

12. test ur movie to know either it is work or not by click ctrl+enter. hehehe 

hehehe so nie lah step secara general nye..hehehe

huhu untuk tengok hasil keje aku nie, aku dah upload kat google site..sila la melawat..if u want to do so just just knock the 'door'. ok guys..see u again yaaa...

❤ Apps 4: Types of Interaction ❤

salam and good morning to all!!!!

sorry yaaa...today br ade kesempatan untuk update my blog yg cantekk niee...hehehe (such a perasan)..huhu  erm after dah study pasal apps 1, 2 amd 3 and now kite masuk for the last apps pulak eh which is apps 4. Apps 4 nie its about types of interaction. as far as i know, we can create such an interaction by using ADOBE FLASH..especially if we want to built up multimedia learning courseware it is better to use ADOBE FLASH as a platform. ok guys, untuk types of interaction nie ade 4 jenis interaction. The types are as stated below:

A- Multiple Choice Question

B- Text Question

C- Navigation Main Menu

D- Drag n Drop

ok, now untuk create setiap intection yang kite nak ade step2 or procedure yang kite perlu ikut satu persatu..so for those yg ase mcm nk try tue boleh la ikut step nie..hehehe step nye ade seperti dibawah..hehehe (aku siap explain detail lagi tau..huhu such a perasan!!! huheuheu)

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

Steps;

1- Name the first layer as question.

2- Choose text tool --> select static text on the properties panel --> typing the question

3- Insert new layer --> name the layer as buttons

4- Create button by using oval tool --> choose appropriate color--> resize the button

5- Choose text tool --> Type 'A' on top of the button which represent as A button

6- Convert button to symbol by select whole button --> click modify --> convert it to symbol --> name the button as A --> select button type --> OK 

7- Step 6 is same goes to others 3 button (B, C, D) --> choose appropriate color and resize each button (same size as A) -->Convert all the buttons to symbol and select button type.

8- Insert new layer --> name it as response

9- Choose text tool --> choose dynamic text --> type response as it variable in the properties panel

10- Insert another layer --> name it as action --> put action script by right click and choose Actions.

The action script:

stop();

var respon;

respon = " "

11-  Since the answer is A --> right click on the button A --> choose actions --> type in the action script below:

The action script: 

on (release) {

 respon = "Congrates, Your answer is correct!";

}

12. Do the same step for button B, C, and D (repeat right click -->choose actions --> type in the action script) --> just edit the respon for the other button according what you want it to be as long as it shows it is the wrong answer because the right answer is A..huhu

13.  Control --> Test movie --> Done or the other alternative just press ctrl+enter..huhu

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Task 2: Create one application that allow users to type an input of question provided. 

Steps;

1- Prepare your background as creative as you are..^_^

2- Choose text tool to type in topic for the question about and you have to make sure it is STATIC TYPE by change it in the properties panel --> name the layer as background

3- Insert new layer --> name it as question

4- Choose text tool --> select STATIC TYPE --> type in the question.

5- Then, select rectangle tool and create box shape on the stage

6- Select text tool --> preposition it and you need to change it to INPUT TEXT by changing it in the properties panel

7- Select text tool again --> but now choose DYNAMIC TEXT. This is for our respon to the answer..

8- Insert new layer --> name as buttons

9- From library panel -->choose play button --> drag to stage --> resize the button

10- Insert new layer and name it as stop

11- Right click on first keyframe and choose actions.  Type in the action script below.

The action script:

stop();

var answer;

var respon; 

answer = " "

respon = " "

13- Select button --> right click --> choose actions.  Type in the action script below.

The action script:

on (release) {if (answer == "print client") {respon = "Correct!";}

else {

 respon = "Incorrect, Your answer "+ answer +" is wrong";

 }

}

on (release, keyPress "<Enter>") {if (answer == "print client") {respon = "Correct!";}

else {

 respon = "Incorrect, Your answer "+ answer +" is wrong";

 }

}

14- In the INPUT text field --> type in 'answer' for it variable

15- In the DYNAMIC text field --> type in 'respon' for it variable

16- Control --> test movie --> Done or other alternative is press ctrl+enter

*you have to make sure that you already uncheck auto-kern..if not, it doesn't work..that's my experience..huhu 

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Task 3: Create a Main Menu that contain following actions:

• A button that navigate form 1 page to another
• A button that navigate from 1 scene to particular frame of different scene
• A button that navigate users to other webpage

Steps :

1- Create the background -> insert logo image, header of the site and buttons  (home, about and page). Make sure to convert all the buttons (home, about and page) to symbol by click on modify>convert to symbol>name the button>select button> click 'OK'.

2- Click on the 'Home' button --> go properties --> Type in 'home' in the Instance name field. Repeat this for the other two button, but do change the instance name according to the button name.

3- After that, we need to duplicate scene.  To do this, go to window --> Other panels --> Scene -->Duplicate scene and rename it from Scene 1 to Scene 2 by double click on it.

4- Select Scene 2 -->Choose text tool --> Type in the description of the scene 2..for mine, my scene 2 is 'About'..

5- Do the same as step 4 for Scene 1. 

6- Test the movie.  Here we can see that the description that we create are keep repeating non-stop.  Hence, we insert action script at the button layer on scene 1. 

      Action script : stop ();

7- Insert frame for all the layer (until frame no 15) in Scene 1.  Same goes to the Scene 2.

9- In Scene 2, insert new layer --> name it as about --> go to properties panel --> in the frame field, type 'aboutPage'. On the about layer, it shows the name of frame that we type in.

10- Still in the Scene 2, insert new layer -->name it as stop --> right click on the first frame -->choose actions --> Type action script

action script: 

 'stop ();'.

11- Now, change to Scene 1, right click on the 'About' button -->choose actions. Type in the action script.

12- The action script:

on (release) {

gotoAndPlay("Scene 2", 1);

}

13- Test the movie --> click on the ' About' button, it will show about page.  But when click on the Home button, nothing happen.  It is because we not insert the action script yet.

14- To do this, we change from Scene 1 to Scene 2, then we right click the 'Home' button -->choose actions.  Type in the action script.

The action script:

on (release) {

gotoAndStop("Scene 1", 1);

}

15- Testing the movies again.  Now try click on the home button and novel button.  It will show the pages.

16- To activate button 'About', in Scene 1 --> right click the about button -->choose action. Type in the action script.

on (release)

{

getURL (""http://www.facebook.com/pages/Memorial-Gallery/352337924827038?ref=ts&fref=ts"");

}

17- Repeat step 16 but this time do it in Scene 2..If not only in Scene 1 can navigate to the other webpage..

18- Test movie by press ctrl+enter

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Task 4: Based on your creativity, create a simple flash application that involves drag and drop function.

Steps:

1- name the layer as question..choose text tool and type the instruction

2- insert new layer and name it as rectangle and draw  rectangle shape 

3- Select the rectangle --> click modify --> convert it to symbol --> name as box --> choose graphic type --> OK

4- insert new layer and name it as circle and draw circle by using rectangular tool

5- Select the cicle --> click modify --> convert it to symbol --> name the circle according to color ---> choose movie clip ---> OK

6- Since we want to drag the circles to the rectangle, then, right click on the red circle --> choose actions. Type in the action script below.

The action script:

on (press) {         

 startDrag(this, true);

}

on (release) {

 stopDrag();

}

7-  Repeat step 5 and apply to blue circle.

8-  Control --> test movie --> Done

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Ok guys, since xblh nk upload .swf file kat sini..all of u are pleased to visit my site by click HERE.

Last but not least, u can try it yaa..hehehe and if i've a mistake please correct me..hug n kisses..byeee...

❤ Apps 3: Creating Animation ❤

hola guyssss!!!

 kali nie aku nk post pasal class activity aku on creating animation..nie adelah apps yang ketiga aku blaja dalam ADOBE FLASH..hehehe untuk activity yang first adalah seperti dibawah;

A. create an animated bouncing ball that could change its positions, colors, 

and size along the preferred timeline. 

so, daripada soalan diatas, aku pun create lah aku punye animated bouncing ball yang tersendiri dengan berpandukan kepada apps3 yang diinstallkan dalam ipad kitorg..hehehe nk tgk hasil aku?? huhu tarraaaaaaaaaaa..

ok, now aku nk explain pulak mcm mane aku buat sampai boleh jadi cantik mcm nie..hehehe such a perasan kan..hehehe step2 yang aku gunekan adalah seperti berikut..

1- create new stage
2- select an oval tool and draw circle shape which is like a ball..
3- select that circle and convert it to a symbol by go to 'Modify' menu and choose 'Convert to Symbol'
4- type name of the symbol and choose as graphic, then click 'OK'.
5- go to frame 10, and right click on it..
6- Choose 'Insert Keyframe'
7- Here, i've change  the position of the ball
8- at this position i've change its size..to change the size, click on the free transform tool, clik on the circle and simply drag into small size..(here is up to u olls la..if nk besar just drag into a bigger size..xkisah lah ape2 pun..asalkan nmpak peubahan size..hehe and paling penting ikut citarasa sedap hati korg ye..hehe)
9- to change the color, its also the same, click on the circle, and look at the properties panel..in properties panel u're able to change its brightness and color..to change the brightness just choose brightness then u may increase or decrease the brightness of the circle..if want to change the color just choose 'Tint' and u can choose the color u want..huhu simple right..
10- after change the position, color and brightness, now we want to create its motion..to create the motion, we can click at any frame in between frame 1 and 10 since i've insert keyframe and make a changes at this frame...

11- so, i choose frame 5..right click on frame 5, and choose create motion tween. 
12- step yang same diulang..terpulang la korang nk buat sampai frame berape pun...hehehe
13- after dah siap, boleh test movie by press ctrl+enter..
 taraaaa...jadilah mcm animation bouncing ball kat atas..
sebelum aku lupe, if nk slow or fast its movement just change pada frame rate je..hehehe yg asal adalah 12fps..so kalo nk its move slower just decrese the rate..hehehe


selain bouncing ball aku jugak buat ayunan pendulum..hehehe step nye lebih kurang je as ape yg aku explain kat atas..

hehehe ok x? boleh lah kan dari xde..hehehehe xpe2..next time aku buat cntik2 lagi ok..hehehe

B. Create a new flash file and change a text form into a star shape.

untuk task yang ini, aku kene create animation yang boleh tukar tulisan kepada bentuk ape2 je..mcm magic tue..hehehe untuk buat nie kite apply shape tween..hehe hasil yang aku buat adalah mcm video kat dibawah..

untuk create animation mcm nie, ade beberapa step yang terlibat..huhu...Procedure untuk create this kind of animation adalah seperti yang berikut; 

1- create a new flash file
2- at frame 1, type text using text tool
3- we need to break apart the text by select the text, click on 'Modify' and choose 'Break Apart' so we can break the text individually.
4- we need to repeat break apart step for once again by select the 'Modify' and click 'Break Apart'
5- Then, on the frame, u may choose any frame u want..as for me i choose frame 25.
6- right click on frame 25, choose insert key frame
7- Delete the text and draw a star shape by using polystar tool..
8- at the properties panel for polystar tool, click 'option' and choose 'star'
9- Draw star at the stage on frame 25..
10- Click on any frame between frame 1 and 25, right click and choose 'create shape tween'..
11- u may repeat this step if u wanna change it back to the text what i did..meaning that from text to shape to text..hehehe


C. Use a motion guide technique to guide the ant move along the tunnel.

untuk task yang seterusnya, aku kene create satu animasi yang menggunakan motion guide untuk menggerakkan sesuatu mengikut laluan yang dikehendaki..as for example nk create layang2 terbang ke, roket terbang ke..hehehe tp untuk task nie minx en.semut berjalan..hehehe bile ckp pasal semut nie aku teringat kat adik aku..bile aku dok bebel2 kan die kan boleh pulak die ckp camni 'adik seperti dengar semut berbisik la..akak dengar x?' dengan muke innocent gile membuatkan aku nk gelak..hahaha miss u laaa adik..huhu ok cukup2..back to my task..aku pun create lah animation about semut berjalan..hasilnye adelah seperti dibawah..

untuk create semut berjalan nie, kene gune motion guide technique..step nye ade diexplain kan seperti dibawah..

1- create a new flash file
2- I draw the ant..after complete draw the ant, by using selection tool, select the ant and click on 'Modify', Choose 'Covert to Symbol' and name it as ant and choose movie clip, then click 'OK'.
3- Delete the ant..on the layer, i choose pencil tool + smooth to draw a tunnel for the ant..name the layer as road..
4- insert a new layer, and name it as ant..drag the ant symbol from the library..
5- at frame 50, right click and insert key frame,
6- move the position of the ant to the end of the tunnel..
7- in the middle of the frame, right click on frame and create a motion tween..
8- then, Click 'new motion guide'
9- Select pencil tool and choose smooth option then start to draw the line guide..
10- Click on the ant, and make sure the draw line is touch at the middle of the box..if not, adjust the line so that, it will touch the middle by using selection tool.
11- on the properties panel, tick on 'Orient to path'..
12- press ctrl+enter to test your movie..
now, u can save it..huhu

*bile nk select pic semut tue, its akan effect die punye tunnel..so ape yg aku dah buat, kat layer tunnel tue aku lock kan..huhu senang keje..hehe


D. Try to animate cartoon's mouth by applying frame by frame technique in adobe flash..

task yg nie senang jugak la..just gerak2 kan mulut cartoon yang kite draw seolah2 menampakkan yang cartoon tue tgh ckp something..hehe contoh nye adalah seperti dibawah..

huhu untuk create animation on cartoon's mouth nie teknik frame-by-frame adalah yang paling sesuai untuk diaplikasikan..hehehe kat bwh nie aq ade list out kan procedure yang aku gune..so korg boleh la try nnt..ok, let explore it..

1- create new flash file
2- draw any shape of mouth such as smile, sad, and so on..
3- convert on what u draw into a symbol.
4- cilck on modify, choose convert to symbol, name it as mouth 1, mouth 2 and so on (name yg korg ase senang nk ingat..), choose graphic and click OK..
5- then, draw the face of the cartoon on frame 1..then after complete ur drawing, right click on frame 1, copy frame, and go to frame to right click and paste frame..the same cartoon will appear on the second frame..
6- just remove the mouth and drag in the new styles of mouth..repeat in frame by frame by exchanging cartoon's mouth style..
7- terpulang lah pada korang bape banyak korang nk buat..huhu aq buat tiga style of cartoon's mouth animation je..hehehe

so, inilah task2 yang aku dah siapka untuk aktiviti kelas aku..hehehe korng boleh try eh..if xfhm boleh tny kat ruangan komen ok..hehehe
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

❤ Developing Web Tadika Annur - Part II ^_^ ❤

Assalamualaikum and the very good morning ^_^ waaaaaaa baik betul kan aku..hehehe sebagai seorang muslim kite kene mulakan bicara dengan memberi salam..hehehe ^_^ ok u olls...u olls ingat x last entry kite post pasal ape? alaaaaaa xkan xingat kotttt..ingat laaaa..cepat laaa...(hahahaha such a gediks) huhu ok lah...dis entry aku nk sambung story telling pasal project 1 group aku yang develop web untuk tadika kitorg..aicewahh..hehe last entry aku cakap pasal user and page about web punye tadika kan..aku dah sentuh registration, survey yang mane aku apply list/menu and also radio button..then semua data yang dimasukkan tue akan diterima oleh sistem untuk direokdkan dan dapat dilihat oleh admin dalam database..n at last enrty before aku stop, aku ade tinggalkan persoalan mengenai siapa, apa itu admin right? now here, lets the journey begin..hehehe actually admin tue adalah org yang develop a web..dalam kes nie, admin untuk web tadika ni adalah aku, jannah n mas..untuk web nie, admin perlu log in, so that die dpt tgk sume info mengenai murid..boleh delete, dan juga update data murid and boleh juga menambah info dalam web..

kalo perhatikan betul2, dibawah news tue ade link untuk log in kan? ok function log in nie adalah untuk admin log masuk ke web nie for editing, updating, deleting, and so on..after click that link akan keluar page nie..

so, setiap admin akan ade their own username n password...how to create function log in for admin? 

untuk create function log in, step nye adelah seperti berikut;

1- open new php page

2- create table (invisible kan table tue..)

3- Insert text field

4- Insert Button (Login)

5- go to Server Behavior

6- Select User Authentication

7- Choose Log in User

8- so akan keluar new windows for us to fill in..select username and password..

9- after log in where to go? hoho where else to go, just directing it to the admin page..^_^

but, we also set up one page for the unsuccessful login user..same goes with the login page, but juat add on the new text which shows yang salah masuk password ke, salah username ke and so on...it is shown in the picture below..

here, sekiranya login xberjaya due to wrongly enter the password and so on, die akan keluar like abouve page..but if successful log in, akan terus ke admin page..admin page? ape itu admin page? tgk pic kat bawah..

admin page n user page nie same je actually..yang membezakannya adelah menu yang ade pada hujung sudut atas sebelah kanan..itu je yang beza dengan user...xnampak eh? meh aku nk zoom supaya korang nampak dengan jelas dan nyata nye..

kalo tgk kat pic atas neh..nie lah menu untuk admin..then kat bawah box news tue ade satu link untuk admin log out...then, tgk kat menu, untuk user akan ade registration page kan where parent kan register their children to enter this kindergarten right? but it is differ with admin page where dekat admin page akan ade student info...di bahagian student info ni akan paparkan nama murid..so here, admin boleh tgk borang setiap murid, update maklumat murid, dan boleh jugak delete record murid untuk murid yang dah pun tamat tadika or berpindah or anything else..^_^ 

pic kat atas ni shows us page student info..kat page nie akan keluar senarai nama murid yang dah telah berdaftar..so, here, admin boleh update record murid dan akan keluar murid nye profile untuk diupdatekan maklumat. 

pic atas neh adalah page dimana admin boleh update info murid setelah click pada nama murid yang berkenaan..untuk mengemaskini maklumat murid, kitorg create page update, then using the same form (jimat mase..hehehe)..

1- go to server behavior

2- click recordset(query)

3- go to binding, and drag all the info to the related field

4- go to server behavior

5- click update record

6- before apply update record, u need to insert hidden field..

how to insert hidden field?

1- go to insert

2- Click Form

3- Choose Hidden Field

Hidden field nie actually its behind the system..kene insert sbb nnt untuk id kite x update..so that's y kite letak hidden field for id..nie yang aku faham lah...hehe if ade mistake boleh leave ur comment later ok..so after dah edit/update, kite go for deleting process pulak..deleting process nie same jugak caranye mcm nk update..cume beza nye xyah nk create form mcm kite create form utk update record tadi..huhu

ok, now for deleting pulak ok..korg scroll balik tgk pic mengenai student info tadi...pastue korang akan nampak link 'Delete Record' kan? so, for admin untuk delete record pelajar, admin kene click on that particular button then akan appear page seperti pic dibawah..

so, if nk delete record murid, admin just click pada 'cross' button provided..when click on that particular button, akan appear window like this:

the, if u 're sure to delete that particular student's record, u just click ok..if not, just click cancel..so, here, how do we create this delete record page?

1- create new php page n save it as del_form

2- create table for student info

3- go to Server Behavior

4- click on Recordset(query)

5- Go to binding and drag in info to the provided field..

6- Go to Server Behavior

7- Click Repeat Region

8- Then Click also Go to detail page and customize the info needed..

mcm mane aku nk explain eh? erm mcm nie, if nk delete record, kene ade 'Go To Detail Page', so that nnt system akan delete semua data yang berkenaan..so, untuk tu, kite kene create satu page untuk del_form2..dalam page nie as usual just copy the form..do the recordset, then go to server behavior and choose delete record..so pada 'Go To Detail Page' nnt, directing kan pada del_form2..so sume data akan di delete..hehehe 

so, nie lah secara overview kitorg develop kitorng nye web untuk projek 1 kitorng..hehehe xtido mlm kot..punye nk siapkan cepat kitorg sanggup berjaga sampai pagi..at last projek nie siap jugak pukul 5 pagi....pengalaman yang sgt best...kalo belajar xrase sume nie sgt rugiiii..huhu bersama2 merempit dengan my classmate, Jannah pegi ke KTHO sbb mastermind kitorg stay kat KTHO..so buat kat bilik die lah..hehehe ape2 pun..antara moment yang xboleh dilupakan untuk MASTER level..huhu thumbs up to aku n my team project..yiehaaaa!!!!!