วิดีโอสอน

วิดีโอด้านล่างแสดงวิธีใช้วิดีโอเชิงโต้ตอบและวิธีใช้งาน:

บทช่วยสอนที่เป็นข้อความ - ตัวอย่าง

นี่คือวิดีโอเชิงโต้ตอบที่เราจะสร้างในบทช่วยสอนนี้:

เมื่อใดควรใช้วิดีโอเชิงโต้ตอบ

วิดีโอแบบอินเทอร์แอกทีฟนั้นสมบูรณ์แบบเมื่อคุณมีวิดีโอคลิปที่ต้องการเพิ่มองค์ประกอบแบบอินเทอร์แอกทีฟอยู่แล้ว

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

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

ขั้นตอนที่ 1: หัวข้อ

เราจะใช้วิดีโอสั้นๆ ของเรดเคอแรนท์เป็นพื้นฐานสำหรับบทช่วยสอนนี้

พุ่มไม้สีแดงจากPhil Fried บนVimeo

วิดีโอด้านบนได้รับอนุญาตจากใบอนุญาต Creative Commons Attribution ShareAlike (วิดีโอใน

  และ   (คลิกลิงก์และคลิกขวาที่วิดีโอในหน้าใหม่ จากนั้นเลือก "บันทึกวิดีโอเป็น") 

ขั้นตอนที่ 2: ไฟล์วิดีโอ

คลิปวิดีโอเป็นรากฐานที่สำคัญของวิดีโอเชิงโต้ตอบใดๆ

รูปแบบวิดีโอ .mp4 จะใช้งานได้ในเบราว์เซอร์ส่วนใหญ่ อย่างไรก็ตาม คุณควรจัดหาวิดีโอสำรองในรูปแบบ webm เพื่อความแน่ใจ

ตัวอย่างเช่น เบราว์เซอร์ Opera ไม่รองรับรูปแบบ .mp4 เลย คุณสามารถตรวจสอบเบราว์เซอร์ที่รองรับรูปแบบวิดีโอ .mp4  ได้ที่นี่

ในการแปลงวิดีโอ mp4 เป็นรูป แบบ  WebM คุณสามารถใช้ตัวแปลงโอเพ่นซอร์ส เช่นMiro

ขั้นตอนที่ 3: สร้างวิดีโอเชิงโต้ตอบ

เลือก  ตัวเลือก เนื้อหาใหม่  แล้วเลือก วิดีโอแบบโต้ตอบ จากรายการประเภทเนื้อหา:

ขั้นตอนที่ 4: โปรแกรมตัดต่อวิดีโอแบบโต้ตอบ

โปรแกรมตัดต่อวิดีโอแบบโต้ตอบควรปรากฏขึ้น ส่วนบนของโปรแกรมแก้ไขมีลักษณะดังนี้:

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

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

ขั้นตอนที่ 5: อัปโหลดวิดีโอ

นี่คือที่ที่เราเพิ่มคลิปวิดีโอซึ่งอิงจากวิดีโออินเทอร์แอกทีฟของเรา 

กดปุ่ม "+" จากนั้นกดปุ่ม "อัปโหลดไฟล์วิดีโอ":

เรียกดูตำแหน่งที่คุณดาวน์โหลดไฟล์วิดีโอ mp4 จากขั้นตอนที่ 1 และอัปโหลดวิดีโอ ไอคอนสี่เหลี่ยมสีดำที่มี mp4 เขียนอยู่จะปรากฏขึ้น:

กดปุ่มบวกอีกครั้งเพื่อเพิ่มรูปแบบวิดีโอทางเลือกเพื่อให้แน่ใจว่ารองรับในทุกเบราว์เซอร์ ค้นหาและอัปโหลดคลิปวิดีโอในรูปแบบ WebM ที่คุณแปลงจาก mp4 ในขั้นตอนที่ 2:

เพิ่มป้ายกำกับที่เกี่ยวข้องสำหรับระดับคุณภาพทั้งสอง ตอนนี้ แก้ไขข้อมูลลิขสิทธิ์โดยกด ปุ่ม แก้ไขลิขสิทธิ์ด้านล่างไอคอนคลิปวิดีโอสีดำ:

เนื่องจากเราใช้คลิปวิดีโอที่ได้รับอนุญาตของครีเอทีฟคอมมอนส์ เราจึงเพิ่มข้อมูลด้านล่างในกล่องโต้ตอบแก้ไขลิขสิทธิ์

Title: -> Berries
Author: Fred Rune Rahm
Source: https://vimeo.com/15132262 License: Attribution-ShareAlike License Version:  3.0 Unported 

ตอนนี้เราได้เพิ่มไฟล์วิดีโอและข้อมูลลิขสิทธิ์แล้ว เราก็พร้อมที่จะเพิ่มการโต้ตอบ

ขั้นตอนที่ 6: เพิ่มการโต้ตอบ

กด แท็บ เพิ่มการโต้ตอบที่ด้านบนของตัวแก้ไข วิดีโอคลิปที่เราเพิ่มในขั้นตอนก่อนหน้านี้จะแสดงตัวอย่าง:

เราใช้แถบเครื่องมือด้านบนวิดีโอคลิปเพื่อเพิ่มการโต้ตอบ:

การโต้ตอบมีสามประเภท:

• การโต้ตอบแบบทดสอบ (คำถาม) แสดงเป็นปุ่มสีน้ำเงิน
• การโต้ตอบอย่างง่าย (ข้อความ รูปภาพ ตาราง) แสดงเป็นปุ่มสีม่วงและ
• การโต้ตอบแบบปรับตัว (ไปที่)

ในบทช่วยสอนนี้ เราจะเพิ่มการโต้ตอบระหว่าง  ข้อความและ  รูปภาพ

ขั้นตอนที่ 7: การโต้ตอบกับข้อความ

เราจะเพิ่มข้อความสั้นๆ เกี่ยวกับ Redcurrants ซึ่งผู้เรียนสามารถเลือกอ่านได้ 

ขั้นแรก เพิ่ม การโต้ตอบ ด้วยข้อความโดยกด ปุ่ม ข้อความ   บนแถบเครื่องมือ จากนั้นลากไปด้านบนของวิดีโอแล้ววางตรงกลางวิดีโอ กล่องโต้ตอบจะปรากฏขึ้นเมื่อคุณยกเลิกการโต้ตอบ

เราต้องการให้ข้อความโต้ตอบปรากฏในสามวินาทีแรกของวิดีโอ พิมพ์ 0:00 เป็นเวลาเริ่มต้นและ 0:03 เป็นเวลาสิ้นสุดในฟิลด์แสดงเวลา ในกรณีนี้ เราไม่ต้องการให้วิดีโอหยุดโดยอัตโนมัติเมื่อมีการโต้ตอบปรากฏขึ้น ดังนั้นเราจะไม่เลือกช่องทำเครื่องหมาย  หยุด ชั่วคราว

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

ในช่อง Text เราจะเพิ่มข้อความข้อมูลเชิงลึกเกี่ยวกับ Redcurrants ที่ถอดความจาก  Wiktionary :

เรดเคอแรนท์เป็นผลเบอร์รี่ที่กินได้สีแดงสดของไม้พุ่ม Ribes rubrum ซึ่งมีถิ่นกำเนิดในยุโรปตะวันตก

กดเสร็จสิ้น ตอนนี้คุณจะเห็นว่ามีการเพิ่มไอคอนที่มีป้ายกำกับRedcurrantsลงในวิดีโอ:

นอกจากนี้ ยังมีการเพิ่มจุดสีขาวลงในไทม์ไลน์ด้านล่างวิดีโอ เพื่อระบุว่ามีการโต้ตอบในวิดีโอ ณ จุดนี้:

เล่นวิดีโอเพื่อให้แน่ใจว่ามองเห็นการโต้ตอบในเวลาที่ถูกต้อง

กดสองครั้งที่ไอคอนการโต้ตอบเพื่อแก้ไของค์ประกอบแบบโต้ตอบ 

ขั้นตอนที่ 8: การโต้ตอบกับรูปภาพ

เราจะเพิ่มการโต้ตอบภาพสองภาพที่แสดงลูกเกดชนิดอื่นซึ่งผู้เรียนสามารถดูได้โดยการกดที่ไอคอนรูปภาพ 

ด้านล่างนี้คือลิงก์ไปยังรูปภาพที่พบในวิกิมีเดียคอมมอนส์ที่เราจะใช้:

• ภาพลูกเกดดำ
• ภาพลูกเกดขาว

คุณสามารถเพิ่ม การโต้ตอบกับ รูปภาพ ได้ในลักษณะเดียวกับที่เราเพิ่มการโต้ตอบกับข้อความ กด ปุ่ม Image  ลากไปที่วิดีโอแล้ววางในตำแหน่งที่เราต้องการวาง  

ใน การโต้ตอบกับ รูปภาพ ครั้งแรก เราเพิ่มรูปภาพแบล็คเคอแรนท์ ใน ฟิลด์ แสดง เวลาให้ใส่ 0:03 - 0:03 คราวนี้เราจะเลือก ช่องทำเครื่องหมาย หยุดชั่วคราวเพื่อให้วิดีโอหยุดชั่วคราวเมื่อการโต้ตอบปรากฏขึ้น เพิ่มป้ายกำกับ Blackcurrants นอกจากนี้ ใช้Blackcurrantsสำหรับช่องข้อความแสดงแทนและช่องข้อความโฮเวอร์ กดเสร็จสิ้น

อย่าลืมเพิ่มข้อมูลใบอนุญาตที่เหมาะสมเมื่อใช้มัลติมีเดียที่คุณไม่ได้เป็นเจ้าของสิทธิ์

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

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

ขั้นตอนที่ 9: สรุป

ในตอน ท้ายของวิดีโอเชิงโต้ตอบ คุณสามารถเพิ่มบทสรุป บทสรุปมีจุดมุ่งหมายเพื่อให้ผู้เรียนสะท้อนเนื้อหาการเรียนรู้ที่นำเสนอในวิดีโอ 

เราจะเพิ่มกลุ่มคำสั่งสองกลุ่มในสรุป สำหรับคำอธิบายโดยละเอียดเกี่ยวกับวิธีสร้างบทสรุปคุณสามารถอ่าน  บทช่วยสอนนี้ได้

ใน กลุ่ม คำสั่ง แรก ให้เพิ่มคำสั่งต่อไปนี้: 

ลูกเกดแดงมีถิ่นกำเนิดในยุโรปตะวันตก

ลูกเกดแดงมีถิ่นกำเนิดในแอฟริกาตอนเหนือ

ลูกเกดแดงมีถิ่นกำเนิดในเอเชียใต้

ข้อความแรกคือข้อความที่ถูกต้อง ตอนนี้คุณควรมีสิ่งนี้:

หากต้องการสร้างกลุ่มงบ อื่น ให้กด ปุ่มเพิ่มงบ ใน กลุ่ม งบ ที่สอง เพิ่มคำสั่งต่อไปนี้: 

ลูกเกดอื่นๆ ได้แก่ ลูกเกดดำและลูกเกดขาว 

ลูกเกดอื่นๆ ได้แก่ ลูกเกดสีน้ำเงินและลูกเกดเหลือง 

ลูกเกดอื่น ๆ ได้แก่ Greencurrants และ Orangecurrants

ข้อความแรกเป็นข้อความที่ถูกต้องที่นี่เช่นกัน 

ขั้นตอนที่ 10: ที่คั่นหน้า

แม้ว่าวิดีโอตัวอย่างที่เราใช้ที่นี่จะสั้นมาก แต่เราจะเพิ่มบุ๊กมาร์กบางส่วน บุ๊กมาร์กใช้เพื่อระบุหัวข้อใหม่ การโต้ตอบที่สำคัญ หรือเหตุการณ์ภายในวิดีโอ

กลับไปที่  ขั้นตอน เพิ่มการโต้ตอบ  โดยกดแท็บนี้ที่ด้านบนของตัวแก้ไข

บุ๊กมาร์กจะแสดงในเมนูบุ๊กมาร์ก ซึ่งเปิดขึ้นโดยการกด ปุ่ม บุ๊กมาร์กถัดจาก ปุ่ม เล่น :

คุณเพิ่มบุ๊กมาร์กโดยเลื่อนหัวเล่นไปยังจุดที่ต้องการในวิดีโอแล้วกด   ปุ่มบุ๊กมาร์ก

เราจะเพิ่มบุ๊กมาร์กที่การโต้ตอบแต่ละครั้งจะปรากฏในวิดีโอ 

เลื่อนหัวเล่นไปที่ 0:00 แล้วกดปุ่ม  บุ๊กมาร์ก

จากเมนู กดAdd bookmark : 

เพิ่มป้ายกำกับ  Redcurrants ไปที่บุ๊กมาร์กแล้วกดEnterบนแป้นพิมพ์

ย้ายการเล่น- ไปที่ 0:03 เพิ่มบุ๊กมาร์กและติดป้ายกำกับลูกเกดอื่นๆ สุดท้าย ย้ายหัวเล่นไปที่ 0:04 และเพิ่มบุ๊กมาร์กที่มีป้ายกำกับ  ว่าสรุป

บุ๊กมาร์กแต่ละรายการจะแสดงด้วยเส้นสีเทาแนวตั้งบนแถบค้นหา ผู้เรียนสามารถข้ามไปยังบทได้โดยตรงโดยการกดที่คั่นหน้าในเมนูที่คั่นหน้า 

ตอนนี้คุณควรมีสิ่งนี้:

คุณสามารถแก้ไขป้ายกำกับบุ๊กมาร์กได้โดยเลื่อนตัวชี้ตำแหน่งเพื่อให้บุ๊กมาร์กที่คุณต้องการแก้ไขปรากฏขึ้น วางเคอร์เซอร์ในข้อความบุ๊กมาร์กและแก้ไขข้อความโดยตรง คุณลบบุ๊กมาร์กโดยกด ปุ่มทางด้านขวาของป้ายกำกับบุ๊กมาร์ก 

ขั้นตอนที่ 11: จบหน้าจอ

วิดีโอเชิงโต้ตอบที่มีคำถามฝังอยู่จะมี End Screen ต่อท้าย End Screen มีข้อมูลสรุปของคำถามที่ตอบทั้งหมด พร้อมด้วยคะแนนที่ได้รับสำหรับแต่ละคำถาม ผู้ใช้อาจย้อนกลับไปยังคำถามที่ยังไม่ได้ตอบ ตอบคำถาม และ End Screen จะได้รับการอัปเดตตามนั้น

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

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

ขั้นตอนที่ 12: เสร็จสิ้น

บันทึกโหนด/บทความเพื่อดูวิดีโอเชิงโต้ตอบที่เสร็จสมบูรณ์ของคุณ
ตอนนี้คุณควรมีผลลัพธ์เหมือนกับตัวอย่างที่อ้างถึงด้านบนของหน้า  

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