จากไอเดียสู่สื่อดิจิทัล

ช่วงที่ 4 เวลา 15.30 ถึง 16.15 น.

ห้องเว็บแอป
ชิ้นที่ 3 เว็บแอปบทเรียนวิดีโอ GPAS

นำบทเรียน Edpuzzle ที่มีลิงก์บอตแล้ว มาสร้างเป็นเว็บแอปด้วย Gemini Canvas มีโหมดนักเรียนพร้อมแบบทดสอบท้ายบท และโหมดครูที่แสดงขั้น GPAS ครูสั่งด้วยคำสั่ง 3 รอบ W1 ถึง W3 และตรวจทุกรอบ

GPA1A2S

15.30 ถึง 15.35 น. ดูตัวอย่างก่อน

เว็บแอปบทเรียนวิดีโอ GPAS

เล่นเป็นนักเรียนจนจบ แล้วสลับเป็นโหมดครู

โหมดนักเรียน 8 หน้า

  1. ปก จุดประสงค์ และข้อตกลง
  2. ทำนายก่อนดู (G)
  3. บทเรียน Edpuzzle ฝังในหน้า
  4. คิดต่อว่า ทำไม พร้อมคำใบ้ (P)
  5. สถานการณ์ใหม่ (A1)
  6. ทบทวนกับแชตบอต (S)
  7. แบบทดสอบ 5 ข้อ พร้อมผลป้อนกลับทันที
  8. หน้าสรุป คะแนน เทียบคำทำนาย และงานขั้น A2 คาบหน้า

เปิดตัวอย่าง โหมดนักเรียน

โหมดครู

เพิ่มหน้าแรก ผังบทเรียน GPAS (จุดหยุดใน Edpuzzle กับขั้น GPAS และสิ่งที่ครูตัดสินเอง) และแผงบันทึกครูทุกหน้า จุดมุ่งหมาย ครูทำอะไร ครูตรวจอะไร และเฉลย ใช้ส่งให้เพื่อนครูดูวิธีออกแบบ

เปิดด้วยลิงก์ที่ต่อท้าย ?mode=teacher เป็นการแยกเพื่อความสะดวก ไม่ใช่การล็อก นักเรียนที่รู้ลิงก์ก็เปิดได้

เปิดตัวอย่าง โหมดครูดาวน์โหลดแม่แบบสำรอง

ตัวอย่างใช้บทเรียนอาหารติดคอ ข้อเท็จจริงตรวจแล้วตาม Blueprint ข้อมูลทั้งหมดอยู่ในตัวแปร CONFIG บนสุดของไฟล์

15.35 ถึง 15.45 น. รอบที่ 1

W1 เตรียมเนื้อหาเว็บแอป

วางต่อในแชท Gemini เดิมของคลิป พว. ครูตรวจก่อนไปรอบถัดไป

15.45 ถึง 15.55 น. รอบที่ 2

W2 ประกอบคำสั่งแล้วสร้างใน Canvas

กรอกลิงก์ด้านล่าง ระบบตรวจรูปแบบและใส่ลิงก์ลงในคำสั่งให้

คำสั่ง W2 ที่ประกอบแล้ว


            

            
    
                
  1. ในแชท Gemini เดิม เลือกเครื่องมือ Canvas
    แชทนี้มีเนื้อหารอบ W1 อยู่แล้ว Gemini
                    จึงใช้ได้ทันที ถ้าแชทเดิมใช้ทักษะของ Gemini ซึ่งเลือก Canvas ไม่ได้ ให้เปิดแชทใหม่ที่ไม่เรียกทักษะ
                    และวางผลรอบ W1 ในช่องด้านบนก่อนคัดลอก W2
    2. 
                
  2. วางคำสั่ง W2 แล้วส่ง
    รอจนไฟล์สร้างเสร็จ หน้าตัวอย่างจะแสดงใน Canvas
    3. 
                
  3. ทดลองเป็นนักเรียนจนจบ
    แล้วต่อท้ายที่อยู่ด้วย ?mode=teacher หรือกดปุ่มโหมดครู
                
    4. 
            

            

                ทางสำรอง ถ้า Canvas สร้างไม่ครบ ใช้แม่แบบของวิทยากร
                

                    

                

            

            
ลิงก์ฝังของ Edpuzzle มีรูปแบบ edpuzzle.com/embed/media/รหัส ช่องนี้แปลงลิงก์
                edpuzzle.com/media/รหัส ให้อัตโนมัติ ข้อมูลที่กรอกเก็บในเบราว์เซอร์ของท่านเท่านั้น

        

        

            
15.55 ถึง 16.05 น. รอบที่ 3
                
W3 ทดลองและแก้ทีละเรื่อง

                
ทดลองบนมือถือ ติ๊กรายการตรวจ แล้วสั่งแก้ทีละเรื่อง

            

            
            

        

        

            
16.05 น.
                
แชร์ลิงก์บน Padlet

            

            

                

                    
ลิงก์แชร์ของ Gemini Canvas

                    
    
                        
  1. ใช้ปุ่มแชร์ของ Canvas (วิทยากรสาธิตบนจอ)
    2. 
                        
  2. คัดลอกลิงก์ แล้วเปิดบนมือถือเพื่อทดสอบ
    3. 
                        
  3. วางลิงก์ในการ์ดของคู่ท่านบน Padlet
    4. 
                    

                    
เปิด Padlet

                

                

                    
เก็บไฟล์ไว้ใช้ต่อ

                    
คัดลอกโค้ดหรือดาวน์โหลดไฟล์จาก Canvas บันทึกเป็นชื่อ index.html ไฟล์นี้ใช้เผยแพร่บน Hugging Face
                        Spaces ด้านล่าง และแก้เนื้อหาได้ที่ CONFIG โดยไม่ต้องสั่ง Gemini ใหม่

                

            

        

        

            
16.05 ถึง 16.15 น. วิทยากรสาธิต
                
เผยแพร่บน Hugging Face Spaces

                
ดูเป็นตัวอย่างแล้วทำเองหลังอบรม ใช้เวลาราว 10 นาทีเมื่อมีบัญชีแล้ว

            

            
    
                
  1. สมัครบัญชี Hugging Face
    ที่ huggingface.co ด้วยอีเมล แล้วยืนยันอีเมลให้เรียบร้อย
                
    2. 
                
  2. สร้าง Space ใหม่
    กด New Space ตั้งชื่อเป็นภาษาอังกฤษไม่มีช่องว่าง เช่น
                    choking-gpas เลือก SDK แบบ Static เลือก Public แล้วกดปุ่มสร้าง Space
    3. 
                
  3. อัปโหลดไฟล์
    ไปที่แท็บ Files เลือก Add file แล้ว Upload files อัปโหลดไฟล์ชื่อ
                    index.html แทนไฟล์เดิม แล้วกด Commit
    4. 
                
  4. เปิดแท็บ App ทดสอบ
    ส่งลิงก์ให้นักเรียน ส่วนลิงก์โหมดครู ใช้ที่อยู่ตรงของแอป
                    (ลงท้ายด้วย static.hf.space) แล้วต่อท้ายด้วย ?mode=teacher
    5. 
            

            

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

            

            
เปิด Hugging Face