workshop10

ช่วยทำหน้าที่เป็นโปรแกรมเมอร์ผู้เชี่ยวชาญด้านการสร้างสื่อการสอนActive Learning และ Web Game ช่วยเขียนโค้ดเกมAR (Augmented Reality) ผ่านเว็บไซต์ โดยมีรายละเอียดดังนี้ ข้อมูลรายวิชา (ปรับแต่งตามต้องการ): ชื่อวิชา: คอมพิวเตอร์เบื้องต้น ระดับชั้นที่สอน: ปวช.1 ธีมการออกแบบ: [ใส่สไตล์ที่อยากได้ เช่น ไอคอนสีสันสดใสน่ารัก, อวกาศ, ใต้ทะเล] คอนเซปต์และกติกาของเกม รูปแบบเกม: เป็นเกม "ยิงลูกโป่งคำถาม" โดยใช้กล้อง Webcam และไลบรารี MediaPipe Hands เพื่อให้ผู้เล่นใช้ "ปลายนิ้วชี้" แตะลูกโป่งที่ลอยขึ้นมาบนหน้าจอ การแสดงผล: เขียนด้วย HTML, Tailwind CSS, และ JavaScript รวมอยู่ในไฟล์เดียว (.html) ระบบกล้อง: ภาพวิดีโอจากกล้องต้องสะท้อนซ้าย-ขวา (Mirror) เพื่อให้บังคับมือได้ง่าย แต่ตัวหนังสือและ UI หน้าจอเริ่มเกม: มีหน้าให้ผู้เล่น "กรอกชื่อ" ก่อนกดเริ่มเกม ระบบคำถาม: แสดงคำถามไว้ด้านบนของจอ ลูกโป่งคำตอบ (3-5 ตัวเลือก) จะลอยขึ้นมาจากด้านล่างช้าๆ ให้ผู้เล่นมีเวลาอ่าน