34
กกกกกกกกกกกกก Scratch กกกกกกก Scratch กกกกกกกกกกกกกกกก Digital Media กกกกกกกกกกกกกกกกกกกกกกกกกกกก FASH กกก Switch กกกกกกกกกกกกกกกกกกกกกกกกกกกกกก กกกกกกกกกกก กกกกกกกกกกกกกกกกกกกกกกกกกกกกก กกกกกกก FASH กกก Switch กกกกกกกกกกกก กกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกก Digital กกกก กกกกกกกกกกกกกกกก Scratch กกกกกกกกกกกกกกกกกก Moodel LMS กกก กกกกกก กกกกกกกกกกกกกกก Social Network กกกกก Website VoiceThread กกกกกกกกกก กกกกกกกกกกกกกกกกกกก 1.กกกกกกกกกก Costumes กกกกกกกกกกกกกก Import 2.กกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกกก กกกกกกกกกกกกกก

การใช้โปรแกรม Scratch

Embed Size (px)

Citation preview

Page 1: การใช้โปรแกรม Scratch

การใช้�โปรแกรม Scratch

โปรแกรม Scratch ม�ความสามารถผลิ�ต Digital Media ที่��ม�ศั�กยภาพเที่�ยบเที่�าโปรแกรม FASH แลิะ Switch โดยที่��ม�ขั้� "นตอนการที่%างานที่��ไม�สลิ�บส�บซ้�อน ม�ความง�ายต�อการใช้�งานมากกว�า โปรแกรม FASH แลิะ Switch เป)นอย�างมาก เหมาะส%าหร�บผ+�ที่��ม�ประสบการณ์-ผลิ�ตส.�อ Digital น�อย เม.�อสร�างงานโดย Scratch

สามารถน%าเสนอได�ใน Moodel LMS แลิะ แลิะย�งน%าเสนอในร+ปแบบ Social Network ได�ใน Website VoiceThread ได�อ�กด�วย

การเตร�ยมไฟลิ-ขั้�อม+ลิ

1.คลิ�กที่��แที่บ Costumes แลิะคลิ�กที่��ป01ม Import

2.จากน�"นเลิ.อกภาพที่��ต�องการน%ามาสร�างงาน ด�งภาพขั้�างลิ�าง

Page 2: การใช้โปรแกรม Scratch

3.จะได�ภาพที่��ต�องการจนครบด�งภาพขั้�างลิ�าง ในขั้�"นตอนน�"อาจสร�างการ-ต+นเองก3ได�จากโปรแกรมช้�วยสร�างงานกราฟ4กอ.�นๆ

Page 3: การใช้โปรแกรม Scratch

ขั้��นตอนสร้าง Animation

1. เม.�อได�ภาพจนครบแลิ�ว ให�คลิ�กที่��แที่บ Scripts แลิะคลิ�กที่��ป01ม Control จากน�"นเลิ.อกคลิ�ก Icon When Click แลิ�วลิากมาปลิ�อยไว�ในพ."นที่�� Script เพ.�อต�องการน%าเสนองานโดยการคลิ�ก

Page 4: การใช้โปรแกรม Scratch

2. เลิ.อกคลิ�ก Icon forever แลิ�วลิากมาปลิ�อยไว�ในพ."นที่�� Script

เพ.�อต�องการน%าเสนองานซ้%"าๆ ก�นตลิอดเวลิา ด�งภาพขั้�างลิ�าง

Page 5: การใช้โปรแกรม Scratch

3. คลิ�กที่��ป01ม Look จากน�"นเลิ.อกคลิ�ก Icon next costume

แลิ�วลิากมาปลิ�อยไว�ในพ."นที่�� Script ภายใน Icon forever เพ.�อต�องการน%าเสนอภาพภายใน Costume ตามลิ%าด�บจนครบ ด�งภาพขั้�างลิ�างน�"

Page 6: การใช้โปรแกรม Scratch

4. คลิ�กที่��ป01ม Control จากน�"นเลิ.อกคลิ�ก Icon wait แลิ�วลิากมาปลิ�อยไว�ในพ."นที่�� Script ภายใน Icon forever ภายใต� Icon

next costume แลิ�วก%าหนดเวลิาหย0ดเป)น 0.2 ว�นาที่� เพ.�อหย0ดการน%าเสนอช้��วขั้ณ์ะขั้องแต�ลิะภาพภายใน Costume ตามลิ%าด�บจนครบ ที่��ต�องหย0ดช้��วขั้ณ์ะเพ.�อให�ภาพต�อเน.�องโดยการช้ลิอการน%าเสนอ (จากน�"นจะน%าเสนอซ้%"าๆ ตามค%าส��งขั้อง Icon forever) ด�งภาพขั้�างลิ�างน�"

Page 7: การใช้โปรแกรม Scratch

ขั้��นการ้สร้างฉากหลั�ง

1.ไปคลิ�กที่�� Stage จากน�"นเลิ.อกคลิ�กแที่บ Background แลิะคลิ�กป01ม Import เพ.�อน%าภาพมาเป)นภาพ Background ตามลิ%าด�บ

Page 8: การใช้โปรแกรม Scratch

2. แลิ�วเลิ.อกภาพ Background ที่��ต�องการ ตามภาพขั้�างลิ�าง

Page 9: การใช้โปรแกรม Scratch

ขั้��นการ้น�าเสนอเส�ยงเพลังปร้ะกอบ

1. กลิ�บไปคลิ�ก scripts แลิ�วเลิ.อกคลิ�กที่��ป01ม Control จากน�"นคลิ�กแลิ�วลิาก Icon when clicked แลิะ forever มาจ�ดวางจากบนลิงลิ�างตามลิ%าด�บ

Page 10: การใช้โปรแกรม Scratch

2. เลิ.อกเพลิงโดยคลิ�กที่��แที่บ Sound แลิ�วกดป01ม Import ตามลิ%าด�บ ตามภาพขั้�างลิ�าง

3. เลิ.อกเพลิงที่��ต�องการ

Page 11: การใช้โปรแกรม Scratch

4. ต�อไปให�คลิ�กที่��แที่บ Sound จากน�"นคลิ�กลิาก Icon play

sound until ไปปลิ�อยวางภายใน Icon forever

Page 12: การใช้โปรแกรม Scratch

ขั้��นตอนการ้น�าเสนอ Preview

1. คลิ�กที่��ป01มธงส�เขั้�ยวเม.�อต�องการน%าเสนอ ตามภาพขั้�างลิ�าง

Page 13: การใช้โปรแกรม Scratch

2. คลิ�กที่��ป01มวงกลิมที่��แดงเม.�อต�องการหย0ดน%าเสนอ ตามภาพขั้�างต�น

การเขั้�ยนโปรแกรม Scratch

ส%าหร�บม.อใหม� ลิองอ�านบลิ3อกน�"ก�อนนะคร�บ ที่%าความร+ �จ�กก�บ Scratch แลิะ เร��มต�นง�ายๆ ก�บ Scratch

การสอนเขั้�ยนโปรแกรมด�วย Scratch ให�เด3กๆ หร.อม.อใหม�ฝึ8กเขั้�ยนโปรแกรม ที่%าได�หลิายว�ธ� แต�ในที่��น�" เราจะเร�ยนร+ � Scratch

ผ�านโปรเจกต�างๆ ที่��มาก�บโปรแกรม Scratch ซ้9�งม�มากมาย แลิะ

Page 14: การใช้โปรแกรม Scratch

หลิากหลิายหมวดหม+� แลิะค�อนขั้�างแน�นอนว�า ผ+�เร�ยนน�าจะม�โปรเจกเหลิ�าน�" เม.�อ ดาวน-โหลิด โปรแกรม Scratch มาเป)นที่��เร�ยบร�อยแลิ�วการศั9กษาโปรเจกต�างๆ ขั้องคนอ.�น ที่%าให�เราเขั้�าถ9งความค�ด หร.อม0มมองใหม�ๆ ขั้องโปรเจกน�"นๆ ศั9กษาการเขั้�ยนโปรแกรม เขั้�ยนสคร�ปต-อย�างไร ให�บรรลิ0ตามส��งที่��ค�ด ส��งที่��ต�องการ เม.�อเราม�พ."นฐานขั้องโปรเจกน�"นๆ แลิ�ว การต�อยอดโปรเจก ด+เหม.อนจะเป)นก�าวแรกที่��จะลิองเขั้�ยนโปรแกรมให�ที่%างานต�อได�จร�ง ก�อนที่��เราจะเร��มโปรเจกใหม�เป)นขั้องเราเองหลั�กการ้เขั้�ยนโปร้แกร้มใน Scratch ตอนที่�� 1Posted on June 7, 2011by ค�ดสร�างสรรค-หลิ�กการที่��ใช้�ในการเขั้�ยนโปรแกรมม�มากมาย แต� Scratch น%ามาใช้�ไม�ที่� "งหมดแต�อาจม�เพ��มเต�มได�ในเวอร-ช้��นต�อๆไป หลิ�กการแรกเปร�ยบเหม.อนค%ากลิ�าวขั้อง Albert Einstein“Everything should be made as simple as possible, but not simpler.” Albert Einsteinในการเขั้�ยนโปรแกรม งาน(ใหญ่�)ควรแบ�งเป)นงานย�อยๆ แต�ไม�ควรย�อยเก�นไปเน.�องจากคอมพ�วเตอร-ม�ได�ฉลิาดสามารถค�ดขั้�"นตอนการที่%างานได�เอง (ในอนาคตก3ไม�แน�) อ�กที่�"งงานเด�ยวก�นย�งอาจที่%าได�หลิายว�ธ�แตกต�างก�น ด�งน�"นเป)นหน�าที่��ขั้องโปรแกรมเมอร-ที่��ต�องออกแบบการที่%างาน แบ�งงาน แลิะลิ%าด�บขั้�"นตอนการที่%างาน (algorithm) ให�ก�บคอมพ�วเตอร-ยกต�วอย�างเช้�นในโปรเจก Aquarium เราต�องการให�ปลิาว�ายน%"าไปมาด+เป)นธรรมช้าต�อย+�ในต+�ปลิาซ้9�งก3ค.อกรอบขั้องฉากเวที่�น�"นเอง เราสามารถแบ�งเป)นงานย�อยได� ค.อ การเคลิ.�อนที่��ขั้องปลิาไปเร.�อยๆ

Page 15: การใช้โปรแกรม Scratch

การสะที่�อนกลิ�บที่�ศัเม.�อเจอผน�งต+�ปลิา  การเปลิ��ยนที่�ศัเองในแต�ลิะช้�วงขั้ณ์ะหน9�งเพ.�อให�ด+เป)นธรรมช้าต�ต�วอย�างน�"ค�อนขั้�างง�าย แต�เต3มไปด�วยหลิ�กการในการเขั้�ยนโปรแกรม น��นค.อ

การที่%างานถ+กแบ�งเป)นขั้�"นตอนหร.อช้0ดค%าส� �ง (sequence) เช้�นช้0ดค%าส� �งที่�� 1. เคลิ.�อนที่��ไปขั้�างหน�า 1 หน�วย 2. ตรวจสอบด+ว�าช้นผน�งหร.อไม� ถ�าช้นให�สะที่�อนกลิ�บการที่��ปลิาต�องเคลิ.�อนที่��ไปเร.�อยๆ พร�อมที่�"งตรวจสอบด+ว�าช้นผน�งหร.อไม� เป)นหลิ�กการที่%างานแบบซ้%"าๆหร.อวนซ้%"า (iteration,

looping) ขั้องช้0ดค%าส� �งช้0ดหน9�ง (repeating a sequence of instructions)ในช้0ดค%าส� �งน�"ย�งม�การตรวจสอบขั้�อเที่3จจร�ง (conditional

statement) ด�วยว�าปลิาช้นผน�งต+�หร.อไม� ซ้9�งอาศั�ยตรรกะ (logic) ถ�าจร�ง (true) ก3อาจจะที่%างานอย�างหน9�ง ถ�าเที่3จ(false) ก3อาจจะที่%างานอ�กอย�างหน9�งการเก�ดเหต0การณ์-หน9�ง (event) ที่%าให�ต�องที่%างานอย�างหน9�ง (event handling) ในต�วอย�างน�" จะเห3นว�าในช้�วงขั้ณ์ะหน9�ง ปลิา

Page 16: การใช้โปรแกรม Scratch

ม�โอกาศัที่��จะเปลิ��ยนที่�ศัที่าง น�"นก3ค.อเหต0การณ์-ที่��ถ+กก%าหนดจากเวลิา (time event) ค.อที่0กๆ 1 ว�นาที่� ปลิาจะส0�มโอกาสว�าควรจะเปลิ��ยนที่�ศัหร.อไม� น�"นค.อการตอบสนองต�อเหต0การณ์- (event handling)การเคลิ.�อนที่��ขั้องปลิาไปเร.�อยๆ แลิะการเปลิ��ยนที่�ศัขั้องปลิาที่0กๆ 1

ว�นาที่�น�"นที่%างานแยกจากก�นแต�เก�ดขั้9"นพร�อมก�น ซ้9�งก3ค.อหลิ�กการที่%างานค+�ขั้นาน (parallel execution, threading) ที่��ให�โปรแกรมสคร�ปต-ที่%างานพร�อมๆก�นหลิายๆสคร�ปต-

หลั�กการ้เขั้�ยนโปร้แกร้มใน Scratch ตอนที่��   2 ต�วอย�างการเลิ�าเร.�องใน MadLibs ก3ม�หลิ�กการเขั้�ยนโปรแกรมที่��ส%าค�ญ่ด�งน�"

การโต�ตอบแบบที่�นที่� (real-time interaction) เป)นการโต�ตอบระหว�างผ+�ใช้�ก�บโปรแกรมผ�านการร�บร+ �ได�หลิายที่างเช้�น เมาส- ค�ย-บอร-ด เส�ยง เป)นต�น ในโปรเจกน�"ผ+�ด%าเน�นเร.�องม�การถาม แลิะให�ผ+�ใช้�งานตอบผ�านค�ย-บอร-ดต�วแปร (variables) ม�หน�าที่��เก3บค�าที่��ต�องการน%ามาใช้�ใหม�ผ�านการเร�ยกช้.�อขั้องต�วแปร เช้�นโปรเจกน�"สร�างต�วแปรมาเก3บค�าขั้อง

Page 17: การใช้โปรแกรม Scratch

ค%าตอบที่��ได�จากผ+�ใช้�งาน แลิะน%ากลิ�บมาใช้�ใหม�ขั้ณ์ะเลิ�าเร.�อง ต�วแปรย�งระบ0ตอนสร�างได�ว�าเป)นต�วแปรส�วนต�ว (private

variables) ใช้�ได�ก�บต�วลิะครที่��สร�างม�นขั้9"นมาเที่�าน�"น หร.อ ต�วแปรส�วนรวม (global variables) สามารถใช้�ได�ก�บที่0กต�วลิะคร เป)นการแช้ร-ขั้�อม+ลิระหว�างก�น ต�วแปรที่��ใช้�เก3บค%าตอบน�"นเป)นต�วแปรส�วนรวมซ้9�งวาฬสองต�วเอาไปใช้�ได�ขั้ณ์ะเลิ�าเร.�องการส�งต�อการที่%างาน (synchronization) ระหว�างต�วลิะคร ใช้�ว�ธ�การส�งรห�สส�ญ่ญ่าณ์ออกไป (broadcast) โดยอาศั�ยช้.�อขั้องรห�ส (event) ที่��แตกต�างเป)นต�วส�งไม�ให�ระหว�างก�น ต�วลิะครหร.อฉากเวที่�ที่��รอฟ@งรห�สที่��ม�นสนใจ (event listening)  ก3จะร+ �ว�าม�นควรจะเร��มที่%างานต�อหร.อย�ง เช้�นโปรเจกน�" ผ+�ด%าเน�นเร.�องได�ถามตอบก�บผ+�ใช้�เสร3จแลิ�ว ก3ส�งส�ญ่ญ่าณ์ให�เร��มเลิ�าเร.�องได� (“start

story”) วาฬสองต�วพร�อมที่�"งฉากเวที่�สนใจในรห�สน�"ก3ต�างเร��มต�นที่%างานขั้องตนเอง จากน�"นเป)นการเลิ�าเร.�องระหว�างวาฬสองต�ว วาฬที่�"งสองต�วจ9งผลิ�ดก�นร�บส�งรห�สเพ.�อให�การเลิ�าเร.�องต�อเน.�องก�นอย�างราบร.�นน�"นเอง

หลิ�กการเขั้�ยนโปรแกรมใน Scratch ตอนที่�� 3Scratch ไม�ได�ใช้�การเขั้�ยนโปรแกรมเช้�งว�ตถ0 (Object

oriented) อย�างจร�งจ�ง แต�โปรเจก GravityBlocks สะที่�อนการใช้�หลิ�กการเขั้�ยนโปรแกรมเช้�งว�ตถ0อย+�บ�าง มาลิองด+ก�นการเขั้�ยนโปรแกรมเช้�งว�ตถ0 (Object oriented) เป)นการมองแบบรวมศั+นย-อย+�ที่��ต�วว�ตถ0 (object) ค.อสนใจว�าว�ตถ0ที่��จะสร�างน�"นม�องค-ประกอบหร.อค0ณ์สมบ�ต�อะไรบ�าง แลิะที่%างานอะไรได�บ�าง โดยที่��วไปการเขั้�ยนโปรแกรมเช้�งว�ตถ0น�"นเป)นการสร�างว�ตถ0หลิากหลิาย

Page 18: การใช้โปรแกรม Scratch

ช้น�ดหลิายว�ตถ0ให�ที่%างานรวมก�น โต�ตอบก�น ส�งขั้�อม+ลิระหว�างก�น ตามลิ%าด�บขั้�"นตอนที่��ออกแบบไว�จนได�ผลิลิ�พที่-ที่��ต�องการขั้�"นแรกขั้องการเขั้�ยนโปรแกรมเช้�งว�ตถ0ค.อการสร�างต�นแบบหร.อแผ�นพ�มพ-เขั้�ยวขั้องว�ตถ0 (class) ซ้9�งประกอบด�วยค0ณ์สมบ�ต�หร.อขั้�อม+ลิ (properties, attributes, data แลิ�วแต�จะเร�ยก) ขั้องว�ตถ0 แลิะส��งที่��ม�นสามารถที่%าได� (function, method)

การเขั้�ยนโปรแกรมเช้�งว�ตถ0ใน Scratch ต�วลิะครหน9�งต�วก3ค.อหน9�งว�ตถ0 ด�งน�"นขั้�อม+ลิพ."นฐานขั้องว�ตถ0ก3ได�จากต�วลิะคร เช้�นช้.�อต�วลิะคร เคร.�องแต�งกาย เส�ยง ต%าแหน�งบนเวที่� ที่�ศัที่างการเคลิ.�อนที่�� ความสามารถในการหม0น การกลิ�บที่�ศั นอกจากน�"นถ�าเราสร�างต�วแปรส�วนต�วก3เขั้�าขั้�ายเป)นขั้�อม+ลิขั้องว�ตถ0 การเขั้�ยนสคร�ปต-ก3ค.อการเขั้�ยน method ให�ก�บว�ตถ0น�"นเองการสร�างบลิ3อกส�ต�วแรกในโปรเจก GravityBlocks เป)นการสร�างต�นแบบ (class) ขั้9"นมา น�"นก3ค.อ สร�างบลิ3อกที่��ม�สองส� ส�บานเย3นเป)นแถบบางๆอย+�ด�านบน ส�ฟAาอ�อนในส�วนที่��เหลิ.อขั้องบลิ3อก ต%าแหน�งขั้องบลิ3อกบนเวที่� ส�วนการที่%างานขั้องบลิ3อก ค.อการเคลิ.�อนที่��ลิง การหย0ดการเคลิ.�อนที่��เม.�อม�แผ�นพ�มพ-เขั้�ยวแลิ�ว ก3สามารถสร�างว�ตถ0ออกมาได� (instantiation) อ�กหลิายๆต�ว เช้�นในโปรเจก GravityBlocks

เราสร�างต�นแบบบลิ3อก (เป)นว�ตถ0ด�วย) เฉพาะต�วแรกต�วเด�ยว จากน�"นที่%าซ้%"าเพ.�อสร�างบลิ3อกอ.�นๆอ�ก 14 บลิ3อกว�ตถ0ที่��ได�จากต�นแบบเด�ยวก�นจะม�เอกลิ�กษณ์-ขั้องม�นเอง ถ9งแม�ว�าตอนสร�างว�ตถ0 ที่0กต�วจะเร��มต�นด�วยขั้�อม+ลิแลิะหน�าที่��เหม.อนก�นหมด แต�หลิ�งจากน�"นว�ตถ0จะเป)นต�วขั้องต�วเอง ที่%าอะไรก3ได�ที่��ม�นสามารถที่%าได�โดยไม�ต�องที่%าเหม.อนต�วอ.�น เปลิ��ยนค0ณ์สมบ�ต�ก3ได�

Page 19: การใช้โปรแกรม Scratch

เช้�น บางบลิ3อกก%าลิ�งเคลิ.�อนที่�� บางบลิ3อกอาจอย+�น��งๆบนพ."นหร.อบนบลิ3อกอ.�น เม.�อบลิ3อกถ+กลิากหร.อเคลิ.�อนที่��ลิง ต%าแหน�งขั้องม�นก3จะเปลิ��ยนตามไปด�วย

หลิ�กการเขั้�ยนโปรแกรมใน Scratch ตอนที่�� 4

ในม0มมองหน9�ง การเขั้�ยนโปรแกรม ค.อการบ�งค�บที่�ศัที่างขั้องขั้�อม+ลิ ที่��เราปAอนเขั้�าไปในโปรแกรม ผ�านกระบวนการต�างๆ จนได�ขั้�อม+ลิใหม�ออกมา ขั้�อม+ลิที่��เขั้�าแลิะออกย�งอาจเก�ดขั้9"น ขั้ณ์ะที่��โปรแกรมที่%างาน ต�วอย�างเช้�น โปรแกรมฟ@งเพลิง ผ+�ใช้�เลิ.อกเพลิงที่��อยากฟ@ง (ขั้�อม+ลิเขั้�า ช้.�อเพลิง) โปรแกรมก3เป4ดเพลิงน�"นให�ฟ@ง (ขั้�อม+ลิออก เส�ยง) ขั้ณ์ะฟ@งเพลิง ผ+�ฟ@งสามารถลิดเส�ยง หร.อหย0ดเพลิงช้��วขั้ณ์ะได�เป)นต�น

ขั้�อม+ลิที่��ร �บเขั้�ามา อาจม�การพ�กต�วอย+�ในต�วแปร (variables) จากน�"นสามารถปร�บเปลิ��ยนขั้�อม+ลิให�ที่�นสม�ยได� สามารถสร�างช้.�ออ�างอ�งที่��ม�ความหมายให�ก�บขั้�อม+ลิได� เร�ยกใช้�ขั้�อม+ลิผ�านช้.�อที่��ต� "งใหม�ได� แลิะสามารถส�งต�อขั้�อม+ลิ จากงานหน9�งส+�อ�กงานหน9�งได� กลิไกที่��ที่%าให�โปรแกรมที่%างานได�ค.อ การควบค0มลิ%าด�บการที่%างานแลิะการส�งผ�านขั้�อม+ลิระหว�างงาน (control flow)

มาลิองด+ต�วอย�างในโปรเจก SimpleCircuit เพ.�อด+ว�ธ�การควบค0ม ให�งานแลิะขั้�อม+ลิลิ.�นไหลิในโปรแกรมได�ถ+กต�องตามที่��ต�องการ ใน Scratch ม�การควบค0มการที่%างานอย+� 3 แบบ ค.อ 1.

การที่%างานเม.�อม�เหต0การณ์-หน9�งมากระต0�น 2. การที่%างานซ้%"าๆ แลิะ 3. การที่%างานแบบม�เง.�อนไขั้

Page 20: การใช้โปรแกรม Scratch

ต�"งแต�เร��มจนจบโปรแกรม ม�เหต0การณ์-เก�ดขั้9"นมากมายหลิายแบบ เช้�นในสคร�ปต-ขั้องเวที่� (ซ้�ายม.อ) เม.�อผ+�ใช้�คลิ�กธงเขั้�ยว สคร�ปต-ที่��ร �บเหต0การณ์-น�"ก3เร��มต�นที่%างาน แลิะระหว�างโปรแกรมที่%างาน ผ+�ใช้�ย�งโต�ตอบก�บโปรแกรมได� โดยกดแปAนเว�นวรรค (space bar)

ที่%าให�เวที่�ส�บเปลิ��ยนพ."นฉากหลิ�ง เปลิ��ยนหน�าตาขั้องแผงวงจร อ�กต�วอย�างหน9�งค.อ การส�งรห�สจากสคร�ปต-หน9�ง ที่%าให�อ�กสคร�ปต-ที่��ร �บรห�สน�"ที่%างาน

การควบค0มการที่%างานซ้%"า ม�หลิายร+ปแบบ เช้�น แบบร+ �จ%านวนรอบแน�นอน (บลิ3อก repeat) แบบไม�ร+ �จ%านวนรอบแน�นอน แต�อาศั�ยเง.�อนไขั้มาช้�วยในการหย0ด (บลิ3อก forever if) แลิะแบบที่%าซ้%"าจนกว�าจะจบโปรแกรม ต�วอย�างเช้�น สคร�ปต- Stage แลิะ Bulb

จะที่%างานวนซ้%"าไปเร.�อยๆ จนกว�าจะจบโปรแกรม โดยน%าส��งที่��ต�องการที่%าซ้%"ามาใส�ในบลิ3อก forever

Page 21: การใช้โปรแกรม Scratch

การที่%างานที่��ขั้9"นก�บเง.�อนไขั้ ก3ม�หลิายแบบค.อ จะที่%างานถ�าเง.�อนไขั้เป)นจร�งเที่�าน�"น (บลิ3อก if) ที่%างานได�ที่� "งกรณ์�ที่��เง.�อนไขั้เป)นจร�งหร.อเที่3จ (บลิ3อก if else) แลิะส0ดที่�ายค.อการน%าเง.�อนไขั้มาซ้�อนก�น โดยน%าเง.�อนไขั้หน9�งไปซ้�อนในอ�กเง.�อนไขั้หน9�ง ซ้9�งจะซ้�อนก�นก��ช้� "นก3ได� แต�มากไปก3อาจที่%าให�สคร�ปต-ด+ส�บสนได� ในสคร�ปต- Bulb จะเห3นการซ้�อนก�นขั้องเง.�อนไขั้ โดยเช้3กที่��เง.�อนไขั้แรกก�อน ค.อแปAนเว�นวรรคถ+ดกดหร.อไม� ถ�าใช้�จะเปลิ��ยนช้0ด แต�ถ�าไม�ใช้�ก3จะพบก�บอ�กเง.�อนไขั้หน9�ง ที่��เช้3กการครบวงจร เพ.�อจะต�ดส�นใจว�าจะเป4ดหร.อป4ดหลิอดไฟ

หลิ�กการเขั้�ยนโปรแกรมใน Scratch ตอนที่�� 5การเขั้�ยนโปรแกรม คงหน�ไม�พ�นการค%านวณ์แลิะการประมวลิผลิขั้�อม+ลิ โดยขั้�อม+ลิที่��สามารถน%ามาค%านวณ์ได� ค.อ ต�วเลิขั้ ต�วอ�กษร แลิะ ตรรกะ (ถ+ก หร.อ ผ�ด) ซ้9�งพบเห3นได�เก.อบจะที่0กโปรเจกใน Scratch

การค%านวณ์ต�วเลิขั้ที่��วไป ก3ม�การบวก (+) ลิบ (-) ค+ณ์ (*) หาร (/) นอกจากน�"นย�งม� การส0�มค�า การใช้�ฟ@งก-ช้�นคณ์�ตศัาสตร-อ�กมากมาย

Page 22: การใช้โปรแกรม Scratch

ส�วนการจ�ดการขั้�อม+ลิต�วอ�กษรน�"น สามารถรวมสองค%าให�เป)นค%าเด�ยวก�นได� (join) หร.อด9งอ�กษรใดอ�กษรหน9�งมาจากค%าได� (letter of ) นอกจากน�"นย�งน�บจ%านวนอ�กษรที่�"งหมดในค%าได� (length of)

ส%าหร�บตรรกะที่��ใช้�ในเง.�อนไขั้ หาได�จากการเปร�ยบเที่�ยบต�วเลิขั้ เช้�น การเปร�ยบเที่�ยบ มากกว�า (>) น�อยกว�า (<) หร.อ เที่�าก�บ (=) ซ้9�งจะค.นค�าเป)น จร�งหร.อเที่3จ เม.�อม�หลิายเง.�อนไขั้ ก3ย�งสามารถประมวลิผลิระหว�างเง.�อนไขั้ได�จาก ตรรกะแลิะ (and) ตรรกะหร.อ (or) ตรรกะไม� (not)

ส��งส%าค�ญ่อย�างหน9�งในการค%านวณ์ที่��กลิ�าวมา ค.อลิ%าด�บการค%านวณ์ ต�วอย�างเช้�น ถ�าต�องการค%านวณ์ 3 * 5 -4 /2 ในโปรแกรมภาษาอ.�น จะค%านวณ์ตามกฎลิ%าด�บการค%านวณ์ขั้องภาษาน�"นๆ เพ.�อลิดความส�บสน ใน Scratch จะที่%าการค%านวณ์ได�ที่��ลิะค+� เหม.อนการใส�วงเลิ3บ คนเขั้�ยนโปรแกรมต�องร+ �ว�า ต�องการค%านวณ์อย�างไร เพราะจะได�ผลิต�างก�น เช้�น ((3*5)-(4/2)) = 13 หร.อ ((3 * (5 – 4))

/2) = 1.5 เป)นต�น

Page 23: การใช้โปรแกรม Scratch

มาด+ต�วอย�าง GardenSecre

t ในสคร�ปต-ขั้องดอกไม� 1 ซ้9�งจะเห3นบลิ3อกค%านวณ์ส�เขั้�ยวอ�อน อย+�หลิายบลิ3อก เช้�น บลิ3อกเง.�อนไขั้ (flower = 1) ในบลิ3อกถ�า (if)การเลิ�นเอฟเฟคส� ความสว�าง ขั้นาดขั้องดอกไม�น�" ต�างใช้�การค%านวณ์เพ.�อสร�างความหลิากหลิาย เช้�น ส�เปลิ��ยนโดยน%าเอาต%าแหน�ง x ขั้องเมาส- มาหารด�วย 5 ค�าความสว�าง เก�ดจากการส0�ม ส�วนการเปลิ��ยนขั้นาด น%าเอาต%าแหน�ง y ขั้องเมาส- บวกด�วย 220

แลิ�วหารด�วย 3 ส0ดที่�ายบวกก�บค�าส0�ม ส�งเกต0การใช้�บลิ3อกซ้�อนในบลิ3อก เสม.อนการใส�วงเลิ3บ น�"นค.อ (((mouse y + 220) / 3) + random)

ในบลิ3อกที่%าซ้%"า (repeat) หาจ%านวนคร�"ง ในการหม0นให�ได� 1 รอบ ด�วยการค%านวณ์ (360 / 15)

หลิ�กการเขั้�ยนโปรแกรมใน Scratch ตอนที่�� 6

Page 24: การใช้โปรแกรม Scratch

การออกแบบหน�าตาโปรแกรม (user interface) เป)นเร.�องส%าค�ญ่ที่��ไม�ควรมองขั้�าม โดยเฉพาะโปรแกรมที่��ต�องการโต�ตอบก�บผ+�ใช้� แม�เป)นโปรแกรมเลิ3กๆ แต�อาจใช้�งานยาก ถ�าหน�าตาโปรแกรมไม�ส.�อถ9งการใช้�งาน หร.อไม�สามารถด9งศั�กยภาพขั้องโปรแกรมออกมาได� เพราะไม�ม�ช้�องที่างให�ต�ดต�อ

Scratch สามารถสร�างช้�องที่างการต�ดต�อ ระหว�างผ+�ใช้� ก�บโปรแกรมได�หลิายว�ธ� ลิองมาด+ต�วอย�างในโปรเจก  PianoMachine

ขั้�อความบนเวที่� เป)นการส.�อสารตรงไปย�งผ+�ใช้� ส�วนใหญ่�เป)นค%าส� �ง หร.อว�ธ�ใช้�งาน ต�วแปรเม.�อสร�างแลิ�ว สามารถแสดงบนเวที่�ได� แต�ถ�าต�องการให�ผ+�ใช้�ปร�บเปลิ��ยนม�นได� ขั้ณ์ะที่��โปรแกรมที่%างาน ที่%าได�โดยแสดงต�วแปรในร+ปแบบสไลิด- เหม.อนต�วแปรความเร3ว (speed)

การสร�างป01มค%าส� �ง ที่%าได�โดยการสร�างต�วลิะคร ที่��ร �บการคลิ�กเมาส-จากผ+�ใช้� เพ.�อให�โปรแกรมที่%างาน เช้�น  เม.�อคลิ�กที่��ค�ย-เปCยโนใดๆ ก3จะม�เส�ยงออกมาจากค�ย-น�"นๆ แต�การสร�างต�วลิะครให�เป)นป01มค%าส� �งโดยเฉพาะก3ม� เช้�น ป01มเพ��มหร.อลิดจ%านวนลิ+กบอลิ แลิะป01มการ

Page 25: การใช้โปรแกรม Scratch

สะที่�อนขั้องลิ+กบอลิ  นอกจากน�"น โปรแกรมย�งร�บค%าส� �งจากผ+�ใช้�ผ�านการกดค�ย-ต�างๆ บนค�ย-บอร-ด เช้�น a-z 0-9 ค�ย-ลิ+กศัร แลิะค�ย-เว�นวรรค (space bar)

หลิ�กการเขั้�ยนโปรแกรมใน Scratch ตอนที่�� 7

โดยที่��วไป โปรแกรมม�กประกอบไปด�วยงานย�อย (sub-

program) หลิายๆ งานเขั้�าด�วยก�น ซ้9�งงานย�อยในโปรแกรม ม�กเร�ยกได�หลิายแบบตามแต�ลิะบร�บที่ ค%าที่��น�าจะใช้�เร�ยกที่��วไป ค.อฟ@งก-ช้�น (function) เป)นการที่%างานที่��ร �บขั้�อม+ลิเขั้�าไป แลิ�วที่%างานตามขั้�"นตอนที่��ก%าหนดไว� ส0ดที่�ายให�ผลิลิ�พธ-ออกมา ในบางโปรแกรมภาษา อาจได�ย�นค%าว�า โปรซ้�เจอร- (procedure) ซ้9�งคลิ�ายฟ@งก-ช้�น แต�ไม�ค.นผลิลิ�พธ-ออกมาให�น%าไปใช้�ต�อ ส�วนในการเขั้�ยนโปรแกรมเช้�งว�ตถ0 (object oriented) ม�กใช้� เมธเธ�ด (method) เป)นฟ@งก-ช้�นที่��ผ+กต�ดก�บว�ตถ0 ถ�าจะเร�ยกใช้�งาน ต�องเร�ยกผ�านว�ตถ0น�"นๆ

ที่0กโปรแกรมจะต�องม�ฟ@งก-ช้�นหลิ�ก (main function) เป)นจ0ดเร��มต�นขั้องโปรแกรม ที่��สามารถร�บขั้�อม+ลิเขั้�ามาใช้�ภายในโปรแกรม การจ�ดลิ%าด�บการที่%างานขั้องโปรแกรมจะอย+�ภายในฟ@งก-ช้�นหลิ�ก (work flow) โดยการเร�ยกใช้�แลิะส�งผ�านขั้�อม+ลิให�ฟ@งก-ช้�นต�างๆ ที่%างาน แลิะส0ดที่�ายสามารถส�งขั้�อม+ลิ ออกจากโปรแกรมได�

ใน Scratch หลิ�กการขั้องฟ@งก-ช้��นน�"นไม�สมบร+ณ์- โปรแกรมที่��เขั้�ยนด�วย Scratch จะประกอบด�วยสคร�ปต-หลิายๆ สคร�ปต- ในแต�ลิะต�วลิะคร แต�ลิะสคร�ปต-ถ+กมองว�าเป)นการที่%างานเฉพาะอย�าง ซ้9�งคลิ�ายก�บหน�าที่��ขั้องฟ@งก-ช้��น ปกต�แลิ�ว ฟ@งก-ช้��นต�องม�ช้.�อ สามารถร�บหร.อค.นขั้�อม+ลิได� แลิะจะที่%างานเม.�อถ+กเร�ยกช้.�อฟ@งก-ช้�น

Page 26: การใช้โปรแกรม Scratch

พร�อมก�บขั้�อม+ลิเขั้�า (function call) แต�สคร�ปต-ใน Scratch

ไม�ม�ช้.�อ ร�บหร.อส�งขั้�อม+ลิไม�ได�

อย�างไรก3ตาม ส��งที่�� Scratch สามารถที่%าได�ใกลิ�เค�ยงค.อ ใช้�การส�งรห�ส (broadcast) แที่นการเร�ยกฟ@งก-ช้�น แลิะการใช้�ต�วแปรโกลิบอลิ (global variable) ที่��ที่0กต�วลิะครสามารถเขั้�าถ9งแลิะใช้�งานได� เพ.�อร�บส�งขั้�อม+ลิระหว�างสคร�ปต-

ฟ@งก-ช้�นหลิ�กขั้อง Scratch ค.อสคร�ปต-ที่��ที่%างานเม.�อธงเขั้�ยวถ+กคลิ�ก ส�งเกต0ว�าม�นอาจม�สคร�ปต-แบบน�"ได�หลิายสคร�ปต- ที่� "งน�"เพราะ Scratch ใช้�หลิ�กการที่%างานแบบค+�ขั้นาน (parallel) ซ้9�งแต�ลิะต�วลิะครที่%างานพร�อมก�นได� แลิะในต�วลิะครหน9�งๆ ย�งที่%างานได�หลิายอย�างพร�อมก�นอ�กด�วย

ลิองมาด+ต�วอย�างการใช้�ฟ@งก-ช้�นในโปรเจก FishChomp

Page 27: การใช้โปรแกรม Scratch

ในต�วอย�างน�"ที่� "ง ปลิาที่อง 1 (goldfish1) แลิะ ปลิาต�วใหญ่� (hungry fish) เร��มที่%างานพร�อมก�นในสคร�ปต-หลิ�ก เม.�อธงเขั้�ยวถ+กคลิ�ก ปลิาที่อง 1 ที่%างานในสคร�ปต-หลิ�กอย+�สคร�ปต-เด�ยวตลิอดโปรแกรม แต�ปลิาต�วใหญ่�ย�งม�อ�กสคร�ปต-หน9�ง ที่��เป)นฟ@งก-ช้�นรอการเร�ยกใช้�งานระหว�างเลิ�นเกมน�" ปลิาที่อง 1 จะส�งรห�ส “got-me” ออกไป ถ�าถ+กปลิาต�วใหญ่�ก�น แลิะเม.�อปลิาต�วใหญ่�ร�บรห�ส “got-me” ก3จะแสดงแอน�เมช้��นการก�นพร�อมเส�ยง “chomp” งานหลิ�กขั้องการส�งรห�ส (broadcast) ค.อการเช้.�อมต�อการที่%างานให�สอดคลิ�องก�น หมายความว�า ณ์ เวลิาที่��ปลิาที่อง 1 ถ+กก�น ก3ส�งรห�สส�ญ่ญ่าณ์ บอกปลิาต�วใหญ่�ให�แสดงที่�าที่างการก�นพร�อมเส�ยงการเค�"ยวด�วย เพ.�อให�เกมด+สมจร�ง

แต�ในม0มมองขั้องการใช้�ฟ@งก-ช้�น การส�งรห�สค.อ การเร�ยกช้.�อฟ@งก-ช้�น got-me ให�ที่%างาน (function call) สคร�ปต-ที่��ร �บรห�ส

Page 28: การใช้โปรแกรม Scratch

got-me เปร�ยบเสม.อนฟ@งก-ช้�นที่��ม�ช้.�อว�า got-me ซ้9�งอาจเป)นสคร�ปต-ในต�วลิะครเด�ยวก�นก3ได� หร.อ ต�วลิะครอ.�นก3ได� เช้�นในกรณ์�น�" เป)นสคร�ปต-หน9�งในปลิาต�วใหญ่�

เร.�องขั้องฟ@งก-ช้�นใน Scratch ย�งม�ต�อในคราวหน�า

หลิ�กการเขั้�ยนโปรแกรมใน Scratch ตอนที่�� 8ฟ@งก-ช้�นม�การที่%างานที่��ช้�ดเจน ร+ �ว�าต�องการใช้�ขั้�อม+ลิใดบ�าง แลิะจะ

ค.นขั้�อม+ลิใดบ�างออกมา ที่��ส%าค�ญ่เม.�อใส�ขั้�อม+ลิเด�มเขั้�าไปแลิ�ว ต�องได�ผลิลิ�พธ-เหม.อนเด�มที่0กคร�"งจ9งจะเป)นฟ@งก-ช้�น ลิองส�งเกต0ด+ บลิ3อกในหมวด Operator เช้�น บวก ลิบ ค+ณ์ หาร ฯลิฯ เป)นฟ@งก-ช้�นที่างคณ์�ตศัาสตร- แต�ม�อย+�หน9�งบลิ3อกในหมวดน�"ที่��ไม�ใช้�ฟ@งก-ช้�น ร+ �ม� "ยว�า

ค.อบลิ3อกอะไร ค%าตอบหาไม�ยากเลิย

การใช้�ฟ@งก-ช้�นที่%าให�โปรแกรมส�"นลิง เน.�องจากงานบางอย�างอาจเก�ดขั้9"นหลิายคร�"ง แต�ถ�างานน�"นอย+�ในร+ปขั้องฟ@งก-ช้�น ก3เขั้�ยนขั้9"นมาเพ�ยงคร�"งเด�ยว แลิ�วใช้�ว�ธ�เร�ยกฟ@งก-ช้�นแที่น นอกจากน�"น โปรแกรมย�งด+ง�ายขั้9"น การแก�ไขั้ปร�บปร0งก3ง�ายขั้9"น (ก3โปรแกรมม�นส�"นลิง)

เพราะแก�ไขั้ที่��ฟ@งก-ช้�นที่��เด�ยว

ร+ปแบบฟ@งก-ช้�นใน Scratch ม�หลิากหลิาย แลิะซ้�บซ้�อนกว�าที่��ค�ด มาลิองด+ต�วอย�างใน Delicious Fish

เมธเธ�ด (method) ค.อฟ@งก-ช้�นที่��ใช้�เฉพาะก�บต�วลิะครต�วใดต�วหน9�ง (object function) คลิ�ายก�บการเขั้�ยนโปรแกรมเช้�งว�ตถ0 ปกต�เมธเธ�ดขั้องว�ตถ0ใดจะที่%างาน เม.�อม�การส�งสาร (massage)

Page 29: การใช้โปรแกรม Scratch

มาย�งว�ตถ0น�"นโดยตรง ใน Scratch สามารถสร�างสคร�ปต-ให�เป)นเมธเธ�ดได� โดยสร�างรห�สให�ก�บว�ตถ0น�"นโดยเฉพาะ เช้�น ปลิาที่องเม.�อถ+กก�น จะส�งรห�ส “got-me” ออกไป แต�ม�เฉพาะปลิาต�วใหญ่�เที่�าน�"นที่��ร �บรห�สน�" อาจพ+ดได�ว�า สคร�ปต-ที่��ร �บรห�ส “got-me” ขั้องปลิาต�วใหญ่� เป)นเมธเธ�ดหร.อฟ@งก-ช้�นขั้องว�ตถ0 นอกจาก “got-

me” แลิ�ว ย�งม�รห�สที่��ที่%าหน�าที่��เหม.อนก�นอ�ก ค.อ “got 1″ ก�บ “oh-no”

การส�งแลิะร�บรห�สเป)นร+ปแบบหน9�งขั้องฟ@งก-ช้�นที่��ขั้9"นก�บเหต0การณ์- การส�งรห�สเป)นเหต0การณ์-แบบหน9�ง (event) แลิะเม.�อม�ฟ@งก-ช้�นใดที่��สนใจรห�สน�" (event listening) ได�ร�บรห�สน�" ก3จะเร��มที่%างานเพ.�อตอบสนองก�บเหต0การณ์-ที่��เก�ดขั้9"น (response function)

ต�วอย�างเช้�น เม.�อเร��มต�นเกม ต�วควบค0มเกมจะส�งรห�ส “setup”

ให�ปลิาที่0กต�วเตร�ยมพร�อมส%าหร�บการเลิ�น ปลิาที่0กต�วก3ตอบสนองรห�สน�"ด�วยการซ้�อนต�ว (hide) เที่�าน�"นเอง แต�เม.�อเขั้�าส+�แต�ลิะระด�บเกม ปลิาจะได�ร�บรห�ส “level1″ ตามมาด�วย “level2″ จนกระที่��งจบเกม เม.�อได�ร�บรห�ส “game-over” ปลิาแต�ลิะต�วจะตอบสนองต�างก�นไป

การใช้�การร�บส�งรห�ส เป)นการประสานงานให�สอดคลิ�องก�นระหว�างต�วลิะคร แต�ฟ@งก-ช้�นที่��ขั้9"นก�บเหต0การณ์- ย�งม�อ�กหลิายแบบ ที่��ไม�ขั้9"นก�บรห�ส เช้�น ขั้9"นก�บเวลิา (time event) ในเกมที่��ม�การควบค0มเวลิา เวลิาหมดถ.อเป)นเหต0การณ์-หน9�ง ที่��ที่%าให�เก�ดการเปลิ��ยนระด�บเกม หร.อการจบเกม นอกจากน�"น ผ+�เลิ�นย�งเป)นคนที่%าให�เก�ดเหต0การณ์-ต�างๆ อ�ก เช้�น การใช้�เมาส-ลิากไปมา (mouse event)

ที่%าให�ปลิาต�วใหญ่�เคลิ.�อนที่��ตามเมาส-

Page 30: การใช้โปรแกรม Scratch

เม.�อปลิาต�วใหญ่�ก�นปลิาแต�ลิะช้น�ดได� ม�นจะร�บรห�สจากปลิาที่�"งสามช้น�ด แลิะต�องแสดงแอน�เมช้��นการเค�"ยวพร�อมเส�ยงประกอบ แต�ถ�าต�องเขั้�ยนสคร�ปต-แสดงแอน�เมช้��นที่��เหม.อนก�นหมด ส%าหร�บปลิาที่�"งสามช้น�ด จะที่%าให�สคร�ปต-ยาวขั้9"น แลิะในอนาคตถ�าต�องการเพ��มปลิาช้น�ดอ.�นอ�ก ก3ต�องเขั้�ยนสคร�ปต-เหม.อนก�นอ�ก ซ้9�งไม�ใช้�ว�ธ�การเขั้�ยนโปรแกรมที่��ด� ด�งน�"นในสคร�ปต-ปลิาต�วใหญ่� จ9งน%าส�วนที่��เป)นแอน�เมช้��น (chomp) ออกมาเป)นฟ@งก-ช้�นต�างหาก ซ้9�งเป)นฟ@งก-ช้�นที่��ถ+กเร�ยกใช้�ภายในสคร�ปต-ปลิาต�วใหญ่�เที่�าน�"น เป)นฟ@งก-ช้�นส�วนต�ว (private function) ด�วยว�ธ�น�" ฟ@งก-ช้�น oh-on, got 1, got-

me จะเร�ยกใช้�ฟ@งก-ช้�น chomp เพ.�อแสดงแอน�เมช้��นแที่น ซ้9�งเป)นการเร�ยกใช้�ฟ@งก-ช้�นภายในฟ@งก-ช้�นอ�กที่�หน9�ง

เม.�อปลิาแต�ลิะช้น�ดถ+กก�น คะแนนจะเปลิ��ยนแปลิง อาจขั้9"นหร.อลิงก3ได� แลิะจ%านวนปลิาแต�ลิะช้น�ดที่��ถ+กก�นก3เพ��มขั้9"นด�วย การที่��จะตามการเปลิ��ยนแปลิงน�"ได�

Page 31: การใช้โปรแกรม Scratch

ต�องสร�างต�วแปรโกลิบอลิ (Score, goldfish, goldfish1,

greenfish) มาเก3บค�าเหลิ�าน9"ไว�