เอกสารประกอบการฝึกอบรม

การพัฒนาสื่อผ่านเครือข่ายอินเทอร์เน็ต

เรื่อง

การสร้างสื่อการสอนด้วยโปรแกรม SWISH 2

*******************

เป็นที่ยอมรับกันทั่วไปว่าสื่อการเรียนการสอนเป็นสิ่งที่จำเป็นและสำคัญ เพื่อช่วยให้ผู้เรียนสามารถทำความเข้าใจในเนื้อหาสาระได้ง่าย รวดเร็วและมีความคงทนต่อการเรียนรู้ และพบว่าประเทศไทยได้นำเอาสื่อการเรียนการสอนมาใช้ในกระบวนการเรียนรู้น้อยมาก ที่พบเห็นโดยทั่วไปจะใช้สื่อสิ่งพิมพ์เป็นหลัก มีการนำเอาสื่อเทคโนโลยี หรือสื่อของจริงมาช่วยน้อยมากทั้งนี้พบว่ามีสาเหตุหลายประการ เช่น ขาดการส่งเสริมสนับสนุนจากผู้บริหาร ผู้สอนให้ความสำคัญกับสื่อการสอนน้อย ผู้สอนไม่มีเวลาทุ่มเทให้กับการผลิตสื่อการสอน ผู้สอนขาดความรู้ความเข้าใจในกระบวนการผลิตสื่อการเรียนรู้ ผู้เขียนพบว่าโดย ทั่วไปการอบรมสร้างสื่อการสอนโดยเฉพาะสื่อคอมพิวเตอร์ระบบมัลติมีเดีย ซึ่งอาจเป็นคอมพิวเตอร์ช่วยสอน หรือสื่อผ่านเครือข่ายอินเทอร์เน็ต ก็ยังได้นำเอาเครื่องมือ (Authoring program) ที่ไม่เหมาะสม มาใช้ในการสร้างสื่อการสอน เช่น เครื่องมือบางตัวไม่สามารถรับตัวแปรได้ สื่อที่เป็นผลผลิตมีข้อจำกัดในการสร้างอยู่ในวงแคบๆ ไม่สามารถพัฒนาขึ้นเป็นสื่อคอมพิวเตอร์ช่วยสอนที่สมบูรณ์ได้ อีกทั้งการนำสื่อการสอนไปใช้ก็ยังยุ่งยากและมีข้อจำกัดอีกมากมาย หรือในกรณีของการสร้างสื่อการสอนผ่านเครือข่ายอินเทอร์เน็ตก็เช่นเดียวกัน ก็ยังได้นำเอาเครื่องมือสร้างเว็บเพจโดยทั่วไป มาใช้เป็นเครื่องมือในการสร้างซึ่งจะเกิดปัญหาในด้านขนาดของอักษรที่มีสามารถกำหนด ให้ตายตัวได้ ทำให้ตำแหน่งของภาพนิ่งหรือภาพเคลื่อนไหว เปลี่ยนแปลงไปตามผู้ใช้กำหนดซึ่งอาจทำให้สื่อความหมายของสาระผิดไปอย่างสิ้นเชิงได้ ผู้เขียนมีความเห็นว่าครูผู้สอนโดยทั่วไปมีศักยภาพสูงเพียงพอที่จะพัฒนาสื่อการเรียนการสอนด้วยคอมพิวเตอร์

เป็นอย่างดี หากได้รับสาระที่ถูกต้องและใช้เครื่องมือที่เหมาะสมกับเทคโนโลยีที่ก้าวไปมากในปัจจุบัน ซึ่งในที่นี้ได้นำเสนอการสร้างสื่อง่ายๆ แบบหนึ่งซึ่งผลงานที่เป็นผลผลิตมีคุณภาพในระดับดีพอสมควร

ปัจจุบันโปรแกรมประยุกต์ที่ใช้เป็นเครื่องมือสร้างสื่อมัลติมีเดียด้วยระบบคอมพิวเตอร์ได้พัฒนาขึ้นเป็นอันมาก โดยเฉพาะ Macromedia Flash ซึ่งนับเป็นพัฒนาการครั้งสำคัญของมัลติมีเดียที่สามารถใช้งานผ่านเครือข่ายอินเทอร์เน็ตได้ โดยในโปรแกรมนี้มีความสามารถในการสร้างภาพเคลื่อนไหว และคล้ายโปรแกรมภาษาในตัว เรียกว่า Action Script มีความสามารถกว้างขวาง แทบกล่าวได้ว่าไม่มีอะไรที่ Flash จะทำไม่ได้ (ยกเว้นเป็นฐานข้อมูลในตัวเอง) สามารถ Publish ออกใช้งานได้หลายรูปแบบทั้ง swf ,exe และอื่นๆ อีกมากมาย อย่างไรก็ตามการใช้งานโปรแกรมค่อนข้างยุ่งยากสำหรับผู้ใช้คอมพิวเตอร์ระดับมือใหม่ ทำให้มีผู้สร้างโปรแกรมที่ใช้งานง่ายกว่า เช่นโปรแกรม Swish ที่ผลผลิตของงานเป็นไฟล์ที่มีส่วนขยายเป็น swf เช่นเดียวกับโปรแกรม Flash ที่ให้เราสามารถสร้าง Presentation อย่างสวยงามได้อย่างรวดเร็ว โดยไม่ต้องใช้พื้นฐานความรู้มากนัก อย่างไรก็ตาม โปรแกรม swish ไม่สามารถทุกสิ่งได้ตามที่ต้องการอาจต้องอาศัยโปรแกรม Flash มาร่วมบ้าง จะทำให้ได้งานที่มีคุณภาพตามต้องการ

เมนูและเครื่องมือต่างๆ ใน Swish 2

โปรแกรม swish มีเครื่องมือทั้งในรูปหลายรูปแบบ เช่น

- menu bar ซึ่งเป็นเครื่องมือที่อยู่ในรูปแบบรายการข้อความ ซึ่งเมื่อคลิกเม้าส์ที่ menu bar จะมีเมนูย่อย (sub menu) ซึ่งโดยปกติจะเป็นคำสั่งที่ใช้ในการสร้างงาน แต่อาจมีบางเมนูซึ่งอาจมีเมนูย่อยต่อไปอีกชั้นหนึ่งก็ได้ ในกรณีนี้เมนูย่อยสุดท้ายจะเป็นคำสั่งที่ใช้ในการสร้างงาน

- toolbar ซึ่งเป็นเครื่องมือที่อยู่ในรูปของปุ่มซึ่งมีภาพสัญลักษณ์ของปุ่ม ให้เราใช้อย่างหลากหลาย มี Toolbox ซึ่งเป็นเครื่องมือกลุ่มหนึ่งซึ่งมีเครื่องมือที่ใช้วาด หรือสร้าง Objects ต่างๆ เช่น เส้น สี่เหลี่ยม วงกลม หรือกำหนดเส้นทางเคลื่อนที่ของวัตถุในโปรแกรม

- Panel เป็นกลุ่มของเครื่องมือคล้าย toolbar แต่มักแยกหน้าต่างออกมาต่างหาก สามารถเคลื่อนย้าย หรือรวมกลุ่มของ Panel เข้าด้วยกัน ซึ่งเป็นเครื่องมือสำคัญที่ใช้สร้างงานด้วยเช่นเดียวกัน

ดังแสดงในภาพที่ 1

ภาพที่ 1

รู้จักกับเครื่องมือในโปรแกรม swish

1. เมนู File เป็นเครื่องมือด้านการจัดการไฟล์ ซึ่งประกอบด้วย เมนูย่อยดังนี้

- New คลิกเพื่อเปิดแฟ้มงานใหม่

- Open คลิกเพื่อเปิดแฟ้มงานต้นฉบับ (*.swi) ที่เคยสร้างไว้แล้ว

- Save คลิกเพื่อบันทึกแฟ้มงานต้นฉบับ

-Save As คลิกเพื่อบันทึกแฟ้มงานต้นฉบับเมื่อต้องการเปลี่ยนชื่อแฟ้ม หรือเปลี่ยนตำแหน่งการบันทึกแฟ้มไปยัง Folder ที่ต่างออกไปจากเดิม

-New Windows คลิกเพื่อเปิดโปรแกรม Swish ซ้อนขึ้นอีก ใช้ในกรณีที่ที่ต้องการสร้างงาน swish หลายแฟ้มพร้อมๆ กัน ซึ่งอาจสามารถ copy งานจากแฟ้มหนึ่งไปยังอีกแฟ้มหนึ่งได้

-Samples เป็นการเปิดแฟ้มตัวอย่างที่โปรแกรม Swish มีมาให้เพื่อใช้ในการศึกษา หรือดัดแปลงไปใช้งาน

-Import ใช้ในการดึงข้อความ ภาพนิ่งแบบ raster(*.bmp; *.dib; *.gif; *.jpg; .if, .jpeg; .png ) ภาพนิ่งแบบ Vector (* .wmf ; *.emf; *.swf) ภาพเคลื่อนไหว (*.gif; *.swf; หรือแฟ้ม *.exe ที่สร้างด้วยโปรแกรม Flash) เสียง (*.mp3 หรือ *.wav)

- export คลิกเพื่อส่งชิ้นงานไปใช้จริง โดยปกติเราจะส่งไปในรูป *.swf แต่หากต้องการคลิกเพื่อเผยแพร่งานใน internet เราสามารถ export เป็น *.html ในกรณีนี้จะได้ไฟล์ *.swf และ *.html โดยใช้ชื่อเดียวกับไฟล์ *.swi แต่ส่วนขยายต่างกัน นอกจากนี้เราสามารถ export งานในรูปของ video คือ *.avi ก็ได้ (กินเนื้อที่ใน Disk มาก)

-test คลิกเพื่อทดสอบชิ้นงานที่สร้างขึ้นว่าให้ผลตรงกับที่ต้องการหรือไม่ ก่อนที่จะ export งานไปใช้จริง ซึ่งสามารถ test แบบ play ในโปรแกรม swish หรือทดสอบผ่านทาง Browser ก็ได้

การสร้างสื่อการสอนโดยทั่วประกอบด้วยส่วนหลัก ๆ 3 ส่วนคือ ส่วนนำ ( Title) เนื้อเรื่อง ( Content) และแบบทดสอบ

2. เมนู Edit ประกอบด้วยเมนูย่อยดังนี้

- Undo ใช้สำหรับย้อนขั้นตอนกลับจากที่เคยทำไปแล้ว ซึ่งอาจย้อนกลับได้หลายขั้นตอนคล้ายโปรแกรม Microsoft word มีประโยชน์สำหรับการแก้ไปงานที่ทำผิดพลาด ตราบใดที่ยังไม่ปิดแฟ้มงานนั้น หากปิดแฟ้มงานแล้วเปิดใหม่จะไม่สามารถย้อนกลับไปยังข้อผิดพลาดเดิมที่ทำไว้ก่อนปิดชิ้นงานได้

- Redo ใช้เป็นกรณีตรงกันข้ามกับ Undo ซึ่งทำให้สามารถเปลี่ยนขั้นตอนย้อนกลับไปกลับมาได้

- Cut ใช้สำหรับตัดวัตถุ (Objects) ต่างๆในโปรแกรม

- Copy คลิกเพื่อคัดลอกวัตถุไปวางใหม่ ทำให้ได้วัตถุเหมือนเดิมหลายจำนวน

- Paste คลิกเพื่อวางวัตถุที่ได้ Cut หรือ Copy ไว้แล้ว

- Delete คลิกเพื่อลบวัตถุ ในกรณีนี้วัตถุที่ถูกลบไม่เก็บไว้ในหน่วยความจำ (Clip board) ซึ่งอาจทำให้สามารถ Paste วัตถุที่เคย Copy หรือ Cut ไว้ก่อนหน้านี้ได้

- Make Instance คลิกเพื่อเพิ่มจำนวนของ Sprite (เป็นภาพเคลื่อนไหวซึ่งซ้อนอยู่ในงานนี้อีกชั้นหนึ่ง

-Show คลิกเพื่อแสดง Object ที่ได้ซ่อนไว้แล้ว

-Hide คลิกเพื่อซ่อน Object

-Show all stateคลิกเพื่อแสดงทุกสภาวะของปุ่ม (button)

-Select all Objects คลิกเพื่อเลือกทุกๆ Object ในพื้นที่สร้างงาน

-Properties คลิกเพื่อแสดงคุณสมบัติของวัตถุที่เลือก

3. เมนู view มีเมนูย่อยเพื่อใช้งานดังนี้

-Preview Frame คลิกเพื่อตรวจสอบว่าขณะแสดงผลในพื้นที่สร้างงานกำลังอยู่ในตำแหน่ง Frame ใด

-Toolbar เป็นกลุ่มของเมนูย่อยที่มีเมนูย่อยซ้อนอีกชั้นหนึ่ง เราสามารถคลิกเพื่อแสดง Tools ย่อยสามารถคลิกเพื่อให้แสดงหรือไม่ก็ได้ ดังแสดงในภาพที่ 2

ภาพที่ 2

-status bar คลิกเพื่อแสดงหรือซ่อน แถบแสดงสถานะ ซึ่งอยู่ด้านล่างของเนื้อที่สร้างงาน

- Rulers คลิกเพื่อแสดงสเกลของเนื้อที่สร้างงาน มีหน่วยเป็น Pixel

- Zoom in คลิกเพื่อซูมภาพคล้ายมองในระยะใกล้ ทำให้ดูโตขึ้น (ขนาดของเนื้อที่สร้างงานเท่าเดิม)

-Zoom out คลิกเพื่อซูมภาพคล้ายมองในระยะไกลออกไป ทำให้ดูขนาดเนื้อที่สร้างงานเล็กลง แต่สภาพจริงเนื้อที่สร้างงานเท่าเดิม

- Zoom at 100 % คลิกเพื่อแสดงขนาดของเนื้อที่สร้างงานเท่ากับของจริง

- Fit Scene in window คลิกเพื่อให้มองเห็นเนื้อที่สร้างงานเต็มพื้นที่ใน Lay out

-Fit Object in Window คลิกเพื่อมองขนาดของ Object เต็มขนาดที่สามารถมองเห็นได้ใน Lay out

- Show grid คลิกเพื่อแสดงเส้น grid ในเนื้อที่สร้างงาน มีประโยชน์ในการมองเพื่อจัดวางตำแหน่งของวัตถุให้ตรงกับที่ต้องการ เส้น grid ใช้เพื่อสะดวกในการมองเพื่อวางตำแหน่งของวัตถุเท่านั้น ไม่แสดงผลในผลงานที่ได้ export ออกไป

- Snap to Grid คลิกเพื่อให้วัตถุวิ่งเข้าหาเส้น grid เมื่อนำวัตถุวางใกล้ สะดวกในการจัดวางวัตถุที่ต้องการให้ระดับแนวตั้งหรือแนวดิ่งตรงกัน

- Snap to Object Handle คลิกเพื่อให้วัตถุวิ่งเข้าหา Handle ของ Object ตัวอื่น (Handle คือ จุดแสดงขอบเขตของวัตถุใด ซึ่งประกอบด้วย จุดมุมทั้ง 4 และ กึ่งกลางด้านทั้ง 4)

-Show all image คลิกเพื่อแสดง Objects ทั้งหมด

-Smooth Edges and Images คลิกเพื่อทำให้ขอบวัตถุวัตถุเช่น อักษร หรือภาพคมชัดไม่เกิดรอยหัก

4. เมนู Insert มีเมนูย่อยเพื่อใช้งานโดยสังเขปดังนี้

- Scene คลิกเพื่อแทรก Scene (โปรแกรมนี้สามารถเพิ่ม Scene เพื่อให้เกิดการแสดงอย่างต่อเนื่องโดยอัตโนมัติหากไม่สั่งการให้เป็นอย่างอื่น

- Text คลิกเพื่อแทรกข้อความ ซึ่งสามารถเลือกชนิดของ Font ขนาดของอักษร สีอักษร ฯลฯ ได้ที่ Properties ของ Text

- Button คลิกเพื่อแทรกปุ่ม

- Sprite คลิกเพื่อแทรกวัตถุซึ่งเป็นภาพเคลื่อนไหว โดยเมื่อคลิกที่นี่จะเกิดเนื้อที่สร้างงานใหม่ซึ่งเป็นส่วนย่อยภายในเนื้องานเดิม ซึ่งจะมี Time line เป็นของตัวเอง

- Image คลิกเพื่อแทรก ภาพ โดยทั่วไปจะเป็นภาพนิ่ง อาจเป็นภาพแบบ Raster หรือ Vector ก็ได้ แต่เราสามารถแทรกภาพเคลื่อนไหวประเภท gif animation โดยมีสั่งแทรก จะมีหน้าต่าง Import Frames ขึ้นมาให้เลือก ถ้าหากเลือกคลิกที่ Select All Frames โดยมีตัวเลือกที่ import as Sprite แล้วคลิกต่อที่ import จะทำให้เกิด Sprite ซึ่งเป็นภาพเคลื่อนไหวโดยอัตโนมัติ แต่หากไม่เลือกคลิกที่ปุ่มดังกล่าว อาจเลือก เอา Frame หนึ่ง Frame ใด จะได้ภาพเดียวไม่เคลื่อนไหว ดังแสดงในภาพที่ 3

ภาพที่ 3

- Content คลิกเพื่อแทรก Object อื่นๆ เช่นเสียง ภาพนิ่ง ภาพเคลื่อนไหว ฯลฯ

- Instance คลิกเพื่อแทรกภาพเคลื่อนไหว ซึ่ง Clone มาจาก Sprite (Sprite อันเดียว สามารถ Clone ไปได้หลายๆ ตัว โดยที่ไม่ต้องเปลืองหน่อยความจำเพิ่ม)

-Effect คลิกเพื่อเพิ่มเอฟเฟคของ Object เช่นให้ภาพพลิกและวิ่งพลิ้วเข้ามาวางในตำแหน่ง วิ่งเข้ามาจากภาพจางแล้วเข้มขึ้น ฯลฯ

-Event คลิกเพื่อบอกเหตุการณ์ของเม้าส์ เช่น ขณะที่กดปุ่มซ้ายของเม้าส์ (On press) ปล่อยปุ่มซ้ายของเม้าส์ (On release) วางเม้าส์เหนือวัตถุ (On Roll Over) เมื่อเอาเม้าส์ออกจากวัตถุ ( On Roll Out) ขณะลากเม้าส์บนวัตถุ (On Drag Over) ขณะลากเม้าส์ออกจากวัตถุ ( On Drag Out) เป็นต้น ดังแสดงในภาพที่ 4

ภาพที่ 4

-Action คลิกเพื่อแทรกคำสั่งต่างๆ เช่น ให้เปิด ไฟล์ใหม่ วิ่งไปที่ Frame ใดๆ แสดงเสียง หยุดแสดงเสียง ฯลฯ

-Insert Frame คลิกเพื่อเพิ่ม Frame ทำให้การแสดงผลของ Effect ยาวนานขึ้น

-Delete Frame ใช้เพื่อลบ Frame ออกจาก Time line ทำให้การแสดงผล Effect ใช้เวลาน้อยลง

5. เมนู Modify มีเมนูย่อย และแต่ละเมนูย่อยจะมีเมนูคำสั่งย่อยอีกชั้นหนึ่ง ดังแสดงในภาพที่ 5

ภาพที่ 5

-Grouping มีเมนูย่อย เช่น Group คลิกเพื่อ รวม Object หลาย ๆ Object เป็น Object เดียว หรือ Ungroup ใช้เพื่อแยก Object ที่เคยรวมกัน เป็น Object ย่อย หรืออาจรวมกลุ่มเป็นภาพเคลื่อนไหว Group as Sprite หรือรวมกลุ่มแบบ shape ( Group as shape) ซึ่ง วัตถุด้านหน้าจะกลวง ดังแสดงในภาพที่ 6

ภาพที่ 6

หากต้องการให้ส่วนที่ซ้อนทับกลวง เราสามารถทำได้โดยการคลิกที่ check box หน้า Solid shape with overlap filled ดังแสดงในภาพที่ 7

ภาพที่ 7

-convert คลิกเพื่อเปลี่ยน Object นั้นเป็นรูปแบบอื่นๆ เช่น เป็นปุ่ม (button) เป็นภาพเคลื่อนไหว (Sprite) หรือเป็นรูปทรง (Shape) ดังแสดงในภาพที่ 8

ภาพที่ 8

-Order มีเมนูย่อยเพื่อเรียง Object ให้อยู่ด้านล่างหรือด้านบนในเนื้อที่สร้างงาน (Object ที่อยู่บนสามารถบังวัตถุที่อยู่ล่าง) โดยมีเมนูย่อยสั่งงานคือ Bring to Front คลิกเพื่อให้วัตถุนั้นขึ้นมาอยู่ชั้น (Layer) บนสุด Send to back คลิกเพื่อส่งวัตถุลงอยู่ในชั้นล่างสุด Bring forward คลิกเพื่อส่งวัตถุให้เลื่อนชั้นขึ้นมา 1 ระดับ คลิกเพื่อส่งวัตถุให้เลื่อนชั้นลงไป 1 ระดับ

- Transform มีเมนูย่อยที่ใช้เพื่อ หมุนหรือพลิกวัตถุ

-Alignment เป็นเมนูที่ประกอบด้วยเมนูย่อยที่สามารถเปลี่ยนตำแหน่งอ้างอิงของวัตถุไปยัง จุด Handle ต่างๆ ได้

-Justification ใช้เพื่อจัดบรรทัดของข้อความ แบบต่างๆ เช่น ชิดหน้า (Align Left) จัดกึ่งกลาง (Center) ชิดขวา (Align Right ) หรือเต็มบรรทัด (Full) ดังแสดงในภาพที่ 9

ภาพที่ 9

-Appearance ใช้เพื่อจัดทิศทางของข้อความเป็นแนวต่างๆ เช่นแนวดิ่ง และในทิศทางต่างๆ ดังแสดงในภาพที่ 10

ภาพที่ 10

6. เมนู Control มีเมนูย่อยเพื่อใช้ควบคุมการแสดงของภาพเคลื่อนไหวดังนี้

- Play movie คลิกเพื่อแสดงภาพเคลื่อนไหวทั้ง File โดยจะเริ่มจาก Scene แรก และดำเนินต่อไปเรื่อยๆ ตามที่ได้สั่งงานไว้ในโปรแกรม

- Play Scene คลิกเพื่อทดสอบการแสดงผลของงานใน Scene นั้นๆ

- Play effect คลิกเพื่อทดสอบการแสดงผลของ Effect นั้นๆ

- Preview Frame คลิกเพื่อดูการแสดงผลใน Frame นั้นๆ

- Stop คลิกเพื่อหยุดการแสดงผลของภาพเคลื่อนไหวนั้น

- Step forward คลิกเพื่อแสดงผลของ Frame ต่อไป

- Step back คลิกเพื่อย้อนกลับไปดูการแสดงผลของ Frame ก่อนหน้า 1 Frame

- Cue to End คลิกเพื่อไปดู Frame สุดท้ายของ Scene นั้นๆ

- Rewind to start คลิกเพื่อไปดู Frame แรกสุดของ Scene นั้นๆ

7. เมนู Tools เป็นเมนูที่ใช้ปรับเครื่องมือเพื่อเหมาะกับการใช้งานแต่ละผู้ใช้ มีเมนูย่อยดังนี้

-Preference เป็นเมนูใช้ปรับทางเลือกสำหรับผู้ใช้ แสดงในภาพที่ 11

ภาพที่ 11

-Customize เป็นเมนูที่ใช้ในการปรับแต่งโปรแกรม ให้เหมาะกับผู้ใช้เอง เช่นสามารถกำหนดคีย์ลัด (Shortcut Key) ให้ตรงกับความเคยชินของผู้ใช้เอง เช่นเคยใช้โปรแกรม Flash ก็อาจทำให้งาน ในลักษณะเดียวกับโปรแกรม flash ก็ใช้คีย์ลัดแบบเดียวกับโปรแกรม Flash เป็นต้น จากภาพที่ 12

ภาพที่ 12

เป็นการตั้งค่าคีย์ลัด ให้มีการ Save As เมื่อกดคี F12 โดยการเลือกเมนู ในที่นี้คือ File เลือกคำสั่ง ในที่นี้ใช้ Save As พิมพ์ F12 ในช่อง Press New Shortcut Key แล้วกดปุ่ม Assign จะปรากฎ F12 ในช่อง Current Keys: ดังแสดงในภาพที่ 13

ภาพที่ 13

-Keyboard map ใช้เพื่อแสดงคีย์ลัด ดังแสดงในภาพที่ 14

ภาพที่ 14

8. เมนู Panel ประกอบด้วย Panel ย่อย ซึ่งแต่ละ Panel ย่อยคือหน้าต่างของเครื่องมือที่สำคัญเพื่อใช้ในการสร้างงาน ซึ่งแต่ละ Panel อาจซ้อนในกรอบเดียวกับ โดยแต่ละ Panel จะกลายเป็น Tab หนึ่งในหน้าต่างนั้น ซึ่งเราจะได้ศึกษารายละเอียด การใช้งานในเอกสารนี้ ดังแสดงในภาพที่ 15

ภาพที่ 15

การสร้าง Title

เมื่อเปิดโปรแกรมใหม่ๆ จะมีเนื้อที่สร้างงานว่างๆ ให้โดยอัตโนมัติ โดยปกติจะตั้งชื่อไฟล์

เป็น movie1 ซึ่งเมื่อบันทึกเป็นไฟล์จริงจะมีส่วนขยายเป็น swi ซึ่งเป็นไฟล์ประเภทต้นฉบับ (ไม่สามารถนำไปใช้งานได้จริง) เราจะเก็บไว้ปรับปรุงแก้ไข หากต้องการปรับปรุงชิ้นงานนั้นใหม่ ซึ่งการสร้างงานเราสามารถทำตามที่เราได้ออกแบบไว้ ในที่นี้จะนำเสนอรูปแบบหนึ่งที่เห็นว่าไม่ต้องใช้ความรู้พื้นฐานมากเกินไป และผู้ศึกษาเมื่อสร้างงานตามรูปแบบนี้แล้วจะมีความสามารถประยุกต์ หรือดัดแปลง ไปใช้ในระดับก้าวหน้าได้โดยไม่ยาก ใช้ขั้นตอนดังนี้

1. คลิกที่เมนู Panel > Movie จะได้ Panel ของ Movie ให้เปลี่ยนค่าของเนื้อที่แสดงชิ้นงานให้มีความกว้าง 760 pixel ส่วนสูง 560 pixel (หากเป็น 800 x 600 เต็มเนื้อที่แบบ Full Screen จะเกิดแถบเลื่อนทั้งแนวตั้งและแนวนอน เมื่อต้องการให้แสดงผลแบบเต็มจอ) ส่วน Frame rate ซึ่งจำนวนภาพที่เปลี่ยนแปลงในแต่ละช่วงเวลา 1 วินาที อาจเป็น 12 กรอบภาพต่อวินาทีตามค่าเริ่มต้น หรืออาจลดลงมา เพื่อให้ขนาดของ ไฟล์เล็กลง ซึ่งมีผลทำให้แสดงผลได้รวดเร็วยิ่งขึ้น ส่วน Bgnd Color หรือ Background Color นั้นอาจเปลี่ยนได้ ตามต้องการในที่นี้ใช้สีขาว ดังแสดงในภาพที่ 16

ภาพที่ 16

การกำหนดขนาดของ Movie เราสามารถกำหนดเป็น 400 x 300 pixel ซึ่งทั้งด้านกว้าง และด้านสูง เป็นครึ่งหนึ่งของรายละเอียดของจอภาพ เมื่อสั่งให้แสดงผลแบบเต็มจอก็สามารถทำได้ และกินเนื้อที่ ไฟล์ต่ำมาก แต่ผลที่เกิดตามมาคือภาพเมื่อขยายให้โตขึ้นจะไม่ชัดเจนทำให้ขาดความสวยงาม

2. คลิกเม้าส์ที่ view > Fit scene in window ซึ่งจะทำให้มองเห็นเนื้อที่สร้างงานเต็มเนื้อที่ของ Layout Panel และมองเห็น Handle รอบๆ เนื้อที่สร้างงานเป็นจุดสี่เหลี่ยมทั้ง 4 มุม และกึ่งกลางด้านทั้ง 4 ด้าน รวม 8 จุด (ควรระมัดระวังหากนำเม้าส์เข้าไปในจุดซึ่งเป็น Handle แล้วลาก จะทำให้ขนาดของเนื้อที่สร้างงานเปลี่ยนแปลงได้)

3. คลิกเม้าส์ที่ insert > text หรือคลิกที่ (Insert Text) ซึ่งอยู่ใน Toolbar ก็ได้ แล้วพิมพ์ข้อความ “สื่อการสอนผ่านเครือข่ายอินเทอร์เน็ต” ใน Text Panel (แสดงออกมาทันทีที่คลิกเม้าส์บนปุ่ม Insert text โดย Panel เหล่านี้จะเปลี่ยนไปตามชนิดของ Object ที่เรากำลังสร้าง เช่นหากสร้างรูปสี่เหลี่ยม จะเกิด Panel ชื่อ shape แทน) เลือก Font (รูปแบบตัวอักษร) ให้เป็นภาษาไทย ควรเป็น Font ที่มีชื่อตามหลังด้วย UPC เช่น AngsanaUPC ถ้าหากใช้ Font ชื่อต่างๆ เช่น Font ที่ใช้ ในโปรแกรม Photoshop อาจเกิดปัญหาได้ แล้วเลือกขนาด Font ที่พอเหมาะ ดังแสดงในภาพที่ 17

ภาพที่ 17

4. คลิกเม้าส์ที่ Insert Text อีกครั้งหนึ่ง โปรแกรมจะสร้าง Object ของ Text ขึ้นอีกตัวหนึ่งซึ่งมีคุณสมบัติเหมือนตัวที่สร้างไว้เดิม คล้ายเป็นการ Duplicate ดังแสดงในภาพที่ 18

ภาพที่ 18

5. ทำซ้ำดังข้อที่ 4 แล้วแก้ข้อความในคุณสมบัติของ Text จนกระทั่งได้งาน ดังแสดงในภาพที่ 19

ภาพที่ 19

6. คลิกเม้าส์ใน Frame ที่ 0 ใน Time line ใส่ Effect เลือก Slide In >From top ดังภาพที่ 20

ภาพที่ 20

ในการเลือก Effect มีทางเลือกให้มากมาย ในที่นี้นำเสนอเพียง แบบเดียว

7. คัดลอก Effect ไปวางใน Timeline ของ Text อื่น ๆ โดยให้เริ่มแสดงผลที่ Frame 6 และ Frame 12 โดยการคลิกเม้าส์ขวาแล้วเลือก Copy Effect แล้ว Paste Effect ตามลำดับ (การเลือกตำแหน่งของ Frame ต่างๆ สามารถกำหนดเอาเองได้ตามที่เห็นเหมาะสม หากเริ่มต้นมี Effect ที่ Frame ใด Object นั้นจะแสดงผลที่ Frame นั้นๆ ดังนั้น สรุปว่า Effect ที่อยู่ทางซ้ายใน Timeline จะแสดงผลก่อน ทางขวา ) ดังแสดงในภาพที่ 21

ภาพที่ 21

จากภาพ ข้อความแบ่งเป็น 3 Object แต่ละ Object อยู่ต่างบรรทัดกันใน Timeline บรรทัดบน Object อยู่เหนือบรรทัดล่าง (เมื่อเรามองจากเนื้องานที่นำเสนอจริง วัตถุที่อยู่บนเมื่อซ้อนตำแหน่งกันจะบังบรรทัดล่าง) สรุปว่าเมื่อ Object อยู่ต่าง Layer กัน Layer บนบัง Layer ล่าง เราสามารถเปลี่ยนลำดับของ Leyer ได้ ด้วยการคลิกเม้าส์ที่ ลูกศรในตำแหน่งเม้าส์ชี้ (Mouse Pointer) ดังภาพที่ 22

ภาพที่ 22

8. คลิกเม้าส์ใน Frame ของ Timeline ตำแหน่งหลังจาก Effect สุดท้ายประมาณ 12 Frame (เมื่อ Frame rate เป็น 12 fps) หรือให้หยุดการแสดงผล 1 วินาที ในที่นี้คือ Frame ที่ 30 แล้วสั่งให้เปิดแฟ้มถัดไป สมมติว่าชื่อแฟ้มเป็น title2.swf กำหนด level เป็น 0 (การตั้งชื่อ File แนะนำให้ใช้ภาษาอังกฤษเท่านั้น ไม่มีเว้นวรรคภายในข้อความ และไม่ควรเกิน 8 ตัวอักษร เพื่อป้องกันการผิดพลาดเมื่อนำไป upload ขึ้นในเว็บไซต์ Internet เมื่อใช้ OS ต่างกันออกไป) ดังแสดงในภาพที่ 23

ภาพที่ 23

9. คลิกเม้าส์ File > Save As เพื่อบันทึก File แล้วเลือกตำแหน่งของที่เก็บไฟล์โดยอาจสร้าง Folder ใหม่ ดังแสดงในภาพที่ 24

ภาพที่ 24

10. ตั้งชื่อ Folder เป็น wbi (อาจตั้งชื่อเป็นอย่างอื่นได้) ดังแสดงในภาพที่ 25

ภาพที่ 25

11. คลิกเม้าส์ซ้ำที่ wbi เพื่อเปิด Folder แล้วบันทึกชื่อไฟล์เป็น title1 โดยไม่ต้องใส่ส่วนขยาย โปรแกรมจะสร้างส่วนขยายให้เองเป็น title1.wbi แล้วคลิกต่อที่ save ดังแสดงในภาพที่ 26

ภาพที่ 26

ไฟล์ซึ่งมีส่วนขยายเป็น swi เป็นแฟ้มต้นฉบับเราเก็บไว้แก้ไข หากพบข้อผิดพลาดในงานที่เราได้ Export ออกไปใช้งาน

12. คลิกเม้าส์ที่ File > Export เพื่อเอาผลงานไปใช้จริง โดยเลือกเป็น Export แบบ html ซึ่งจะได้ทั้งแฟ้ม html และ swf พร้อมกันในครั้งเดียว ดังแสดงในภาพที่ 27

ภาพที่ 27

เมื่อบันทึกไฟล์แรกและ export ไฟล์แล้วสามารถ Save As ไฟล์นี้ เป็นชื่อ title2 โดยไม่ต้องใส่ส่วนขยาย (ใส่ส่วนขยายด้วยก็ได้) แล้วเปลี่ยนข้อความ เป็น “โดย” แล้วใส่ชื่อผู้สร้าง “…………” ดังแสดงในภาพที่ 28

ภาพที่ 28

13. ใส่ภาพผู้สร้าง โดยคลิกเม้าส์ที่ insert > image แล้วเลือก ไฟล์ภาพที่เตรียมไว้ แล้วใส่ Effect จะปรากฏภาพดังแสดงในภาพที่ 29

ภาพที่ 29

14. ใส่ Action ของ Frame ให้เปิดไฟล์ title3.swf ให้ level เป็น 0 ดังแสดงในภาพที่ 30

ภาพที่ 30

การแสดงผลของไฟล์หลักถือเป็น level ระดับ 0 หากต้องการให้ มีการแสดงผลของไฟล์ Flash อื่นเหนือไฟล์หลักอาจให้ level เป็น 1 , 2 , 3 ….. โดย level 1 จะวางเหนือ level 0 และ level 2 อยู่เหนือ level 0 เป็นต้น เมื่อมองจากงานจริง ภาพใน level 1 จะบัง level 0 , level2 บัง level1 การกำหนด level ไม่จำเป็นจะต้องเลขเรียงลำดับ อาจกำหนดให้มี level 1 ,2 แล้วข้ามไปมี level 5 ก็ได้

เมื่อแก้เนื้องานตามที่ต้องการแล้ว บันทึกแฟ้ม และ Export เป็น swf เพื่อเก็บผลงานจริง

ดังแสดงในภาพที่ 31

ภาพที่ 31

15. เปิดแฟ้มใหม่ ใส่ข้อความ “จุดประสงค์การเรียนรู้” “ทดสอบก่อนเรียน” “เนื้อหาวิชา” “ทดสอบหลังเรียน” ใส่ Effect แล้วกด shift เลือก Object ทั้งหมด ดังแสดงในภาพที่ 32

ภาพที่ 32

16. คลิกเม้าส์ที่ Modify > convert to button จะเกิดผลดังแสดงในภาพที่ 33

ภาพที่ 33

จะเห็นได้ว่าแต่ละข้อความจะถูกคัดลอกเป็น 3 ข้อความโดยแต่ละข้อความอยู่ใน State ต่างกัน คือ Up State , Over State และ Down State

17. เลือกข้อความใต้ Over State คลิกเม้าส์ในช่องสีของ Text panel แล้วเปลี่ยนสีข้อความให้เป็นสี Magenta (คล้ายสีม่วง) ดังแสดงในภาพที่ 34

ภาพที่ 34

18. เปลี่ยนสีของข้อความที่เป็น Over State ของทุกๆ ตัวให้เป็นสีม่วงเหมือนกัน และเปลี่ยนสีของข้อความที่เป็น Down State ให้เป็นสีแดงเหมือนกัน

19. คลิกเม้าส์ที่ Frame ท้ายสุดของ Effect ในที่นี้คือ Frame ที่ 25 แล้วใส่ Action เป็น stop เพื่อให้หยุดการเคลื่อนไหว ดังแสดงในภาพที่ 35

ภาพที่ 35

20 เลือกข้อความ “จุดประสงค์การเรียนรู้” ที่ Panel ชื่อ Action คลิกที่ Add Event ดังแสดงในภาพที่ 36

ภาพที่ 36

21. คลิกเม้าส์ที่ Add Event จะเกิดเมนูย่อยเลือก On Release ดังแสดงในภาพที่ 37

ภาพที่37

23. คลิกส์เม้าส์ที่ Add Action > Load Movie ดังแสดงในภาพที่ 38

ภาพที่ 38

24. เมื่อเกิด Panel ของ Action ใส่ข้อความ object.swf ในช่อง Movie URL และให้ level เป็น 0 ดังแสดงในภาพ 39 (ในที่นี้สมมติว่า ไฟล์ที่เก็บจุดประสงค์การเรียนรู้ชื่อ object.swf ซึ่งสามารถใช้ชื่ออะไรก็ได้)

ภาพที่ 39

สร้าง Action ให้กับปุ่มอื่นๆ เช่นใน ทดสอบก่อนเรียน เป็น pretest.swf , เนื้อหาวิชา เป็น content.swf และทดสอบหลังเรียนเป็น posttest.swf ตามลำดับ

25. บันทึกไฟล์เป็น title3.swi และ Export เป็น title3.swf เก็บไว้ใน Folder เดียวกับ title1.swf และ title2.swf

26. ทดสอบการใช้งานของไฟล์ โดยการคลิกเม้าส์ที่ File > Test> In browser ดังภาพที่ 40

ภาพที่ 40

เมื่อเสร็จเรียบร้อยควรไปทดสอบการใช้งานจริงโดยการคลิกเม้าส์ที่ ไฟล์ title1.html ใน Window Explorer ดังภาพที่ 41

ภาพที่ 41

หากพบข้อบกพร่องที่ไฟล์ใดๆ ให้เปิด ไฟล์ *.swi เมื่อถูกต้องแล้ว Export ไปทับของเดิม

การสร้างเนื้อหาวิชา

เนื้อหาสาระถือเป็นหัวใจสำคัญของสื่อการเรียนการสอน ควรออกแบบมาเป็นอย่างดี และน่าจะคำนึงถึงสิ่งต่อไปนี้

-ผู้เรียนได้คิดและสรุปมโนทัศน์ (concept) ด้วยตนเอง

-เนื้อหาเป็นลำดับและมีขั้นตอน

-ซอยเนื้อหาเป็นส่วนย่อยๆ เข้าใจง่าย

-เชื่อมโยงความรู้เก่าเพื่อเข้าสู่ข้อสรุปที่เป็นความรู้ใหม่

-มีแบบฝึกทบทวนความรู้ความเข้าใจภายหลังที่เสนอมโนทัศน์ย่อยหรือมโนทัศน์หลัก

-ใช้ภาพนำเสนอสาระแทนข้อความให้มากที่สุดเท่าที่จะทำได้

-หากสาระนั้นๆ มีความสำพันธ์เชื่อมโยงถึงการเปลี่ยนแปลง ควรใช้ภาพเคลื่อนไหวนำเสนอ และหากเป็นไปได้ควรควบคุมการหยุด การเล่น เดินหน้าทีละขั้นตอน หรือถอยหลังที่ละขั้นตอนได้ เพื่อให้ผู้เรียนสามารถสังเกตการเปลี่ยนแปลงที่ละขั้นตอน

-ให้กิจกรรมผู้เรียนได้ปฏิบัติในสาระที่นำเสนอ

-ใช้คำถามนำเพื่อให้ผู้เรียนได้คิดและเชื่อมโยงไปสู่ข้อสรุป

-แบบฝึกทบทวนมีผลป้อนกลับแบบบวก เมื่อผู้เรียนทำแบบฝึกได้ถูกต้องควรมีคำชมเชยผู้เรียน หากทำไม่ถูกต้องอาจใช้ข้อความที่ให้กำลังใจ (ไม่ควรใช้คำเชิงตำหนิผู้เรียน)

-หากสามารถนำเสนอสาระแบบจำลองสถานะการณ์ (Simulation) ได้ เช่นการปฎิบัติการในวิชาวิทยาศาสตร์ย่อมเกิดผลดีกว่า

หลักการโดยทั่วไปในการสร้างสื่อการสอน

-ขนาดตัวอักษรโต และรูปแบบตัวอักษรควรเป็นแบบปกติ ไม่เป็นตัวหนา ตัวเอียง ฯลฯ

-สีตัวอักษรตัดกับสีของพื้นหลัง ทำให้อ่านข้อความได้สะดวก และสบายตา

-สีอักษรไม่มากจนเกินไป (ไม่ควรเกิน 3 สี) เช่น สีอักษรปกติ สีตัวเน้น และสีอักษรที่มีการเชื่อมโยง มีรูปแบบที่คงที่ตรงกันตลอดทั้งหมดในบทเรียน

-ไม่มีภาพหรือข้อความที่ไม่เกี่ยวข้องกับการนำเสนอเนื้อหาหรือสาระในบทเรียน

เทคนิคการสร้างเนื้อหาสาระของสื่อการสอน

หากผู้สร้างสื่อการสอนได้วางแผนล่วงหน้าเป็นอย่างดีจะใช้เวลาในการสร้างน้อยกว่า และผลงานมีคุณภาพสูงกว่า มีคำแนะนำการสร้างดังนี้

1. สร้างไฟล์ต้นฉบับของแต่ละหน้าที่จะนำเสนอเนื้อหาในบทเรียน ซึ่งประกอบด้วยปุ่มไปหน้า ย้อนกลับ เมนูหลัก หรืออาจมีปุ่มควบคุมด้านเสียง เช่นเปิดเสียง ปิดเสียง ฯลฯ บันทึกไฟล์เก็บไว้ เพื่อนำไปบันทึกใหม่ (Save As) ในโอกาสต่อไป ในที่นี้ตั้งชื่อเป็น 001.swi

2. เตรียมภาพนิ่ง ภาพเคลื่อนไหว หรือเสียง เก็บเตรียมไว้ใน Folder หนึ่ง พร้อมที่จะนำไปใช้งาน

3. มีโปรแกรมวิวภาพ เช่น ACDsee โปรแกรมตกแต่งภาพเช่น Photoshop , Firework โปรแกรมตกแต่งเสียง เช่น (AudioRec) , Samplitude

4. มีโปรแกรม Web Browser เช่น Internet Explorer , Netcape communicator หรือ opera

เพื่อใช้ในการทดสอบชิ้นงาน

การใช้งานโปรแกรมเหล่านี้เมื่อใช้งานเสร็จในโปรแกรมใด ไม่ควรปิดแต่สามารถเปิดโปรแกรมที่ต้องการใช้งานใหม่ เมื่อต้องการเปลี่ยนโปรแกรมทำได้โดยการกด Alt+Tab เพื่อเลือกโปรแกรมใช้งาน

ขั้นตอนการสร้าง

1. เปิดโปรแกรม คลิกเม้าส์ที่ File > New แล้วตรวจสอบขนาดของไฟล์ เป็น 760 x 560 pixel

เพื่อให้แสดงผลได้เต็มจอภาพ และไม่มีแถบเลื่อนทั้งแนวระดับและแนวดิ่ง

2. คลิกเม้าส์ที่ Insert > Image นำภาพเข้ามาสร้างปุ่มไปหน้า ปุ่มถอยหลัง ปุ่มไปเมนูหลัก (ในที่นี้ next10.gif, back10.gif, home2.gif ใน Folder ย่อยชื่อ webtool ซึ่งอยู่ใน Folder หลักชื่อ animate ซึ่งมีให้พร้อมแล้ว หรืออาจสร้างเอง ) หากภาพดังกล่าวหากเป็นภาพประเภท gif animator ควรเลือก Select All Frames ซึ่งจะทำให้ได้ภาพแบบเคลื่อนไหวเหมือนต้นฉบับ แล้วพิมพ์เลขหน้า ที่มุมขวาบน ได้ผลดังแสดงในภาพที่ 42

ภาพที่ 42

2. คลิกเลือกภาพทั้ง 3 โดยการกด Shift ค้าง จะทำให้เกิด Handle ล้อมรอบภาพทั้ง 3 คลิกที่เมนู Modify > convert > convert to button ดังแสดงในภาพที่ 43

ภาพที่ 43

3. คลิกที่ Over state ของแต่ละ Button ใน Outline เพื่อเลือก Object แล้วคลิก Insert text ที่ Toolbar เพื่อพิมพ์ข้อความแต่ละปุ่มเป็น ต่อไป ย้อนกลับ และเมนูหลัก ดังแสดงในภาพที่ 44

ภาพที่ 44

4. ควรทดลองผลการสร้างงานโดยการคลิกที่ปุ่ม Play แล้วนำเม้าส์วางเหนือปุ่มต่างๆ ซึ่งควรจะมีข้อความแสดง ดังแสดงในภาพที่ 45

ภาพที่ 45

เมื่อนำเม้าส์ออกจากปุ่มข้อความต่างๆ ที่ปรากฏควรหายไป

5. ที่ปุ่มเมนูหลัก ใส่ Action (คลิกเม้าส์ที่ Stop ก่อนแก้ไข) โดยการคลิกเม้าส์ขวาบนปุ่ม คลิกต่อที่ Event > On Release ดังแสดงในภาพที่ 46

ภาพที่ 46

6. คลิกเม้าส์ที่ Add Action เพื่อใส่คำสั่ง เมื่อผู้ใช้คลิกเม้าส์ที่ปุ่มนี้ แล้วส่งผลให้โปรแกรมไปเปิดไฟล์เมนูหลักแทนที่ ซึ่งปุ่มนี้จะมีเหมือนกันทุกๆ หน้า พิมพ์ชื่อไฟล์ลงใน Movie URL เป็น title3.swf (ไฟล์เมนูหลัก) และให้ level เป็น 0 ซึ่งเป็น level เดียวกับไฟล์ที่กำลังสั่งงาน ดังแสดงในภาพที่ 47

ภาพที่ 47

7. บันทึกไฟล์ ชื่อ 001.swi เพื่อเก็บเป็นต้นฉบับสำหรับใช้ Save As เป็นชื่ออื่นๆ ต่อไป (เป็นเทคนิคที่ทำให้แต่ละหน้า มีปุ่มขนาดเดียวกัน ตำแหน่งเดียวกันทุกๆ หน้า และไม่ควรให้เกิดการเปลี่ยนแปลงในไฟล์นี้ หากต้องการใช้ ควรเปิดไฟล์แล้ว Save As เป็นชื่ออื่นทันที) ดังแสดงในภาพที่ 48

ภาพที่ 48

8. บันทึกไฟล์นี้ใหม่ด้วยการ Save As เป็น p001.swi (ส่วนขยายอาจมองไม่เห็นเราสามารถพิมพ์แค่ p001 ส่วนขยายโปรแกรมจะใส่ให้เอง หรืออาจพิมพ์ส่วนขยายด้วยก็ได้) แล้ว Save As เตรียมไว้หลายๆ ไฟล์ เช่น p002, p003, p004 …….

9. ที่ไฟล์ p001.swi ใส่ Action (ใช้วิธีการตามข้อ 6) ในปุ่มต่อไป เป็น p002.swf ให้ level เป็น0 ปุ่มย้อนกลับอาจเป็น title3.swf และ level เป็น 0

หากเป็นไฟล์ p002.swi ปุ่มต่อไป ใส่ Action เป็น p003.swf ให้ level เป็น0 ปุ่มย้อนกลับอาจเป็น p001.swf และ level เป็น 0 เพื่อให้สามารถเชื่อมโยงเปิดไฟล์ต่างๆ ตามต้องการ

เทคนิคการโหลด Movie หลายระดับ

การโหลด Movie ที่มี level หลาย level ที่ให้เราสามารถนำเสนอสาระได้หลายไฟล์พร้อมกันโดยให้ต่าง level กัน level ตัวเลขค่าน้อยอยู่ด้านล่าง ตัวเลขค่ามากสามารถบัง Object ที่มี level ต่ำกว่า เทคนิคนี้สามารถนำมาใช้เพื่อเพิ่มรายละเอียดของสาระในสื่อการสอนเป็นอย่างดี เช่น สอนคำศัพท์ภาษาอังกฤษ สมมติสถานการณ์ว่า มีภาพสัตว์ เมื่อนำเม้าส์วางเหนือตัวสัตว์ ให้มีข้อความเป็นคำศัพท์ภาษาอังกฤษ และเมื่อคลิกเม้าส์ ให้เกิดเสียงของคำศัพท์ภาษาอังกฤษนั้น ดังตัวอย่าง

1. แทรกภาพสัตว์ตามที่ต้องการ ดังแสดงในภาพที่ 49 (ขั้นตอนในการแทรกภาพได้กล่าวมาแล้ว)

ภาพที่ 49

2. คลิกที่ File > New window เพื่อเปิดโปรแกรม Swish ตัวใหม่อีก 1 ตัว คลิกเม้าส์ที่ view >ruler และ view > show grid เพื่อให้มองเห็นเส้นกริด สามารถวางตำแหน่งของข้อความ หรือภาพ ได้อย่างแม่นยำ ดังแสดงในภาพที่ 50

ภาพที่ 50

3. พิมพ์ข้อความ RABBIT แล้วบันทึกชื่อไฟล์เป็น p001a.swi แล้ว export เป็น p001a.swf ในทำนองเดียวกันสร้าง File ใหม่ พิมพ์ข้อความ p001b.swi แล้ว export เป็น p001b.swf โดยไม่ให้ข้อความอยู่ในตำแหน่งเดียวกับภาพในไฟล์ p001.swi

4. บันทึกเสียง ให้มีเสียงเปล่งเป็น rabbit เป็นชื่อไฟล์ใดๆ สมมติว่าเป็น sound1.wav และบันทึกเสียงให้มีเสียงเปล่งเป็น cat สมมติเป็น sound2.wav ทั้งสองไฟล์ดังกล่าวสร้างไว้ชั่วคราวไม่ได้นำไปใช้งานจริง (ไฟล์เสียงทั้งสองหากนำไป insert ลงไฟล์ swf แล้วสามารถลบทั้งได้)

5. เปิดไฟล์ใหม่ คลิก insert > content จะเกิดหน้าต่าง open แล้วเปิด ไฟล์ sound1.wav เสียงจากไฟล์ sound1.wav จะเข้าไปอยู่ใน File ประเภท swf จะเห็นได้ว่า ไฟล์เสียงนี้ไม่มีภาพหรือ object ใดๆ ประกอบอยู่ด้วย ดังแสดงในภาพที่ 51

ภาพที่ 51

6. จะเห็นรูปลำโพงใน Timeline แสดงว่าเสียงเข้ามาเรียบร้อยแล้ว สามารถคลิกเม้าส์ที่ play เพื่อทดสอบฟังเสียงได้ หากเห็นว่าถูกต้องดีแล้ว บันทึกชื่อไฟล์เป็น p001as.swi และ export เป็น p001as.swf (เป็นไฟล์เสียงที่อยู่ในรูปแบบของ *.swf ซึ่งทำให้ขนาดของไฟล์เล็กลงมากและใช้งานในโปรแกรม swish ได้สะดวก )

7. ทำเช่นเดียวกับข้อ 6 คือสร้างไฟล์เสียงในรูปแบบของ swf โดยให้ชื่อไฟล์เป็น p001bs.swf

(การกำหนดชื่อไฟล์ในลักษณะนี้ทำให้เราสามารถกลับมาแก้ไขได้ง่ายเมื่อพบข้อผิดพลาด เราสามารถเข้าใจได้ทันทีว่า ชื่อไฟล์ขึ้นต้นด้วย p001 แสดงว่าเป็นองค์ประกอบของหน้า 1)

8. กด Alt+ tab เพื่อเปลี่ยนหน้าต่างของโปรแกรมไปเป็นไฟล์ p001.swi แล้วคลิกเม้าส์ขวาที่รูปกระต่าย จะเกิดหน้าต่างของเมนูย่อยเลือก event > On Roll Over แล้วคลิกเม้าส์ที่ Add Action >Load Movie ดังแสดงในภาพที่ 52

ภาพที่ 52

9. เกิดหน้าต่าง Action แล้วพิมพ์ข้อความในช่อง Movie URL เป็น p001a.swf และในช่อง level พิมพ์เลข 1 ( level เป็น 1 จะแสดงผลเหนือ level 0 ซึ่งเป็นการแสดงผลของไฟล์ p001.swf ) คลิกเม้าส์ต่อที่ On (Roll Over) > Add Event >On Roll Out ดังแสดงในภาพที่ 53

ภาพที่ 53

10. คลิกเม้าส์ที่ Add Action > Unload Movie ใน Panel Action ใส่เลข 1 ในช่อง level

เพื่อสั่งงานให้ภาพเคลื่อนไหวจากไฟล์ p001a.swf ซึ่งอยู่ใน level 1 เช่นเดียวกันถอนตัวออกจากหน่วยความจำ (Load level ใดเมื่อถอนออกใช้ level เดียวกัน) ดังแสดงในภาพที่ 54

ภาพที่ 54

11.คลิกเม้าส์ที่ Event ใดๆ เช่น On Roll Out > Add Event > เลือก On Release > Add Action แล้วพิมพ์ข้อความในช่อง Movie URL เป็น p001as.swf แล้วให้ level เป็น 5 เพื่อให้ออกเสียงเมื่อปล่อยเม้าส์ (ในกรณีนี้ไม่ Unload Movie เนื่องจากหากมี Movie อื่นมาแสดงผลใน level 5 อีก Movie ตัวนี้จะหลุดออกเองโดยอัตโนมัติ หรือหากเปลี่ยน Movieของ level 0 การแสดงผลของ level 5 จะถูก Unload ไปด้วย โปรดสังเกตว่า การ load Movie ไม่จำเป็นจะต้อง เรียง level 1 2 3 …..ก็ได้) ดังแสดงในภาพที่ 55

ภาพที่ 55

12.คลิกเม้าส์ขวาที่รูปแมวแล้วทำข้อ 8 , 9,10 และ 11 ซ้ำอีกครั้งหนึ่งโดยชื่อไฟล์จาก p001a.swf และเปลี่ยนจาก p001as.swf เป็น p001bs.swf ดังแสดงในภาพ ที่ 56

ภาพที่ 56

13. บันทึกไฟล์ แล้ว export เป็น p001.swf ตามเดิม

14. ทดสอบการทำงานจริงโดยเปิด window explorer แล้วคลิกเม้าส์เพื่อทดสอบการทำงานด้วยการเปิดไฟ title1.html เพื่อเริ่มดูการแสดงผลตั้งแต่ไฟล์แรก

หากเกิดข้อพลาดที่จะต้องแก้ไขใด ให้เปิดไฟล์ *.swi เพื่อแก้ไข แล้ว export ทับไฟล์เก่า จนกว่าใช้การได้

การสร้างไฟล์จุดประสงค์การเรียนรู้ (Object.swf) ซึ่งอาจเป็นไฟล์เล็กเพียงหน้าเดียว ก็สามารถประยุกต์ความรู้จากที่ได้กล่าวมาแล้วได้

การสร้างไฟล์ข้อสอบ จำเป็นต้องใช้โปรแกรม Flash เนื่องจากเป็นโปรแกรมที่รับตัวแปร สามารถเขียนเป็นโปรแกรมเพื่อรวมคะแนน ฯลฯ ซึ่งได้สร้างรูปแบบไว้ใช้งานเผยแพร่ใน website ซึ่งมีที่อยู่เป็น (เป็นการชั่วคราว อาจเปลี่ยนแปลงในโอกาสต่อไป)