1
แผนผังการสร้ างบทเรียนคอมพิวเตอร์ ช่วยสอน แผนผังที่ 1 ใช้ สร้ างบทเรียนคอมพิวเตอร์ ช่วยสอน ในระดับแรก ที่
ชื่อปุ่ ม
ชื่อหัวข้อเรื่ อง
หน้ำแรก 2 Ob จุดประสงค์ 3 Ptest แบบทดสอบก่อนเรี ยน 4 S เนื้อหำสำระ 5 Potest แบบทดสอบหลังเรี ยน 6 R แหล่งอ้ำงอิง 7 help ระบบช่วยเหลือผูใ้ ช้ 8 m ผูจ้ ดั ทำำ 9 Exit ออกจำกโปรแกรม 10 mane แฟ้ มผูจ้ ดั ทำำก่อนออกจำก โปรแกรม 1
Index
ชื่อแฟ้ มข้อมูล สำำหรับจัดทำำ-แก้ไข
ชื่อแฟ้ มข้อมูล เปิ ดดู
ชื่อแฟ้ มข้อมูล SWf
index.swi
Index.html
Index.swf
ob.swi
Ob.html
Ob.swf
ptest.swi
Ptest.html
Ptest.swf
s.swi
s.html
s.swf
potest.swi
Potest.html
Potest.swf
R.swi
r.html
r.swf
help.swi
help.html
help.swf
m.swi
m.html
m.swf
Exit.swi
Exit.html
Exit.swf
Mane.swi
Mane.html
Mane.swf
หมำยเหตุ
แผนผังที่ 1 ใช้ สร้ างบทเรียนคอมพิวเตอร์ ช่วยสอน ในระดับที่ 2 ที่
ชื่อปุ่ ม
ชื่อหัวข้อเรื่ อง
หน้ำแรก 2 Ob จุดประสงค์ 3 Ptest แบบทดสอบก่อนเรี ยน 4 S เนื้อหำสำระ 1 5 a เนื้อหำสำระ 2 6 b เนื้อหำสำระ 3 7 d เนื้อหำสำระ 4 11 Potest แบบทดสอบหลังเรี ยน 1
Index
ชื่อแฟ้ มข้อมูล สำำหรับจัดทำำ-แก้ไข
ชื่อแฟ้ มข้อมูล เปิ ดดู
ชื่อแฟ้ มข้อมูล SWf
index.swi
Index.html
Index.swf
ob.swi
Ob.html
Ob.swf
ptest.swi
Ptest.html
Ptest.swf
s.swi
s.html
s.swf
A.swi
a.html
a.swf
B.swi
b.html
b.swf
D.swi
d.html
d.swf
potest.swi
Potest.html
Potest.swf
วิธีการผลิต สื่ อคอมพิวเตอร์ ช่วยสอน 1.
ให้ดบั เบิลคลิก ที่ ซีดีไดร์ copy โฟลเดอร์ soursecaiversion1.2 ไปวำงไว้ที่ ไดร์ D:/
หมำยเหตุ
2 2. 3.
ไปที่ไดร์ D:/ หำโฟลเดอร์ soursecaiversion1.2 ดับเบิลคลิก
การผลิตสื่อหน้ าแรก (หน้ าหลัก ) 1. ดับเบิลคลิกที่ ไฟล์ index.swi เพื่อสร้ำงสื่ อหน้ำแรก
2.
จะได้ดงั รู ป
3.
ให้ท่ำนเปลี่ยนหัวข้อเรื่ องให้เป็ นชื่อเรื่ องของท่ำน พิมพ์แนะนำำกำรเรี ยน ใส่ รูปภำพให้สวยงำม เปลี่ยนสี พ้ืนหลัง บันทึก
4. 5.
บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล swi เพื่อใช้สำำ หรับในกำรแก้ไข 1.คลิกที่ File save as…จะปรำกฏ
6. การบันทึก
3
2. พิมพ์ชื่อ index ลงในช่อง file name และเลือก floder soursecaiversion1.2 ที่สร้ำงไว้ 3. คลิก save บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล html เพื่อให้เป็ นแฟ้ มข้อมูล สำำหรับเปิ ดใน อินเทอร์ เนต คลิกที่ file export - html จะปรำกฏ
4. พิมพ์ชื่อ index ลงในช่อง file name และเลือก floder soursecai ที่สร้ำงไว้ 5. คลิก save 6.กำรบันทึกทั้ง 2 ขั้นจะทำำให้ได้ แฟ้ มทั้งหมด 3 แฟ้ มคือ index.html, Index.swf ,Index.swi
การผลิตสื่อหน้ าจุดประสงค์
4 1.
ดับเบิลคลิกที่ ไฟล์ ob.swi เพื่อสร้ำงสื่ อหน้ำจุดประสงค์
2.
จะได้ดงั รู ป
ให้ท่ำนพิมพ์ จุดประสงค์กำรเรี ยนรู ้ เปลี่ยนสี พื้นหลัง ใส่ รูปภำพ ตกแต่งให้สวยงำม 4. บันทึก การบันทึก บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล swi เพื่อใช้สำำ หรับในกำรแก้ไข 1.คลิกที่ File save as…จะปรำกฏ 3.
5
2. พิมพ์ชื่อ ob ลงในช่อง file name และเลือกโฟร์ เดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 3. คลิก save บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล html และ swf เพื่อให้เป็ นแฟ้ มข้อมูล สำำหรับเปิ ดใน โปรแกรมอินเทอร์ เนต คลิกที่ file export - html+swf จะปรำกฏ
4. สังเกตที่ช่อง file name จะมีชื่อ ob.html อยูแ่ ล้ว 5.สังเกตที่ช่อง SAVE IN จะมีชื่อ โฟรเดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 5. คลิก save 6.กำรบันทึกทั้ง 2 ขั้นจะทำำให้ได้ แฟ้ มทั้งหมด 3 แฟ้ มคือ ob.html, ob.swf , ob.swi
การผลิตสื่อหน้ าแหล่งอ้ างอิง
6
5.
ดับเบิลคลิกที่ ไฟล์ R.swi เพื่อสร้ำงสื่ อหน้ำแหล่งอ้ำงอิง
6.
จะได้ดงั รู ป
ให้ท่ำนพิมพ์แหล่งอ้ำงอิง เปลี่ยนสี พื้นหลัง ใส่ รูปภำพ ตกแต่งให้สวยงำม 8. บันทึก การบันทึก บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล swi เพื่อใช้สำำ หรับในกำรแก้ไข 1.คลิกที่ File save as…จะปรำกฏ 7.
7
2. พิมพ์ชื่อ R ลงในช่อง file name และเลือกโฟร์ เดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 3. คลิก save บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล html และ swf เพื่อให้เป็ นแฟ้ มข้อมูล สำำหรับเปิ ดใน โปรแกรมอินเทอร์ เนต คลิกที่ file export - html+swf จะปรำกฏ
4. สังเกตที่ช่อง file name จะมีชื่อ R.html อยูแ่ ล้ว 5.สังเกตที่ช่อง SAVE IN จะมีชื่อ โฟรเดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 5. คลิก save 6.กำรบันทึกทั้ง 2 ขั้นจะทำำให้ได้ แฟ้ มทั้งหมด 3 แฟ้ มคือ R.html, R.swf ,
การผลิตสื่อหน้ าผู้จัดทำา
R.swi
8
1.
ดับเบิลคลิกที่ ไฟล์ m.swi เพื่อสร้ำงสื่ อหน้ำผูจ้ ดั ทำำ
2.
จะได้ดงั รู ป
ให้ท่ำนพิมพ์ชื่อผูจ้ ดั ทำำ เปลี่ยนสี พื้นหลัง ใส่ รูปภำพ ตกแต่งให้สวยงำม 4. บันทึก การบันทึก บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล swi เพื่อใช้สำำ หรับในกำรแก้ไข 1.คลิกที่ File save as…จะปรำกฏ 3.
9
2. พิมพ์ชื่อ m ลงในช่อง file name และเลือกโฟร์ เดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 3. คลิก save บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล html และ swf เพื่อให้เป็ นแฟ้ มข้อมูล สำำหรับเปิ ดใน โปรแกรมอินเทอร์ เนต คลิกที่ file export - html+swf จะปรำกฏ
4. สังเกตที่ช่อง file name จะมีชื่อ m.html อยูแ่ ล้ว 5.สังเกตที่ช่อง SAVE IN จะมีชื่อ โฟรเดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 5. คลิก save 6.กำรบันทึกทั้ง 2 ขั้นจะทำำให้ได้ แฟ้ มทั้งหมด 3 แฟ้ มคือ m.html, m.swf ,
การผลิตสื่อหน้ าระบบช่ วยเหลือผู้ใช้
m.swi
10
5.
ดับเบิลคลิกที่ ไฟล์ help.swi เพื่อสร้ำงสื่ อหน้ำระบบช่วยเหลือผูใ้ ช้
6.
จะได้ดงั รู ป
ให้ท่ำน เปลี่ยนสี พ้ืนหลัง ใส่รูปภำพ ตกแต่งให้สวยงำม 8. บันทึก การบันทึก บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล swi เพื่อใช้สำำ หรับในกำรแก้ไข 1.คลิกที่ File save as…จะปรำกฏ 7.
11
2. พิมพ์ชื่อ help ลงในช่อง file name และเลือกโฟร์ เดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 3. คลิก save บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล html และ swf เพื่อให้เป็ นแฟ้ มข้อมูล สำำหรับเปิ ดใน โปรแกรมอินเทอร์ เนต คลิกที่ file export - html+swf จะปรำกฏ
4. สังเกตที่ช่อง file name จะมีชื่อ help.html อยูแ่ ล้ว 5.สังเกตที่ช่อง SAVE IN จะมีชื่อ โฟรเดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 5. คลิก save 6.กำรบันทึกทั้ง 2 ขั้นจะทำำให้ได้ แฟ้ มทั้งหมด 3 แฟ้ มคือ help.html help.swf help.swi
12
การผลิตสื่อหน้ าออกจากโปรแกรม 9.
ดับเบิลคลิกที่ ไฟล์ exit.swi เพื่อสร้ำงสื่ อหน้ำออกจำกโปรแกรม
10. จะได้ดงั รู ป
11. ให้ท่ำน เปลี่ยนสี พ้ืนหลัง ใส่ รูปภำพ ตกแต่งให้สวยงำม 12. บันทึก
การบันทึก บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล swi เพื่อใช้สำำ หรับในกำรแก้ไข 1.คลิกที่ File save as…จะปรำกฏ
13
2. พิมพ์ชื่อ exit ลงในช่อง file name และเลือกโฟร์ เดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 3. คลิก save บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล html และ swf เพื่อให้เป็ นแฟ้ มข้อมูล สำำหรับเปิ ดใน โปรแกรมอินเทอร์ เนต คลิกที่ file export - html+swf จะปรำกฏ
4. สังเกตที่ช่อง file name จะมีชื่อ exit.html อยูแ่ ล้ว 5.สังเกตที่ช่อง SAVE IN จะมีชื่อ โฟรเดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 5. คลิก save 6.กำรบันทึกทั้ง 2 ขั้นจะทำำให้ได้ แฟ้ มทั้งหมด 3 แฟ้ มคือ exit.html exit.swf exit.swi
14
การผลิตสื่อหน้ าแบบทดสอบก่อนเรียน 3. ดับเบิลคลิกที่ ไฟล์ ptest.swi เพื่อสร้ำงสื่ อหน้ำแบบทดสอบก่อนเรี ยน
4. จะได้ดงั รู ป
5. โปรดสังเกตว่ำ ในแฟ้ ม ptest.swi นี้ จะประกอบด้วย scene ทั้งหมดจำำนวน 13 scene 3.1 เมื่อคลิกที่ Scene_1 ด้ำนซ้ำยมือ จะเป็ นหน้ำแรกของแบบทดสอบ ซึ่ งหน้ำนี้ จะทำำงำนคือให้พิมพ์ชื่อ ในช่อง สี ขำวด้ำนหลังข้อควำมชื่อ และให้พิมพ์นำมสกุลในช่อง สี ขำวด้ำนหลังข้อควำมนำมสกุล หน้ำนี้ให้ท่ำน เปลี่ยนสี พ้ืนหลัง สี ตวั อักษร ใส่ รูปภำพ ตกแต่งให้สวยงำม เมื่อคลิกที่ Scene_2 ด้ำนซ้ำยมือ จะเป็ นหน้ำที่ 2 ของแบบทดสอบ จะปรำกฏดังนี้ หน้ำนี้ให้ท่ำนเปลี่ยนสี พื้นหลัง สี ตวั อักษร ใส่ รู ปภำพ ตกแต่งให้ สวยงำม
15
เมื่อคลิกที่ _1 ด้ำนซ้ำยมือ จะเป็ นหน้ำที่ 3 ของแบบทดสอบ จะปรำกฏดังนี้
ซึ่งเป็ นโจทย์ขอ้ ที่ 1 และตัวเลือก ท่ำนสำมำรถแก้ไขโจทย์ โดยคลิกที่ ข้อควำมโจทย์ แล้วคลิกที่ แท็บ Text ด้ำนขวำมือ จะปรำกฏช่องให้พิมพ์ขอ้ ควำม ให้ท่ำนแก้ไขโจทย์ตำมต้องกำร
ในกำรแก้ไขข้อควำม ตัวเลือกในแต่ละตัวเลือกก็ทำำ เช่นเดียวกัน ให้ท่ำนเปลี่ยนให้เรี ยบร้อย
16
ขั้นตอนกำรแก้ไขปุ่ มตัวเลือก ให้ถูก หรื อผิด มีดงั นี้ ตรงปุ่ ม ก ข ค ง นั้น เรำสำมำรถใส่ สคริ ปให้ถูกหรื อผิดดังนี้ คลิกที่ปุ่ม ก และคลิกที่ แท็บ script จะปรำกฏดังนี้
ซึ่งจะมีขอ้ ควำม ดังนี้
ซึ่ งหมำยควำมว่ำ
เมื่อคลิกที่ปุ่มแล้ว ให้ค่ำ ของ n = n+0 (ข้อนี้ผิด) ถ้ำต้องกำรให้ขอ้ นี้ ถูกให้เปลี่ยน 0 เป็ น 1
คือ n = n +1 (ข้อถูก) แล้วคลิกที่แท็บ Layout เพื่อกลับไปหน้ำจอเดิม แล้วคลิกที่ ปุ่ ม ข ค และ ง แก้ไขให้ถูกผิดตำม ต้องกำรกำรแก้ไขทำำดังนี้ คลิกที่ n = n+0 จะปรำกฏ n = n+0 ตัวหนังสื อสี นำเงิ ้ ำ น ที่ช่อ ด้ำนล่ำงให้นำำ เมำส์ คลิก ลบ เลข 0 ออกพิมพ์เลข 1 แทน แล้วคลิกที่แท็บ Layout เพื่อกลับไปหน้ำจอ เดิม แล้วคลิกที่ ปุ่ ม ข ค และ ง แก้ไขให้ถูกผิดตำมต้องกำร
17
ใน Scene ที่_2 ถึง Scene ที่_9 ให้แก้ไขเหมือน Scene ที่_1 Scene ที่_13 เป็ น scene สรุ ปผลกำรเรี ยน ซึ่งจะสรุ ปดังนี้ แบบทดสอบทั้งหมด 10 ข้อ ถ้ำได้คะแนน 9- 10 อยูใ่ นระดับ ดีมำก คะแนน 7- 8 อยูใ่ นระดับ ดี คะแนน 5 -6 อยูใ่ นระดับผ่ำนเกณฑ์ คะแนนน้อยกว่ำ 5 อยูใ่ นระดับ ไม่ผำ่ นเกณฑ์
6. ให้ท่ำน เปลี่ยนสี พ้ืนหลัง ใส่รูปภำพ ตกแต่งให้สวยงำม
18
7. บันทึก การบันทึก บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล swi เพื่อใช้สำำ หรับในกำรแก้ไข 1.คลิกที่ File save as…จะปรำกฏ
2. พิมพ์ชื่อ ptest ลงในช่อง file name และเลือกโฟร์ เดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 3. คลิก save บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล html และ swf เพื่อให้เป็ นแฟ้ มข้อมูล สำำหรับเปิ ดใน โปรแกรมอินเทอร์ เนต คลิกที่ file export - html+swf จะปรำกฏ
4. สังเกตที่ช่อง file name จะมีชื่อ ptest.html อยูแ่ ล้ว 5.สังเกตที่ช่อง SAVE IN จะมีชื่อ โฟรเดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 5. คลิก save
19
6.กำรบันทึกทั้ง 2 ขั้นจะทำำให้ได้ แฟ้ มทั้งหมด 3 แฟ้ มคือ ptest.html ptest.swf ptest.swi การผลิตสื่อหน้ าแบบเนือ้ หาสาระ 1. ดับเบิลคลิกที่ ไฟล์ s.swi เพื่อสร้ำงสื่ อหน้ำเนื้ อสำระ
2. จะได้ดงั รู ป
3. โปรดสังเกตว่ำ ในแฟ้ ม s.swi นี้ จะประกอบด้วย scene ทั้งหมดจำำนวน 5 scene ซึ่งในเนื้ อหำสำระนี้จะประกอบด้วย เมนูต่ำงๆ คือ หน้ำหลัก จุดประสงค์ แบบทดสอบก่อนเรี ยน เนื้ อหำสำระ 1 เนื้อหำสำระ 2 เนื้อหำสำระ 3 เนื้อหำสำระ 4 แบบทดสอบหลังเรี ยน แหล่งอ้ำงอิง ระบบช่วยเหลือผูใ้ ช้ ผูจ้ ดั ทำำ และปุ่ ม ออกจำกบทเรี ยน ปิ ดเสี ยง เปิ ดเสี ยง และปุ่ มคลิก ไปหน้ำต่อไป และเมนูที่ตอ้ งเปลี่ยนชื่อตำมหัวข้อของเนื้ อหำมีอยู่ 4 หัวข้อหลัก คือในเมนู เนื้อหำสำระ 1 เนื้อหำสำระ 2 เนื้อหำสำระ 3 เนื้อหำสำระ 4
20
3.1 กำรเปลี่ยนข้อควำมในปุ่ ม คลิกที่ปุ่มเนื้ อหำสำระ 1 3.1.1 คลิกที่ scene 1 ด้ำนซ้ำยตรง outline ก่อน
คลิกตรงปุ่ มเมนู เนื้ อหำสำระ 1 จะสังเกตเห็นว่ำ outline ด้ำนซ้ำยจะคลี่ออกให้เห็นรำยละเอียดภำยใน ซีน และปุ่ ม S จะมีแถบสี นำเงิ ้ ำ นคลุมอยู่ แสดงว่ำ ปุ่ มเนื้ อหำสำระที่ 1 นี้มีชื่อว่ำ S ให้คลิกที่ เครื่ องหมำย + ด้ำนหน้ำปุ่ ม S
จะเห็นรำยละเอียดภำยในปุ่ ม S ดังนี้.........>
21
จะเห็นรำยละเอียดภำยในปุ่ ม S ดังนี้.........>
ให้คลิกที่ ข้อควำม ด้ำนล่ำง ของ_UP/HIT STATE และคลิก แท็บ text ด้ำนขวำ
คลิกลบข้อควำม เนื้ อหำสำระ 1 พิมพ์หวั ข้อเรื่ องของเรำลงไปแทน เพื่อเปลี่ยนข้อควำม จำกเนื้ อหำสำระ เป็ นข้อควำม หัวข้อเรื่ องของเรำ แล้วคลิกเปลี่ยนข้อควำมด้ำนล่ำง overatate และ downstate ให้เป็ นหัวข้อเรื่ องของเรำ ก็เป็ นอัน เสร็ จกำรเปลี่ยนข้อควำมในปุ่ ม จำกนั้นให้เปลี่ยนข้อควำมในปุ่ ม เนื้ อหำสำระ 2 เนื้อหำสำระ 3 และเนื้อหำสำระ 4 ให้เป็ นหัวข้อ เรื่ องของเรำให้เรี ยบร้อยทุกปุ่ ม ให้ท่ำนเปลี่ยนหัวข้อ พิมพ์เนื้ อหำสำระ เปลี่ยนสี พิน้ หลัง ใส่ รูปภำพ ตกแต่งให้สวยงำม
22
ให้ท่ำนเปลี่ยนข้อควำมปุ่ มในซีนที่ 2 ถึง ซีนที่ 5 และเพิ่มเนื้อหำสำระ ใส่ รูปภำพ ตกแต่งให้สวยงำมเมื่อ เรี ยบร้อย แล้วให้บนั ทึก และทดสอบว่ำโปรแกรมทำำงำนตำมที่ตอ้ งกำรหรื อไม่ 4. บันทึก การบันทึก บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล swi เพื่อใช้สำำ หรับในกำรแก้ไข 1.คลิกที่ File save as…จะปรำกฏ
2. พิมพ์ชื่อ S ลงในช่อง file name และเลือกโฟร์ เดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 3. คลิก save บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล html และ swf เพื่อให้เป็ นแฟ้ มข้อมูล สำำหรับเปิ ดใน โปรแกรมอินเทอร์ เนต คลิกที่ file export - html+swf จะปรำกฏ
4. สังเกตที่ช่อง file name จะมีชื่อ S.html อยูแ่ ล้ว 5.สังเกตที่ช่อง SAVE IN จะมีชื่อ โฟรเดอร์ soursecaiversion1.2 ที่สร้ำงไว้
23
5. คลิก save 6.กำรบันทึกทั้ง 2 ขั้นจะทำำให้ได้ แฟ้ มทั้งหมด 3 แฟ้ มคือ s.html s.swf s.swi 5.การทดสอบ ทำาดังนี้ คลิกที่ file test in browser
จะทดสอบด้วย โปรแกรม internet explorer กดปุ่ ม F11 เพื่อให้แสดงผลเต็มหน้าจอ
ทดสอบคลิกปุ่ ม ให้เลื่อนไป-กลับ ในแต่ละหน้ำพร้อม กับตรวจสอบ กำร แสดงผลของ เนื้อหำสำระไปด้วย
24
การผลิตสื่อหน้ าแบบทดสอบหลังเรียน 1. ดับเบิลคลิกที่ ไฟล์ potest.swi เพื่อสร้ำงสื่ อหน้ำแบบทดสอบหลังเรี ยน
2. จะได้ดงั รู ป
3. โปรดสังเกตว่ำ ในแฟ้ ม potest.swi นี้ จะประกอบด้วย scene ทั้งหมดจำำนวน 33 scene 3.1 เมื่อคลิกที่ _1 ด้ำนซ้ำยมือ จะเป็ นหน้ำแรกของแบบทดสอบ ซึ่งหน้ำนี้ จะทำำงำนคือให้พิมพ์ชื่อ ในช่อง สี ขำวด้ำนหลังข้อควำมชื่อ และให้พิมพ์นำมสกุลในช่อง สี ขำวด้ำนหลังข้อควำมนำมสกุล หน้ำนี้ให้ท่ำน เปลี่ยนสี พ้ืนหลัง สี ตวั อักษร ใส่ รูปภำพ ตกแต่งให้สวยงำม เมื่อคลิกที่ _2 ด้ำนซ้ำยมือ จะเป็ นหน้ำที่ 2 ของแบบทดสอบ จะปรำกฏดังนี้ หน้ำนี้ให้ท่ำนเปลี่ยนสี พื้นหลัง สี ตวั อักษร ใส่ รู ปภำพ ตกแต่งให้ สวยงำม
25
เมื่อคลิกที่ scene_1 ด้ำนซ้ำยมือ จะเป็ นหน้ำที่ 3 ของแบบทดสอบ จะปรำกฏดังนี้
ซึ่งเป็ นโจทย์ขอ้ ที่ 1 และตัวเลือก ท่ำนสำมำรถแก้ไขโจทย์ โดยคลิกที่ ข้อควำมโจทย์ แล้วคลิกที่ แท็บ Text ด้ำนขวำมือ จะปรำกฏช่องให้พิมพ์ขอ้ ควำม ให้ท่ำนแก้ไขโจทย์ตำมต้องกำร
ในกำรแก้ไขข้อควำม ตัวเลือกในแต่ละตัวเลือกก็ทำำ เช่นเดียวกัน ให้ท่ำนเปลี่ยนให้เรี ยบร้อย
26
ขั้นตอนการแก้ไขปุ่ มตัวเลือก ให้ ถูก หรือผิด มีดงั นี้ ตรงปุ่ ม ก ข ค ง นั้น เรำสำมำรถใส่ สคริ ปให้ถูกหรื อผิดดังนี้ คลิกที่ปุ่ม ก และคลิกที่ แท็บ script จะปรำกฏดังนี้
ซึ่งจะมีขอ้ ควำม ดังนี้
ซึ่ งหมำยควำมว่ำ เมื่อคลิกที่ปุ่มแล้ว ให้ค่ำ ของ n = n+0 (ข้อนี้ผิด) ถ้ำต้องกำรให้ขอ้ นี้ ถูกให้เปลี่ยน 0 เป็ น 1 คือ n = n +1 (ข้อถูก) แล้วคลิกที่แท็บ Layout เพื่อกลับไปหน้ำจอเดิม แล้วคลิกที่ ปุ่ ม ข ค และ ง แก้ไขให้ถูกผิดตำม ต้องกำรกำรแก้ไขทำำดังนี้ คลิกที่ n = n+0 จะปรำกฏ n = n+0 ตัวหนังสื อสี นำเงิ ้ ำ น ที่ช่องด้ำนล่ำงให้นำำ เมำส์ คลิก ลบ เลข 0 ออกพิมพ์เลข 1 แทน แล้วคลิกที่แท็บ Layout เพื่อกลับไปหน้ำจอเดิม แล้วคลิกที่ ปุ่ ม ข ค และ ง แก้ไขให้ถูกผิดตำมต้องกำร
27
การแก้ไขการแสดงของเสียง ในกำรแก้ไขข้อถูก-ผิดนอกจำกท่ำนจะแก้ไข ค่ำของ n แล้วยังต้องแก้ไขกำรแสดงของเสี ยงและซีนที่ ใช้แสดงผลถูกผิดด้วย ซึ่งแก้ไขได้ดงั นี้
ตรง playSound (“worng.mp3”); แสดงว่ำข้อนี้จะแสดงเสี ยง ผิดออกมำกถ้ำต้องกำรแก้ไขให้แสดง เสี ยง ถูกให้คลิก ตรงข้อควำม playSound (“worng.mp3”); จะปรำกฏ playSound อยูด่ ำ้ นล่ำงโปรแกรม และมีSound ให้เลือก
ให้ท่ำนคลิกเลือก right.mp3 แล้วใช้เมำส์คลิกที่วำ่ งๆ 1 ครั้ง right.mp3 จะไปปรำกฏแทนที่ worng.mp3
28
การแก้ไขให้ แสดงซีน ถูกหรือ ผิด gotoSceneAndPlay ขอให้ท่ำนสังเกตว่ำหลัง scene 1 ถึง scene10 จะปรำกฏซีน wrong ซีน right ทุกซีน ซึ่งหมำยควำมว่ำ ถ้ำตัวเลือก ข้อ ก ข ค ง ในข้อไหนที่ ถูก จะแสดง ซีน right ถ้ำตัวเลือก ข้อ ก ข ค ง ในข้อไหนที่ ผิด จะแสดง ซีน wrong ซึ่งเรำมีวธิ ี กำรแก้ไขดังนี้
ให้คลิกที่ gotoSceneAndPlay (“worng1”,1); จะปรำกฏ gotoSceneAndPlay อยูด่ ำ้ นล่ำงโปรแกรม และ มีtaget ให้เลือก ให้ท่ำนคลิกที่ เลือกให้แสดง ซีน ถูก -ผิด ได้ตำมต้องกำร เลือก worng1 กรณี ที่ขอ้ ที่1 ผิด เลือก right1 กรณี ที่ขอ้ ที่1 ถูก
เมื่อเลือกเรี ยบร้อยแล้วใช้เมำส์คลิกที่วำ่ งๆ 1 ครั้ง คำำสั่งที่เรำเลือก จะไปปรำกฏด้ำนบน ดังนี้ กรณีขอ้ ที่ถูก หมายเหตุ
worng1 คือ ผิดของข้อที่ 1 right1 คือ ถูกของข้อที่ 1 worng2 คือ ผิดของข้อที่ 2 กรณีขอ้ ที่ผิด
right2 คือ ถูกของข้อที่ 2 .... ... worng10 คือ ผิดของข้อที่ 10
29
ใน Scene ที่_2 ถึง Scene ที่_10 ให้แก้ไขเหมือน Scene ที่_1 Scene ที่_13 เป็ น scene สรุ ปผลกำรเรี ยน ซึ่งจะสรุ ปดังนี้ แบบทดสอบทั้งหมด 10 ข้อ ถ้ำได้คะแนน 9- 10 อยูใ่ นระดับ ดีมำก คะแนน 7- 8 อยูใ่ นระดับ ดี คะแนน 5 -6 อยูใ่ นระดับผ่ำนเกณฑ์ คะแนนน้อยกว่ำ 5 อยูใ่ นระดับ ไม่ผำ่ นเกณฑ์
4. ให้ท่ำน เปลี่ยนสี พ้ืนหลัง ใส่รูปภำพ ตกแต่งให้สวยงำม
30
5. บันทึก การบันทึก บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล swi เพื่อใช้สำำ หรับในกำรแก้ไข 1.คลิกที่ File save as…จะปรำกฏ
2. พิมพ์ชื่อ potest ลงในช่อง file name และเลือกโฟร์ เดอร์ soursecaiversion1.2 ที่สร้ำงไว้ 3. คลิก save บันทึกเป็ นแฟ้ มข้อมูลนำมสกุล html และ swf เพื่อให้เป็ นแฟ้ มข้อมูล สำำหรับเปิ ดใน โปรแกรมอินเทอร์ เนต คลิกที่ file export - html+swf จะปรำกฏ
4. สังเกตที่ช่อง file name จะมีชื่อ potest.html อยูแ่ ล้ว 5.สังเกตที่ช่อง SAVE IN จะมีชื่อ โฟรเดอร์ soursecaiversion1.2 ที่สร้ำงไว้
31
5. คลิก save 6.กำรบันทึกทั้ง 2 ขั้นจะทำำให้ได้ แฟ้ มทั้งหมด 3 แฟ้ มคือ potest.html potest.swf potest.swi 5.การทดสอบ ทำาได้ ดังนี้ คลิกที่ file test in browser
จะทดสอบด้วย โปรแกรม internet explorer กดปุ่ ม F11 เพื่อให้แสดงผลเต็มหน้าจอ
กรอกชื่อ นำมสกุล แล้วคลิก กดเพื่อยืนยัน
32
จะปรากฏหน้าแสดงข้อความยินดีตอ้ นรับ ให้คลิกที่ปุ่ม คลิกไปทำาแบบทดสอบ
จะปรากฏโจทย์ขอ้ ที่ 1
กรณี เลือกตอบข้อถูก จะปราฏข้อความ ถูกต้อง
กรณี เลือกตอบข้อผิด จะปราฏข้อความให้ พยายามใหม่
เมื่อคลิกคลิกต่อไป โปรแกรมจะไปสู่ขอ้ ต่อไป
33