Scratch คือ ภาษาโปรแกรมแบบ "ลากวางบล็อก" (Block-based Programming) ที่ถูกออกแบบมาเพื่อให้เด็กและผู้เริ่มต้นเรียนรู้การเขียนโปรแกรมได้ง่ายที่สุด โดยไม่ต้องพิมพ์โค้ดเองครับ

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

จุดเด่นของ Scratch:

ไม่ต้องพิมพ์: ตัดปัญหาเรื่องพิมพ์ผิด (Syntax Error) เพราะใช้การลากบล็อกสีๆ มาต่อกันเหมือนจิ๊กซอว์ ถ้าบล็อกไหนต่อกันไม่ได้ แสดงว่าคำสั่งนั้นใช้ด้วยกันไม่ได้

เห็นผลทันที: เมื่อต่อบล็อกเสร็จ พอกดปุ่ม "ธงเขียว" ตัวละครจะทำตามคำสั่งทันที ทำให้เรียนรู้ได้สนุก

สร้างได้หลากหลาย: ตั้งแต่การ์ตูนแอนิเมชันสั้นๆ, นิทานโต้ตอบได้, ไปจนถึงเกมที่ซับซ้อน

ส่วนประกอบหลักของ Scratch:

Sprite (ตัวละคร): สิ่งที่เราจะสั่งงาน (เริ่มต้นมักจะเป็นรูป "แมวสีส้ม")

Stage (เวที): พื้นที่ที่ตัวละครแสดงท่าทางตามคำสั่งของเรา

Blocks Palette (แถบคำสั่ง): แบ่งตามสีเพื่อให้จำง่าย เช่น:

สีน้ำเงิน (Motion): สั่งให้เคลื่อนที่ เดิน หมุน

สีเหลือง (Events): สั่งว่าเริ่มทำเมื่อไหร่ เช่น "เมื่อคลิกธงเขียว"

สีส้ม (Control): สั่งให้รอ, ทำซ้ำ (Loop), หรือเช็กเงื่อนไข (If-Then)

สีม่วง (Looks): สั่งให้พูด เปลี่ยนชุด หรือเปลี่ยนขนาด

ลองนึกภาพตามขั้นตอนต่อไปนี้:

ระบุปัญหา: อยากให้แมวเดินไปข้างหน้าแล้วร้อง "เมี๊ยว"

วางแผน: ต้องมีบล็อก "เริ่ม" -> "เดิน" -> "ส่งเสียง"

ดำเนินการ: ลากบล็อกสีเหลือง (เมื่อคลิกธงเขียว) มาวาง ต่อด้วยบล็อกสีน้ำเงิน (เดิน 10 ก้าว) และบล็อกสีชมพู (เล่นเสียงเมี๊ยว)

ตรวจสอบ: กดธงเขียวดูว่าแมวทำตามนั้นไหม

คราวหน้ามาลองทำตามตัวอย่าง "ชุดคำสั่งแรก" (Script) ง่ายๆ เพื่อให้แมวเดินวนไปมาไม่หยุด

ตัวอย่าง "ชุดคำสั่งแรก"

มาลองสร้าง "ชุดคำสั่งแรก" ให้เจ้าแมวสีส้มเดินไปมาและทักทายเรากัน!

เราจะใช้บล็อกคำสั่งต่อกันเหมือนจิ๊กซอว์ โดยแบ่งออกเป็น 3 ขั้นตอนง่ายๆ ดังนี้:

1. คำสั่งเริ่ม (Events) - สีเหลือง

เราต้องบอกให้คอมพิวเตอร์รู้ว่า จะให้เริ่มทำงานตอนไหน

ลากบล็อก "เมื่อคลิก ธงเขียว" (When green flag clicked) มาวางเป็นอันแรก

2. คำสั่งเคลื่อนที่ (Motion) - สีน้ำเงิน

เราจะสั่งให้แมวเดินไปข้างหน้า

ลากบล็อก "เคลื่อนที่ 10 ก้าว" (move 10 steps) มาต่อข้างล่าง

ถ้าอยากให้เดินวนไปมาไม่หลุดขอบจอ ให้ลากบล็อก "ถ้าชนขอบให้สะท้อนกลับ" (if on edge, bounce) มาต่อท้ายด้วย

3. คำสั่งพูด (Looks) - สีม่วง

ทำให้แมวดูมีชีวิตชีวาขึ้น

ลากบล็อก "พูด Hello! เป็นเวลา 2 วินาที" มาต่อเป็นอันสุดท้าย

💡 ถ้าอยากให้แมว "เดินไม่หยุด" (Loop)

ในโปรแกรมมิ่ง เรานิยมใช้คำสั่ง "ทำซ้ำ" (Forever)

นำบล็อก "วนซ้ำตลอด" (Forever) สีส้ม มาครอบคำสั่งเดินเอาไว้

ทีนี้พอเรากด ธงเขียว เจ้าแมวก็จะเดินไปชนขอบแล้วเด้งกลับไปมาแบบไม่หยุดเลย!

สรุปภาพรวม:

[เริ่ม: ธงเขียว] ➡️ [วนซ้ำตลอด: (เดิน 10 ก้าว ➡️ ถ้าชนขอบให้สะท้อนกลับ)]

ลำดับต่อไปลองเพิ่ม "เสียงเมี๊ยว" และ "แมวเดินตามเมาส์"

มาอัปเกรดโค้ดให้เจ้าแมวทั้ง ส่งเสียง และ วิ่งตามเมาส์ ของเรากัน! การทำให้ตัวละครเคลื่อนที่ตามเมาส์เป็นพื้นฐานสำคัญของการสร้างเกม

เราจะใช้บล็อกคำสั่งมาต่อกันดังนี้:

1. คำสั่งเริ่ม (Events) - สีเหลือง

ลากบล็อก "เมื่อคลิก ธงเขียว" มาวางเหมือนเดิม

2. คำสั่งวนซ้ำ (Control) - สีส้ม

ลากบล็อก "วนซ้ำตลอด" (Forever) มาวาง เพื่อให้แมวคอยเช็กตำแหน่งเมาส์ของเราอยู่ตลอดเวลา

3. คำสั่งให้เดินตามเมาส์ (Motion) - สีน้ำเงิน

ใส่บล็อก "หันไปทิศทาง (pointer ของเมาส์)" ไว้ในช่องวนซ้ำ เพื่อให้แมวหันหน้ามาหาเมาส์เราตลอด

ใส่บล็อก "เคลื่อนที่ 5 ก้าว" ต่อท้าย (ปรับเลขน้อยลงหน่อยเพื่อให้แมวไม่วิ่งเร็วเกินไป)

4. คำสั่งเพิ่มเสียง (Sound) - สีชมพู/ม่วงอ่อน

ลากบล็อก "เล่นเสียง Meow จนจบ" มาวางต่อท้ายคำสั่งเดิน

ข้อควรระวัง: ถ้าใส่ไว้ใน "วนซ้ำตลอด" แมวจะร้องไม่หยุดเลย! ถ้าอยากให้ร้องแค่บางครั้ง เราอาจจะใช้บล็อกเงื่อนไข (If) เช่น "ถ้าคลิกเมาส์ แล้วค่อยให้ร้องเมี้ยว"

สรุปการต่อบล็อก (มองเป็นภาพลำดับขั้นตอน):

[เมื่อคลิก ธงเขียว]

[วนซ้ำตลอด] (ครอบข้างล่างนี้ไว้)

หันไปหา (pointer ของเมาส์)

เคลื่อนที่ 5 ก้าว

ถ้า (แตะ pointer ของเมาส์) แล้ว

เล่นเสียง Meow จนจบ

ผลลัพธ์ที่ได้:

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

ลองนึกดู... ถ้าเราเปลี่ยนจากเสียงแมวเป็น "เสียงง่ำๆ" แล้วเปลี่ยนลูกศรเมาส์เป็น "รูปปลา" เราก็จะได้ เกมแมวกินปลา แบบง่ายๆ แล้วนะ!

ต่อไปมาลอง เปลี่ยนรูปตัวละคร จากแมวเป็นอย่างอื่น และ เพิ่มแต้ม (Score)

มาอัปเกรดโปรแกรมของเราให้กลายเป็น "เกมเก็บของ" จริง ๆ กันเลย! มาเปลี่ยนแมวให้เป็นตัวละครที่ชื่นชอบ และเพิ่มระบบนับคะแนน (Score) เข้าไป

1. วิธีเปลี่ยนตัวละคร (Change Sprite)

ใน Scratch เราสามารถเลือกตัวละครใหม่ได้ง่าย ๆ ดังนี้:

มองไปที่มุมขวาล่างของจอ จะเห็นรูปหน้าแมวที่มีเครื่องหมายบวก (Choose a Sprite)

คลิกเข้าไปแล้วเลือกตัวละครที่ชอบได้เลย (เช่น เลือกเป็น "Shark" หรือ "Dinosaur")

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

2. วิธีเพิ่มแต้ม (Create a Score Variable)

ในทางคอมพิวเตอร์ เราเรียก "ตัวนับคะแนน" ว่า Variable (ตัวแปร) ครับ:

ไปที่แถบสีส้มเข้มที่เขียนว่า Variables

คลิกปุ่ม "Make a Variable"

พิมพ์ชื่อว่า "Score" แล้วกด OK คุณจะเห็นตัวเลข 0 ปรากฏบนหน้าจอเวที

3. เขียนโค้ดเพิ่มแต้ม (Coding the Score)

เราจะเพิ่มคำสั่งเข้าไปในชุดเดิม เพื่อให้คะแนนเพิ่มขึ้นเวลาตัวละครแตะเมาส์ครับ:

[เมื่อคลิก ธงเขียว]

[ตั้งค่า Score เป็น 0] (เพื่อรีเซ็ตคะแนนใหม่ทุกครั้งที่เริ่มเกม)

[วนซ้ำตลอด]

หันไปหา (pointer ของเมาส์)

เคลื่อนที่ 5 ก้าว

ถ้า (แตะ pointer ของเมาส์) แล้ว

เปลี่ยน Score ทีละ 1 (ตรงนี้แหละครับที่ทำให้คะแนนเพิ่ม!)

เล่นเสียง (เลือกเสียงที่ชอบ)

รอ 1 วินาที (สำคัญมาก! เพื่อไม่ให้คะแนนเด้งรัวเกินไปขณะที่แตะเมาส์อยู่)

💡 ทริคเพิ่มเติม:

ตอนนี้ตัวละครของนักเรียนจะวิ่งไล่ตามเมาส์และเก็บแต้มได้แล้ว! ถ้าอยากให้มันดูเหมือนเกมมากขึ้น ลองไปที่มุมขวาล่างสุดตรง "Choose a Backdrop" เพื่อเปลี่ยนภาพพื้นหลังให้เป็น ใต้ทะเล หรือ อวกาศ หรือ จะลองออกแบบภาพพื้นหลังเองก็ได้

สนุกไหม? ถ้านักเรียนอยากให้เกมท้าทายขึ้น เราสามารถเพิ่ม "ตัวร้าย" ที่ถ้าเราไปโดนแล้วคะแนนจะลดลงได้ด้วยนะ คราวหน้ามาลองเพิ่ม ตัวร้าย กันได้เลย

เพิ่ม "ตัวร้าย" ที่ถ้าเราไปโดนแล้วคะแนนจะลด

คราวนี้เกมของเราจะเริ่มตื่นเต้นขึ้นแล้ว การเพิ่ม "ตัวร้าย" (Enemy) จะทำให้คนเล่นต้องคอยหลบ เป็นการฝึกใช้คำสั่งเงื่อนไขที่ซับซ้อนขึ้นอีกระดับ

มาทำตามขั้นตอนดังนี้เลย:

1. สร้างตัวร้าย (Create Enemy)

ไปที่ Choose a Sprite (มุมขวาล่าง) แล้วเลือกตัวละครที่ดูดุๆ หรือน่ากลัวมาหนึ่งตัว (เช่น Ghost หรือ Bat)

ปรับขนาด (Size) ให้ตัวเล็กลงหน่อยเพื่อจะได้หลบง่ายขึ้น

2. เขียนโค้ดให้ตัวร้ายขยับเอง (Enemy AI)

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

[เมื่อคลิก ธงเขียว]

[วนซ้ำตลอด]

เคลื่อนที่ 10 ก้าว

ถ้าชนขอบให้สะท้อนกลับ

รอ 0.1 วินาที (เพื่อให้มันดูไม่เร็วเกินไป)

3. เขียนโค้ด "โดนตัวร้ายแล้วคะแนนลด"

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

ลากบล็อกมาต่อเพิ่มในช่อง [วนซ้ำตลอด] ของตัวละครหลักครับ:

[ถ้า] <แตะโดน (ชื่อตัวร้าย)> [แล้ว]

เปลี่ยน Score ทีละ -1 (ใส่เครื่องหมายลบหน้าตัวเลข เพื่อให้คะแนนลดลง)

เล่นเสียง (เสียงแบบโดนทำร้าย หรือเสียง "อุ๊ย!")

เคลื่อนที่ไปที่ (ตำแหน่งสุ่ม) (เพื่อให้ตัวละครเรากระเด็นหนีออกมา ไม่ให้คะแนนลดรัวๆ)

💡 สรุปภาพรวมของเกมตอนนี้:

ตัวละครหลัก: วิ่งตามเมาส์ -> แตะเมาส์ได้แตะเพิ่ม (+1) -> แตะตัวร้ายแต้มลด (-1)

ตัวร้าย: วิ่งไปมาในจอ คอยขวางทางเรา

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

ต่อไปจะเพิ่ม "ด่านต่อไป" เมื่อคะแนนถึง 10 แต้ม และเพิ่ม "เวลาจำกัด" (Timer) ให้เกมกดดันขึ้น

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

1. เพิ่ม "เวลาจำกัด" (Timer)

เราจะสร้างตัวนับเวลาถอยหลังครับ ถ้าเวลาหมด เกมจะหยุด!

ไปที่แถบ Variables (สีส้มเข้ม) กด Make a Variable ตั้งชื่อว่า "Timer"

ไปที่ Backdrops (ฉากหลัง) หรือตัวละครไหนก็ได้ แล้ววางโค้ดนี้:

[เมื่อคลิก ธงเขียว]

[ตั้งค่า Timer เป็น 30] (ให้เวลา 30 วินาที)

[วนซ้ำจนกว่า Timer = 0]

รอ 1 วินาที

เปลี่ยน Timer ทีละ -1

[หยุดทั้งหมด (Stop all)] (เมื่อเวลาหมด ทุกอย่างในเกมจะหยุดทำงาน)

2. เพิ่ม "ด่านต่อไป" (Next Level)

เราจะเปลี่ยนฉากหลังเมื่อคะแนนถึง 10 แต้ม เพื่อบอกว่าคุณผ่านด่านแล้ว!

ไปที่ Choose a Backdrop (มุมขวาล่างสุด) เลือกฉากมาเพิ่ม 2 ฉาก (เช่น ฉากป่า และ ฉากอวกาศ)

กลับมาที่โค้ดของ ตัวละครหลัก เพิ่มคำสั่งเงื่อนไขนี้เข้าไปใน [วนซ้ำตลอด]:

[ถ้า] <Score = 10> [แล้ว]

เปลี่ยนฉากหลังเป็น (ชื่อฉากที่ 2)

ไปที่ตำแหน่ง (x:0, y:0) (ย้ายตัวละครมาเริ่มใหม่ตรงกลางจอ)

พูด "เย้! ผ่านด่านแล้ว" เป็นเวลา 2 วินาที

(อาจจะเพิ่มความยากโดยการเปลี่ยนความเร็วตัวร้ายในด่านนี้ก็ได้นะ!)

💡 สรุปสิ่งที่จะเกิดขึ้นในเกม:

คุณมีเวลา 30 วินาทีในการทำคะแนนให้ถึง 10 แต้ม

ถ้าทำได้ทัน ฉากจะเปลี่ยนเป็นด่านต่อไป

ถ้าเวลาหมดก่อนที่คะแนนจะถึง 10 เกมจะจบลงทันที!

ตอนนี้เกมแรกของนักเรียนมีครบทั้ง ตัวละคร, คะแนน, ตัวร้าย, เวลา และด่าน แล้ว!

มาเพิ่ม "หน้าจอ Game Over" เท่ๆ เวลาเวลาหมด และทำความเข้าใจวิธี "แชร์เกม" ให้เพื่อนๆ ลองเล่นได้เลย!

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

1. วิธีเพิ่ม "หน้าจอ Game Over" เท่ๆ

เราจะสร้างฉากหลังใหม่ขึ้นมาเพื่อแสดงตอนจบเกมโดยเฉพาะครับ

สร้างฉากหลัง:

ไปที่ Backdrops (มุมขวาล่าง) คลิกที่รูปพู่กัน (Paint)

ใช้เครื่องมือตัว T (Text) พิมพ์คำว่า "GAME OVER" ตัวใหญ่ๆ เลือกสีแดงหรือสีที่ดูเท่ๆ

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

ตั้งชื่อฉากนี้ว่า "GameOverScreen"

เขียนโค้ดสั่งให้ฉากแสดง:

กลับไปที่โค้ดของ Timer ที่เราเขียนไว้ก่อนหน้านี้

ปรับปรุงส่วนท้ายของโค้ดเวลาหมดดังนี้:

[เมื่อคลิก ธงเขียว] -> [เปลี่ยนฉากหลังเป็น (ฉากด่านแรก)]

... (โค้ดลดเวลาจนถึง 0) ...

[เปลี่ยนฉากหลังเป็น "GameOverScreen"]

[เล่นเสียง (เสียงเกมโอเวอร์)]

[หยุดทั้งหมด (Stop all)]

2. วิธี "แชร์เกม" (Share) ให้โลกเห็น

เมื่อสร้างเกมเสร็จแล้ว การแชร์ให้เพื่อนเล่นเป็นส่วนที่สนุกที่สุดครับ!

สมัครสมาชิก: ถ้ายังไม่ได้สมัคร ให้กดปุ่ม Join Scratch (ฟรี) และยืนยันอีเมลให้เรียบร้อย (ถ้าไม่ยืนยันอีเมล ปุ่มแชร์จะไม่ขึ้นครับ)

ตั้งชื่อเกม: พิมพ์ชื่อเกมเท่ๆ ของคุณในช่องด้านบน (เช่น "The Great Adventure 2024")

กดปุ่ม Share: จะมีปุ่มสีส้มที่เขียนว่า "Share" อยู่ด้านบนสุด กดปุ่มนั้นได้เลย!

ใส่รายละเอียด:

Instructions: เขียนบอกวิธีเล่น (เช่น "เลื่อนเมาส์เพื่อหนีผี!")

Notes and Credits: ขอบคุณคนที่ช่วยสอน หรือบอกว่าเกมนี้ได้ไอเดียมาจากไหน

ส่งต่อ: ก๊อปปี้ Link ของหน้านั้น ส่งไปให้เพื่อนใน LINE หรือ Facebook ได้เลย เพื่อนจะสามารถกดเล่นเกมของคุณผ่านมือถือหรือคอมพิวเตอร์ก็ได้ครับ

💡 สรุปการเรียนรู้ของคุณวันนี้:

วันนี้นักเรียนได้ใช้ กระบวนการแก้ปัญหา ตั้งแต่:

ระบุปัญหา: อยากสร้างเกม

รวบรวมข้อมูล: รู้จักเครื่องมือ Scratch

วางแผน: ลำดับขั้นตอนการเดิน การเก็บแต้ม การหลบศัตรู

ดำเนินการ: ต่อบล็อกจนเป็นเกมจริง

ตรวจสอบประเมินผล: ทดสอบเล่น และเพิ่ม Game Over เพื่อให้เกมสมบูรณ์

ยินดีด้วย! นักเรียนกลายเป็น "นักพัฒนาเกม" รุ่นจิ๋วแล้ว!