Videos Case Developing Gamify Coding Education (K-12)

Description

ปัญหาการศึกษาไทยในยุคดิจิทัลและ AI คืออะไร? มาร่วมหาคำตอบกับคุณตูนจาก Spark Education ในเซสชั่นนี้ เขาจะมาแบ่งปันประสบการณ์การพัฒนาแพลตฟอร์ม CodeVenture และ CodingThailand เพื่อสอน coding ให้เด็กๆ ทั่วประเทศ ฟังเรื่องราวการแก้ปัญหาการเรียน coding ที่ยากและน่าเบื่อ พร้อมเรียนรู้แนวคิดการสร้างเกมและสื่อการสอนที่น่าสนใจ รวมถึงความท้าทายในการทำงานร่วมกับโรงเรียนและคุณครูทั่วประเทศ มาดูกันว่า CodeVenture จะช่วยเตรียมความพร้อมเด็กไทยสำหรับอนาคตได้อย่างไร

Chapters

  • แนะนำตัวและ Spark Education: เตรียมเด็กๆ สู่ยุค Tech 0:00
  • พูดคุยเรื่องการศึกษาไทยและ CodeVenture 0:40
  • CodeVenture: สอน Coding ให้เด็กๆ มากกว่าแค่การเขียนโปรแกรม 1:30
  • ทักษะสำคัญในยุค AI และ Coding 2:23
  • Coding คือทักษะสำคัญ แต่ไม่จำเป็นต้องเขียน Syntax 3:09
  • ปัญหาของการสอน Coding ในไทย 4:10
  • ปัญหาการขาดแคลนบุคลากรและความไม่สนุกในการเรียน Coding 5:29
  • วิธีแก้ปัญหา: ทำให้ง่ายขึ้น สนุกขึ้น และเตรียมเครื่องมือให้ครู 6:12
  • ใช้ Nuxt 2 และ 3 ในทุก Project 6:47
  • เหตุผลที่เลือกใช้ Nuxt 7:25
  • CodingThailand: เรียนวิธีคิดผ่านวิธี Code 9:08
  • ความสำเร็จของ CodingThailand ในช่วงโควิด 10:38
  • ผสาน Coding กับวิชาอื่น: ตัวอย่างรามเกียรติ์ 12:01
  • การสร้าง Universe ของเกมและสื่อการสอนสำหรับโรงเรียนชายขอบ 13:02
  • ยอดผู้ใช้และ Certificate ของ CodingThailand 14:38
  • CodeVenture: ยกระดับ Gamify และ Gameplay 15:00
  • การเลือก Game Engine และการใช้ Phaser 15:27
  • 3 รูปแบบการ Coding ใน CodeVenture 16:08
  • Tech Stack ที่ใช้ใน CodeVenture 17:31
  • ความสำคัญของมาตรฐาน Certificate และความร่วมมือกับบางมด 18:08
  • ผลการทดลองใช้ CodeVenture ในโรงเรียน 19:06
  • ประสบการณ์การออกบูธและการตอบรับที่ดี 19:42
  • สร้าง Ecosystem ทางการศึกษาและเครือข่ายคุณครู 20:09
  • Partnership กับ code.org และที่ปรึกษา 20:43
  • สรุปและขอบคุณ 21:05

Transcript

คำบรรยายต่อไปนี้อาจไม่ถูกต้องทั้งหมด หากคุณพบข้อผิดพลาดใดๆ คุณสามารถช่วยแก้ไขข้อผิดพลาดได้บน GitHub

แนะนำตัวและ Spark Education: เตรียมเด็กๆ สู่ยุค Tech0:00

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

ขอเช็กก่อนนะฮะ มีใครเรียนอยู่มั้ยครับตอนนี้ ขอรีเช็กครับ แก๊งข้างหน้า โอ้ อื้อ เราน่าคุ้นๆ นะ อ๋อ ยังมีกลุ่มที่เรียนอยู่นะครับ ใครมีหลานอยู่ที่บ้านมั้ยฮะ ใครมีหลานบ้างครับ มีลูกมีหลานมีน้องนะฮะ

พูดคุยเรื่องการศึกษาไทยและ CodeVenture0:40

เดี๋ยวเราจะมาพูดเรื่องการศึกษาไทยกันนะฮะ อ๋อ เดี๋ยวมันจะเศร้าๆ นิดนึงนะฮะ ก็เปิดก่อนนะครับ ขอแนะนำตัวอีกทีนะครับ ชื่อตูนนะครับ ไม่ต้องเรียกพี่ก็ได้นะฮะ เจอกันนะครับ มาจาก Spark Education นะฮะ vision ของเราคืออยากจะ prepare เด็กๆ

ในยุคที่มัน tech มาเยอะๆ มากๆ เลยนะครับ ไม่ว่าจะเจอ AI เจออะไรก็ไม่รู้อ่ะ แต่เราอยากเตรียมความพร้อมให้กับเด็กๆ ทุกคนนะครับ อันนี้คือ goal ใหญ่ที่เราพยายามสร้างมา แล้วเดี๋ยวค่อยๆ ไปดูว่า Spark เนี่ยทำอะไรบ้าง ทำเยอะแยะไปหมดเลยเกี่ยวกับการศึกษาของเด็กเรื่อง tech เนาะ แล้วเดี๋ยวเรามาดูกันนะครับ

CodeVenture: สอน Coding ให้เด็กๆ มากกว่าแค่การเขียนโปรแกรม1:30

โอเค โปรเจคตอนนี้ที่ทำอยู่นะครับชื่อว่า CodeVenture

เราพยายามจะสอน coding เด็กแล้วกัน ถ้าเกิดพูดง่ายๆ เหมือนสอน coding เด็ก แต่ถ้าเกิดลึกๆ ขึ้นหน่อยคือจริงๆ coding มันได้มากกว่า coding ใครเขียนโปรแกรมนี่เป็น dev กันหมดอยู่แล้วนะ มันตั้งแต่แตก task ทำความเข้าใจปัญหา แก้ปัญหา แก้ bug อีกได้ leadership โอ้โห เต็มไปหมดเลยนะครับ ดังนั้นเราเลยเห็นความสำคัญของการฝึก coding แล้วเรารู้สึกว่าเนี่ยมันเป็น skill ที่สำคัญ เป็นทักษะสำคัญของเด็กในอนาคต ไม่จำเป็นต้อง code ได้ก็ได้นะ แต่ว่ามันต้องมีหลักการ มีกระบวนการคิดเหล่านี้ติดตัวไป อุ๊ย เงียบเหมือนจริงจังขึ้นมาทีเดียวเลยนะฮะ

ทักษะสำคัญในยุค AI และ Coding2:23

โอเค เดี๋ยวเรามี 25 นาทีนะครับ

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

หรือแบบพอเราเรียนที่โรงเรียนวันนี้ พรุ่งนี้แม่งล้าสมัยแล้วอ่ะ

แล้วหรือว่าจริงๆ แล้วทักษะที่เราฝึกวันนี้ แล้วกว่าเราจะได้ทำงานนี่ป่ะอีก 6-12 ปีอ่ะ มันยังใช้ได้อยู่มั้ยวะ นะครับ

Coding คือทักษะสำคัญ แต่ไม่จำเป็นต้องเขียน Syntax3:09

ดังนั้นคำตอบที่เราพยายามไปหามานะครับ พี่มีทีมที่ไปคุย เป็น facilitator

เป็น international partnership กับ code.org ด้วยนะครับ ก็ไปคุยกันมาแล้วก็สรุปว่า coding แม่งคือทักษะที่สำคัญที่สุดที่เด็กควรจะมี แต่ว่าไม่จำเป็นต้องไปพิมพ์ syntax นะ แต่ว่าเป็นเรื่องกระบวนการคิดนะครับ เมื่อกี้บอกไปแล้วเรื่องการ breakdown ปัญหา เรื่องการคิดอย่างซับซ้อนแก้ไขปัญหาไปเรื่อยๆ รวมถึงจริงๆ มันมี creative อยู่ในการเขียน code เนาะ บางคนบอกว่า coding แม่งโคตร logic เลย จริงๆ ไม่ใช่นะ ตั้งชื่อตัวแปรตั้งยังไง นี่แม่งศิลป์หมดเลย คือแบบศาสตร์ศิลป์น่ะ คือมันอยู่ด้วยกันน่ะ มึงมาตั้งงูๆ ปลาๆ เพื่อนตบอีกต่างหาก

มันรวมทุกอย่างเลยอยู่ข้างในการเขียนโปรแกรมใช่ป่ะนะครับ

ปัญหาของการสอน Coding ในไทย4:10

ทีนี้ปัญหาที่เกิดขึ้นคือ coding แม่งยากแล้วก็น่าเบื่อ

ทุกคนรู้มั้ยฮะว่าตอนนี้เด็กตั้งแต่ปี 2560 ตั้งแต่ ป.1 ต้องเรียน coding ทุกคน

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

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

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

ปัญหาการขาดแคลนบุคลากรและความไม่สนุกในการเรียน Coding5:29

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

มันก็เลยส่งผลไปให้ว่าแบบมันเรียนไม่สนุกอ่ะ เด็กๆ ก็เลยเบื่อ แล้วมันไม่ควรเบื่ออ่ะ

coding มันไม่ได้น่ากลัวขนาดนั้นอ่ะ เราก็เลยพยายามจะสร้างความสนุกกับการเรียนรู้ สิ่งเหล่านี้ขึ้นมานะครับ

วิธีแก้ปัญหา: ทำให้ง่ายขึ้น สนุกขึ้น และเตรียมเครื่องมือให้ครู6:12

อันนี้ตัวอย่าง ก่อนที่เราจะทำความเข้าใจใช่มั้ย เราบอกว่าเราต้องเข้าใจปัญหาก่อน ก็ไปไล่ซื้อหนังสือมาหมดเลย ทุกสำนักพิมพ์ที่มีอยู่ในประเทศไทยนะฮะ ก็ไปไล่อ่านทุกบทของเด็กๆ ที่เค้าเรียนกันนะฮะ ว่าเค้าเรียนอะไรกันบ้างนะฮะ แล้วก็เราก็เจอ solution ว่า เอ๊ย เมื่อกี๊เราบอกว่ามันยากก็ทำให้มันง่าย บอกว่าน่าเบื่อก็ทำให้สนุก บอกครูไม่มีเวลาเตรียมตัวสอน งั้นเตรียมเครื่องมือให้ครูเลยนะครับ

เป็น solution ที่เราตีออกมานะครับ แต่ว่าเดี๋ยวก่อนเข้าไปลึกกว่านี้เนาะ

ใช้ Nuxt 2 และ 3 ในทุก Project6:47

เดี๋ยวจะบอกว่าเราไม่ได้พูดเรื่อง Nuxt เรื่อง Vue เลยนะครับ ทุก project ที่พูดหลังจากนี้นะครับใช้ Nuxt 2 และ 3 ทั้งหมดนะครับ ในการแปลงความ บทเรียนต่างๆ

ออกมาเป็นรูปแบบสื่อการสอนหรืออะไรต่างๆ ทั้งหมดนะครับ แล้วก็ขาย Nuxt นิดนึงนะครับ ตอนนี้มี 54,000 star แล้วนะครับ ผมใช้ตั้งแต่ประมาณแบบหลักหมื่น หมื่นนิดๆ อะไรอย่างเงี้ย ก็ใช้มาหลายปีแล้วนะครับ ใครมีปัญหาเรื่อง Nuxt เรื่องอะไรก็มาคุยกันได้นะครับ

เหตุผลที่เลือกใช้ Nuxt7:25

ทำไมถึงเลือกใช้ Nuxt ณ วันนั้นนะครับ เรารู้สึกว่ามันค่อนข้างง่ายครับ เข้ามา install เสร็จแล้วก็ run ขึ้น project ได้อย่างรวดเร็ว แล้วก็มันก็มีเรื่อง component มีเรื่องอะไรพวกนี้ จริงๆ เมื่อก่อนก็เคยฝึกเขียน React เหมือนกันเนาะ ไป Next ไปทำอะไรพวกนี้ แต่ว่าสุดท้ายอ่ะ framework มันอยู่ที่จริตคนด้วยอ่ะ คือเราถูกจริตกับตัวนี้ เราก็บอกตัวนี้ แต่มันไม่มีอันไหนที่มันดีหรือมันไม่ดีหรอก มันอยู่ที่ว่าเราสนิทกับมันมากน้อยขนาดไหนนะครับ

อันที่ 2 Nuxt มันมี standard folder ขึ้นมาใช่มั้ย เราแบบ โห สร้าง pages (มี s) ปุ๊บ มัน auto routing ให้เลย

ไปพิมพ์ ไม่ต้องมาเขียน จริงๆ ใน Vue เราต้องไปเขียนเองใช่ป่ะ ตอน route ใช่มั้ย ใน Nuxt ก็ไม่ต้องเขียนเลย มัน auto gen มาให้นะครับ แต่ว่าเวอร์ชันล่าสุดนี่แบบน่าเบื่อไปนิดนึงนะ ต้องไปแก้ในไฟล์ app.vue ตัวแรกอ่ะนะ ว่าต้องใส่ layout ต้องใส่นู่นใส่นี่อะไรอย่างเงี้ย วุ่นวายขึ้นนิดนึงนะครับ แต่สำหรับ project เล็กๆ ที่ install มาปุ๊บ ก็ run แล้วก็ใช้งานแบบ page เดียวอะไรอย่างเงี้ยก็ง่ายครับผม อันที่ 3 เมื่อกี๊เชื่อมกันเลยครับ server-side rendering SEO friendly ครับ เพราะว่าแบบมันช่วยเรื่องพวกนี้จริงๆ แล้วก็ทำให้ project เราไปติด Google Search ได้ง่ายขึ้นอะไรอย่างเงี้ยครับ แล้วก็สิ่งที่จริงๆ ส่วนตัวชอบที่สุด ก็คือความเป็นระเบียบเรียบร้อยของการจัดสัดส่วนของ code นะครับ ไม่ว่าจะเป็น template เป็น script แล้วก็ style ใช่มั้ยนะครับ มันก็จัดสัดส่วนที่สวยงามอยู่นะฮะ

CodingThailand: เรียนวิธีคิดผ่านวิธี Code9:08

เข้าไปที่เมื่อกี๊เราพูดถึง CodeVenture นิดหน่อย

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

เราทำชื่อ page ชื่อว่าเรียนวิธีคิดผ่านวิธี code เราทำมาประมาณ 5 ปีที่แล้วนะครับ ตอนนั้น 5 ปีที่แล้วก็คือช่วงที่โรงเรียน เอาวิชาชื่อวิทยาการคำนวณเข้ามาในประเทศพอดีนะครับ ตอนนั้นปัญหาเกิดขึ้นคือคุณครูยังไม่มีใคร จบสายตรงลงไปสอนเด็กๆ นะครับ เราก็พยายามจะทำสื่อการสอนขึ้นมานะครับ ทำอะไรบ้าง เราก็ไปไล่หลักสูตรนะครับ จริงๆ มันมีตัวที่ตรงกับหลักสูตรอยู่แล้ว ที่เราทำเป็นสไลด์ ทำบทเรียนขึ้นมานะครับ รวมถึงเราจะมี mini game เนาะ เด็กอ่ะ อะไรเป็น game อ่ะ เอาหมดแหละนะครับ เราพยายามจะใช้ gameify coding เข้าไป แล้วก็ให้ความรู้เหล่านั้นน่ะ มันถูกซ่อนอยู่ข้างหลังไปกับความสนุก เพราะว่าถ้าเกิดเด็กไม่สนุก ความรู้ไม่เกิดนะครับ เรามีความเชื่อแบบนั้น เราก็เลยสร้าง อย่างเช่นตอนนั้นเค้าเรียนเรื่องการเข้ารหัสเนาะ การเข้ารหัสมีหลากหลายเลย มี picture cipher มี Atbash มีหลายตัว เราก็พยายามแกะออกมา

แล้วก็แปลงออกมาเป็นรูปแบบของ game ไปตะลุย ไปสู้กับหุ่นยนต์ไปอะไรอย่างงี้นะครับ

ความสำเร็จของ CodingThailand ในช่วงโควิด10:38

ซึ่ง ณ วันนั้นเนี่ย ก็เป็นเหมือนแบบ

สิ่งที่เรามีก็คือนอกจากเขียนโปรแกรมแล้ว เราพยายามจะใส่ความน่ารักเข้าไปในแพลตฟอร์ม ซึ่งเฮ้ยมันได้ผลว่ะ ตอนนั้นเป็นช่วงโควิดพอดี เราตั้งใจว่าประมาณแบบ 1,000 คนก็ดีใจแล้ว ตอนเปิดแพลตฟอร์มใช่มั้ย ตอนนั้นรู้สึกว่าจะขึ้นมาแบบอาทิตย์เดียวที่ปล่อยไป มีหลายหมื่นคนที่เข้ามาใช้ แบบเยอะจนตกใจ เตรียมอะไรไม่ทันเลยนะครับ อันนี้ก็จะเป็นตัวเกมที่เราปล่อยไป เราพยายามจะสร้าง education แล้วเราเป็นคน tech แล้วเราก็ใส่ creative เข้าไปในตัวแพลตฟอร์ม ที่เราสร้างขึ้นมานะครับ อันนี้เป็นตัวอย่างอีกตัวนึง อันนี้ก็จะเป็นเหมือนเกมฝึกการตั้ง password เนาะ จริงๆ มัน content น่ะมันไม่ได้ยากหรอก มันก็ตั้งกี่ตัว 7 ตัว 8 ตัว มีอักขระ มีตัวเลขใช่มั้ย แต่เรามาแปลงสิ่งเหล่านั้น สิ่งที่ยากมันคือ shot ที่แบบแปลงหลักการเหล่านั้น น่ะออกมาเป็นเกม ว่ามันจะ sync จะ match กันยังไงนะครับ แล้วก็แปลงออกมา แล้วตอนจบก็ได้ cert อันนี้ก็มีคนเล่นมาหลาย ตอนนี้น่าจะเกือบแสนคนแล้ว เกมเมื่อกี้น่าจะประมาณ 600,000-700,000 คนนะครับ

ผสาน Coding กับวิชาอื่น: ตัวอย่างรามเกียรติ์12:01

เราบอกว่ายังไม่พอเว้ย มันต้องไปจับกับวิชาอื่นได้ดิ coding อ่ะ อันนี้เราใส่รามเกียรติ์เข้าไปครับ ให้เด็กๆ ในทีมไป research เรื่องรามเกียรติ์มาว่า เฮ้ยเส้นเรื่องมันเป็นยังไงวะ แล้วเราจะเอา coding ไปใส่ยังไง อันนี้จริงๆ เราเรียกกันว่าเหมือน block coding เนาะ สอนเด็ก เค้าเรียกว่าเป็น sequencing อ่ะ แบบขึ้นลงซ้ายขวาเดินไปเดินมานะครับ ให้ไปตามโจทย์ที่เรากำหนดให้ แต่ว่ามันก็ดีจนเกินคาด จนมีอาจารย์

เราตั้งใจให้อาจารย์สอนคอมใช่มั้ยครับ อาจารย์ภาษาไทยก็เริ่มเอาไปใช้ เข้าใจว่ามีนักวิจัยหลายคนเอาไปเป็นเคส ในการบอกว่าเฮ้ยนี่สิ มันคือสื่อที่เอาไปใช้ในการเรียนได้นะครับ เริ่มมีนักวิชาการมาคุยนะครับ มีอาจารย์จากจุฬามาคุยด้วยนะครับ

โอเค แต่ว่าปัญหามันเกิดขึ้นตรงที่ตอนที่เราออกไปเว้ย

การสร้าง Universe ของเกมและสื่อการสอนสำหรับโรงเรียนชายขอบ13:02

แฟนคลับเราเป็นโรงเรียนชายขอบก็เยอะฮะ ดังนั้นสิ่งที่เกิดขึ้นคือคอมไม่พอนะฮะ คอมไม่พอดังนั้นทีมเราก็เลยพยายามจะสร้าง 1 เกม ออกมาพร้อมกับ universe ที่เกิดขึ้น มันจะมีสไลด์ PowerPoint ในการสอน มีเกมออกไป มีแบบฝึกหัดที่เป็นกระดาษ เป็น worksheet ปล่อยไปให้ด้วยใช้โหลดฟรีนะ หน้าตามันก็จะเป็นแบบเหมือนคู่มือเป็นแบบฝึกหัด ที่คุณครูสามารถเอาไปปริ้นท์ ให้กับเด็กๆ ใช้ในห้องเรียนได้นะครับ

แล้วก็เราก็ได้ผลลัพธ์กลับมาจากกลุ่มคุณครู เราได้คุณครูเริ่มถ่ายรูปกับ feedback กลับมา ให้ว่ามันเกิดอะไรขึ้นในห้องเรียนบ้าง เด็กมีความสนุกขนาดไหนนะครับ มีการพูดคุยกันในกรุ๊ปนะครับ

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

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

ยอดผู้ใช้และ Certificate ของ CodingThailand14:38

อันนี้ยอดปัจจุบันเพิ่งเช็กเมื่อกี้นะครับ ก็ตอนนี้เรามี user ประมาณ 100,000 คนนะครับ certificate ที่เราออกไปประมาณ 500,000 ใบ เอ่อทั่วประเทศ โรงเรียนครบ 77 จังหวัดนะฮะ ตอนนี้ครับ

ทีนี้ เมื่อกี้อ่ะ CodingThailand

CodeVenture: ยกระดับ Gamify และ Gameplay15:00

แต่ว่ามาวันนี้เรามาในนามของ CodeVenture เนาะ เราพยายามจะอัพเกรดความเป็น gamify ของตัวแพลตฟอร์มที่แบบมันเหมือนเป็นตุ้มให้กดเฉยๆ เนาะ

ตัว gameplay มันก็เริ่มจะดูแบบโหเป็นเกมจัดๆ มากขึ้นนะครับ ไม่ใช่แบบเป็นรูปธรรมดาเป็นบล็อกๆ ให้เดินเฉยๆ ใช่ป่ะ อันเนี้ยเราใส่ animation เข้าไป ใส่อะไรเข้าไป ซึ่งปัญหาก็เกิดอีกว่าแล้วเราจะใช้ตัวอะไร

การเลือก Game Engine และการใช้ Phaser15:27

มาทำเป็น game engine วะ เพราะเราไม่มีความรู้เรื่องพวกนี้เลยนะ เราเริ่มจากศูนย์หมดเลยนะครับ ซึ่งตอนสุดท้ายเราก็เลือก Phaser นะครับ ไม่รู้ว่าทุกคนในนี้มีคนรู้จักมั้ยฮะ ใช้ Phaser ในการทำตัวเกมขึ้นมา แล้วก็ใช้ Tiled ในการสร้าง map เนาะ นะครับ แล้วก็คือโชคดีนิดนึงก็คือไป search ใน GitHub แล้วไปเจอ Nuxt Phaser พอดีว่า เอ้ย อ๋อมันเอามาคุยกับ Nuxt ได้เว้ย

เราก็พยายามแกะขึ้นมาทำให้มันสามารถคุยได้ มากไปกว่านั้น สิ่งที่เราสร้างขึ้นมา

3 รูปแบบการ Coding ใน CodeVenture16:08

เมื่อกี้ตอน CodingThailand มันเป็นแค่กดๆ ขึ้นลงซ้ายขวาใช่มั้ย รอบนี้เรามามี 3 แบบเลย 1 คือ icon block ก็คือเหมือนกดเลือกปุ่มเหมือนเดิม สำหรับเด็กเล็ก block-based coding นะครับ เป็นเหมือน Scratch เป็นเหมือน Blockly นะครับ ไม่รู้ใครรู้จักมั้ย Blockly ของ Google เนาะ เราก็เอามาใช้ แล้วอันสุดท้ายเป็น text-based coding นะครับ เราใช้ Microcode ในการทำขึ้นมา แล้วก็ให้เด็กเขียน Python เข้าไป แล้วก็ compile ออกมานะครับ

อันนี้ซูมขึ้นมาว่าหน้าตามันเป็นยังไง อันนี้เรา custom block ขึ้นมาเพื่อเราเอามาใช้งานใช่มั้ยครับ ไอ้ตัว block พวกเนี้ยเราก็ gen ขึ้นมาเลย ขึ้นลงซ้ายขวา มีปุ่มอะไรแปลกๆ เราก็ใส่ได้เต็มที่นะครับ แล้วก็อันนี้เมื่อกี้ Blockly เนาะ

ตัวนี้ปวดหัวสุดเลย ปวดหัวจัด ก็คือ CodeMirror ออกมาเสร็จเนี่ย เราต้อง compile ตัว Python ออกมา ให้มันไปคุยกับ JavaScript อีกทีนึง เพราะเราจะส่งให้มันไปคุยกับ Phaser อีกทีนึงใช่มั้ยนะครับ เราก็ต้อง gen ออกมาใช้ Skulpt นะครับ

ในการ compile แล้วก็ run Python บน client-side นะครับ

Tech Stack ที่ใช้ใน CodeVenture17:31

ทีนี้นี่ stack ให้ดูนะครับ stack ให้ดูแล้วก็มีติด พวก Hotjar ในการ track เราดู behavior คุณครูกับเด็ก ว่าแบบมันเป็นยังไงใช่มั้ยครับ เราก็เป็น tool ที่ดี แต่แพงไปหน่อยนะครับ ใครรู้จัก ขอเช็กหน่อย

มีใครรู้จัก Blockly มั้ยครับ มีบางกลุ่มนะครับ ตัว Blockly จริงๆ เป็นตัวที่ดีเอาไปใช้กับเด็กๆ ได้นะครับ เป็น base ของ Scratch นะครับ Scratch เอาไปใช้เหมือนกันนะครับ

ความสำคัญของมาตรฐาน Certificate และความร่วมมือกับบางมด18:08

มากไปกว่านั้น การที่เราทำแล้วออก cert ไป 500,000 ใบ มันจะไม่มีคุณค่าเลยถ้าเกิดเราไม่สามารถเคลมได้ว่า หลักสูตรของเรามันมีมาตรฐาน ดังนั้นตอนนี้เราทำเรื่อง certificate ที่เราออกมานะครับ ครั้งที่แล้วตอนทำ Coding Thailand เราออกพร้อมกับดีป้านะครับ อันนี้ตอนนี้เรามีบางมดนะครับ ทำ micro-credential ด้วย ก็คือหมายถึงว่าถ้าเกิดเล่นเกมของเรา เด็กคนนั้นจบไป 2 ใบ เอา cert 2 ใบนี้ไปแจ้งที่บางมด บางมดจะให้ cert ของบางมดกลับมานะครับ

ซึ่งอันนี้ก็มากกว่า coding เฉยๆ แล้วเนาะ

มันต้องสร้าง ecosystem เองขึ้นมานะครับ

ผลการทดลองใช้ CodeVenture ในโรงเรียน19:06

อันนี้เป็นรูปที่เราเอาไปทดลองใช้นะครับ เราไปทดลองกับ 15 โรงเรียน เราได้มา 4,000 user test ที่เป็นนักเรียนนะครับ

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

ประสบการณ์การออกบูธและการตอบรับที่ดี19:42

อันนี้เราก็ไปออกบูธครับ อันนี้เราไปทดลองออกบูธกับทีมขึ้นมา วันแรกเราออกบูธแค่แบบเมตรเดียวเนาะ แบบเมตร×เมตร ไปๆ มาๆ ต้องไปขอพื้นที่เค้าเพราะว่าเด็กมาต่อกัน เราต้องใช้คอมประมาณ 5 เครื่องในการเปิด ตอนแรกเราเปิดแค่แบบใช้จอเดียวอะไรอย่างเงี้ย

แล้วก็สิ่งที่เรากำลังสร้างขึ้นไปนะครับ

สร้าง Ecosystem ทางการศึกษาและเครือข่ายคุณครู20:09

สำหรับงานที่เกี่ยวกับการศึกษานะครับ ถ้าเกิดใครแบบมี passion เรื่องการศึกษา เรามาคุยกันได้ว่าเราสามารถช่วยอะไรกันได้บ้าง เพราะว่าตอนนี้เรามีเครือข่ายคุณครูอยู่ประมาณ 20,000 คน ที่ใช้แพลตฟอร์มเรานะครับ เรามีเด็กนักเรียนที่อยู่ในแพลตฟอร์มอีกประมาณ 80,000 คน ที่อยู่กับของเราเหมือนกัน ซึ่งถ้าเกิดเราไม่ได้อยากเก็บ resource นี้ไว้คนเดียว

ใครอยากเอาไปสร้างประโยชน์เพิ่มเรามาคุยกันได้นะครับ

Partnership กับ code.org และที่ปรึกษา20:43

แล้วก็ตอนนี้บอกไปแล้วว่าเราเป็น partnership กับ code.org แล้วนะครับ ก็มีบริษัท ทีมงานเพื่อนๆ

ที่ช่วยกันทำเรื่องการศึกษา มีพี่อภิรักษ์นะครับ มาเป็นที่ปรึกษา UX เราด้วย แล้วก็เราก็ไปเคยแข่งที่ต่างๆ มานะครับ

สรุปและขอบคุณ21:05

โอเค ประมาณนี้ครับ จบแล้วครับสำหรับ CodeVenture ครับ เราก็อยากให้การศึกษาไทยมันดีขึ้นนะครับ ก็ขอบคุณมากครับ