การเขียนโปรแกรมด้วย Scratch

แผนการจดั การเรียนรู้ รายวชิ า เทคโนโลยี (วทิ ยาการคานวณ) ใบความรู้ เรอ่ื งรจู้ กั Scratch และการวนซำ้ ➢ 01 รจู้ ักโปรแกรม Scratch โปรแกรม Scratch เป็นโปรแกรมโอเพนซอร์ส (Open-source software) พัฒนาโดยนักวิจัยที่ ห้องปฏิบัติการสื่อ (MIT Media Lab) สถาบันเทคโนโลยีแมสซาชูเซตส์ประเทศสหรัฐอเมริกา Scratch ออกแบบมาให้ใช้กับเด็กอายุ 8-16 ปีและเป็นทางเลือกที่ดีในการเขียนโปรแกรมสำหรับผู้เริ่มต้นปัจจุบัน Scratch พัฒนาถึงเวอร์ชัน 3.0 ผู้ใช้สามารถเขียนโปรแกรมออนไลน์หรือดาวน์โปลดโปรแกรมมาใช้ท่ี เคร่ืองคอมพวิ เตอร์แบบออฟไลน์ เนื่องจากโปรแกรม Scratch เป็นโปรแกรมภาษาเชิงกราฟิกจึงทำให้ใช้งานง่ายสามารถสร้าง สคริปต์หรือโปรแกรมที่ประกอบด้วยบล็อกคำสั่งต่าง ๆ มาวางต่อกันเป็นลำาดับโดยไม่ต้องกังวลกับการ พิมพค์ ำส่งั ผิดพลาดหน้าต่างโปรแกรม Scratch ดังรูปที่ 1.1 รูป 1.1 หนา้ ตา่ งโปรแกรม Scratch ชววนนคคิดิด ชวนคิดนักเรียนจะเขียนโปรแกรมโดยใช้ Scratch เพื่อสร้างผลงานอะไรได้บ้างโดยศึกษา รายละเอียดและทดสอบการใช้งานจากตวั อย่างโปรแกรมได้ท่ี http://scratch.mit.edu/ ระดบั ชนั้ มธั ยมศกึ ษาปีท่ี 1

แผนการจดั การเรียนรู้ รายวชิ า เทคโนโลยี (วทิ ยาการคานวณ) เรม่ิ ตน้ กบั โปรแกรม Scratch ในบทน้จี ะแนะนำการใช้งานโปรแกรม Scratch แบบออฟไลน์ท่ีต้องตดิ ตง้ั ไว้ที่เคร่ืองคอมพิวเตอร์ หากนักเรียนยังไม่มีโปรแกรมสามารถทำได้โดยเข้าไปที่เว็บไซต์ http://scratch.mit.edu/ แล้วเลือก Offline Editor ซ่งึ จะอยูใ่ นสว่ น Support ดา้ นล่างของเว็บเพจดงั รูป 1.2 รปู 1.2 Offine Editor สำหรับ Scratch 2.0 หลังจากน้นั จะปรากฏหนา้ ตา่ งให้ดาวนโ์ หลดดังรูปท่ี 1.3 รูป 1.3 หนา้ ต่างดาวน์โหลด Scratch 2.0 ระดบั ชนั้ มธั ยมศกึ ษาปีท่ี 1

แผนการจดั การเรียนรู้ รายวชิ า เทคโนโลยี (วทิ ยาการคานวณ) ขั้นตอนการติดตั้งโปรแกรม ขั้นตอนที่ 1 ติดตั้งโปรแกรม Adobe AIR โดยคลิกดาวน์โหลดเลือกให้เหมาะสมกับ ระบบปฏิบัติการที่ใช้ซึ่งจได้ไฟล์ AdobeAIRInstaller.exe หลังจากนั้นให้ดับเบิลคลิกโฟล์เพื่อติดตั้ง โปรแกรม ขั้นตอนที่ 2 ติดตั้งโปรแกรม Scratch โดยคลิกดาวน์โหลดเลือกใหเ้ หมาะสมกับระบบปฏิบัติการ ที่ใช้ซึ่งจะได้ไฟล์ Scratch-456.0.4.exe หลังจากนั้นให้คับเบิลคลิกไฟล์เพื่อติดตั้งโปรแกรม (ชื่อไฟล์ โปรแกรม Scratch อาจแตกต่างกนั เน่อื งจาก Scratch จะถูกปรับปรงุ ใหท้ ันสมัยอยูเ่ สมอ) สำหรับสว่ นที่ 3 Support Materials เป็นส่วนของเอกสารให้ความรู้และตัวอยา่ งโปรแกรม สว่ นประกอบหลกั ของหน้าต่างโปรแกรม Scratch หนา้ ต่างโปรแกรม Scratch ท่ปี รากฏจะมีลกั ษณะคล้ายโปรแกรมอืน่ ที่มีเมนใู ห้ใช้งานและพ้ืนท่ีใน การทำงานซ่งึ มสี ว่ นประกอบหลักในการทำงาน 3 สว่ นคอื เวทีตวั ละครและสครปิ ต์ดงั รปู 1.4 รูป 1.4 ส่วนประกอบหนา้ ต่างโปรแกรม Scratch ระดบั ชนั้ มธั ยมศกึ ษาปีท่ี 1

แผนการจดั การเรียนรู้ รายวชิ า เทคโนโลยี (วทิ ยาการคานวณ) 1. เวที (stage) เป็นพื้นที่สำหรับแสดงผลลัพธ์การทำงานเม่ือตอ้ งการรันโปรแกรมให้คลิกปุ่มธงเขียวและ ถา้ ตอ้ งการยกเลิกใหค้ ลิกปมุ่ หยดุ นอกจากนน้ี ักเรยี นยงั สามารถกำหนดส่วนประกอบต่าง ๆของพน้ื หลงั เวทไี ดเ้ ช่นเลือกภาพพ้ืนหลัง เลอื กเพลงประกอบซงึ่ กำหนดได้โดยคลกิ เลือกเครอ่ื งมือ มมุ ลา่ งซ้ายของหนา้ ตา่ งโปรแกรม 2. ตัวละคร (sprite) ในโปรแกรม Scratch สามารถกำหนดให้มีตัวละครได้หลายตัวละครแต่ละตัวจะมี ข้อมลู สว่ นตวั ที่แตกตา่ งกนั เช่น ชอื่ ชดุ ตวั ละคร ทศิ ทางการเคลอ่ื นท่ี พกิ ดั ของตำแหน่ง โดยชุดตัวละครจะ หมายถึง เครือ่ งแตง่ กายและท่าทาง 3. สครปิ ต์ (script) เปน็ พนื้ ท่ที ่ีใชส้ ำหรบั เขยี นโปรแกรมดงั รปู 1.5 ซง่ึ ประกอบดว้ ย 3.1 บล็อกคำสั่งแต่ละบล็อกถูกจัดอยู่ภายในกลุ่มท่ีทำหน้าที่ที่เกี่ยวข้องกันโดยมที ั้งหมด 10 กลุ่ม และถา้ คลิกท่กี ลุ่มบล็อกใดก็จะปรากฏบล็อกคำสงั่ ภายในกล่มุ นน้ั 3.2 พื้นที่เขียนโปรแกรมผู้ใช้สามารถลากบล็อกคำสั่งที่ต้องการมาวางเรียงต่อกันในพื้นที่เขียน โปรแกรม รูป 1.5 ส่วนสครปิ ต์ ระดบั ชนั้ มธั ยมศกึ ษาปีท่ี 1

แผนการจดั การเรียนรู้ รายวชิ า เทคโนโลยี (วทิ ยาการคานวณ) ตวั อยา่ งท่ี 1 เริม่ ตน้ กับ Scratch ดว้ ยการเขยี นโปรแกรมให้ตวั ละครแมวเดนิ สรา้ งโปรแกรม Scratch ให้ ตวั ละครแมวเดนิ มีขัน้ ตอนดังน้ี 1) เปดิ โปรแกรม Scratch จะปรากฏตวั ละคร Sprite1 ที่เป็นรปู แมว 2) คลกิ แทบ็ Costumes จะปรากฏชุดตวั ละคร 2 ชดุ คอื costume1 และ costume2 ให้ สังเกตว่าชุดตวั ละครมีลักษณะท่าทางการก้าวเดินของแมวที่แตกตา่ งกันดังรูป 1.6 รูป 1.6 ชดุ ตวั ละคร 3) คลิกแท็บ Script แลว้ เขียนโปรแกรมโดยลากบลอ็ กคำส่ังวางในพน้ื ทีเ่ ขยี นโปรแกรมดังนี้ 4) รันโปรแกรมโดยคลิกปุ่ม สังเกตผลลัพธ์ที่ได้จะเห็นว่าแมวมีลักษณะคล้ายการเดิน 1 ก้าว ซึ่งเป็นผลมาจากคำสั่ง move 10 steps หมายถึง สั่งให้ตัวละครเคลื่อนที่ไป 10 หน่วย (การเคลื่อนที่ 1 หน่วยจะเท่ากบั การขยบั ไป 1 จุดบนหนา้ จอ) และคำสง่ั next costume หมายถึง เปลย่ี นเป็นชุดตัวละคร ในลำดับถดั ไป ระดบั ชนั้ มธั ยมศกึ ษาปีท่ี 1

แผนการจดั การเรียนรู้ รายวชิ า เทคโนโลยี (วทิ ยาการคานวณ) 5) ปรับสคริปต์ในข้อ 3) โดยเพิ่มบล็อกคำสั่ง forever วางให้ครอบคำสั่ง move 10 steps และ next costume 1 2 >>>>>>> 3 4 6) คลกิ ปุม่ ธงเขยี ว แลว้ สงั เกตผลลัพธ์ทไ่ี ดจ้ ะเห็นวา่ แมวเดินชนขอบเวทีอย่างไม่สิ้นสดุ ➢ 02 การทำงานแบบวนซำ้ ในการเขียนโปรแกรมมีหลายกรณีที่ต้องมีการทํางานซ้ำ ๆกันซึ่งทำให้ต้องเขียนคำสั่งชุดเดียวกนั ซ้ำกันหลายครั้งเพื่อให้การทำงานมีประสิทธิภาพ Scratch มีคำสั่งที่ใช้ในการทํางานแบบวนซ้ำซึ่งอยู่ใน กลุ่มบลอ็ ก Control ดงั น้ี 2.1 บลอ็ กคำส่งั forever เป็นคำส่งั ท่ีกำหนดการทำงานแบบวนซำ้ ไม่รูจ้ บ ตวั อยา่ งเชน่ ระดบั ชนั้ มธั ยมศกึ ษาปีท่ี 1

แผนการจดั การเรียนรู้ รายวชิ า เทคโนโลยี (วทิ ยาการคานวณ) 2.2 บล็อกคำส่ัง repeat เป็นคำสั่งทีก่ ำหนดการทำงานแบบวนซ้ำตามจำนวนรอบที่ กำหนด ตัวอย่างเชน่ ตัวอย่างที่ 2 วาดรูปสีเ่ หล่ยี ม แนวคดิ ในการวาดรปู สเ่ี หลย่ี มคอื ต้องวาดเส้นตรงแล้วต้องเปลีย่ นทศิ ทางการวาดเป็นมุม 90 องศา ซ่งึ ถ้าสังเกตจะเห็นวา่ ส่วนนมี้ ีการทำซำ้ 4 รอบ แต่กอ่ นการสงั่ วาดรูปจะต้องมกี ารล้างหน้าจอภาพให้ว่าง ก่อนแล้วจงึ วางปากกา และกําหนดจดุ เรม่ิ ต้นของการวาด จากแนวคิดเขียนรหสั ลำลองได้ดงั นี้ 1. ล้างจอภาพ 2. วางปากกา 3. กำหนดตำแหน่งเริม่ วาดที่พกิ ัด (0,0) 4. ทำงานตอ่ ไปนี้ 4 รอบ 4.1 ลากเสน้ ตรง 100 หน่วย 4.2 หมุนตามเข็มนาฬิกา 90 องศา โปรแกรมมีดงั นี้ ระดบั ชนั้ มธั ยมศกึ ษาปีท่ี 1

แผนการจดั การเรียนรู้ รายวชิ า เทคโนโลยี (วทิ ยาการคานวณ) ผลลพั ธท์ ี่ได้ คือ จากตวั อยา่ งท่ี 2 อธบิ ายได้วา่ 1. บรรทดั ที่ 1 กำหนดจดุ เริ่มต้นเมื่อผู้ใชค้ ลกิ ธงเขียว 2. บรรทดั ที่ 2 ล้างหนา้ จอภาพ 3. บรรทดั ที่ 3 วางปากกา 4. บรรทัดที่ 4 กำหนดตำแหน่งเริม่ ต้นใหต้ ัวละครอยทู่ กี่ ลางจอภาพซึ่งคือตำาแหน่ง 0,0 5. กำหนดให้ทำคำส่ังภายในบล็อกคำสงั่ repeat จำนวน 4 รอบคือคำส่ังบรรทัดท่ี 6 เคลื่อนที่ไป ตามทิศทางของตวั ละครเป็นจำนวน 100 หนว่ ยและบรรทดั ท่ี 7 หมุนตามเข็มนาฬกิ า 90 องศาซ่ึงจะทำให้ ไดร้ ปู สเ่ี หลี่ยม 1 รูป ระดบั ชนั้ มธั ยมศกึ ษาปีท่ี 1