ทดลองใช้ Agora Flexible Classroom สร้างห้องเรียนเสมือนจริง
เจาะลึกการติดตั้ง Agora Flexible Classroom บน Electron เดสก์ท็อปใน 1 บ่าย พร้อมฟีเจอร์ห้องเรียน ห้องสอบ และโหมดการใช้งานจริง
ภาพประกอบจากคลังภาพสต็อก ไม่ใช่ภาพจากเหตุการณ์จริง
- ทีมพัฒนา ed-tech มักพบปัญหาว่าวิดีโอคอลทั่วไปไม่เพียงพอสำหรับห้องเรียน
- Agora Flexible Classroom มอบ UI ห้องเรียนสำเร็จรูปบน Electron สำหรับ Windows และ macOS
- การติดตั้งใน 1 บ่ายทำได้ผ่าน Node.js 16, Git, Yarn และ App ID จากคอนโซล
- มีฟีเจอร์ครอบคลุมตั้งแต่ไวท์บอร์ด ห้องกลุ่มย่อย จนถึงโหมดคุมสอบ
ทีมพัฒนา ed-tech ทุกทีมมักจะต้องเผชิญกับข้อจำกัดเดิมๆ เมื่อต้องสร้างระบบการเรียนการสอนออนไลน์ วิดีโอคอลทั่วไปอาจเพียงพอสำหรับการประชุม แต่ห้องเรียนต้องการอะไรที่มากกว่านั้น เช่น การที่ครูสามารถเปิดไมค์ให้นักเรียน ไวท์บอร์ดที่ซิงค์ตรงกันสำหรับเด็ก 40 คน หรือห้องกลุ่มย่อยที่ไม่หลุด การสร้างระบบเหล่านี้ทั้งหมดจาก WebRTC ดิบๆ ถือเป็นโปรเจกต์ที่ใช้เวลาเป็นภาคเรียนด้วยซ้ำ แทนที่จะสร้างเอง บทความนี้จึงพาไปทดลองติดตั้ง Agora Flexible Classroom เวอร์ชันเดสก์ท็อป เพื่อดูว่าการตั้งค่าไฟล์ .env เพียงไฟล์เดียวกับการทำงานในหนึ่งบ่ายจะพาเราไปได้ไกลแค่ไหน
ผลลัพธ์ที่ได้นั้นไปได้ไกลกว่าที่คาดไว้ นี่คือคู่มือการใช้งานที่ผู้เขียนอยากรู้ก่อนเริ่มต้น ทั้งสิ่งที่ Flexible Classroom เป็นจริง ๆ ขั้นตอนที่แน่นอนในการรันระบบในเครื่อง และกรณีการใช้งานจริงในโลกแห่งความเป็นจริง
Flexible Classroom ไม่ใช่แค่วิดีโอคอลวิดเจ็ตที่แปะลงบนหน้าเว็บ แต่มันคือ UI ห้องเรียนที่มีเลย์เอาต์ บทบาท และรูปแบบการโต้ตอบประกอบเสร็จสรรพ ทำงานอยู่บนเอนจิ้นเรียลไทม์ของ Agora ภายในระบบคุณจะได้รับวิดีโอและเสียงที่มีความหน่วงต่ำผ่าน SD-RTN, ช่องข้อความเรียลไทม์สำหรับการซิงค์สถานะ และไวท์บอร์ดแบบอินเทอร์แอกทีฟ โดยทั้งหมดถูกจัดกลุ่มในรูปแบบที่เอกสารเรียกว่า "ชั้นเรียนขนาดเล็ก", "1 ต่อ 1" และ "ห้องบรรยาย" โดยโค้ดนี้ถูกสร้างเป็นไคลเอนต์เดสก์ท็อป Electron แทนที่จะเป็นแท็บเบราว์เซอร์ ซึ่งใช้เอนจิ้นเดียวกันแต่แพ็กเกจเป็นแอปเนทีฟสำหรับ Windows และ macOS
ภาพประกอบจากคลังภาพสต็อก ไม่ใช่ภาพจากเหตุการณ์จริง
การเลือกใช้โซลูชันสำเร็จรูปอย่าง Agora Flexible Classroom ช่วยลดภาระงานด้านสถาปัตยกรรมระบบเรียลไทม์และการจัดการเครือข่ายที่ซับซ้อนอย่างมาก ช่วยให้นักพัฒนาสามารถมุ่งเน้นไปที่ประสบการณ์ผู้ใช้งานและการปรับแต่งฟีเจอร์เฉพาะของแพลตฟอร์มการศึกษาแทนที่จะเสียเวลาเขียนโค้ดพื้นฐานใหม่ทั้งหมด
ก่อนจะแตะเทอร์มินัล สิ่งสำคัญคือต้องรู้ว่าสิ่งที่คุณจะได้จากไฟล์ .env นั้นมีอะไรบ้าง Flexible Classroom มาพร้อมกับชุดซีนที่สร้างไว้ล่วงหน้า (SDK ในรีโปนี้ถูกแบ่งเป็น UI คิดห้องเรียน, เลเยอร์สถานะการศึกษา และเลเยอร์การส่งผ่านข้อมูลเรียลไทม์) ซึ่งรวมกันเป็น 4 กลุ่มฟีเจอร์หลัก:
- การติวแบบ 1 ต่อ 1 ไปจนถึงชั้นเรียนขนาดเล็กประมาณ 50 คน
- ห้องบรรยายสำหรับกลุ่มใหญ่ (ใชSDK ตัวเดียวกันแต่กำหนดค่าซีนต่างกัน)
ไม่มีฟีเจอร์ใดที่ถูกฝังตายตัวในเลย์เอาต์ ทุกอย่างรวมถึงไวท์บอร์ดคือบันเดิลของตัวเองในแกลเลอรีปลั๊กอินของ SDK และจะถูกโหลดตามซีน ซึ่งทำให้เกิดฟีเจอร์ระดับถัดไปที่เปิดใช้งานเฉพาะในบางเซสชันเท่านั้น:
- ไวท์บอร์ด
- ห้องแชท
- โหวต / โพล
- ตอบคำถาม / ควิซ
- ตัวนับถอยหลัง
- ลายน้ำ
- สตรีมมีเดีย
- ฝังเว็บวิว
นอกจากนี้ยังมีแพ็กเกจพิเศษที่แยกต่างหากอย่างแท้จริงคือ agora-proctor-sdk ซึ่งแปลงห้องเรียนให้กลายเป็นห้องสอบที่มีการควบคุมดูแล แทนที่จะเป็นแค่บทเรียนปกติ
ขั้นตอนการติดตั้งระบบเบื้องต้นในเครื่องมีดังนี้:
- เตรียมข้อกำหนดเบื้องต้น: Git, Node.js 16 (ยังไม่รองรับเวอร์ชัน 18 ขึ้นไป) และ Yarn บัญชี Agora ที่เปิดใช้งาน Flexible Classroom ในคอนโซล และการเชื่อมต่อที่ไม่ติดไฟร์วอลล์
- โคลนเดสก์ท็อปรีโปและเลือกเวอร์ชัน release/2.9.0
- ดึงข้อมูลซับโมดูลทั้งหมดด้วยคำสั่งติดตั้งแพ็กเกจ
- ใส่ App ID และ Certificate จากคอนโซล Agora เพื่อให้ไคลเอนต์สร้าง RTM โคนได้เอง
- ทดสอบการทำงานด้วยการเข้าใช้งาน 2 บทบาทคือ ครูและนักเรียน เพื่อดูการซิงค์วิดีโอและไวท์บอร์ด
- ทางเลือกเพิ่มเติม: แพ็กเกจเป็นแอปเนทีฟสำหรับ Mac หรือ Windows
ที่มา: Dev.to
พบข้อมูลผิดพลาดในบทความนี้? แจ้งปัญหาบทความนี้
ความคิดเห็น
แสดงความคิดเห็น