การออกแบบคอร สแวร ourseware design...

36
บทนํา การออกแบบบทเรียนคอมพิวเตอร เปนขั้นตอนที่นําผลที่ไดจากการวิเคราะหขอมูลตาง ที่เกี่ยวของ ไดแก วัตถุประสงค เนื้อหา แบบฝกหัด แบบทดสอบ สวนของการจัดการบทเรียน และ สวนประกอบอื่น แลวนํามาออกแบบเปนตัวบทเรียน (Courseware) ผลลัพธที่ไดจากขั้นตอนนีจะไดบทดําเนินเรื ่อง (Storyboard) ผังงานของบทเรียน (Lesson Flowchart) และกลยุทธดานการ เรียนการสอน ซึ่งจะนําไปใชพัฒนาเปนบทเรียนคอมพิวเตอรโดยใชระบบนิพนธบทเรียนหรือใช ซอฟทแวรคอมพิวเตอรในขั้นตอนของการพัฒนาตอไป ในขั้นตอนนี้จึงเกี ่ยวของกับการดําเนินการ ตาง ดังนี1. การออกแบบหนาจอ (Screen Design) 2. มาตรฐาน (Standards) 3. การปฏิสัมพันธ (Interactivity) 4. การออกแบบขอคําถาม (Design of Question) 5. การตรวจปรับ (Feedback) 6. กิจกรรมการเรียนรู (Learning Activity) 7. การเลือกใชสื่อ (Media Selection) 8. การสรุปเนื้อหา (Review) 9. การเลือกวิธีการนําสงบทเรียน (Delivery Selection) 10. การออกแบบโครงสรางบทเรียน (Lesson Structure) 11. การลําดับการเรียนการสอน (Instructional Sequencing) 12. บทดําเนินเรื่อง (Storyboards) และผังงานบทเรียน (Lesson Flowchart) 13. การจัดการบทเรียน (Management) 14. การจัดทําเอกสารและการยอมรับ (Documentation and Acceptance) การออกแบบหนาจอ (Screen Design) หนาจอของบทเรียนคอมพิวเตอรเปนสวนที่ติดตอกับผูเรียนโดยตรง เนื่องจากผูเรียน ตองนั่งอยูหนาจอภาพของเครื่องคอมพิวเตอรตลอดเวลาที่ศึกษาบทเรียน ดังนั้น การออกแบบ หนาจอจึงมีความสําคัญที่จะตองคํานึงถึงองคประกอบตาง ที่มีผลกระทบตอผูเรียน เชน ความ 9 การออกแบบคอรสแวร Courseware Design

Upload: others

Post on 07-Feb-2020

0 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

บทนา การออกแบบบทเรยนคอมพวเตอร เปนขนตอนทนาผลทไดจากการวเคราะหขอมลตาง ๆ ทเกยวของ ไดแก วตถประสงค เนอหา แบบฝกหด แบบทดสอบ สวนของการจดการบทเรยน และสวนประกอบอน ๆ แลวนามาออกแบบเปนตวบทเรยน (Courseware) ผลลพธทไดจากขนตอนนจะไดบทดาเนนเรอง (Storyboard) ผงงานของบทเรยน (Lesson Flowchart) และกลยทธดานการเรยนการสอน ซงจะนาไปใชพฒนาเปนบทเรยนคอมพวเตอรโดยใชระบบนพนธบทเรยนหรอใชซอฟทแวรคอมพวเตอรในขนตอนของการพฒนาตอไป ในขนตอนนจงเกยวของกบการดาเนนการตาง ๆ ดงน 1. การออกแบบหนาจอ (Screen Design) 2. มาตรฐาน (Standards) 3. การปฏสมพนธ (Interactivity) 4. การออกแบบขอคาถาม (Design of Question) 5. การตรวจปรบ (Feedback) 6. กจกรรมการเรยนร (Learning Activity) 7. การเลอกใชสอ (Media Selection) 8. การสรปเนอหา (Review) 9. การเลอกวธการนาสงบทเรยน (Delivery Selection) 10. การออกแบบโครงสรางบทเรยน (Lesson Structure) 11. การลาดบการเรยนการสอน (Instructional Sequencing) 12. บทดาเนนเรอง (Storyboards) และผงงานบทเรยน (Lesson Flowchart) 13. การจดการบทเรยน (Management) 14. การจดทาเอกสารและการยอมรบ (Documentation and Acceptance) การออกแบบหนาจอ (Screen Design) หนาจอของบทเรยนคอมพวเตอรเปนสวนทตดตอกบผเรยนโดยตรง เนองจากผเรยนตองนงอยหนาจอภาพของเครองคอมพวเตอรตลอดเวลาทศกษาบทเรยน ดงนน การออกแบบหนาจอจงมความสาคญทจะตองคานงถงองคประกอบตาง ๆ ทมผลกระทบตอผเรยน เชน ความ

9 การออกแบบคอรสแวร Courseware Design

Page 2: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

236 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

ละเอยดในการแสดงผลของจอภาพ สพนหลง การเลอกใชส ขนาดของตวอกษร วธการปฏสมพนธ ความสะดวกในการใชงาน และความรวดเรวในการนาเสนอภาพ เปนตน นกคอมพวเตอรเชอวา ถาการออกแบบหนาจอของบทเรยนคอมพวเตอร สรางความประทบใจและชวนใหผเรยนตดตามบทเรยนแลว จะสงผลใหบทเรยนมประสทธภาพสงขน ซงสงผลไปยงผลสมฤทธทางการเรยนและคาความคงทนทางการเรยนของผเรยนใหมคาสงขนตามไปดวย การออกแบบหนาจอ จงเปนสวนสาคญทจะตองพจารณาในประเดนตาง ๆ ดงตอไปน 1. ความละเอยดของการแสดงผล (Resolution) 2. สวนของการแสดงผลบทเรยน (Instructional Display) 3. สวนของการควบคมบทเรยนของผเรยน (Student Control) รายละเอยด มดงน 1. ความละเอยดของการแสดงผล (Resolution) ความละเอยดของการแสดงผล เปนสวนทสาคญประการหนงของการออกแบบหนาจอของบทเรยนคอมพวเตอรทจะตองกาหนดขนกอนสวนอน ๆ เพอใชเปนขอบงคบพนฐานของบทเรยนทจะตองออกแบบภายใตการแสดงผลทระดบความละเอยดของภาพทปรากฏบนหนาจอ โดยวดความละเอยดเปนจานวนพกเซล (Pixel – Picture Element) ซงความละเอยดของการแสดงผลจะมความสมพนธกบความสามารถของเครองคอมพวเตอรทใชนาเสนอบทเรยน ไดแก ความสามารถของแผงวงจรแสดงผล (VGA Card) และสมรรถนะของจอภาพ ความละเอยดของการแสดงผลตามมาตรฐาน (Display Standard) กาหนดไวดงน

Display Format Resolution Color Sponsor Systems MDA CGA (Color Graphic Array) EGA (Enhanced Graphic Adapter) PGA Hercules MCGA VGA (Video Graphic Array) SVGA (Super Video Graphic Array) XGA (Extended Graphic Array) SXGA (Super Extended Graphic Array) UXGA (Ultra Extended Graphic Array)

720 x 350 320 x 200 640 x 350 640 x 480 729 x 348

720 x 400 T 320 x 200 G 720 x 400 T 640 x 480 G 800 x 600

1,024 x 768 1,280 x 1,024 1,600 x 1,200 1,600 x 1,280

2 (Text) 4 16 256 256 256 256 256 256+ 256+

+16.7 M +16.7 M +16.7 M +16.7 M

IBM IBM IBM IBM

Non-IBM - - - -

VESA - - - -

PC PC PC PC PC

PS/2 PS/2 PC PC PC PC PC PC PC

Page 3: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 237

ถากาหนดการแสดงผลภาพไวทระดบ VGA ท 640 x 480 พกเซล ทระดบสตา ๆ เชน 256ส บทเรยนทจะปรากฏหนาจอภาพกจะไมนาสนใจ เนองจากภาพหรอกราฟกจะมลกษณะหยาบ ไมสวยงาม แตถากาหนดความละเอยดไวสงเกนไป เชน ทระดบ XGA ท 1,024 x 768 พกเซล ทระดบสจรง 16.7 MillionColor กจะมผลตอขนาดความจของตวบทเรยน ทอาจจะมความจเกนกวาความจของซดรอมหนงแผน ซงมความจ 650 MB อกทงการประมวลผลภาพทมความละเอยดมาก ๆ เครองจะใชเวลาประมวลผลภาพชา อาจมผลทาใหการนาเสนอบทเรยนขาดชวงหรอภาพอาจเกดการกระตกได จงควรกาหนดไวทระดบปานกลาง เชน SVGA ท 800 x 600 พกเซล ทระดบสตงแต 32 KiloColor หรอ 64 KiloColor ซงในระดบนสามารถไดภาพทมคณภาพและใชงานกบเครองคอมพวเตอรทว ๆ ไปได โดยเฉพาะบทเรยนทนาเสนอผานเวบ เชน WBI/WBT หรอ e-Learning กตาม จะตองพจารณาความละเอยดในการแสดงผลภาพดวย เนองจากความเรวของเครอขายอนเทอรเนตอาจจะไมสงมากพอทจะนาเสนอภาพทมความละเอยดระดบสงมากได 2. สวนของการแสดงผลบทเรยน (Instructional Display) Roderics, Sims แหงมหาวทยาลยเทคโนโลยซดนย ไดยกคากลาวของ Heines เกยวกบการออกแบบหนาจอในสวนของการแสดงผลบทเรยนไววา ในหนาจอของบทเรยนคอมพวเตอรควรประกอบดวยสวนตาง ๆ จานวน 5 สวน ดงน

1. สวนของคาแนะนา (Orientation) ไดแก การนาเสนอชอเรอง หมายเลขเฟรม 2. สวนของผเรยนทจะตองเรยน (Directions) ไดแก ตวเนอหาบทเรยน กจกรรมการเรยน ในสวนน แบงออกเปน 2 สวน ดงน 2.1 เนอทแสดงภาพกราฟก (Graphic Area) ปกตจะอยทางซายมอของจอภาพ หรออาจจดไวตรงกลางโดยมขอความอยรอบ ๆ หรออยในสวนลางของภาพกได 2.2 เนอทแสดงขอความ (Text Area) ปกตจะอยทางขวามอของจอภาพ 3. สวนของการโตตอบจากผเรยน (Student Response) ไดแก คาตอบจากผเรยน การรวมกจกรรมของผเรยน 4. สวนของการปอนกลบและแสดงขอความผดพลาดจากบทเรยน (Feedback and Error Messages) ไดแก ขอความทแสดงการตรวจปรบจากบทเรยน รวมทงขอผดพลาดทเกดขนจากการใชบทเรยน 5. สวนของทางเลอกผเรยน (Student Options) ไดแก สวนของการควบคมบทเรยน รวมทงคาแนะนาตาง ๆ ในการใชบทเรยน ตาแหนงการจดหนาจอของสวนประกอบทง 5 สวนดงกลาว ไมใชขอกาหนดตายตวแตอยางใด ผออกแบบบทเรยนสามารถสรางสรรคและจดวางตาแหนงตาง ๆ ไดตามความตองการ โดยยดสวนประกอบทง 5 นเปนหลก อยางไรกตามแมวาจะสามารถจดวางตาแหนงไดตามความตองการ แตมองคประกอบในการจดภาพพนฐานทผออกแบบควรจะตองพจารณา ไดแก จด

Page 4: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

238 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

ศนยกลางของสายตา (Optical Center) และทศทางการมองของสายตา หรอ Eye Flow ซงปกตโดยทวไปจะมลกษณะคลายตว Z (Z-like Pattern) ซงเปนทศทางการนาเสนอทดงดดความสนใจมากทสด ดงนน สวนใดทมความสาคญหรอเปนจดเนนจงควรจดวางไวตรงกลางของจอภาพหรออยในเสนทศทางการมองของสายตา

ภาพท 9-1 แสดงสวนประกอบของสวนการแสดงผลบทเรยน

ภาพท 9-2 จดศนยกลางของสายตาและทศทางการมองของสายตา (Z-Like Pattern)

X

Eye Flow

Optical Center

Eye Flow

Next Back Quit Help

This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen This Area is for Text Display on Screen

Graphic Area

Student Options

Feedback and Error Messages

Press <Enter> to study information…

Frame 20 of 125 Title : This is a Lesson Title

Student Response

Orientation Directions Orientation

Page 5: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 239

3. สวนของการควบคมบทเรยนของผเรยน (Student Control) เปนสวนของการควบคมการนาเสนอบทเรยนของผเรยน สวนนผออกแบบบทเรยนจะตองคานงถงความสมพนธระหวางเนอหากบการออกแบบหนาจอ โดยทวไปสวนของการควบคมบทเรยน สามารถจาแนกได 3 แบบ ดงน 3.1 การใชรายการใหเลอก (Menu) เปนสวนของการควบคมบทเรยนทมลกษณะเปนรายการใหเลอกรายขอ ซงจะพบในสวนของรายการใหเลอกบทเรยนทเปดโอกาสใหผเรยนเลอกได สวนของการนาเสนอคาถามหรอการนาเสนอเนอหาทมการแบงรายการเปนขอ ๆ จดวาเปนรปแบบทผเรยนมความคนเคยมากทสด เนองจากงายตอการปฏสมพนธในการควบคมบทเรยน

ภาพท 9-3 การใชรายการใหเลอก (Menu) ในการควบคมบทเรยน 3.2 การใชวธแสดงเนอหาตามลาดบ (Display Sequencing) เปนการนาเสนอเนอหาทตอเนองกน การควบคมบทเรยนจงใชในสวนของทางเลอกบทเรยน (Student Options) เพอใหผเรยนมปฏสมพนธในการควบคมบทเรยน 3.3 การใชวตถ (Object) ไดแก รปภาพ สญรป กราฟก หรอวตถใด ๆ ทอาจเปนสวนหนงของภาพในการเขาถงบทเรยน โดยทางานในลกษณะของ Hot Spot หรอ Hot Object สามารถควบคมบทเรยนไดโดยวธการคลกเมาสหรอวธเลอนเมาสไปอยบนวตถนน ๆ แลวคลกทวตถดงกลาว กจะสามารถเขาถงเนอหาบทเรยนได ซงเปนการควบคมบทเรยนอกวธหนงทนยมใชกนในการออกแบบบทเรยนคอมพวเตอร

Menu

1. This is a Choice Number One

2. This is a Choice Number Two 3. This is a Choice Number Three

4. This is a Choice Number Four

5. This is a Choice Number Five

EXIT

< Click the button as you wish to study >

Page 6: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

240 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

ภาพท 9-4 การใชวธแสดงเนอหาตามลาดบในการควบคมบทเรยน

ภาพท 9-5 การใชวตถในการควบคมบทเรยนในลกษณะ Hot Spot หรอ Hot Object

NEXT

BACK

EXIT

Display Sequencing on Student Control Display Sequencing on Student Control Display Sequencing on Student Control Display Sequencing on Student Control Display Sequencing on Student Control Display Sequencing on Student Control Display Sequencing on Student Control Display Sequencing on Student Control Display Sequencing on Student Control Display Sequencing on Student Control

Title : This is a Lesson Title

Frame 1 of 20

1

2

3

4

Camera

Casette Tape

CRT

Slade

< Move mouse over any image and click it to study the lesson >

Video Production Equipment

EXIT

Title : This is a Lesson Title

Frame 1 of 20

Page 7: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 241

มาตรฐาน (Standards) มาตรฐานของบทเรยนคอมพวเตอรมความสาคญไมนอยกวาดานอน ๆ ซงจะสงผลถงระดบคณภาพของบทเรยน การออกแบบคอรสแวรหรอตวบทเรยนจงตองคานงถงมาตรฐานทก ๆ สวน นบตงแตการออกแบบหนาจอ การออกแบบเทมเพลท การเลอกใชส การเลอกใชรปแบบตวอกษร และการเลอกสพนหลง เปนตน ในการเลอกใชสเพอใหเปนมาตรฐานนน Nigel Harrison ไดใหหลกการกวาง ๆ เกยวกบการเลอกใชสไวดงน 1. ใชสสอความหมายเดยวกนตลอดบทเรยน ไมเปลยนแปลง 2. ใชสพนหลงโทนออน เชน สขาว สเทาออน สฟาออน 3. ใชสทตดกนระหวางพนฉากหลงกบตวหนงสอ 4. ไมควรใชสเกน 4 สในแตละหนาจอ ยกเวนการนาเสนอภาพกราฟก 5. ไมควรใชสรอน เพราะจะทาใหเกดการระคายเคองตอสายตาเมอดไปนาน ๆ 6. หลกเลยงการใชสทสวางมากเกนไป เชน สสะทอนแสง สาหรบมาตรฐานสวนอน ๆ ไดแก 1. มาตรฐานของการออกแบบหนาจอ (Screen Design) 2. มาตรฐานของการเชอมโยงกบผเรยน (User Interface) 3. มาตรฐานงานเอกสาร (Documentation) รายละเอยด มดงน 1. มาตรฐานของการออกแบบหนาจอ (Screen Design) บทเรยนคอมพวเตอรเรองหนง ๆ ไมวาจะเปน CAI/CBT, WBI/WBT หรอ e-Learning กตาม จะประกอบดวยหนาจอเปนจานวนมาก ไดแก หนาจอนาเสนอชอเรองบทเรยน หนาจอรายการใหเลอก หนาจอนาเสนอเนอหา หนาจอคาถาม หนาจอกราฟก หนาจอสวนชวยเหลอ หนาจอใหขอมลยอนกลบ หนาจอสรปบทเรยน และหนาจออน ๆ ซงหนาจอทกสวน ผออกแบบจะตองกาหนดใหเปนมาตรฐานเดยวกนตลอดทงบทเรยน ทงนเพอใหผเรยนเกดความคนเคยขณะศกษาบทเรยน บทเรยนทมมาตรฐานจะตองมเอกลกษณในการออกแบบหนาจอ โดยมแนวทางการออกแบบสอดคลองและกลมกลนกนตลอดทงบทเรยน หนาจอสวนนจะตองออกแบบไวกอน หลงจากนนจงนามาประกอบเขากบเนอหาสรางเปนบทเรยนแตละเฟรม จงเรยกหนาจอสวนนวา เทมเพลท (Templates) ซงปจจบนมแหลงเทมเพลทใหเลอกบนเครอขายอนเทอรเนตมากมาย ทงทเสยคาใชจายและใหบรการดาวนโหลดไดโดยไมมคาใชจายใด ๆ จงพบวามบทเรยนคอมพวเตอรสวนหนงทใชบรการจากเทมเพลทเหลาน

Page 8: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

242 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

ภาพท 9-6 ตวอยางเทมเพลท (Template) ทจะตองมในบทเรยนคอมพวเตอร 2. มาตรฐานของการเชอมโยงกบผเรยน (User Interface) การเชอมโยงกบผเรยน (User Interface) ไดแก การใชเมาสคลก การลากเมาสผาน การใช สญรป การใชแปนพมพ การใชรายการใหเลอก หรอการปฏสมพนธลกษณะอน ๆ ซงเรยกรวมวาเปน WIMP (Windows, Icon, Mouse and Pull-down Menu) เปนสวนทสนบสนนใหผเรยนมปฏสมพนธกบบทเรยน ทตองคงความเปนมาตรฐานเหมอนกนตลอดทงบทเรยนเชนกน เพอสรางความคนเคยใหกบผเรยนในการมปฏสมพนธทเกดขนอยางตอเนอง แมวาบางสวนของบทเรยนจะสามารถกาหนดการเชอมโยงไดหลายวธ เชน แบบทดสอบ ซงจาแนกออกเปนหลายประเภททงแบบเลอกตอบ แบบเตมคา แบบจบค หรอแบบถกผด แตกตองเปนมาตรฐานเดยวกนในการเชอมโยงกบผเรยน เชน สญรปทใช ปมสาหรบการปฏสมพนธ เครองหมายทใชเชอมโยง หรอสวนอน ๆ ทออกแบบไวสาหรบการเชอมโยง รวมถงสวนสาหรบควบคมทางเลอกบทเรยน

Title

Title Information

Menu

Menu

Information

Graphic Question

Help

Help

1. Text 2. Text 3. Text 4. Text

Graphic

Review

Review

Question

End

End Feedback

Feedback

Page 9: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 243

(Student Options) ไดแก ปม Next, Back, Quit, Exit, Help หรอปมอน ๆ กจะตองใชเหมอนกนตลอดทงบทเรยน นอกจากนยงตองพจารณาถงตาแหนงการจดวางปมเหลานดวยทจะตองอยในตาแหนงเดยวกนทกเทมเพลท 3. มาตรฐานงานเอกสาร (Documentation) งานเอกสาร ไดแก คมอการใชงาน คาแนะนาในการตดตง และคมอในการบารงรกษา จดวาเปนองคประกอบทมความสาคญตอการพฒนาบทเรยนคอมพวเตอรเชนกน โดยเฉพาะอยางยงการพฒนาบทเรยนตามความตองการของลกคาทมขอตกลงกนกอน การยดถอมาตรฐานของงานเอกสารจงมความสาคญไมนอยกวาองคประกอบอน ๆ นอกจากจะมสวนประกอบเนอหาครอบคลมตามลกษณะงานของเอกสารนน ๆ แลว ยงตองมรปแบบการจดการเอกสารทด มความสะดวกตอการคนควาและใชงานงาย การปฏสมพนธ (Interactivity) การปฏสมพนธของบทเรยน มความสมพนธกบกระบวนการนาเสนอเนอหาบทเรยนโดยตรง องคประกอบทมผลตอสวนนไดแก ผเรยน บทเรยน และคอมพวเตอร โดยทวไปการปฏสมพนธจะเกดจากการทผเรยนตอบคาถามบทเรยนแลวไดรบการตรวจปรบคาตอบจากบทเรยน แตการปฏสมพนธไมไดจากดอยเพยงแคนน การรวมกจกรรมระหวางบทเรยน เชน การคลกเมาสเพอศกษารายละเอยดของเนอหา หรอการจบคคา 2 คาทมความหมายอยในกลมเดยวกน กจดวาเปนการปฏสมพนธดวยเชนกน จงกลาวไดวาการปฏสมพนธเกดขนตลอดเวลาในกระบวนการเรยนรดวยบทเรยนคอมพวเตอร นอกจากปจจยตาง ๆ ทง 3 สวน อนไดแก ผเรยน บทเรยน และคอมพวเตอร ทมผลตอ การออกแบบในสวนของการปฏสมพนธแลว ยงจาเปนตองพจารณาความสามารถของระบบนพนธบทเรยนทใชพฒนาบทเรยน ดงนน การออกแบบในสวนของการปฏสมพนธจงเปนการพจารณาระหวางผออกแบบบทเรยนกบโปรแกรมเมอร ทจะรวมกนสรางสรรคการปฏสมพนธใหนาสนใจ การปฏสมพนธของบทเรยนคอมพวเตอร แบงออกได 3 แนวทางดงน 1. การปฏสมพนธทเกดจากคอมพวเตอร (Computer Generated Interactions) 2. การปฏสมพนธทเกดจากผเรยนเรม (Learner Initiated Interactions) 3. ทางเลอกเพอชวยเหลอ (Help Options) รายละเอยด มดงน 1. การปฏสมพนธทเกดจากคอมพวเตอร (Computer Generated Interactions) การปฏสมพนธทเกดจากคอมพวเตอร เปนสวนทเกดจากสมรรถนะของคอมพวเตอรและความสามารถของระบบนพนธบทเรยนทใชพฒนาบทเรยนคอมพวเตอรเปนหลก เปนการท

Page 10: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

244 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

บทเรยนหรอคอมพวเตอรสรางเงอนไขใหผเรยนมปฏสมพนธกบบทเรยนในลกษณะตาง ๆ เชน สงใหคลกเมาสเลอกคาตอบ สงใหยายวตถ หรอรอคอยคาตอบจากการกดแปนพมพ เปนตน โดยใชความสามารถของระบบนพนธบทเรยนเปนหลก ซงปจจบนระบบนพนธบทเรยนมกสนบสนนการปฏสมพนธทหลากหลายรปแบบ นบตงแตการสรางปมเพอใชเมาสคลก การสรางปมเพอใชเมาสลากผาน และการกาหนดพนทวตถสาหรบคลกเมาส รวมไปถงการปอนตวอกษรหรอตวเลขของแปนพมพ หรอการปอนขอความยาว ๆ ในลกษณะของการตอบคาถามแบบอตนย การออกแบบบทเรยนสวนน จงเปนการพจารณาถงการปฏสมพนธทบทเรยนมตอผเรยนในลกษณะตาง ๆ ตงแตตนจนจบบทเรยน โดยทในแตละบทเรยนควรสรางสรรคใหมการปฏสมพนธทหลากหลาย เพอลดความเบอหนาย โดยเฉพาะผเรยนระดบเดกเลก ตวอยางการปฏสมพนธทเกดจากคอมพวเตอร มดงน 1. ปมกดใหเลอก (Button) เปนปมทสรางขนสาหรบการปฏสมพนธทวไป เชน รายการใหเลอก (Menu) 2. พนทใหเลอก (Hot Spot) เปนพนททกาหนดขนสาหรบคลกเมาสเพอการปฏสมพนธ เชน รายการใหเลอก คาถามแบบปรนย 3. วตถใหเลอก (Hot Object) เปนวตถหรอภาพทมอย โดยกาหนดใหสามารถปฏสมพนธไดโดยการคลกเมาสทวตถนน ๆ เชน การปฏสมพนธกบสวนประกอบตาง ๆ ของวตถเพอเขาถงเนอหา 4. พนทเปาหมาย (Target Area) เปนพนทเปาหมายทกาหนดไวบนหนาจอ เพอใหมการปฏสมพนธไปได 5. รายการใหเลอกแบบเลอนลง (Pull-down Menu) เปนการปฏสมพนธแบบรายการใหเลอกลกษณะเลอนลง ใชในการนาเสนอเนอหาทมเนอความยาว ๆ 6. ปอนขอความ (Text Entry) เปนการปฏสมพนธโดยการปอนตวอกษรหรอขอความทางแปนพมพตามทบทเรยนตองการ เชน คาถามแบบอตนย 7. กดแปนพมพ (Keypress) เปนการกาหนดอกขระใด ๆ บนแปนพมพเพยง 1 ตวอกษร เพอการปฏสมพนธ เชน กด Y เพอยนยนวาใช (Yes) 8. การปฏสมพนธแบบมเงอนไข (Conditional Interactivity) เปนการกาหนดเงอนไขในการปฏสมพนธ โดยใชหลกตรรกศาสตร ไดแก 8.1 กาหนดจานวนครงของการปฏสมพนธ (Tries Limit) เชน การตอบคาถาม หรอการทาขอสอบทระบไววาตอบผดไดไมเกน 2 ครง เปนตน 8.2 กาหนดระยะเวลาของการปฏสมพนธ (Time Limit) เชน แบบทดสอบแบบวดความเรว 8.3 กาหนดเหตการณของการปฏสมพนธ (Event)

Page 11: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 245

2. การปฏสมพนธทเกดจากผเรยนเรม (Learner Initiated Interactions) การปฏสมพนธทเกดจากผเรยนเรม เปนการปฏสมพนธอกขนหนงทเกดจากการรองขอของผเรยน เชน คาถามของผเรยนเพอใหบทเรยนแสดงรายละเอยดเนอหาทเกยวของ โดยสวนใหญเปนบทเรยนคอมพวเตอรระดบสง ทบทเรยนสามารถสรางสรรคเนอหาบทเรยนไดตามความประสงคของผเรยน การออกแบบบทเรยนในระดบนจะตองวนจฉยความตองการของผเรยนอยางละเอยด หลงจากนนจงทาการสงเคราะหเนอหาบทเรยนเพอบนทกไวในฐานขอมล บทเรยนประเภทนจงมเนอหาเปลยนแปลงได (Dynamic Information) เพอใหบทเรยนสนองตอบตอความตองการของผเรยนไดอยางแทจรง 3. ทางเลอกเพอชวยเหลอ (Help Options) ทางเลอกเพอชวยเหลอ จดวาเปนการปฏสมพนธอกลกษณะหนงทมความสาคญตอการออกแบบบทเรยนไมนอยกวาสวนอน ๆ เนองจากบทเรยนคอมพวเตอรถกออกแบบขนมาเพอใหผเรยนใชงานโดยลาพง เมอพบขอผดพลาดไมสามารถศกษาบทเรยนตอได กอาจจะสรางปญหาใหกบผเรยนได ถาไมมทางเลอกเพอชวยเหลอผเรยน ดงนน บทเรยนคอมพวเตอรทกเรองจงตองออกแบบสวนชวยเหลอไวดวย เมอผเรยนเกดปญหาใด ๆ กจะสามารถปฏสมพนธเพอเขาถงขอมลของการชวยเหลอได ปกตทางเลอกเพอชวยเหลอของบทเรยนคอมพวเตอรสวนใหญมกจะใชการปฏสมพนธโดยวธการคลกเมาสทปม Help Kearsley ไดจาแนกทางเลอกเพอชวยเหลอออกเปน 4 รปแบบ ดงน (Kearsley. 1988) 1. รายการชวยเหลอทใหขอมลคงท (Fixed Format Help) เปนขอความหรอคาชแจงสาหรบชวยเหลอผเรยนทมขอความคงทตลอด ทนททผเรยนมปฏสมพนธกบปม Help ขอความกจะปรากฏขนในสวนของหนาจอทออกแบบไว ไมวาจะมปฏสมพนธกครงกจะไดขอความเดมทกครงไมเปลยนแปลง รายการชวยเหลอแบบนจงออกแบบไดงายกวาแบบอน ๆ 2. รายการชวยเหลอทสมพนธกบขอมล (Context Sensitive Help) เปนรายการชวยเหลอทสมพนธกบเนอหาบทเรยนในตาแหนงทผเรยนกาลงศกษาอย ทนททผเรยนรองขอ ขอความกจะปรากฏขน ซงสมพนธกบเนอหาทเปนปจจบน เชน ถาผเรยนกาลงทาแบบทดสอบ ตองการความชวยเหลอ ทนททคลกเมาสทปม Help ขอความทเกยวกบการทาแบบทดสอบกจะปรากฏขน 3. รายการชวยเหลอทใหขอมลทนท (Prompt Help) หรอ รายการชวยเหลอแบบออนไลน (On-line Help) รปแบบนมสวนคลายกบรปแบบท 2 เพยงบทเรยนจะเปนตวสรางคาชแจงขนมาอยางอตโนมต โดยทผเรยนไมตองรองขอแตประการใด ทนททผเรยนตอบคาถามผด กจะไดรบคาขอความชแจงขนมาทนท เชน บทเรยนตองการรบขอมลทเปนตวเลข หากปอนตวอกษร กจะเกดขอความชวยเหลอทนท 4. รายการชวยเหลอทตอบขอคาถามระดบลก (Query-in-dept Help) เปนรายการ ชวยเหลอทอยในรปของฐานขอมล ขอความทปรากฏขนเพอชแนะ จะเกดจากคาถามของผเรยน

Page 12: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

246 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

ซงอาจเปนขอคาถามระดบลก เชน ปญหาทางดานเทคนคตาง ๆ หรอคาอภธานศพท (Glossary) ซงปรากฏอยในบทเรยนคอมพวเตอรทางดานวทยาศาสตรและเทคโนโลยเปนสวนใหญ การออกแบบขอคาถาม (Design of Question) ขอคาถามทใชในบทเรยนคอมพวเตอร ไดแก แบบทดสอบกอนบทเรยน แบบฝกหดระหวางบทเรยน และ แบบทดสอบหลงบทเรยน ทไดทผานการหาคณภาพมาแลว ในขนนจะเปนการออกแบบขอคาถาม รวมทงกาหนดพนทหนาจอใหสอดคลองกบชนดของขอคาถามทใช แมวาแบบทดสอบทใชในบทเรยนคอมพวเตอรสวนใหญจะเปนแบบเลอกตอบกตาม แตกมบทเรยนคอมพวเตอรบางประเภททเลอกใชแบบทดสอบชนดอน ๆ เชน แบบจบค แบบถก-ผด โดยเฉพาะบทเรยนคอมพวเตอรสาหรบเดกเลก จะใชแบบทดสอบหลายชนดผสมกน เพอกระตนใหผเรยนทาแบบทดสอบดวยความสนใจ การออกแบบขอคาถาม จะสมพนธกบความสามารถของระบบนพนธทเลอกใชพฒนาบทเรยน อยางไรกตามระบบนพนธในปจจบนนสวนใหญลวนสนบสนนการสรางแบบทดสอบทกชนด การออกแบบในสวนนจงเกยวกบองคประกอบ 3 สวน ดงน 1. ชนดของขอคาถามทเลอกใช (Question Types) 2. การกาหนดพนทหนาจอ (Screen Design) 3. การจดการกบคาถาม (Question Management) รายละเอยด มดงน 1. ชนดของขอคาถามทเลอกใช (Question Types) แบบทดสอบแบงออกได 2 ชนดใหญ ๆ คอ แบบอตนย และแบบปรนย แบบทดสอบอตนย แบงออกเปน 4 ชนด ไดแก แบบตอบสน ๆ แบบจบค แบบถก-ผด และแบบเลอกตอบ แตละแบบมขอดและขอเสยแตกตางกนไป ในขนนจงเปนการพจารณาชนดของขอคาถามทเลอกใช เพอนามาออกแบบเปนแบบทดสอบสาหรบบทเรยนคอมพวเตอร ซงชนดของขอคาถามสวนใหญจะเปนแบบเลอกตอบ เนองจากงายตอการสอบ และการตรวจผล รวมทงยงสามารถสมคาถามและคาตอบไดดวย 2. การกาหนดพนทหนาจอ (Screen Design) หนาจอทใชนาเสนอแบบทดสอบแตกตางจากหนาจอนาเสนอเนอหา เนองจากตองออกแบบพนทสาหรบใหผเรยนมปฏสมพนธ รวมทงพนทสาหรบใหบทเรยนตรวจปรบคาตอบแกผเรยนดวย โดยมหลกการอยวา ทกครงทผเรยนตอบคาถาม บทเรยนจะตองตรวจปรบทกครง ไมวาคาตอบของผเรยนจะถกหรอผดกตาม เพอยาความเขาใจใหกบผเรยนกรณทตอบถกและเพอตรวจปรบคาตอบทถกตองในกรณทตอบผด โดยทวไปการนาเสนอแบบทดสอบทใชในบทเรยนคอมพวเตอร

Page 13: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 247

มอย 2 ลกษณะ ไดแก นาเสนอหนาจอละหนงขอ และนาเสนอหนาจอละหลายขอ ทงนขนอยกบผออกแบบบทเรยนวาตองการออกแบบคาถามลกษณะใด ถาหากนาเสนอหนาจอละขอกแสดงวาจะไมเปดโอกาสใหผเรยนเปลยนแปลงคาตอบ แตถานาเสนอหนาจอละหลาย ๆ ขอกแสดงวาเปดโอกาสใหผเรยนเปลยนแปลงคาตอบได จนกวาจะกดปมใด ๆ เชน Enter, Submit, Send หรอปมพเศษอน ๆ เพอสงคาตอบของผเรยนไปตรวจคาตอบกบเฉลยของบทเรยน การนาเสนอแบบทดสอบหนาจอละหนงขอ แตละหนาจอจะแบงออกเปน 4 สวน ดงน 1. พนทนาเสนอขอคาถามและคาตอบ (Question Area) ไดแก สวนทนาเสนอขอคาถามรวมทงรปประกอบ (ถาม) และคาตอบ 2. พนทสาหรบผเรยนมปฏสมพนธ (Response Area) ไดแก สวนทใชสาหรบผเรยนตอบคาถาม (หากเปนแบบเตมคาตอบ) 3. พนทสาหรบตรวจปรบความเขาใจ (Feedback Area) ไดแก สวนทใชเฉลยคาตอบหรอนาเสนอขอความตรวจปรบความเขาใจ รวมทงคาแนะนาตาง ๆ 4. พนทอน ๆ เชน รายงานผลคะแนน แสดงสถตการตอบคาถาม

ภาพท 9-7 การกาหนดพนทหนาจอในการนาเสนอแบบทดสอบหนาจอละหนงขอ

This is a Question on Multiple Choice Type ?

Feedback Area

Please select the best choice (A – E) …..

Question No. 4 of 10 Title : This is a Lesson Title

Response Area Question Area

A. Ant, Ant and Ant B. Bird, Bird and Bird C. Cat, Cat and Cat D. Dog, Dog and Dog E. Elephant, Elephant and Elephant

Score : 3 Next Back Quit Help

Page 14: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

248 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

ภาพท 9-8 การกาหนดพนทหนาจอในการนาเสนอแบบทดสอบหนาจอละหลายขอ 3. การจดการกบขอคาถาม (Question Management) เปนการจดการเกยวกบผลลพธทไดจากทผเรยนตอบคาถามหรอทาแบบทดสอบ แบงเปน 2 สวน ไดแก การคดคะแนน (Scoring) และการบนทกผลคะแนน (Record Keeping) การคดคะแนน (Scoring) ผออกแบบบทเรยนจะตองพจารณาอยางรอบคอบวาจะคดคะแนนอยางไร แตละขอมคะแนนเทาไร ผเรยนสามารถตอบคาถามไดเพยงครงเดยวหรอหลายครง การตอบครงตอ ๆ ไปมผลตอคะแนนหรอไม คะแนนรวมมผลตอการเรยนในหวขอถดไปหรอไม หากเปนบทเรยนแบบสาขาทมผลตอการเรยน ถาผเรยนทาแบบทดสอบไมผานเกณฑ ผออกแบบบทเรยนอาจจะออกแบบใหบทเรยนกลบไปยงเนอหาทเกยวของ หรอ นาเสนอเนอหาเพมเตมเพอสรางความเขาใจเพมขนกได ในสวนนยงรวมถงการออกแบบวธการรายงานผลคาตอบแกผเรยน โดยแจงเปนผลคะแนนใหปรากฏทหนาจอ พรอมทงมเสยงแสดงความยนดเพอเสรมกาลงใจ (Reinforcement) แตมขอควรคานงกคอไมควรใชเสยงในเชงตาหนเมอผเรยนตอบผด เนองจากผเรยนจะไมกลาตอบคาถามในขอตอ ๆ ไป ในสวนของการบนทกผลคะแนน (Record Keeping) เปนการจดการบนฐานขอมลเพอเกบบนทกผลคะแนนทผเรยนทาได ทจะตองออกแบบใหสมพนธกบการคดคะแนน รวมทงการรายงาน

Quit Help

1. This is a Question Number One ? A. Ant B. Bird C. Cat D. Dog 2. This is a Question Number Two ? A. Ant B. Bird C. Cat D. Dog 3. This is a Question Number Three ? A. Ant B. Bird C. Cat D. Dog 4. This is a Question Number Four ? A. Ant B. Bird C. Cat D. Dog 5. This is a Question Number Five ? A. Ant B. Bird C. Cat D. Dog 6. This is a Question Number Six ? A. Ant B. Bird C. Cat D. Dog 7. This is a Question Number Seven ? A. Ant B. Bird C. Cat D. Dog 8. This is a Question Number Eight ? A. Ant B. Bird C. Cat D. Dog

Question Title : This is a Lesson Title

Question Area

Score :

Submit the Answer

Score Checking

Page 15: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 249

ผลลพธขนสดทายหลงจบบทเรยน โดยอาจจะแสดงสถตเปรยบเทยบกบผเรยนคนอน ๆ ทไดศกษาบทเรยนนนมากอน สาหรบบทเรยนคอมพวเตอรชวยฝกอบรม มกนยมออกแบบใหสวนนมการออกใบประกาศนยบตรใหกบผเรยนดวย เมอผเรยนทาคะแนนผานเกณฑทตงไว โดยพมพประกาศนยบตรหรอวฒบตรออกทางเครองพมพ สามารถนาไปใชอางองได การตรวจปรบ (Feedback) จดมงหมายหลกของการตรวจปรบ (Feedback) กคอ เพอตรวจสอบและปรบใหผเรยนมความเขาใจในเนอหาตลอดบทเรยนตามวตถประสงคทกาหนดไว นอกจากนยงชวยยาความเขาใจในเนอหาเพอเพมความสนใจ ดงนน การตรวจปรบจงมความจาเปนสาหรบบทเรยนอยางยง ซงสรปไดดงน 1. เพอตรวจสอบความเขาใจของผเรยน รวมทงปรบความเขาใจหากผเรยนยงไมเขาใจใน เนอหาบทเรยนอยางเพยงพอ 2. เพอกระตนความสนใจของผเรยนใหตดตามบทเรยน ตลอดระยะเวลาทดาเนนบทเรยน 3. เพอสงเสรมการเรยนดวยความเขาใจ โดยการเปดโอกาสใหผเรยนมกจกรรมรวมใน บทเรยนมากขน 4. เพอชวยใหผเรยนมโอกาสทบทวนความเขาใจ ในเนอหาบทเรยนทไดศกษามาแลวอกครงหนงและการตรวจปรบจะชวยใหผเรยนไดประเมนผลการเรยนรของตนเองอกทางหนงดวย การตรวจปรบ ประกอบดวยองคประกอบทสาคญ ดงน 1. การตรวจ (Check) คอ การตรวจสอบผเรยนวามความเขาใจในเนอหาหรอไม โดยการใชคาถาม ทาขอสอบ หรอใชวธการอน ๆ 2. การปรบ (Adjust) คอ การปรบเนอหาหรอปรบความรในเนอหาตาง ๆ ทผเรยนไมเขาใจ หลงจากทไดตรวจแลว การออกแบบการตรวจปรบ มขอพจารณาดงน 1. การตรวจพฤตกรรมผเรยน โดยกระทาหลาย ๆ ลกษณะ ดงน 1.1 สอบถามผเรยนเกยวกบสงทศกษา เชน การทบทวน ถามการนาไปใชงาน 1.2 ใหผเรยนทากจกรรมตาง ๆ ในระหวางการดาเนนการเรยนร เชน สรปเนอหา 1.3 ใหผเรยนแกปญหาโจทย เชน ขอสอบ ใบงาน 2. การปรบความเขาใจ กระทาภายหลงจากทมการตรวจพฤตกรรมของผเรยนเมอพบวามปญหา โดยกระทาหลาย ๆ ลกษณะดงน 2.1 ใหเนอหาเรองเดมอกครงหนง เพอเปนการยาความเขาใจ 2.2 ใหเนอหาอกครงโดยเปลยนรปแบบการนาเสนอใหม เชน การแยกแยะโดยใหรายละเอยดเพมขน 2.3 ใหตวอยางหรออปกรณชวยสอนเพมขนจากเดม

Page 16: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

250 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

2.4 สรปเนอหาใหเหนเปนประเดน ๆ หรอเปนจดสาคญมากขน 2.5 แยกกลมผเรยนทมปญหาออกมาเพอใชวธการอน ๆ ในการนาเสนอเนอหาใหม โดยสรป การตรวจปรบเนอหากคอ การเสรมสรางใหบทเรยนมการตรวจสอบผเรยนตลอด เวลาในระหวางกระบวนการเรยนร ดงนนการออกแบบบทเรยนในสวนนกคอ จะตองพยายามใหมการตรวจสอบผเรยนเปนระยะ ๆ เชน การใชคาถาม การเสรมสรางกจกรรม หรอการสรปประเดนสาคญ ๆ เกยวกบเนอหาในระหวางกระบวนการเรยนร หลงจากนนจงปรบความรความเขาใจใหกบผเรยน หากตรวจสอบแลวพบวาผเรยนยงไมเขาใจ โดยใชวธการตาง ๆ ดงกลาวขางตน กจกรรมการเรยนร (Learning Activity) กจกรรมการเรยนร (Learning Activity) หมายถง การกระทาใด ๆ ทเกดขนระหวางบทเรยนอนเนองมาจากการทบทเรยนสอความหมายกบผเรยน โดยใชสอชนดตาง ๆ เพอถายทอดเนอหาตามกระบวนการเรยนการสอนทวางแผนไว ลกษณะของกจกรรมในระหวางการเรยนรทด มดงน 1. สงเสรมใหผเรยนมสวนรวมตลอดบทเรยน ซงจะเปนการสงเสรมการเรยนรดวยความ เขาใจ แทนทจะใชความจาเพยงอยางเดยว 2. สอดคลองกบวตถประสงค และเนอหาของบทเรยน 3. เปนกจกรรมทชวยกระตนความสนใจของผเรยนตลอดเวลาทศกษาบทเรยน 4. เหมาะสมกบระยะเวลา ไมมากและสนเกนไป 5. แสดงขนตอนการเรยนรอยางชดเจน 6. สอดคลองกบสภาพแวดลอม และประหยดแตไดผลคมคา 7. ควรพจารณากจกรรมทสงเสรมการเรยนรดานทกษะและเจตคต แทนทจะเปนความรความสามารถเพยงดานเดยว การออกแบบกจกรรมการเรยนรในสวนน เปนการพจารณาอยางรอบคอบวาเนอหาแตละสวนจะนาเสนอกจกรรมอยางไร เพอใหผเรยนตดตามบทเรยนอยางตงใจ ซงกจกรรมดงกลาว จะตองสอดคลองกบวตถประสงคและเนอหาของบทเรยน เชน แทนทจะใหผเรยนคลกเมาสหรอกด Spacebar เพอเปลยนเนอหาบทเรยนไปยงหนาถดไปเพยงอยางเดยว อาจออกแบบใหผเรยนลากวตถ (Dragging) ไปวางในตาแหนงตาง ๆ หรอเตมคาตอบโดยกดตวอกษรบนแปนพมพกได การเลอกใชสอ (Media Selection) สอ (Media) มความสาคญตอการนาเสนอเนอหา เนองจากมผลโดยตรงตอการเรยนรของผเรยน การเลอกใชสอจงตองพจารณาทงทางดานเนอหาและระดบความรของผเรยน แมวาสอทสามารถใชไดกบบทเรยนคอมพวเตอรจะมขอจากดอยบางประการ ไมเหมอนกบการใชสอในการเรยนการสอนปกต นอกจากนยงขนอยกบความสามารถของระบบนพนธบทเรยนทใชพฒนา

Page 17: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 251

บทเรยนคอมพวเตอรดวย แตขอจากดดงกลาวนไมใชตวแปรททาใหการใชสอในบทเรยนคอมพวเตอรมคณภาพลดลงแตอยางใด

ภาพท 9-9 ความคดรวบยอดในการใชสอ การเลอกใชสอจะตองพจารณาวตถประสงคของบทเรยนเปนสาคญ เพอเลอกใชสอในบทเรยนใหเหมาะสมกบเนอหาและกจกรรมการเรยนร ตามกระบวนการเรยนรทดาเนนไปตามแผนการสอนทกาหนดไว ผเรยนจะอาศยสอเปนชองทางในการนาเสนอเนอหา และกจกรรมการเรยนร ประโยชนของสอจงมบทบาทโดยตรงตอการเรยนรของผเรยนซงผออกแบบบทเรยนจะตองพจารณาเลอกสอ โดยการพจารณาคณสมบตของสอแตละชนด ใหสามารถถายทอดเนอหาไปยงผเรยนไดตรงตามวตถประสงค และสรางความสนใจใหกบผเรยนไดมากทสด นกการศกษาไดจาแนกสอออกไดหลายแนวความคด แนวความคดหนงไดจาแนกสอออกเปน 6 ประเภท ดงน 1. วสดลายเสน แบงออกเปน 9 ชนด ไดแก กระดาน แผนทและลกโลก การตน โปสเตอร แผนภาพ แผนสถต แผนภม ปายผา และปายนเทศ 2. วสดมทรง แบงออกเปน 6 ชนด ไดแก พพธภณฑ ของเลยนแบบ ของจาลอง ของตวอยาง และของจรง 3. โสตวสด แบงออกเปน 4 ชนด ไดแก ระบบเสยง แผนเสยง เทปเสยง และวทย 4. ภาพนง แบงออกเปน 10 ชนด ไดแก ภาพผนง สมดภาพ ภาพสามมต ภาพเขยน รปถาย ฟลมสตรป สไลด ภาพโปรงแสง และภาพตดจากหนงสอ 5. กจกรรมรวม แบงออกเปน 8 ชนด ไดแก งานโครงการ การละเลน การแสดงบทบาท การสาธต การศกษานอกสถานท นทรรศการ และการทดลอง 6. ภาพยนตรและโทรทศน ขอดและขอเสยทเปนคณสมบตเฉพาะของสอตาง ๆ ทสอดคลองกบการนาเสนอเนอหาของบทเรยนคอมพวเตอร มดงน

Objective Audience Content and Activity Media

Lesson

Page 18: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

252 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

ประเภทของสอ ขอด ขอจากด เอกสาร ภาพลายเสน ภาพนง ภาพถายของจรง ภาพ 3 มต ภาพเคลอนไหว วดทศน เสยง

l สามารถอานไดตามความสามารถ ของแตละบคคล l เหมาะสาหรบศกษาดวยตวเอง l ใชถายทอดเนอหาเกยวกบ โครงสรางและความคดรวบยอด กวาง ๆ l แสดงความสมพนธของเนอหา ไดด l ถายทอดความเปนจรง เกยวกบ รปราง ลกษณะ และความจรง l ใหความเปนมตของภาพไดดทง ภายนอกและภายใน l ผเรยนเกดแรงจงใจสง l แสดงลาดบขนการเปลยนแปลง ไดดกวาสอชนดอน ๆ l ผเรยนเกดแรงจงใจสง l แสดงลาดบขนการเปลยนแปลง ไดดกวาสอชนดอน ๆ l ผเรยนเกดแรงจงใจสงมาก l มเสยงประกอบ การสอความหมายดและชดเจน l สอความหมายไดดขน หากใช เสยงประกอบสอชนดอน ๆ

l ขอมลลาสมยงาย l เขยนไดยาก ตองมความชานาญ หรอใชเครองมอชวย l ตองมการตกแตงภาพเพอเนนจด ทตองการนาเสนอ l ขนาดไฟลภาพมขนาดใหญ ทาให การนาเสนอไมตอเนอง l สรางไดยากกวาภาพชนดอน ๆ l ผสรางตองมความชานาญเฉพาะ l ตองใชโปรแกรมเฉพาะ l ขนาดไฟลภาพมขนาดใหญ ทาให การนาเสนอไมตอเนอง l ตองใชโปรแกรมเฉพาะดาน l บทเรยนมขนาดความจมาก หาก ใชเสยงประกอบทงบทเรยน

การสรปเนอหา (Review) การสรปเนอหา (Review) หมายถง การอธบายอยางยอทรวบรวมแนวความคดหรอใจความสาคญรวมเขาไว โดยมจดมงหมายเพอรวบรวมประเดนหลกของเนอหา เพอใหผเรยนรบเนอหาสวนนไวไปใชงานตอไป สวนใหญจะนยมสรปไวในสวนทายของบทเรยนกอนทจะเขาสกจกรรมอน ๆ ดงนน จงพบวาการสรปจะเปนการใหเนอหาอยางยอ ๆ อกครงหนง หลกสาคญในการสรปเนอหา มดงน 1. เปนขอความทจบใจความสาคญ ทแสดงความคดรวบยอดของเนอหาทผานมาแลว 2. เนนเฉพาะสวนทสาคญมาก ๆ โดยใชวธพเศษตาง ๆ เชน ตกรอบ ใชสเนน

Page 19: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 253

3. ทาการสรปทกครงเมอจบสนการใหเนอหา กอนทจะเขาสขนตอนตอไปหรอกจกรรมอยางอน ๆ 4. การใหผเรยนมสวนรวมในการสรปเนอหา จะทาใหผเรยนจดจาเนอหาสาระไดดยงขน โดยปกตในบทเรยนคอมพวเตอรแตละเรอง จะมการสรปอยางนอย 2 ครง ไดแก การสรปกอนการทาแบบทดสอบ และการสรปกอนจบบทเรยน จดมงหมายของการสรปกอนการทาแบบทดสอบกเพอใหผเรยนไดประมวลความรทไดศกษาผานมาแลว อนจะยงผลใหเกดความคดรวบยอดในการทาแบบทดสอบไดประสบความสาเรจ สวนการสรปกอนจบบทเรยนมจดมงหมาย เพอรวบรวมความรทไดศกษามาทงหมด เพอนาไปศกษาตอในบทเรยนถดไปหรอนาไปประยกต ใชงานตอไป การเลอกวธการนาสงบทเรยน (Delivery Selection) การนาสงบทเรยน (Delivery) เปนวธการนาบทเรยนทพฒนาเสรจแลวสงไปยงผเรยน เพอ ใหศกษาบทเรยนตามแผนการเรยนการสอนทกาหนดไว ในการออกแบบคอรสแวรจะตองพจารณาวธการนาสงบทเรยนไวดวยเชนกน เนองจากวธการนาสงบทเรยนมผลตอกระบวนการออกแบบบทเรยน เพอใหเกดความสอดคลองตอรปแบบการเรยนรตอวธการนาสงบทเรยน ซงวธ การนาสงบทเรยนจาแนกออกไดหลายวธ ดงน 1. แบบผสอนเปนผนา (Instructor-Led) บทเรยนคอมพวเตอรทออกแบบขนเพอใชในการเรยนรแบบผสอนเปนผนากคอ บทเรยนทใชสอนเสรมในชนเรยน เพอใชประกอบการบรรยายหรอการสาธต รวมทงการใชเพอประกอบการอภปรายกลม และการทางานกลม เปนตน 2. แบบออกอากาศระยะไกล (Distance Broadcast) บทเรยนคอมพวเตอรทใชในลกษณะนจะใชดาวเทยม โทรทศน โทรทศนตามสาย หรอโทรศพท เปนชองทางในการสงผานความรไปยงผเรยน ซงเนนการเรยนการสอนดวยตนเองเปนหลก 3. แบบใชกบคอมพวเตอร (Computer-Based) บทเรยนคอมพวเตอรทใชในลกษณะน ไดแก CAI, CAL, CAE, CBT และ CBI เปนตน วตถประสงคกเพอใชในการเรยนการสอนตามหลกสตรหรอใชฝกอบรมในสถานประกอบการ ทงหลกสตรระยะสนและระยะยาว ซงเนนการเรยนการสอนดวยตนเองเปนหลก 4. แบบใชกบเวบ (Web-Based) บทเรยนคอมพวเตอรทใชในลกษณะน ไดแก WBI, WBT, NBI, NBT, IBT และ e-Learning เปนตน วตถประสงคกเพอใชในการเรยนการสอนตามหลกสตรหรอใชฝกอบรมในสถานประกอบการ ทงหลกสตรระยะสนและระยะยาว ซงเนนการเรยนการสอนดวยตนเองเปนหลก เชนเดยวกบแบบใชกบคอมพวเตอร 5. แบบใชกบเครอขายไรสาย (Wireless-Based) บทเรยนคอมพวเตอรทใชในลกษณะน ไดแก m-Learning, m-Books เปนตน ซงสงผานบทเรยนโดยอาศยเครอขายไรสายไปยงโทรศพท มอถอหรอเครองคอมพวเตอรแบบพกพาของผเรยน ซงเนนการเรยนการสอนดวยตนเองเปนหลก

Page 20: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

254 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

การเลอกวธการนาสงบทเรยนในขนน จะเปนการพจารณาวาบทเรยนคอมพวเตอรทออกแบบขนวาจะนาไปใชงานในลกษณะใด เชน นาไปใชสอนเสรมการเรยนรในชนเรยนโดยมผสอนเปนผนา หรอใชในการเรยนรดวยตนเองผานเวบ เชน WBI, WBT หรอ e-Learning เปนตน ซงการออกแบบบทเรยนในสวนน จะมความแตกตางกนบางเกยวกบรายละเอยดตาง ๆ เชน ถาหากเปนบทเรยนคอมพวเตอรแบบใชกบเวบ การออกแบบขอคาถามทนาเสนอหนาจอละหนงขอจะไมสะดวกตอการใชงานเหมอนกบการนาเสนอหนาจอละหลายขอ เปนตน การออกแบบโครงสรางบทเรยน (Lesson Structure) การออกแบบโครงสรางบทเรยน จะเปนไปตามขนตอนการเรยนรตามกลยทธดานการเรยนการสอน ซงถายดตามขนตอนการเรยนร MIAP ไดแก ขนสนใจปญหา ขนศกษาขอมล ขนนาขอมลมาใช และขนสาเรจเรจผล แสดงวาบทเรยนกจะมขนตอนการเรยนรครบทกขนตอนในแตละหวเรอง ดงนน โครงสรางของบทเรยนกจะเปนไปตามไดอะแกรมตอไปน

ภาพท 9-10 แนวความคดเกยวกบโครงสรางของบทเรยน จากโครงสรางของบทเรยนตามขนตอนการเรยนร MIAP ไมวาแตละวชาจะประกอบไปดวยกหวเรองกตาม กระบวนการเรยนรจะตองครบสมบรณทง 4 ขนตอนในแตละหวเรอง โดยไมคานงถงวาแตละหวเรองมเนอหาวชาสมพนธกนหรอตอเนองกนหรอไม จงสรปไดวา การออกแบบ โครงสรางบทเรยนจะพจารณาแตละหวเรองเปนประการสาคญ เมอพจารณาโครงสรางบทเรยนทงวชา ซงบทเรยนคอมพวเตอรถกออกแบบขนมาเพอใชสาหรบการเรยนการสอนดวยตนเองเปนหลก โดยอาศยพนฐานของบทเรยนสาเรจรป จงจะตองม

Subject

Topic 2

Motivation 2

Information 2

Motivation 2

Information 2

Topic 1

Motivation 1

Information 1

Motivation 1

Information 1

Topic 3

Motivation 3

Information 3

Motivation 3

Information 3

Page 21: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 255

สวนประกอบตาง ๆ เพมขน เพออานวยความสะดวกใหกบผเรยนในการศกษาดวยตนเอง สวนตาง ๆ ทจะตองเพมเตมเขาไปในโครงสรางบทเรยน มดงน 1. คาชแจงบทเรยน (Instruction) 2. วตถประสงคของบทเรยน (Objective) 3. แบบทดสอบกอนบทเรยน (Pretest) 4. แบบทดสอบหลงบทเรยน (Posttest) 5. สวนอน ๆ เชน สรป แหลงอางองเนอหา สอเพมเตม และแนวทางการใชงาน เปนตน โครงสรางของบทเรยนทเพมเตมสวนตาง ๆ เขาไป จะมลกษณะตามไดอะแกรมดงน

ภาพท 9-11 โครงสรางของบทเรยนเมอเพมเตมสวนตาง ๆ เขาไป

Pretest

Topic 2

Motivation

Information

Application

Progress

Topic 1

Motivation

Information

Application

Progress

Topic 3

Motivation

Information

Application

Progress

Posttest

Review

Instruction

Objective

Subject

Learning Step

Page 22: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

256 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

Subject 3 Subject 2 Subject 5 Subject 4 Subject 1

Unit 1

Topic 2 Topic 1 Topic 1 Topic 2

Unit 2

Syllabus or Program

• Motivation • Information • Application • Progress

การออกแบบโครงสรางของบทเรยน จงเปนการพจารณาลกษณะการจดแบงวชาออกเปนหวเรองตาง ๆ ตามความสมพนธของเนอหาแตละหวเรองทเกดจากการวเคราะหเนอหาในขนตอนการวเคราะห ในการออกแบบโครงสรางบทเรยนคอมพวเตอร มกออกแบบเปนบทเรยนยอย ๆ เรยงลาดบดงน หลกสตร (Syllabus) หรอโปรแกรมการเรยน (Program) แบงออกสวนยอย ๆ ดงน 1. วชา (Subject) 1.1 หนวย (Unit) หรอสวน (Part) 1.1.1 หวเรอง (Topic) หรอบทเรยน (Lesson) 1.1.2 ……… 1.2 ……… 1.2.1 ……… 2. วชา (Subject) 2.1 หนวย (Unit) หรอสวน (Part) 2.1.1 หวเรอง (Topic) หรอบทเรยน (Lesson) 2.1.2 ……… 2.2 ……… 2.2.1 ………

ภาพท 9-12 การแบงลาดบของโครงสรางบทเรยน

Page 23: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 257

บทนาเรอง ประกอบดวยหวขอบทเรยน

รายการใหเลอก ประกอบดวยหวขอบทเรยนและรายการตาง ๆ เชน วตถประสงค คาแนะนาในการใชบทเรยน แบบทดสอบกอนบทเรยน

การดงดดความสนใจหรอการกลาวนากอนเขาสบทเรยน ในขนสนใจปญหา (Motivation)

Title

Menu

Motivation

การนาเสนอเนอหาบทเรยน โดยการถามตอบและการสรปความรทละขน ๆ โดยยดหลกประสบการณการเรยนรในขนศกษาขอมล (Information)

Information Question

การลาดบการเรยนการสอน (Instructional Sequencing) การลาดบการเรยนการสอน (Instructional Sequencing) หมายถง การจดลาดบขนตอนการนาเสนอเนอหาบทเรยนและการจดกจกรรมการเรยนรของบทเรยนคอมพวเตอร การออกแบบในขนน จะตองยดกลยทธดานการเรยนการสอนทผออกแบบยดเปนหลกการไวอยางเหนยวแนน ซงขนตอนการเรยนรจาแนกออกเปน 4 ขนตามทกลาวมาแลว ไดแก ขนสนใจปญหา ขนศกษาขอมล ขนนาขอมลมาใช และ ขนประเมนผลสาเรจ เมอออกแบบลาดบการเรยนการสอนตามกลยทธดงกลาว จะเปนไปตามไดอะแกรมดงน

Page 24: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

258 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

ภาพท 9-13 แสดงไดอะแกรมลาดบการเรยนการสอน

End จบบทเรยน สรปผลทไดจากบทเรยน รวมทงรายการ อน ๆ ของบทเรยน เชน พมพใบประกาศนยบตร

การสรปกอนเขาสการทาแบบทดสอบ เปนขนตอนของการนาขอมลมาใช

ขนตอนการนาขอมลมาใช (Application) ไดแก แบบทดสอบหลงบทเรยน (Posttest) พรอมเฉลย

การสรปกอนจบบทเรยน เพอประมวลความรทได ไปศกษาในหวขอถดไปหรอนาไปประยกตใช

Review

1. Text 2. Text 3. Text 4. Text

Question

Review

Feedback Response

Page 25: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 259

จากไดอะแกรม เปนตวอยางลาดบการเรยนการสอนของบทเรยนคอมพวเตอร เมอยดยทธวธดานการเรยนการสอนแบบ MIAP ผออกแบบบทเรยนจะตองพจารณาควบคไปกบแนวทางการจดการบทเรยนแบบเชงเสนหรอแบบสาขา ซงทางเลอกของการขนศกษาขอมลจะมความแตกตางกน นอกจากนยงสมพนธกบการออกแบบหนาจออกดวย เนองจากหนาจอของขนตอนตาง ๆ มความแตกตางกน บทดาเนนเรอง (Storyboards) และผงงานบทเรยน (Lesson Flowchart) บทดาเนนเรอง (Storyboard) หมายถง เรองราวของบทเรยน ประกอบดวยเนอหาทแบงออกสวนยอย ๆ ตามวตถประสงคของบทเรยน โดยรางเปนเฟรมยอย ๆ ตงแตเฟรมแรกซงเปนบทนาเรอง จนถงจบบทเรยนซงเปนเฟรมสดทาย บทดาเนนเรองประกอบดวยขอความ ภาพ คาถาม-คาตอบ รวมทงรายละเอยดอน ๆ ตามกระบวนการเรยนร ซงมลกษณะเชนเดยวกนกบบทสครปตของการถายทาสไลดหรอภาพยนตร เพอใชเปนแนวทางในการสรางบทเรยนในขนตอไป การออกแบบบทดาเนนเรองจะตองมความละเอยดและสมบรณ เพอใหการพฒนาบทเรยนทาไดงาย อกทงยงสะดวกตอการแกไขบทเรยนในภายหลงอกดวย เนองจากในการพฒนาบทเรยนโดยทวไปนน ผออกแบบบทเรยนกบผพฒนาบทเรยนจะไมไดเปนบคคลเดยวกน บทนาเรองจงเปรยบเสมอนตวกลางทใชตดตอระหวางผออกแบบบทเรยนกบผพฒนาบทเรยน ถาหากตวกลางมความสมบรณ การพฒนาบทเรยนโดยผพฒนากจะงายและไมเกดปญหาใด ๆ แตถาตวกลางไมละเอยดหรอออกแบบไมรอบคอบ กจะสรางปญหาตอการพฒนาบทเรยน บทดาเนนเรองเปรยบเสมอนการจาลองหนาจอของคอมพวเตอรทใชนาเสนอบทเรยน การออกแบบหนาจอกบการเขยนบทดาเนนเรองจงมความสมพนธกน ซงประกอบดวยการจดพนทหนาจอออกเปนสวนตาง ๆ ดงน

1. สวนรางเนอหาหนาจอ (Screen Layout) 2. สวนพนทของคาตอบ (Answer Area)

3. สวนพนทของการตรวจปรบ (Feedback Area) 4. สวนพนทของการควบคมบทเรยน (Control Area) บทดาเนนเรองจงประกอบดวยสวนรางเนอหาหนาจอและพนทตาง ๆ ทกาหนดไว การออกแบบบทดาเนนเรองจงเปนงานเอกสารอกสวนหนง ทผออกแบบบทเรยนจะตองดาเนนการดวยความรอบคอบ โดยพจารณาจากเนอหาและกจกรรมการเรยนการสอนในแตละชวง ๆ ซงเปนการนาเสนอดวยภาพประกอบขอความ นอกจากนยงมสวนของคาอธบายเกยวกบวธการนาเสนอเนอหา ตวอกษร การนาเสนอภาพ เทคนคการนาเสนอ เสยง และรายละเอยดสวนอน ๆ ทอธบายถงการพฒนาบทเรยนใหไดตามวตถประสงค โดยเรยกรายละเอยดหรอขอกาหนดสวนนวาสครปต การเขยนบทดาเนนเรองจงเปนการรางหรอการสเกตมากกวาการพมพดวยคอมพวเตอร ทงน

Page 26: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

260 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

เนองจากบทดาเนนเรองมการเปลยนแปลงอยตลอดเวลา แตอาจจะใชโปรแกรมสาเรจรปชวยออกแบบบทดาเนนเรองไดบาง เชน ใชโปรแกรม Storyboard Editor เปนตน

ภาพท 9-14 สวนประกอบของบทดาเนนเรอง สาหรบขอแนะนาในการเขยนขอความลงในบทดาเนนเรองนน Nigel Harrison ไดใหขอแนะนาไวกวาง ๆ ดงน (Harrison. 1998 : 201) 1. เขยนขอความโดยแบงออกเปนคอลมน เหมอนหนาหนงสอพมพ 2. เขยนขอความโดยไมตองยอหนา เนองจากเปนการนาเสนอขอความบนจอภาพไมใชการนาเสนอบนหนากระดาษ 3. ถาเปนขอความภาษาองกฤษ พยายามหลกเลยงการใชตวพมพใหญทงประโยค ยกเวนตวอกษรทขนตนประโยค 4. พยายามจดขอความใหกนหลงตรงกนทกบรรทด เพอใหงายตอการอาน 5. หลกเลยงการเขยนขอความลอมรอบกราฟกหรอรปภาพ 6. ไมควรเลอกใชรปแบบตวอกษรมากกวา 2 รปแบบในแตละหนาจอ ยกเวนกราฟกหรอการนาเสนอหวเรอง

Next Back Quit Help

Feedback Area

Answer Area

Frame Number Heading

Screen Layout Text Area Graphic Area

Control Area

Page 27: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 261

7. ใชวธการตกรอบเนนขอความทสาคญ ๆ ไมควรใชวธการขดเสนใต เนองจากผเรยนอาจเกดเขาใจคลาดเคลอนระหวางขอความทเนนกบจดเชอมโยงขอมลของไฮเปอรเทกซ นอกจากน Nigel Harrison ยงไดใหคาแนะนาเกยวกบแนวทางการเขยนบทดาเนนเรองใหมประสทธภาพ ดงน (Harrison. 1998 : 201) 1. พงระลกไวเสมอวาจะตองเขยนบทดาเนนเรองใหกบผเรยนอาน มใชเพอผออกแบบ บทเรยนอานเอง 2. ใชประโยคสน ๆ เขยนขอความโดยสรป 3. ขอความทเขยนในบทดาเนนเรองตองชดเจน รดกม และใชไดผล 4. พยายามลดขอความทไมเกยวของกบเนอหาบทเรยน 5. มหวเรองกากบเนอหาบทเรยนดวยทกเฟรม 6. หากเปนขอความภาษาองกฤษ ควรเขยนอยในรปประโยค Active Voice 7. พยายามนาเสนอดวยภาพหรอกราฟกประกอบขอความใหมากทสด 8. ใหผเชยวชาญอานเพอตรวจสอบความเหมาะสมของเนอหา หลงจากทเขยนเสรจแลว

ภาพท 9-15 ตวอยางของสครปต (Script) ผงงานบทเรยน (Lesson Flowchart) หมายถง แผนภมทแสดงความสมพนธของบทดาเนนเรอง ซงเปนการจดลาดบความสมพนธของเนอหาแตละสวนวาสวนใดเกยวของกบสวนใดและสวนใดมากอนหลง เพอใชเปนแนวทางในการจดลาดบการนาเสนอขนตอนตาง ๆ ของบทเรยน โดย ทวไปมกเขยนผงงานกอนบทดาเนนเรอง แตอาจจะเขยนพรอมกนกได สาหรบสญลกษณทเขยน

Page 28: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

262 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

ผงงานบทเรยน มลกษณะเชนเดยวกนกบสญลกษณทใชเขยนผงงานในการเขยนโปรแกรมคอมพวเตอร จงใชโปรแกรมคอมพวเตอรชวยงานดานนได เชน Visio, Microsoft Word เปนตน ใชแทนจดเรมตนและจดสนสดของบทเรยน ใชแทนเฟรมนาเสนอเนอหาหรอขอคาถามของบทเรยน โดยเขยนกากบหมายเลขเฟรมภายในกรอบ ใชแทนการตดสนใจหรอทางเลอกของบทเรยน ใชแทนจดตอ หรอจดเชอม ใชกาหนดทศทางการไหลของเฟรมบทเรยน ลกษณะการเขยนผงงานบทเรยน จะเหมอนกบการเขยนผงงานของการพฒนาโปรแกรมทวไป แตอาจจะกากบไวดวยหมายเลขเฟรมของบทดาเนนเรองเพอใชอางอง ดงน

ภาพท 9-16 ตวอยางของผงงานบทเรยน (Lesson Flowchart)

Information 1

Start

Question

Information 2

End

Information 3

Pass ?

Frame 10

Frame 20

Frame 30 Frame 40 Yes

No

Page 29: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 263

ภาพท 9-17 ตวอยางของผงงานบทเรยน (Lesson Flowchart)

Title

Register

Topic 2 Topic 1 Topic 3 Posttest Instruction EXIT

X End

Pretest

Menu

Choose ?

Content 1

Content 2

Content 3

Question 1

Content 4

Review

Exercise 1

Pass ?

Content 1

Question 1

Content 2

Question 2

Content 3

Review

Exercise 2

Pass ?

Content 1

Content 2

Question 1

Content 3

Content 4

Review

Exercise 3

Pass ?

Objective 2 Objective 1 Objective 3

X X X

Pass ?

X

Result

X

10

20

30

40

100

110

120

130

140

150

160

170

180

200

210

220

230

240

250

260

270

280

300

310

320

330

340

350

360

370

380

400

410

500 600

Page 30: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

264 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

จากผงงานบทเรยนในภาพท 9-14 จะพบวา ลกษณะของเนอหาบทเรยนเปนแบบอสระไมสมพนธกน (บทท 2 หนา 54) เนอหาบทเรยนทง 3 เรองจงไมเกยวของกน ผเรยนจะเลอกศกษาจากบทเรยนเรองใดกอนกได การนาเสนอบทเรยนจงใชรายการใหเลอก (Menu) ซงไดแก เฟรมหมายเลข 40 เปนสวนของการเขาถงสวนตาง ๆ ของบทเรยน ทงแบบทดสอบหลงบทเรยน คาชแจง และทางออกจากบทเรยน เมอพจารณาการออกแบบบทดาเนนเรอง กจะตองสอดคลองกบผงงานบทเรยนดงน

ภาพท 9-18 ตวอยางของผงงานบทเรยนและบทดาเนนเรอง (อยางยอ) ซงสอดคลองกบผงงานบทเรยนในภาพท 9-14

e-Learning for all

Introduction to COMPUTER

Storyboard Frame No. 10 Title : บทนา (Title) Background : ภาพคอมพวเตอรบนพนหลงสนาเงนเขม มเสนโคงตางขนาด 3 เสน สฟาและสฟาออน Text : Introduction to COMPUTER ใช Font Tahoma สขาว e-Learning for allใชสเหลอง มขนาดเหมาะสมกบภาพ Transition : ใชแบบ Dissolve Sound : มเสยงดนตรประกอบ ทนททม การปฏสมพนธกบบทเรยน เสยงจะหยด

User Name :

Introduction to COMPUTER

Storyboard Frame No. 20 Title : การลงทะเบยนเรยน (Register) Background : ใชภาพเดยวกนกบ Title Text : User Name และ Password ใช Font Tahoma สขาว ขนาด 14 Point Transition : ใชแบบ Dissolve Sound : None Comment : เกบ User Name และ Password เขาสฐานขอมล เพอใชสาหรบ พสจนสทธในการเขาเรยนครงตอไป

Password :

Page 31: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 265

Introduction to COMPUTER

Topic 1

Topic 2

Topic 3

Posttest

Instruction

EXIT

menu

ภาพท 9-18 ตวอยางของผงงานบทเรยนและบทดาเนนเรอง (อยางยอ) ซงสอดคลองกบผงงานบทเรยนในภาพท 9-14 (ตอ)

การจดการบทเรยน (Management) การออกแบบการจดการบทเรยน ไดแก การออกแบบโปรแกรมคอมพวเตอรเพอใชในการบรหารและจดการบทเรยน ซงจาแนกออกเปน 3 ดาน ดงน 1. การบรหารบทเรยน (Administration) 2. การเกบคะแนน (Scoring) 3. การวเคราะหและสถต (Analysis and Statistics)

Storyboard Frame No. 30 Title : Pretest Background : ภาพพนหลงสนาเงนเขม Text : ทงหมดใช Font Tahoma สขาว e-Learning for all ใชสเหลอง มขนาดเหมาะสมกบภาพ ขนาดตามเหมาะสม Transition : None Sound : None Comment : ตรวจสอบคาตอบกบเฉลย ทกาหนดให และเกบคะแนนสวนนไว ในฐานขอมลชอของผเรยน

Storyboard Frame No. 40 Title : รายการใหเลอก (Menu) Background : ใชภาพเดยวกนกบ Title Text : ใช Font Tahoma สขาว ขนาด 14 Point บนปมสฟาออน มเงาสเทาเขม Transition : ใชแบบ Dissolve Sound : มเสยงดนตรประกอบ Comment : ทาการ Link ไปยงบทเรยน เรองท 1, 2, 3, Posttest, Introduction และออกจากบทเรยน

Pretest e-Learning for all

→ Submit answer

1. How manty part of computer’s component ? A. 1 B. 2 C. 3 D. 4 2. What is BIT stand for ? A. Binary Digit B. Binary ACSII C. Bi Digit D. Bi Directional 3. Which one is bigger than GB ? A. FB B. TB C. DB D. RB 4. Which one is smaller than micro-second ? A. ns B. gs C. fs D. ps

Page 32: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

266 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

รายละเอยด มดงน 1. การบรหารบทเรยน (Administration) การบรหารบทเรยนเกยวของกบสวนตาง ๆ ดงน 1.1 การลงทะเบยนเรยนและการพสจนสทธ จะตองออกแบบการบรหารบทเรยนเพอรองรบการลงทะเบยนเรยนและการพสจนสทธของผเรยน เมอผเรยนเขาใชบทเรยนอกครงหนง รวมถงการออกแบบการจดการแกไขขอมลสวนตวของผเรยน 1.2 การจดตารางเรยน บทเรยนคอมพวเตอรปจจบนจะตองมสวนของการสนบสนนการจดตารางเรยน เพอใหผเรยนไดเลอกศกษาบทเรยนตามความตองการ ตามปฏทนทกาหนด 1.3 การตดตามผเรยน ลกษณะเดนของบทเรยนคอมพวเตอรอกประการหนงกคอ สามารถออกแบบโปรแกรมบรหารบทเรยนใหตดตามผเรยน (Tracking) ตงแตเรมลงทะเบยน จนถงสนสดการเรยน เพอตดตามและรายงานความกาวหนาทางการเรยนเปนระยะ ๆ 1.4 การฟนคนหนาจอ บทเรยนคอมพวเตอรทด ควรจะมระบบการบรหารบทเรยนทสามารถฟนคนหนาจอได หลงจากทผเรยนไดลงทะเบยนเรยนภายใตชอเดม ระบบการฟนคนหนาจอ จะตองนาเสนอบทเรยนทผเรยนศกษาคางไวเมอครงทผานมา พรอมรายงานผลคะแนนความกาวหนาทางการเรยนของเดมทคางไวอย 1.5 การสนบสนนใหผเรยนเกดการเรยนรรวมกน บทเรยนคอมพวเตอรทใชงานบนเวบ นอกจากจะสามารถเรยนไดหลาย ๆ คนในเวลาเดยวกนแลว ยงจะตองออกแบบการบรหารบทเรยนใหสามารถเรยนรรวมกนได ผเรยนทลงทะเบยนเรยนจากชมชนแตละแหงจะตองสามารถปฏสมพนธซงกนและกนได ทาใหเกดการเรยนรทกวางไกลขน 1.6 การบรหารธนาคารขอสอบ แบบทดสอบหรอขอสอบทใชในบทเรยนคอมพวเตอร จะตองเปนแบบธนาคารขอสอบและใชวธการสมแบบทดสอบ เพอใหเกดความหลากหลายในการวดและประเมนผล ดงนน จงจะตองออกแบบระบบบรหารธนาคารขอสอบในบทเรยนดวยเชนกน 1.7 การรายงานผลการเรยนและการออกใบรบรอง เปนสวนของการออกแบบระบบการรายงานผลการเรยนของผเรยน โดยแสดงผลในรปของสถต เปรยบเทยบกบเกณฑมาตรฐาน หรอเปรยบเทยบกบผเรยนอน ๆ เปนตน ซงสามารถนาผลการเรยนไปออกใบรบรองผลทางการ เรยนหรอประกาศนยบตรได 2. การเกบคะแนน (Scoring) ระดบคะแนนของผเรยน เปนเกณฑทใชวดผลสมฤทธทางการเรยนของผเรยนจากการ ศกษาบทเรยนคอมพวเตอร เนองจากเปนการเรยนการสอนรายบคคล คาระดบคะแนนทผเรยนทาไดจงมความสาคญตอกระบวนการเรยนร นอกจากจะใชเปนตวบงชความสาเรจของผเรยนแลว ผลคะแนนทผเรยนทาไดยงใชเปนตวกาหนดคณภาพของบทเรยนอกดวย ในการหาประสทธภาพของบทเรยนและการหาผลสมฤทธทางการเรยนของผเรยน จงใชคาระดบคะแนนทผเรยนทาได

Page 33: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 267

จากแบบทดสอบหรอแบบฝกหดระหวางบทเรยนและแบบทดสอบหลงบทเรยน เปนตวกาหนดประสทธภาพและผลสมฤทธทางการเรยน การออกแบบบทเรยนในสวนน จงตองมการเกบผลคะแนนทผเรยนทาไดในกระบวนการเรยนรทงหมด โดยออกแบบระบบฐานขอมลเพอเกบบนทกผลคะแนน ทงคะแนนทไดจากแบบ ทดสอบกอนบทเรยน แบบฝกหดระหวางบทเรยน และแบบทดสอบหลงบทเรยน คะแนนทกสวนทถกเกบบนทกไว จะสามารถนาไปใชงานตามความตองการของผออกแบบบทเรยน เชน ใชเปรยบเทยบผลสมฤทธทางการเรยนกอนเรยนและหลงเรยน ใชหาคาความคงทนทางการเรยนหลงจากทศกษาบทเรยนผานไปแลว 1 สปดาหหรอ 1 เดอน ใชเปรยบเทยบผลสมฤทธทางการเรยนกบการเรยนรดวยวธอน ๆ หรอใชจดอนดบความสาเรจของผเรยน รวมทงใชเปนเกณฑในการออกใบรบรองหรอประกาศนยบตรใหกบผเรยน เปนตน 3. การวเคราะหและสถต (Analysis and Statistics) การวเคราะหและสถต เปนการจดการในสวนของผลของการการประเมนบทเรยนทไดในรปของสถต เพอรายงานใหกบผเรยนไดทราบถงความสาเรจทางการเรยน ถาเปนบทเรยนคอมพวเตอรระดบเดกเลกจะนยมใชกราฟกแทนตวเลข หรอนาเสนอดวยกราฟสถต เชน การตนแสดงความยนดทผเรยนทาไดหรอแสดงความใกล-ไกลจากเปาหมายทกาหนดไว เปนตน แตถาเปนบทเรยนสาหรบผใหญหรอระดบโตขน การแสดงผลลพธทไดดวยผลคะแนนหรอเปนกราฟกในลกษณะของกราฟแทงกถอวาเพยงพอแลว หากเปนบทเรยนคอมพวเตอรแบบปญญาประดษฐ ในขนนจะมการวเคราะหถงผลลพธทไดเพอนาไปเชอมโยงกบเนอหาทเกยวของ โดยอาจออกแบบบทเรยนใหมการเรยนเพมเตมหลงจากทวเคราะหถงผลลพธทไดแลวปรากฏวาผเรยนยงไมบรรลวตถประสงคตามทตองการ การจดทาเอกสารและการยอมรบ (Documentation and Acceptance) การจดทาเอกสารและการยอมรบ (Documentation and Acceptance) เปนการออกแบบในขนสดทาย โดยเฉพาะอยางยงการพฒนาบทเรยนคอมพวเตอรตามความตองการของลกคา นอกจากคมอการใชงาน คมอการตดตง และคมอการบารงรกษาบทเรยน อนเปนพนฐานของการนาเสนอบทเรยนไปยงลกคาทจะตองเตรยมเอกสารสวนนไวแลว ยงมเอกสารอน ๆ ซงเปนสงรบรองกระบวนการออกแบบและการพฒนาบทเรยน เพอใหเกดการยอมรบวา กระบวนการออกแบบและพฒนาบทเรยนไดดาเนนการตามขนตอนเชงระบบ โดยใชวธการทางวทยาศาสตร เอกสารประกอบการนาเสนอบทเรยน มดงน 1. แนวทางการออกแบบตวบทเรยน (Courseware Design) 2. การจาแนกบทเรยนออกเปนโมดล (Module Design)

Page 34: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

268 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

3. รายละเอยดของบทเรยน (Lesson Script) ไดแก วตถประสงค เนอหา และกลยทธการดาเนนการเรยนการสอน 4. บทดาเนนเรอง (Storyboard) และผงงานบทเรยน (Lesson Flowchart) 5. เกณฑการพฒนาบทเรยน (Development Standards) 6. ขอความระบความตองการการจดการ (Management Requirements) 7. โครงรางของโครงการ (Project Proposal) ทเปนขอตกลงรวมกนทงสองฝาย การออกแบบสวนอน ๆ ถาเปนการออกแบบบทเรยนคอมพวเตอร ทมบคลากรทเกยวของในกระบวนการออกแบบและพฒนาเปนจานวนมาก สงทจะตองวางแผนและออกแบบการดาเนนการสวนอน ๆ มดงน 1. ตารางเวลาดาเนนการ (Schedule) 2. บคลากรในโครงการ (Project Team) รายละเอยด มดงน 1. ตารางเวลาดาเนนการ (Schedule) ผออกแบบบทเรยนจะตองวางแผนกาหนดการตาง ๆ ในกระบวนการออกแบบและพฒนาบทเรยน โดยกาหนดเปนตารางเวลาดาเนนการเกยวกบขนตอนตาง ๆ เชน กาหนดวนทสงมอบบทเรยน กาหนดวนททดลองใชบทเรยน และกาหนดวนทตดตงบทเรยนเขาสระบบ เปนตน เพอ ใหบคคลทรบผดชอบไดรวมกนวางแผนการวเคราะห การออกแบบ การพฒนา การทดลองใช และการประเมนผลบทเรยน ใหสอดคลองกบตารางเวลาดาเนนการ ซงตารางเวลาดาเนนการในสวนน จะตองเปนทรบรของบคลากรทเกยวของทงหมด 2. บคลากรในโครงการ (Project Team) ถาเปนการพฒนาบทเรยนคอมพวเตอรระบบใหญทมผเกยวของเปนจานวนมาก ผออกแบบบทเรยนจะตองพจารณารวมกบผบรหารโครงการ เพอรวมกนวางแผนและวเคราะหงานในความรบผดชอบของบคลากรฝายตาง ๆ ใหทางานประสานสมพนธกน โดยกาหนดบทบาทและความรบผดชอบของบคลากรทเกยวของ ใหปฏบตการเปนไปตามตารางเวลาดาเนนการทกาหนดไว เพอใหการออกแบบและการพฒนาบทเรยนเสรจสนภายในกาหนดเวลา บทสรป การออกแบบคอรสแวรหรอการออกแบบบทเรยน เปนขนตอนการออกแบบทมความสาคญไมนอยกวาขนตอนการวเคราะหในกระบวนการพฒนาบทเรยนคอมพวเตอร เนองจากขนตอนนเกยวของกบขนตอนยอย ๆ หลายประการ ทผออกแบบบทเรยนจะตองดาเนนการดวยความ

Page 35: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

การออกแบบคอรสแวร 269

รอบคอบ โดยพจารณาขอมลทเกยวของภายใตหลกการจดการบทเรยนเพอการเรยนการสอนดวยตนเอง ขนตอนยอย ๆ ในขนตอนน ไดแก การออกแบบหนาจอ ทางเลอกในการนาเสนอบทเรยน มาตรฐาน การปฏสมพนธ การออกแบบขอคาถาม การตรวจปรบ กจกรรมการเรยนร การเลอกใชสอ การสรปเนอหา การเลอกวธการนาสงบทเรยน การลาดบการเรยนการสอน บทดาเนนเรองและผงงานบทเรยน การจดการบทเรยน การจดทาเอกสารและการยอมรบ และการออกแบบสวนอน ๆ ผลลพธทไดจากขนตอนการออกแบบ ไดแก บทดาเนนเรอง ผงงานบทเรยน ขอกาหนดและรายละเอยดของสอ กจกรรมการเรยนการสอน แบบทดสอบ แบบฝกหด หนาจอบทเรยน วธการปฏสมพนธ และแนวทางการประเมนผลบทเรยน รวมทงกลยทธในการดาเนนการเรยนการสอนตามโครงสรางของบทเรยนทเลอกใช ขนตอไปจะเปนการนาผลลพธทไดทงหมดจากการออกแบบคอรสแวรหรอบทเรยนในขนตอนน ไปพฒนาเปนบทเรยนคอมพวเตอรตอไป แบบฝกหดทายบท จงตอบคาถามตอไปน 1. ปจจยทมผลตอการออกแบบหนาจอ มอะไรบาง 2. ทศทางการมองของสายตาทมลกษณะคลายตว Z (Z-like Pattern) เปนอยางไร 3. ทางเลอกในการนาเสนอบทเรยน เปนอยางไร 4. เพราะเหตใด จงตองมการกาหนดมาตรฐานของบทเรยน 5. แบบทดสอบกอนและหลงบทเรยน มความจาเปนอยางไรกบบทเรยนคอมพวเตอร 6. เพราะเหตใด จงตองมการตรวจปรบบทเรยน 7. การสรปเนอหา มความสาคญอยางไรตอการเสนอเนอหาบทเรยน 8. การออกแบบลาดบการเรยนการสอน ตองดาเนนการอยางไร 9. บทดาเนนเรอง มความสาคญอยางไรตอการพฒนาบทเรยนคอมพวเตอร 10. ขอแนะนาในการเขยนขอความของบทดาเนนเรอง มอะไรบาง 11. เทมเพลท คออะไร 12. ผงงานบทเรยน มความสาคญอยางไรตอการพฒนาบทเรยนคอมพวเตอร 13. สอทมอทธพลตอบทเรยนคอมพวเตอรมากทสดคอสอประเภทใด จงอธบาย 14. เพราะเหตใดบทเรยนคอมพวเตอร จงตองมระบบการจดการบทเรยน 15. ใหออกแบบบทเรยนในหวเรอง “ความรเบองตนเกยวกบคอมพวเตอร” สาหรบผเรยนระดบ ปวช. ในสวนตาง ๆ ดงน 15.1 โครงสรางของบทเรยน 15.2 บทดาเนนเรองและผงงานบทเรยน 15.3 เทมเพลททเกยวของ

Page 36: การออกแบบคอร สแวร ourseware Design 9home.dsd.go.th/kamphaengphet/km/information/WBI/09Courseware_Design.pdf · ของแผงวงจรแสดงผล

270 การออกแบบและพฒนาคอรสแวรสาหรบบทเรยนคอมพวเตอร

Frame No :

Storyboard Form : Title : Module : Unit : Designer : Background : Graphic : Text : Transition : Sound : Audio : Comment :