หนา ก

ค ำน ำ

บทเรยนคอมพวเตอรชวยสอนเรองการสรางการตนแอนเมชนเบองตน ดวย โปรแกรมFlash ชดนไดจดท าขน เพอใชเปนสวนหนงในการจดกจกรรมการเรยนการสอน กลมสาระการเรยนร การงานอาชพและเทคโนโลย รายวชา การสรางการตนแอนเมชนเบองตน รหสวชา ง30247 (วชาเพมเตม) ส าหรบนกเรยนชน มธยมศกษาปท 4 โดยเนนผเรยนเปนส าคญ ใหสามารถพฒนาความรความเขาใจเกยวกบเรองการสรางการตนแอนเมชน ดวย โปรแกรม Flash ทงนไดขยายผลในดานเนอหาใหกวางและชดเจนมากยงขน ซงผเรยนสามารถไปประยกตใชในชวตประจ าวนและใชในอนาคตไดแบบฝกทกษะการสรางการตนแอนเมชน ดวย โปรแกรม Flash ชดนมทง หมด 6 เลม ประกอบดวย เลมท 1 การใชงานโปรแกรม Flash เลมท 2 การวาดรปดวยโปรแกรม Flash เลมท 3 การสรางการเคลอนไหวแบบ Frame By Frame เลมท 4 การสรางการเคลอนไหวแบบ Classic Tween เลมท 5 การสรางการเคลอนไหวแบบ Shape Tween เลมท 6 การใชงานเสยงและวดโอ หวงเปนอยางยงวาแบบฝกทกษะการสรางการตนแอนเมชน ดวย โปรแกรม Flash ชดน จะชวยสงเสรมและพฒนาทกษะการสรางการตนแอนเมชนของนกเรยนใหดยงขน สงผลใหนกเรยนมผลสมฤทธทางการเรยนสงขน ตลอดจนเสรมสรางสมรรถนะส าคญดานความสามารถในการใชเทคโนโลยของนกเรยนและผทสนใจ ใหบรรลตามวตถประสงคของหลกสตรตอไป รษา วลาจนทร

หนา ข

สำรบญ

เรอง หนำ ค าน า............................................................................................................................. .................................. ก สารบญ............................................................... ............................................................................................ ข สารบญภาพ…………………………………………………………………………………………………………………………………… ค สารบญตาราง………………………………………………………………………………………………………………………………… ง ค าแนะน าในการใชแบบฝกทกษะ................................................................................................................... จ ค าแนะน าส าหรบคร ………………………………………………………………………………………………………………………. ช ค าแนะน าส าหรบนกเรยน ………………………………………………………………………………………………………………. ซ ค าอธบายรายวชา…………………………………………………………………………………………………………………………… ฌ โครงสรางรายวชา............................................................................................................................. .............. ฎ ผงมโนทศน……………………………………………………………………………………………………………………………………. ฏ ผงมโนทศน หนวยท 1 การใชงานโปรแกรม Flash…………………………………………………………………………….. ฐ สาระการเรยนร ............................................................................................................................. ................ ฑ ผลการเรยนรทคาดหวง ............................................................................................................................. .... ฑ แบบทดสอบกอนเรยน ................................................................... ................................................................ 1 การใชงานบทเรยนคอมพวเตอรชวยสอน : การใชงานโปรแกรม Flash ..................................................... 3 ใบความรท 1 ความรเบองตนเกยวกบโปรแกรม Flash ................................................................................ 8 ใบความรท 2 การใชเครองมอวาดเสนและการวาดรปทรง ........................................................................... 14 ใบงานท 1 ความรเบองตนเกยวกบโปรแกรม Flash...................................................................................... 25 ใบงานท 2 การใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต ............................................................... 27 แบบฝกปฏบต (Workshop1) ...................................................................................................................... 28 แบบทดสอบหลงเรยน ............................................................................................................................. ...... 29 บรรณานกรม ............................................................................................................................. .................... 31 ภาคผนวก ................................................................................. ..................................................................... 32 ภาคผนวก ก ............................................................................................................................. ..................... 33 ภาคผนวก ข ........................................................................................................................................ .......... 40 ภาคผนวก ค .......................................................................................................... ........................................ 45

หนา ค

สำรบญภำพ

ภำพท หนำ ภาพท 1 หนาแรกของบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”....................... 3

ภาพท 2 เมนหลกของบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”....................... 3

ภาพท 3 ผลการเรยนรทคาดหวงของบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”.. 4

ภาพท 4 แบบทดสอบกอนเรยนของบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”…. 4

ภาพท 5 สรปคะแนนแบบทดสอบกอนเรยน เรอง”การใชงานโปรแกรม Flash”…………………………………. 5

ภาพท 6 วดโอการสอนบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash” ………………….. 5 ภาพท 7 รายละเอยดเนอหาการสอนบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”… 6 ภาพท 8 แบบทดสอบหลงเรยน เรอง”การใชงานโปรแกรม Flash” …………………………………………………. 6

ภาพท 9 สรปคะแนนแบบทดสอบหลงเรยน เรอง”การใชงานโปรแกรม Flash”…………………………………. 7

ภาพท 10 แบบฝกปฏบตเรอง”การใชงานโปรแกรม Flash” ……………………………………………………………. 7

ภาพท 11 หนาตางการท างานของโปรแกรม Flash…………………………………………………………………………. 8

ภาพท 12 แถบเครองมอหลก Toolbar ของโปรแกรม Flash…………………………………………………………… 9

ภาพท 13 แถบเครองมอ Tool ของโปรแกรม Flash……………………………………………………………………….. 9

ภาพท 14 ชอเอกสาร (เรมตนจะเปนชอ Untitled) ................................................................................... 9

ภาพท 15 ภาพเสนควบคมเวลา Timeline .............................................................................................. .. 9

ภาพท 16 ภาพสวนประกอบ Layer .......................................................................................................... 10

ภาพท 17 ภาพพนทการท างาน Stage…..………………………………………………………………………………………. 10

ภาพท 18 สวนประกอบ Properties……………………………………………………………………………………………… 10

ภาพท 19 การก าหนดรายละเอยดเมอสรางเอกสารใหม............................................................................. 12

ภาพท 20 การน าภาพทวาดจากโปรแกรม Flash Import ออกเปนรปภาพ............................................... 13

ภาพท 21 ไฟลแบบบตแมปเมอท าการขยายกจะเหนเมดสทแตกออก ....................................................... 14

ภาพท 22 ไฟลแบบเวกเตอรเมอท าการขยายภาพกยงความคมชด ............................................................ 15

ภาพท 23 กลมเครองมอ Toolbox………………………………………………………………………………………………… 15

ภาพท 24 การแยกวตถออกเปนเสนขอบ outline และพนผว Fill ............................................................ 16

ภาพท 25 สวน Properties Inspector จะเปลยนแปลงตามเครองมอทเลอก .......................................... 16

ภาพท 26 การเลอกส Color ...................................................................................................................... 17

ภาพท 27 การเลอกส เสนขอบ outline และพนผว Fill ........................................................................... 17

ภาพท 28 การรวม Object ........................................................................................................................ 18

ภาพท 29 การแยก Object ....................................................................................................................... 18

หนา ง

สำรบญภำพ (ตอ)

ภำพท หนำ ภาพท 30 การแยก Object โดยการดบเบลคลก......................................................................................... 18

ภาพท 31 เครองมอ Pen Tool แบบตาง ๆ ............................................................................................. 19

ภาพท 32 การท างานของ Pen Tool .................................................................................. ..................... 19

ภาพท 33 การใชงาน Pen Tool .............................................................................................................. 20

ภาพท 34 การใชงาน Add Anchor Point Tool …………………………………………………………………………. 20

ภาพท 35 การปรบเสนตรงมม Comer Point ........................................................................................... 21

ภาพท 36 การเพมจดระหวางเสน .............................................................................................. ................ 21

ภาพท 37 การปรบจด Anker .................................................................................................................... 22

ภาพท 38 การปรบจด Anker บน Curve Point……………………………………………………………………………… 22

ภาพท 39 การเครองมอรปทรงเรขาคณต ................................................................................................... 23

ภาพท 40 การเลอกเครองมอ Selection Tool ................................................................................. ........ 24

ภาพท 41 การเลอกเครองมอ SubselectionTool ................................................................................... 24

หนา จ

สำรบญตำรำง

ตารางท หนา ตำรำงท 1 ตารางไฟลภาพทสามารถบนทกไดจากโปรแกรม Flash ............................................................. 11 ตำรำงท 2 ตารางไฟลภาพเคลอนไหวทสามารถบนทกไดจากโปรแกรม Flash ............................................ 11

หนา ฉ

ค ำแนะน ำในกำรใชแบบฝกทกษะ แบบฝกทกษะชดน จดท าขนเพอพฒนาการเรยนร กลมสาระการเรยนรการงานอาชพและเทคโนโลย รหสวชา ง30247 รายวชาการสรางการตนแอนเมชนเบองตน ระดบชนมธยมศกษาปท 4 แบบฝกทกษะมทงหมด 6 เลม เลมท 1 การใชงานโปรแกรม Flash เลมท 2 การวาดรปดวยโปรแกรม Flash เลมท 3 การสรางการเคลอนไหวแบบ Frame By Frame เลมท 4 การสรางการเคลอนไหวแบบ Classic Tween เลมท 5 การสรางการเคลอนไหวแบบ Shape Tween เลมท 6 การใชงานเสยงและวดโอ เอกสารเลมนเปนเอกสารทใชประกอบการเรยน นกเรยนสามารถศกษาไดดวยตนเอง โดยใหนกเรยนศกษาและปฏบตตามขนตอนดงตอไปน

1. ศกษาจดประสงคการเรยนร เพอใหทราบวาเมอจบบทเรยนแลวนกเรยนจะตอง มความร และมความสามารถอะไรบาง

2. ท าแบบทดสอบกอนเรยนแลวตรวจค าตอบเพอใหรวานกเรยนมความรพนฐาน เกยวกบเรองทจะศกษามากนอยเพยงใด

3. ศกษาใบความร ท าใบงานและท าแบบฝกปฏบตตามกจกรรมทก าหนดไว เพอเปนการ ทบทวนใหมความรความเขาใจในเนอหามากยงขน

4. ท าแบบทดสอบหลงเรยน เพอวดความรความเขาใจอกครงหนง แลวตรวจค าตอบ 5. นกเรยนตองมความซอสตย ตอตนเอง ไมเปดดเฉลยแบบทดสอบกอนเรยน หลง เรยน และเฉลยแบบฝกกจกรรมทกกจกรรม 6. ถานกเรยนและผสนใจตองการศกษาเนอหาเพมเตม สามารถคนควาไดจาก บรรณานกรมทายเลม

หนำ 1 หนำ 1 หนำ ก หนำ ก หนำ ก หนำ ก หนำ ก หนำ ก หนำ ก หนำ ก หนำ ก หนำ ก หนำ ก

หนำ ก หนำ ก หนำ ก หนำ ก

หนา ช

บทเรยนคอมพวเตอรชวยสอนเรองการสรางการตนแอนเมชน ดวยโปรแกรม Flash เลมท 1 เรอง การใชงานโปรแกรม Flash เปนสอประกอบการจดกจกรรมการเรยนการสอนของนกเรยนชน มธยมศกษาปท 4 โรงเรยนประโคนชยพทยาคม ซงในการด าเนนกจกรรมการเรยนการสอน ครผสอนควรปฏบตดงน 1. ขนเตรยมการสอน ครผสอนตองศกษารายละเอยดดงน 1.1 ศกษาโครงสรางผลการเรยนร ของแผนการจดการเรยนรใหเขาใจอยางละเอยด 1.2 ตรวจสอบบทเรยนคอมพวเตอรชวยสอนเรองการสรางการตนแอนเมชน ดวยโปรแกรม Flash Player สอการสอนและคอมพวเตอรใหอยในสภาพทใชงานไดด 1.3 ครผสอนควรเตรยมความรในเนอหาอยางลกซง 2. ขนด าเนนกจกรรมการเรยนการสอน 2.1 ครผสอนสามารถยดหยนเวลาในการจดกจกรรมการเรยนการสอนไดตามความเหมาะสม 2.2 ครเปดบทเรยนคอมพวเตอรชวยสอนเรองการสรางการตนแอนเมชน ดวยโปรแกรม Flash Player และเปดเอกสารประกอบเลมท 1 เรอง การใชงานโปรแกรม Flash ใหนกเรยนไดศกษา 2.3 ครอธบายและสาธตขนตอนการฝกปฏบต 2.4 ครใหนกเรยนเปดเครองคอมพวเตอรและฝกปฏบตตามบทเรยนคอมพวเตอรชวยสอนและกจกรรมฝกทกษะทก าหนดไวในการจดกจกรรม 2.5 ครผสอนสามารถเพมเตมเนอหาบางตอนไดตามความเหมาะสม 3. ขนการประเมนผล 3.1 ครผสอนควรแจงใหนกเรยนทราบถงขอบเขตเนอหาทจะประเมน 3.2 ครผสอนควรประเมนผลทกครงหลงสนสดกจกรรมการเรยนการสอนและแจงใหนกเรยนทราบถงผลการประเมน

ค ำแนะน ำส ำหรบคร

หนา ซ

บทเรยนคอมพวเตอรชวยสอนเรองการสรางการตนแอนเมชน ดวยโปรแกรม Flash เลมท 1 เรอง การใชงานโปรแกรม Flash เลมนใชประกอบการจดกจกรรมการเรยนการสอนของนกเรยนชน มธยมศกษา ปท 2 โรงเรยนประโคนชยพทยาคม โดยมขน ตอนการจดกจกรรมการเรยนการสอน ดงน 1. นกเรยนเปดบทเรยนคอมพวเตอรชวยสอนเรองการสรางการตนแอนเมชน ดวยโปรแกรม Flash Player และเอกสารประกอบเลมท 1 เรอง การใชงานโปรแกรม Flash 2. นกเรยนรบฟงค าชแจงการใชบทเรยนคอมพวเตอรชวยสอนเรองการสรางการตนแอนเมชน ดวยโปรแกรม Flash กอนลงมอปฏบต 3. นกเรยนท าแบบทดสอบกอนเรยน เพอประเมนวานกเรยนมพนฐานความรความเขาใจเกยวกบเรองทจะเรยนมากนอยเพยงใด 4. นกเรยนฟงค าอธบายและการสาธตของคร พรอมทงฝกปฏบตหลงจากการสาธต 5. ศกษาเนอหาและฝกปฏบตตามขนตอนทระบไวในกรอบกจกรรม 6. ทดสอบการฝกปฏบตและใหครผสอนตรวจ 7. ท าแบบทดสอบหลงเรยนเพอดความกาวหนาในการเรยนของนกเรยน หลงจากท าฝกปฏบต โดยใชบทเรยนคอมพวเตอรชวยสอนเรองการสรางการตนแอนเมชน ดวยโปรแกรม Flash 8. หลงจากท ากจกรรมการเรยนการสอนเสรจเรยบรอยแลว ใหนกเรยนปดเครองคอมพวเตอรอยางถกวธและเกบเกาอใหเรยบรอย 9. ในการท ากจกรรมตามบทเรยนคอมพวเตอรชวยสอนเรองการสรางการตนแอนเมชน ดวยโปรแกรม Flash ทกเลมขอใหนกเรยนปฏบตดวยความตง ใจมความซอสตยตอตนเองใหมากทสด 10. นกเรยนรบฟงการบอกคะแนน ค าชมเชย และค าแนะน าเพมเตมจากคร

ค ำแนะน ำส ำหรบนกเรยน

หนา ฌ

ค ำอธบำยรำยวชำ

รายวชา ง30247 การสรางงานแอนเมชนเบองตน กลมสาระการเรยนร การงานอาชพและเทคโนโลย ชนมธยมศกษาปท 4 เวลาเรยน 20 ชวโมง/ภาคเรยน จ านวน 0.5 หนวยกต -------------------------------------------------------------------------------------------------------------------- ศกษาการสรางงานแอมเนชนดวยโปรแกรม Adobe Flash การใชเครองมอ การสรางชนงาน การตกแตงชนงาน การแกไขชนงาน การสรางภาพเคลอนไหว การแปลงชนงานเพอใชในการเผยแพรชนงานและประยกตใชกบงานดานอนๆ ได ปฏบตการใชเครองมอในการสรางภาพเคลอนไหว การวาดเสน การสรางนทานอยางงาย และประยกตพฒนาชนงานจากโปรแกรม Adobe Flash ทใชในงานแอมเนชนไดอยางเหมาะสม ผเรยนสามารถสรางงานแอนเมชนอยางสรางสรรค น าชนงานมาประยกตใชใหเกดประโยชนตอตนเองและสวนรวม โดยมความรบผดชอบ ซอสตย ขยนอดทน ท างานอยางมประสทธภาพ มความคดรเรมสรางสรรคน าภมปญญาทองถนมาประยกตใชตามหลกปรชญา เศรษฐกจพอเพยง ในการด ารงชวตการใชทรพยากรสงแวดลอมอยางประหยด การใชทกษะในการท างานรวมกนอยางมประสทธภาพ และด ารงชวตรวมกนในสงคมอยางมความสข และสามารถแกปญหาแลวถายทอดความคดในการแกปญหาอยางมขนตอนได ผลกำรเรยนร

1. นกเรยนสามารถใชงานโปรแกรม Flash พนฐานได 2. นกเรยนสามารถใชเครองมอ Tool มาสรางภาพเคลอนไหวได 3. นกเรยนสามารถสรางภาพเคลอนไหวแบบตางๆ (Frame by Frame, Classic Tween , Shape

Tween) ได 4. นกเรยนสามารถน าไฟลเสยงและไฟลวดโอมาใชงานในโปรแกรมได 5. สามารถสรางภาพเคลอนไหวและเผยแพรชนงานไดอยางสรางสรรค

รวมทงหมด 5 ผลกำรเรยนร

หนา ญ

โครงสรำงรำยวชำ

รายวชา ง30247 การสรางงานแอนเมชนเบองตน กลมสาระการเรยนร การงานอาชพและเทคโนโลย ชนมธยมศกษาปท 4 เวลาเรยน 20 ชวโมง/ภาคเรยน จ านวน 0.5 หนวยกต

หนวยท

ชอหนวยกำรเรยนร ผลกำรเรยนร

สำระส ำคญ เวลำเรยน

น ำหนกคะแนน

1 การใชงานโปรแกรม Flash ขอท 1 - การเรยกใชงานโปรแกรม Flash - รจกกบสวนประกอบของโปรแกรม Flash - การสรางไฟลงาน การบนทกไฟลงาน และการเปดไฟลงาน

2 5

2 การวาดรปดวยโปรแกรม Flash

ขอท 2 - รปแบบการวาดภาพในโปรแกรม Flash - การใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต - การลบเสนและสพนดวยเครองมอ Eraser Tool - การวาดรปทรงอสระดวยเครองมอ Pen Tool - การเลอกสในรปแบบตางๆ - การไลโทนสเกรเดยนทแบบ Linear Gradient และ Radial Gradient - การเปลยนสเสนดวยเครองมอ Ink Bottle Tool - การเตมสพนดวยเครองมอ Paint Bucket Tool

2

5

3 การสรางภาพเคลอนไหวแบบ Frame by frame

ขอท 3,5 - รจกกบไทมไลน - รจกกบเลเยอร - การจดการกบเลเยอร - รจกกบเฟรม - การจดการเฟรม - การเคลอนไหวแบบ Frame by frame

4 15

4 การสรางภาพเคลอนไหวแบบ Classic Tween

ขอท 3,5 - การเคลอนไหวแบบ Classic Tween - การเคลอนไหวแบบ Motion Tween - การเคลอนไหวใหเคลอนทตามเสนดวย Motion Guide

4 15

หนา ฎ

หนวยท

ชอหนวยกำรเรยนร ผลกำรเรยนร

สำระส ำคญ เวลำเรยน

น ำหนกคะแนน

5 การสรางภาพเคลอนไหวแบบ Shape Tween

ขอท 3,5 - การเคลอนไหวแบบ Shape Tween - การเคลอนไหวของขอความ

4 15

6 การใชงานเสยงและวดโอ ขอท 4,5 - รจกกบประเภทของไฟลเสยง - รจกกบนามสกลไฟลเสยงทโปรแกรมรองรบ - การน าเขาไฟลเสยง - การแทรกเสยงลงในชนงาน - การแทรกเสยงลงในปม - รจกกบไฟลวดโอทโปรแกรมรองรบ - การน าเขาไฟลวดโอ

2 5

กลำงภำค 1 20 ปลำยภำค 1 20

รวม 20 100

หนา ฏ

ผงมโนทศน

รายวชา ง30247 การสรางงานแอนเมชนเบองตน กลมสาระการเรยนร การงานอาชพและเทคโนโลย ชนมธยมศกษาปท 4 เวลาเรยน 20 ชวโมง/ภาคเรยน จ านวน 0.5 หนวยกต

กำรสรำงงำนแอนเมชนเบองตน

การใชงานโปรแกรม Flash

การวาดรปดวยโปรแกรม Flash

การเคลอนไหว แบบ Frame by Frame

การเคลอนไหว แบบ Classic Tween

การเคลอนไหว แบบ Shape Tween

การใชงานเสยง และวดโอ

หนา ฐ

ผงมโนทศน หนวยท 1 กำรใชงำนโปรแกรม Flash

รายวชา ง30247 การสรางงานแอนเมชนเบองตน เรอง การใชงานโปรแกรม Flash ชนมธยมศกษาปท 4 เวลาเรยน: หนวย 2 ชวโมง จ านวน 0.5 หนวยกต

การใชงานโปรแกรม Flash

ความรเบองตนเกยวกบโปรแกรม Flash

การใชงานเครองมอ Flash

หนา ฑ

1. การเรยกใชงานโปรแกรม Flash 2. รจกกบสวนประกอบของโปรแกรม Flash 3. การสรางไฟลงาน 4. การบนทกไฟลงานและการเปดไฟลงาน 5. รปแบบการวาดภาพในโปรแกรม Flash

- การวาดภาพแบบ Object Drawing - การวาดภาพแบบ Shape

6. การวาดเสน - การวาดเสนตรงดวยเครองมอ Line Tool - การวาดเสนอสระดวยเครองมอ Pencil Tool

7. การวาดรปทรงเรขาคณต - การวาดสเหลยมหรอสเหลยมมมโคงดวยเครองมอ Rectangle Tool และ Rectangle Primitive

Tool - การวาดวงกลมหรอวงรดวยเครองมอ Oval Tool และ Oval Primitive Tool - การวาดรปทรงหลายเหลยมและรปดาวดวยเครองมอ PolyStar Tool

8. การลบเสนและสพนดวยเครองมอ Eraser Tool 1. ดานความรความเขาใจ (K)

1.1 อธบายวธการเรยกใชงานโปรแกรม Flash ได (K) 1.2 อธบายสวนประกอบตางๆ ของโปรแกรม Flash ได (K) 1.3 อธบายวธการการสรางไฟลงานได (K) 1.4 อธบายวธการบนทกไฟลงานและการเปดไฟลงานได (K)

1.5 อธบายรปแบบการวาดภาพในโปรแกรม Flash ได (K) 1.6 บอกเครองมอการวาดเสนและการวาดรปทรงเรขาคณตได (K) 1.7 บอกวธการลบเสนและสพนดวยเครองมอ Eraser Tool ได (K)

2. ดานทกษะกระบวนการ (P) 2.1 สามารถเรยกใชงานโปรแกรม สรางไฟลงาน บนทกไฟลงาน และเปดไฟลงานได (P) 2.2 สามารถใชเครองมอการวาดเสนและเครองมอการวาดรปทรงเรขาคณตได (P)

3. ดานคณลกษณะอนพงประสงค (A) 3.1 มเจตคตทดมความใฝร ใฝเรยน มคณธรรมจรยธรรมในการใชคอมพวเตอร (A)

สำระกำรเรยนร

ผลกำรเรยนรทคำดหวง

หนา 1

ค ำชแจง ใหนกเรยนคลกเลอกขอทถกทสดเพยงขอเดยว 1. (Text Tool) เปนเครองมอทท าหนาทอะไร

ก. วาดรปตว A ข. พมพขอความ ค. เปลยนสตวอกษร ง. เคลอนตวอกษร

2. (Free Transform Tool) เปนเครองมอทท าหนาทอะไร

ก. ปรบขนาดรปภาพ ข. วาดรปสเหลยม ค. เคลอนยายรปภาพ ง. ถกทกขอ

3. (Sub Selection Tool) เปนเครองมอทท าหนาทอะไร ก. เลอกวตถทงหมด ข. สรางสเหลยม ค. เลอกวตถบางสวน ง. ลากวตถ

4. (Selection Tool) เปนเครองมอทท าหนาทอะไร ก. เลอกวตถทงหมด ข. สรางสเหลยม ค. เลอกวตถบางสวน ง. ลากวตถ

5. ในการท าใหหวสเหลยมมนตองใชค าสงใดตอไปน ก. Rectangle ข. Shape ค. Corner Radius ง. Radius

แบบทดสอบกอนเรยน

หนา 2

6. หากนกเรยนตองการเปลยนขนาดของหนาจอส าหรบวาดภาพหรอชนงานตองคลกทปมใด ก. Background ข. Document ค. Size ง. Form

7. หากนกเรยนตองการสราง Layer ใหมตองคลกทปมใดตอไปน ก. ข. ค. ง.

8. นามสกลทไดจากการบนทกงานทสรางจาก Flash กรณ (Save As) คอขอใด ก. .jpg ข. .psd ค. .fla ง. .swf

9. นามสกลของงานทไดจากการ Export เพอน าไปใชกบเวบไซตคอขอใด ก. .jpg ข. .psd ค. .fla ง. .swf

10. (Paint Bucket Tool) เปนเครองมอทท าหนาทอะไร

ก. ระบายส ข. เทส ค. เทวตถ ง. ถกทกขอ

หนา 3

1. การเปดใชงานบทเรยนใหไปทไฟล Chapter1.Swf จะปรากฏบทเรยนดงน

ภำพท 1 หนาแรกของบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”

2. ใหเขาสเมนหลกดวยการกดปม

ภำพท 2 เมนหลกของบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”

ในหนาเมนหลกนประกอบดวย 1) ปมตวชวด

2) ปมทดสอบกอนเรยน(Pretest) 3) ปม VDO การใชงานโปรแกรม Flash 4) ปมเนอหา 5) ปมทดสอบหลงเรยน (Posttest) 6) ปมฝกปฏบต (Workshop)

กำรใชงำนบทเรยนคอมพวเตอรชวยสอน : กำรใชงำนโปรแกรม Flash

หนา 4

2.1 ปมตวชวดเปนปมทบอกเปาหมายในการเรยนเปนผลการเรยนรทคาดหวง โดยเมอกดปม จะปรากฏรายละเอยดดงน

ภำพท 3 ผลการเรยนรทคาดหวงของบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”

การกลบไปหนาเมนหลก ใหกดทปม

2.2 ปมทดสอบกอนเรยน (Pretest) เปนปมทวดผลความรของนกเรยนกอนทจะศกษาบทเรยนคอมพวเตอรชวยสอน โดยเมอกดปม จะปรากฏแบบทดสอบดงน

ภำพท 4 แบบทดสอบกอนเรยนของบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”

หนา 5

แบบทดสอบกอนเรยนมทงหมด 5 ขอ เมอตองการเลอกตวเลอกทตองการใหกดปม ขอสอบจะเลอนไปขอถดไปเรอย ๆ จนถงขอสดทายจะสรปคะแนนดงภาพ

ภำพท 5 สรปคะแนนแบบทดสอบกอนเรยน เรอง”การใชงานโปรแกรม Flash”

เมอตองการกลบไปหนาเมนหลก ใหกดทปม

2.3 ปม VDO การใชงานโปรแกรม Flash เปนปมทแสดงเนอหารายละเอยดการสอนโดยน าเสนอในรปแบบวดโอการใชงาน โดยเมอกดปม จะปรากฏวดโอการสอนดงน

ภำพท 6 วดโอการสอนบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”

เมอตองการกลบไปหนาเมนหลก ใหกดทปม

หนา 6

2.4 ปมเนอหา เปนปมทแสดงเนอหารายละเอยดการสอนเปนขอความและรปภาพ โดยเมอกดปม ...........................จะปรากฏวดโอการสอนดงน

ภำพท 7 รายละเอยดเนอหาการสอนบทเรยนคอมพวเตอรชวยสอน เรอง”การใชงานโปรแกรม Flash”

จะมปมควบคมการไปหนาถดไป และปมยอนกลบ เมอตองการหนาเมนหลกใหกดปม

2.5 ปมทดสอบหลงเรยน (Posttest) หลงจากทศกษาบทเรยนเรองการใชงานโปรแกรม Flash เบองตนจบแลว ใหท าการประเมนผล โดยกดปม .จะปรากฏแบบทดสอบดงน

ภำพท 8 แบบทดสอบหลงเรยน เรอง”การใชงานโปรแกรม Flash”

หนา 7

แบบทดสอบหลงเรยนมทงหมด 10 ขอ เมอตองการเลอกตวเลอกใหกดปม ขอสอบจะเลอนไปขอถดไปเรอย ๆ จนถงขอสดทายจะสรปคะแนนดงภาพ

ภำพท 9 สรปคะแนนแบบทดสอบหลงเรยน เรอง”การใชงานโปรแกรม Flash”

2.6 ปมฝกปฏบต (Workshop) หลงจากทศกษาบทเรยน วดผลและประเมนผลจบแลว จะมแบบฝกปฏบตใหทดลองปฏบต เปนใบงาน โดยเมอกดปม จะปรากฏแบบฝกปฏบตดงน

ภำพท 10 แบบฝกปฏบตเรอง”การใชงานโปรแกรม Flash”

จะมปมควบคมการไปหนาถดไป และปมยอนกลบ เมอตองการหนาเมนหลกใหกดปม

หนา 8

ใบควำมรท 1 ควำมรเบองตนเกยวกบโปรแกรม Flash

เรมตนกบ Flash การสรางสอการเรยนร สอน าเสนอ หรองานออกแบบตางๆ ยอมจะหนไมพนการออกแบบสรางสรรคงาน

กราฟก หากสามารถสรางงาน ออกแบบงานกราฟกดวยตนเอง คงจะสรางความภมใจไดมาก แตปญหาใหญของการสรางสรรคงานกราฟกของหลายๆ ทานกคอ “วาดภาพไมเปน”หรอ “สรางผลงานไมได” แตดวยความสามารถของโปรแกรม Macromedia Flash เครองมอชวยสรางสรรคงานกราฟกทงายในการเรยนร และประยกตใชงาน พรอมๆ กบแนวทางการวาดภาพจากคมอฉบบน จะลมค าวา “วาดยาก” ไปเลย เนองจาก Flash เปนซอฟตแวรสรางสรรคงานกราฟกในฟอรแมต Vector ทภาพกราฟกทกภาพประกอบจากเสนโครงรางทท าใหการปรบแตง แกไข หรอออกแบบภาพ ท าไดงายดวยเทคนค “ตด เชอม ปรบเปลยนรปราง ”Macromedia Flash CS3 เปนผลตภณฑลาสดจากคาย Macromedia ทพฒนามาเพอสนบสนนการสรางงานกราฟก ทงภาพนง และภาพเคลอนไหว ส าหรบการน าเสนอผานเครอขายอนเทอรเนต Flash มฟงกชนชวยอ านวยความสะดวก ในการสรางผลงานหลากหลายรปแบบตลอดจนชดค าสงโปรแกรมมงทเรยกวา Flash Action Script ทเพมประสทธภาพในการท างาน และสามารถคอมไพล (Compile) เปนโปรแกรมใชงาน (Application Program) เชน การท าเปน e-Card เพอแนบไปพรอมกบ e-Mail ในโอกาสตางๆ

กำรเรยกใชโปรแกรม Flash การเรยกใชงานโปรแกรม Flash มหลกการคลายๆ กบการเรยกโปรแกรมทวๆ ไปของ

ระบบปฏบตการวนโดวส โดยเรมจากการคลกปม จากนนเลอนไปคลกทรายการProgram, Adobe Flash CS3 Professional รอสกครจะปรากฏหนาตางการท างาน ซงมโหมดการท างานใหเลอกไดหลายลกษณะไดแก • การเปดไฟลจากค าสง Open a Recent Item • การสรางงานผลงานจากรายการ Create New • การสรางผลงานแมแบบ Create from Template จอภำพกำรท ำงำนของ Flash

เมอคลกเลอกการสรางผลงานใหมของ Flash จากรายการ Create New Flash File จะปรากฏสวนประกอบจอภาพการท างานดงน

ภำพท 11 หนาตางการท างานของโปรแกรม Flash

หนา 9

แถบเครองมอหลก (Main Toolbar) แถบเครองมอควบคมการท างานหลกของโปรแกรม เชน การสรางไฟลใหม, การเปดไฟล,การคดลอกขอมลเปนตน โดยสามารถควบคมใหแสดง หรอไมตองแสดงโดยคลกเลอกค าสง Window, Toolbar, Main

ภำพท 12 แถบเครองมอหลก Toolbar ของโปรแกรม Flash

แถบเครองมอ (Toolbox) กลมเครองมอสรางงานและจดการวตถ ประกอบดวยปมเครองมอยอยตางๆ สามารถเปด/ปดดวยค าสง Window, Tools โดยสามารถแบงเครองมอเปนหมวดๆ ได 5 หมวด คอ เครองมอหมวดเลอกวตถ (Selection) เครองมอหมวดวาดภาพ (Drawing) เครองมอจดแตงวตถ (Modify)เครองมอควบคมมมมอง (View) และเครองมอควบคมส (Color)

ภำพท 13 แถบเครองมอ Tool ของโปรแกรม Flash Document Tab สวนควบคมเอกสาร สามารถคลกเพอสลบเปลยนจอภาพเอกสาร

ภำพท 14 ชอเอกสาร (เรมตนจะเปนชอ Untitled) Timeline & Layer Timeline เปนสวนส าคญทท าหนาทควบคมการน าเสนอผลงาน สามารถเปด/ปดดวยค าสง

ภำพท 15 ภาพเสนควบคมเวลา Timeline

หนา 10

Layer สวนควบคมการสรางชนวตถ เพอใหการควบคมวตถแตละชน มอสระ และสะดวกตอการแกไข ปรบแตง

ภำพท 16 ภาพสวนประกอบ Layer

Stage & Workspace

ภำพท 17 ภาพพนทการท างาน Stage

จากรปตวอยางน เมอสงน าเสนอผลงาน แสดงวาจะก าหนดใหเรอยงไมตองแสดงผลทนทบนจอภาพ เพราะเรอถกน าไปวางไวในพนทสเทา เมอน ามาท าเปน Movie ใหเรอวงผานจอภาพไปอกดานหนง กจะปรากฏเรอวงผานจอจากดานซายไปดานขวาของจอ ตามชวงเวลาทก าหนด

Panel หนาตางเลกๆ ทท าหนาทแสดงค าสงควบคมยอยตางๆ ของโปรแกรม โดยจะปรากฏรายการค าสงในเมน Window

. ภำพท 18 สวนประกอบ Properties

หนา 11

ควบคม Panel Panel เปนจอภาพเลกๆ ทแสดงฟงกชนการท างานเฉพาะอยาง เชน การท างานเกยวกบสจะควบคมดวย Color Mixer หรอ Color Swatches การจดต าแหนงวตถตางๆ ควบคมดวย Align Panel เปนตน การเรยกใชหรอเปด/ปด Panel จะใชค าสง Window แลวตามดวยชอ Panel นนๆ

ท ำงำนกบไฟล Flash โปรแกรม Flash สามารถสรางผลงานไดทงภาพนง ทเรยกวา (Still Image) และภาพเคลอนไหว ซงจะเรยกวา Movie ทงภาพนง และภาพเคลอนไหว จ าเปนตองเรมตนจากไฟล Flash ตนฉบบ ทมสวนขยายเปน .fla จากนนจงบนทกเปนไฟลภาพใชงาน ส าหรบภาพนง สามารถเลอกบนทกไดหลายฟอรแมต เชน

ตำรำงท 1 ตารางไฟลภาพทสามารถบนทกไดจากโปรแกรม Flash

ประเภทไฟล สวนขยำย Adobe Illustrator .ai GIF Image .gif Bitmap .bmp AutoCAD DXF Image .dxf Enhanced Metafile .emf EPS 3.0 .eps JPEG Image .jpg PICT .pct PNG Image .png Windows Metafile .wmf

ภาพเคลอนไหว หรอ Flash Movie สามารถบนทกในฟอรแมตทพรอมใชงาน ไดดงน

ตำรำงท 2 ตารางไฟลภาพเคลอนไหวทสามารถบนทกไดจากโปรแกรม Flash

ประเภทไฟล สวนขยำย Flash Movie .swf Animation GIF Image .gif QuickTime .mov Windows AVI .avi Execute File .exe

หนา 12

สรำงไฟลใหม ไฟล Flash ทสรางใหมทกครง ควรก าหนดคณสมบตใหเหมาะสม ดวยค าสง Modify Document เชน ความกวาง/ความสงของ Stage ลกษณะสพนของ Stage เปนตน

ภำพท 19 การก าหนดรายละเอยดเมอสรางเอกสารใหม เปดไฟล การเปดไฟลภาพใชค าสง File, Open... หรอคลกปม Open จาก Main Toolbar นอกจากนยงสามารถเลอกไฟลทเคยเปดไดจากเมนค าสง File, Open Recent

กำรคนสสภำพเดม (Revert) ไฟลทก าลงแกไข ถาตองการคนกลบสสภาพกอนการแกไข ใชค าสง File, Revert

ปดไฟล ไฟลทสราง หรอเปดอย หากตองการปดไฟล สามารถใชค าสง File, Close หรอ File, Close All ทงนไฟลทยงไมไดผานการบนทก โปรแกรมจะแสดงกรอบเตอน ถาตองการบนทกไฟลกอนปด กคลกปม Yes เพอเขาสโหมดการบนทกไฟล แตถาตองการปดไฟลโดยไมบนทกกคลกปม No หรอคลกปม Cancel เพอยกเลกการปดไฟล กลบสจอภาพสรางงานตามปกต

บนทกไฟล ภาพทวาดทสรางเสรจแลว หรอปรบแตงแกไขแลว ควรบนทกไฟลเกบไวทกครง โดยไฟลตนฉบบจะไดสวนขยายเปน .fla การบนทกไฟลสามารถใชค าสง File, Save… หรอ File, Save As…จดสงเกตวาไฟลไดผานการบนทกแลวหรอไม กดไดจากชอไฟลใน Title Bar หากมเครองหมาย * แสดงวายงไมผานการบนทก

หนา 13

กำรบนทกเปนภำพนงใชงำน เนองจากไฟล .fla เปนไฟลตนฉบบ ไมสามารถน าไปใชงานได กอนน าไฟลภาพทสรางดวย Flash ไปใชงาน จ าเปนตองบนทกในฟอรแมตทเหมาะสมส าหรบภาพนง ใหเลอกค าสง File, Export, Export Imageฟอรแมตของภาพนง กเปนรายการทควรน ามาพจารณาประกอบ เชน ถาตองการเปนภาพประกอบสอสงพมพ แนะน าใหเลอกเปน .bmp หรอ .ai แตถาตองการใชบนเวบไซต กควรเลอกเปน .gif, .jpg หรอ .png โดยมหลกในการพจารณา ดงน • ภาพโครงราง หรอภาพทมการใชสแบบ Solid ใหเลอกเปน GIF Format • ภาพทมการใชสแบบไลโทน หรอมการใชสจ านวนมาก ใหเลอกเปน JPEG Format

กำรบนทกในฟอรแมต GIF การบนทกภาพวาดในฟอรแมต GIF ท าไดโดยเลอกค าสง File, Export, Export Image… เลอกรายการ Save as Type เปน GIF Image (*.GIF)

ภำพท 20 การน าภาพทวาดจากโปรแกรม Flash Import ออกเปนรปภาพ

หนา 14

ใบควำมรท 2 กำรใชเครองมอวำดเสนและกำรวำดรปทรงเรขำคณต

รจกกบชนดของภำพกรำฟก เรำสำมำรถแบงภำพกรำฟกออกเปน 2 ชนด คอ ภำพกรำฟกชนดบตแมป (Bitmap ) ภาพกราฟกชนดบตแมปเปนภาพทเกดจากเมดสหรอจดสทเราเรยกกนวาพก เซล(pixel) มาเรยงกนจนเปนภาพ เพราะฉะนนความสวยงามของภาพจงขนอยกบความละเอยดของเมดส

ขอด ภาพชนดนสามารถแสดงรายละเอยดไดใกลเคยงภาพจรง เชน ภาพถายทมรายละเอยดสง เพราะเปนการใชพกเซลจ านวนมากมาประกอบกน

ขอเสย ภาพ ชนดนจะมขนาดใหญตามความละเอยดภาพ เพราะตองใชจ านวนพกเซลเพมขนตาม นอกจากนนการน าภาพมาขยายใหใหญกวาขนาดปกตจะท าใหภาพทไดไมชด

ภำพท 21 ไฟลแบบบตแมปเมอท าการขยายกจะเหนเมดสทแตกออก

ภำพกรำฟกชนดเวกเตอร Vector ) ภาพชนดเวกเตอรไมใชพกเซลเหมอนภาพชนดบทแมป แตจะใชการค านวณทางคณตศาสตรเขามาชวยในการสรางเสนและลวดลายตาง ๆ ทประกอบกนเปนภาพแทน

ขอด ภาพ ชนดนปรบหรอยอขนาดไดตามตองการ โดยไมมผลตอความละเอยดของภาพเพราะไมวาภาพจะเลกหรอใหญความคมชดกไม เปลยนแปลง เพราะคอมพวเตอรจะสรางภาพขนมาโดยใชวธการค านวณ ซงไมไดถกจ ากดดวยจ านวนพกเซลในภาพวามมากนอยเพยงใด นอกจากนนภาพชนดเวกเตอรมขนาดไฟลเลกกวาบทแมปเพราะไมไดใชพกเซล จ านวนมากมาสรางเปนภาพ แตมเพยงค าสงสรางลวดลายเพอประกอบเปนภาพเทานน

หนา 15

ขอเสย เนอง มาจากลกษณะของภาพทสรางจากการใชคอมพวเตอรสรางเสนและรปทรงมาประกอบ กนแลว ภาพชนดนจงมขอจ ากดในการแสลงภาพถาย แตจะเหมาะกบภาพกราฟกแนวลายเสนทมสคอนขางตอเนองเทานน

ภำพท 22 ไฟลแบบเวกเตอรเมอท าการขยายภาพกยงความคมชด

เรมตนกำรวำดรปโดยใชเครองมอใน Flash

ตอไปนเราจะมารจกกลมเครองมอพนฐานในทลบอกซ ส าหรบใชวาดภาพกราฟก ( เราสามารถเปดทลบอกซไดโดยเลอกค าสง Window->Tools หรอกดคย Ctrl + F2

ภำพท 23 กลมเครองมอ Toolbox

หนา 16

การวาดภาพแบบปกตในโปรแกรม Flash นน เมอเราวาดรปดวยเครองมอตางๆเรากจะไดรปทรง ( Shape ) ซงรปทรงของภาพประกอบดวย

ภำพท 24 การแยกวตถออกเปนเสนขอบ outline และพนผว Fill

เสนขอบ( Stroke ) หรอลายเสน (Outline) เปนโครงรางของรป สวนทเปนพนรป (Fill) พนทภายในเสนขอบ

รปทรงทสรางใน Flash จะตางจากโปรแกรมสรางภาพกราฟกทวๆไปคอ ทงสวนทเปนเสนขอบและสวนทเปนพนทรปสามารถแยกจากกนไดอยาง อสระ โดยเครองมอวาดรปใน Flash จะแบงออกเปนสองหมวดใหญๆไดแก เครองมอทสรางและปรบแตงสวนทเปนลายเสน และเครองมอทสรางและปรบแตงสวนทเปนพนรป

กำรก ำหนดรำยละเอยดของรปทรงทวำด

ในหวขอตอไปเราจะกลาวถงเครองมอวาดรปตาง ๆ ในโปรแกรม Flash ซงเมอเราคลกเลอกเครองมอใดเพอวาดรปทรง ใหสงเกตใน Property Inspector ของเครองมอนน จะปรากฏคณสมบตของเสนและสพนใหเราก าหนดเพมเตมได ดงน

ภำพท 25 สวน Properties Inspector จะเปลยนแปลงตามเครองมอทเลอก

หนา 17

จากจานสทเราเลอกใชงานขางตนเปนสมาตรฐานทโปรแกรมก าหนดมา แตหากเราตองการผสมสดวยตวเองกท าไดเชนกนโดยวธการดงน

ภำพท 26 การเลอกส Color

ดานลางของตวเลอกทงสองนในทลบอกซจะมอก 2 ปม ดงน

ภำพท 27 การเลอกส เสนขอบ outline และพนผว Fill

Black and White เปลยนสของ Stroke Color และ Fill Color ใหกลบมาเปนสทใชตอนเรมตน คอ สเสนเปนสด าและสพนเปนสขาว

Swap Colors สลบสระหวาง Stroke Color และFill Color กำรวำดรปทรงซอนกนใน Flash เมอมการน าภาพหรอรปทรงทสรางใน Flash มาเรยงซอนกน จะมผลท าใหรปเหลานนถกรวมเขาดวยกนหรอถกแตกออกเปนสวนยอย ๆ แลวแตกรณ ดงน

หากเราวาดรปทรงทมแตสพนซอนทบอกรปทรงหนงทมสพนเดยวกน จะท าใหพนรปของทงสองถกรวมเขาดวยกน

หนา 18

ภำพท 28 การรวม Object

หาก เราวาดรปทรงทมแตสพนซอนทบอกรปทรงหนงทมสพนตางกน เมอแยกรปทรงออกจากกนจะท าใหบรเวณสเดมทถกอกรปทรงทบหายไป

ภำพท 29 การแยก Object

หาก เราวาดรปทรงทมเสนขอบซอนทบอกรปหนงเสนขอบทซอนทบทง 2 รปทรงนนจะกลายเปนของรปทรงใดรปทรงหนง ขนอยกบการคลกเลอกของเรา เชน หลงจากซอนรปทรงดานลาง ถาเราดบเบลคลกเลอกรปทรงใด เสนขอบกจะกลายเปนของรปทรงนน

ภำพท 30 การแยก Object โดยการดบเบลคลก

หนา 19

หากเราวาดเสนตดผานรปทรงหนง หรอน ารปทรงมาซอนทบเสนจะท าใหรปทรงนนถกแบงออกเปนสวนยอยๆตามแนวทถกตดเสน

หาก เราวาดเสนตดกน หรอน าเสนหนงมาซอนทบอกเสนหนง เสนทง 2 จะถกตดออกเปนสวนยอยๆตรงจดทเสนทงสองตดกน (ไมวาทงสองเสนจะเปนสเดยวกนหรอคนละสกตาม)

กำรวำดเสนตรงและเสนโคงเชอมตอกนโดยใช Pen Tool Pen Tool เปนเครองมอทใชวาดเสนตรงและเสนโคง โดยเสนทวาดจะเชอมตอกนเปนจดตอจด เราจะเรยกจดนวา “จดแองเคอร ” ( anchor point )ภายในกลมของ Pen Tool จะมเครองมอตางๆส าหรบปรบแตงเสนพาธใหเปนรปทรงตางๆไดตามทตองการ ดงน Pen Tool ใชวาดเสนดวยปากา Add Anchor Point Tool ใชเพมจดในแนวเสนพาธ Delete Anchor Point Tool ใชลบจดในแนวเสนพาธ Convert Point Tool ใชเปลยนแขนของเสนพาธใหเปนเสนโคงหรอเสนตรง

ภำพท 31 เครองมอ Pen Tool แบบตาง ๆ

ส าหรบการวาดเสนตรง ใหเราคลกท ในทลบอกซ ตวชเมาสจะเปลยนเปนรป จากนนกปรบแตงคาตางๆใหกบเสนใน Property Inspector แลวคลกเมาสบนสเตจเพอก าหนดจดเรมตน จากนนคลกเมาสทจดตอไปจะไดเสนตรงเชอมระหวางสองจดน

ภำพท 32 การท างานของ Pen Tool

หนา 20

เรำสำมำรถจบวธกำรวำดรปได 2 วธ ขนกบลกษณะรปทรงทเรำวำด

ถาตองการสรางรปทรงแบบเปดใหเราดบเบลคลกทจดสดทายทก าหนดหรอคลก ในทลบอกซ

ภำพท 33 การใชงาน Pen Tool

ถาตองการสรางรปทรงแบบปดใหกลบไปคลกทจดเรมตนของรปทรง สงเกตตวชเมาสทเปลยนไป เปน

ภำพท 34 การใชงาน Add Anchor Point Tool

NOTE !! หำกเรำตองกำรจบกำรสรำงรปทรงนและตองกำรสรำงรปทรงตอไปเลยให กดท <Ctrl> คำงไวและคลกทใดกไดในสเตจ สงเกตวำตวชเมำสจะเปลยนเปน หมำยควำมวำไดเสรจสนกำรสรำงรปทรงนแลวแตยงเปนกำรใชเครองมอ Pen Toolอย ซงถำหำกเรำคลดทใดบนสเตจกจะเปนกำรเรมสรำงรปทรงอน ๆ

ส าหรบการวาดเสนโคง ใหเราคลกท ในทลบอกซตวชเมาสจะเปลยนเปนรป ปรบแตงคาตางๆใหกบเสนใน Property Inspectorแลวเรมท าตามขนตอนดงน

หนา 21

คลกเมาสคางไวทจดเรมตน แลวลากเมาสไปในทศทางทตองการ จะ ปรากฏเสนสมผสทใชในการวาดเสนโคงขนมา ใหปลอยเมาสเมอเสนสมผสมความยาวและอยในทศท

ตองการ( ถาเรากดคย <Shift> จะมผลท าใหเสนสมผสถกวางในแนวนอน แนวตง หรอแนว 45 องศาเทานน) คลกเมาส คางไวทจดปลายของเสนโคง จะปรากฏเสนโคงขนมา ใหลากเมาสไปในทางใดทศหนงจะปรากฏเสน

สมผสอกเสนหนงใหเราปรบความ โคงของเสนไดตามตองการ กอนจบการวาดเสน จะใชวธเดยวกนกบการวาดเสนตรงทไดกลาวไปแลว หรอจะวาดเสนตรงหรอเสนโคงตอไปกได

ปรบแตงรปทรงทวำด

หลงจากทเราไดวาดรปทรงเสรจแลว หากตองการปรบแตงรปทรงนน ใหคลกเลอกเครองหมาย Pen Tool อกครง และคลกทเสนในรปทรงเพอใหแสดงจดแองเคอรใหเหน เพอท าการปรบแตงได ซงจดแองเคอรแบงไดเปน 2 แบบ ดงน

- Comer point เปนจดทอยตรงมมของเสน - Curve point เปนจดทอยบนเสนโคง

ภำพท 35 การปรบเสนตรงมม Comer Point

เพมจดแองเคอร ใหคลกบนเสนในรปทรงตรงจดทตองการกจะมจดแองเคอรเพมขนมา (สงเกตวาเมอตวชเมาสอยเหนอเสนจะเปน)

ภำพท 36 การเพมจดระหวางเสน

กำรลบจดแองแองเคอร ใหคลกบนจดทตองการลบหนงครง(สงเกตวาเมอตวชเมาสอยเหนอจด แองเคอร จะเปน ) แตใหสงเกตในกรณทจดแองเคอรทตองการลบนนเปนจด Curve point เราจะตองคลกบนจดแองเคอรน 2ครง (นนคอคลกครงแรกจะเปนการเปลยนจดแองเคอรเปนจด Corner point ท าใหสวนโคงของเสนถกยบ สวนการคลกครงทสองจะเปนการลบจดแองเคอรนน)

หนา 22

ภำพท 37 การปรบจด Anker

ปรบสวนโคงใหเปนมม ใหน า Pen Tool ไปวางบนจดแองเคอร ทเปน Curve point ทตองการ จะปรากฏสญลกษณ แลวคลกเมาสลงทจดแองเคอรนน จะท าใหสวนโคงของเสนถกยบกลายเปนมมแทน

ภำพท 38 การปรบจด Anker บน Curve Point

หนา 23

กำรวำดรปทรงเรขำคณต

ประกอบไปดวยรปสเหลยม รปวงกลม วงร และรปหลายเหลยม ดงรป ขอแบงออกเปนกลมๆตามรายการท Tools ดงน

ภำพท 39 การเครองมอรปทรงเรขาคณต

กำรวำดรปสเหลยมดวย Rectangle Tool และ Rectangle Primitive Tool

เครองมอ Rectangle Tool และ Rectangle Primitive Tool ใชส าหรบวาดรปสเหลยม หรอสเหลยมมมโคง แตกตางกนตรงทรปทไดจาก Rectangle Primitive Tool จะสามารถกลบมาเปลยนลกษณะความโคงของมมท Property Inspectorไดอกครง

ทงสองเครองมอ สามารถวาดรปสเหลยมไดโดยการคลกท ในทลบอกซ(หรอกดคยลด R ซ าๆ จะสลบไปมาของเครองมอทงสองตว) ตวชเมาสจะเปลยนเปนรป จากนนปรบแตงคาตางๆใหกนเสนทเราจะสราง ซงสามารถก าหนดความโคงของมมของรปสเหลยมไดใน Property Inspector แลวลากเมาสวาดรปสเหลยมหรอวาดรปสเหลยมจตรสไดโดยกด คย<Shift>คางไว

กำรวำดวงกลมหรอวงรดวย Oval Tool และ Oval Primitive Tool

เครองมอ Oval Tool และ Oval Primitive Tool จะใชวาด รปวงกลมหรอวงร แต Oval Primitive Tool สามารถกลบมาเปลยนแปลงรปทรงหรอรศมภายในวงกลม ใน Property Inspector ไดอกครง ทงสองเครองมอ สามารถวาดรปไดโดยการคลกคางทเครองมอ Rectangle Tool ท Toolbox จะปรากฏเมนยอยแสดงเครองมอ Oval Tool และ Oval Primitive Tool (หรอกดคยลด Oซ าๆ จะสลบไปมาของเครองมอทงสองตว) ตวชเมาสจะเปลยนเปนรป จากนนปรบแตงคาตางๆใหกบเสนทเราจะสราง ซงสามารถก าหนดความโคงของมมของรปสเหลยมไดใน Property Inspector แลวลากเมาสวาดวงรหรอวาดรปวงกลมโดยกดคย<Shift> คางไว

กำรวำดรปหลำยเหลยมดวย PolyStar Tool

เครองมอ PolyStar Tool จะอยในกลมเดยวกนกบเครองมอ Rectangle Tool ใชส าหรบสรางรปหลายเหลยม โดยใหคลกคางทเครองมอ Rectangle Tool ททลบอกซจะปรากฏเมนยอยแสดงเครองมอ PolyStar Tool ตวชเมาสจะเปลยนเปน จากนนปรบแตงคาตางๆใหกบรปหลายเหลยมทเราจะสรางใน Property Inspector แลวลากเมาสวาดรปหลายเหลยมไดตามตองการ

หนา 24

กำรวำดลำยเสนอสระดวย Pencil Tool Pencil Tool เปนเครองมอส าหรบใชวาดลายเสนอสระ เหมอนกบการใชดนสอวาดรปบนกระดาษ โดยการคลก ใน Toolbox (หรอกดคยลด Y) ตวชเมาสจะเปลยนเปนรป จากนนใหลากเมาสวาดเสนไดตามตองการใช Selection Tool และ Subselection Tool ปรบแตงรปทรงทวาด หลงจากทเราสรางรปดวยเครองมอตาง ๆ แลว แตหากยงไมพอใจ และตองการปรบแตงรปเหลานนเพมเตมกสามารถใชเครองมอในการปรบ แตงรปทรงทวาดได โดยม 2 เครองมอหลกดงน

กำรปรบแตงเสนขอบของรปโดยใช Selection Tool

เราสามารถใช Selection Tool ปรบแตงเสนขอบหรอปรบแตงรปทรงทไมมเสนขอบ(เพราะถกวาดโดยเครอง มอ เชน Brush Tool)กได โดยการคลกท ในทลบอกซ เมอเราน าตวชเมาสไปวางทเสนขอบของรปทรง ตวชเมาสจะเปลยนไปจาก เปน ซงเราใชดงเสนหรอขอบใหโคงได(ถาเรากดคย<Ctrl> ในขณะทคลกเมาสลากเสน จะเปนการเพมมมใหกบรปทรง)

ภำพท 40 การเลอกเครองมอ Selection Tool

ปรบแตงรปทรงดวย Subselection Tool

SubselectionTool เปนเครองมอส าหรบใชปรบแตงรปทรงทวาดดวยเครองมอตางๆใน Flash ทเปนลกษณะรปทรงโดยคลกท ในทลบอกซ แลวคลกเสนในรปทรงทตองการแกไข จะปรากฏจดแองเคอร จากนนเรากสามารถปรบเปลยนรปทรงได ดงน

ภำพท 41 การเลอกเครองมอ SubselectionTool

ยำยต ำแหนงรปทรงทงรป ใหคลกทเสนแลวลากไปยงต าแหนงทตองการได ปรบรปทรงโดยกำรยำยจดแองเคอร ใหคลกลากยายจดแองเคอรไปยงต าแหนงทตองการซงจะมผลท าใหรปทรง

เปลยนไป

หนา 25

ชอ-สกล.....................................................................................................หอง................ .........เลขท...................

ค ำชแจง ใหนกเรยนอธบายและตอบค าถามตอไปน

1. ใหนกเรยนเขยนอธบายการเรยกใชงานโปรแกรม Flash มาทง 2 วธ ............................................................................................................................. ...................................................................................................................................................................................... .......................................................................................................................................................................................................................................... .................................................................................................................................. .........................................................

2. ใหนกเรยนเตมสวนประกอบของโปรแกรม Flash ใหถกตอง

ตวอกษร A คอ…………………………………………………………………………………………………………………………………… ตวอกษร B คอ................................................................................................................................................... ตวอกษร C คอ…………………………………………………………………………………………………………………………………… ตวอกษร D คอ.................................................................................................................................................... ตวอกษร E คอ.......................................................................................................................... ...........................

ใบงำนท 1 ควำมรเบองตนเกยวกบโปรแกรม Flash CS6

หนา 26

ตวอกษร A คอ…………………………………………………………………………………………………………………………………… ตวอกษร B คอ.......................................................................................................................... ......................... ตวอกษร C คอ…………………………………………………………………………………………………………………………………… ตวอกษร D คอ.......................................................................................................................... ..........................

หนา 27

ชอ........................................................................................ชน ...........................เ ลขท......................................

กจกรรมท 1 ใหนกเรยนตอบค ำถำมตอไปน

1.เขยนอธบายการวาดภาพแบบ Object Drawing มาพอสงเขป …………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………

2.เขยนอธบายการวาดภาพแบบ Shape มาพอสงเขป ………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………… 3.ใหนกเรยนบอกชอเครองมอการวาดเสนและเครองมอการวาดรปทรงเรขาคณต ………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………… ………………………………………………………………………………………………………………………………………………………………… 4.ใหนกเรยนบอกโหมดของการลบสเสนและสพน 4.1 Erase Normal คอ....................................................................................................................... 4.2 Erase Fills คอ.......................................................................................................................... ... 4.3 Erase Lines คอ........................................................................................................................... 4.4 Erase Selected คอ................................................................................................................. ... 4.5 Erase Inside คอ.........................................................................................................................

ใบงำนท 2 กำรใชเครองมอวำดเสนและกำรวำดรปทรงเรขำคณต

หนา 28

กจกรรมท 1 ใหนกเรยนวำดภำพตำมภำพตอไปน โดยใชเครองมอกำรวำดเสนและเครองมอกำรวำดรปทรงเรขำคณต แลวบนทกเปนชอนกเรยนใหใสเลขทน ำหนำแลวตำมดวยชอ เชน (1รษำ)

แบบฝกปฏบต (Workshop1) : กำรใชเครองมอวำดเสนและกำรวำดรปทรงเรขำคณต

หนา 29

ค ำชแจง ใหนกเรยนคลกเลอกขอทถกทสดเพยงขอเดยว 1. (Text Tool) เปนเครองมอทท าหนาทอะไร

ก. วาดรปตว A ข. พมพขอความ ค. เปลยนสตวอกษร ง. เคลอนตวอกษร

2. (Free Transform Tool) เปนเครองมอทท าหนาทอะไร

ก. ปรบขนาดรปภาพ ข. วาดรปสเหลยม ค. เคลอนยายรปภาพ ง. ถกทกขอ

3. (Sub Selection Tool) เปนเครองมอทท าหนาทอะไร ก. เลอกวตถทงหมด ข. สรางสเหลยม ค. เลอกวตถบางสวน ง. ลากวตถ

4. (Selection Tool) เปนเครองมอทท าหนาทอะไร ก. เลอกวตถทงหมด ข. สรางสเหลยม ค. เลอกวตถบางสวน ง. ลากวตถ

5. ในการท าใหหวสเหลยมมนตองใชค าสงใดตอไปน ก. Rectangle ข. Shape ค. Corner Radius ง. Radius

แบบทดสอบหลงเรยน

หนา 30

6. หากนกเรยนตองการเปลยนขนาดของหนาจอส าหรบวาดภาพหรอชนงานตองคลกทปมใด ก. Background ข. Document ค. Size ง. Form

7. หากนกเรยนตองการสราง Layer ใหมตองคลกทปมใดตอไปน ก. ข. ค. ง.

8. นามสกลทไดจากการบนทกงานทสรางจาก Flash กรณ (Save As) คอขอใด ก. .jpg ข. .psd ค. .fla ง. .swf

9. นามสกลของงานทไดจากการ Export เพอน าไปใชกบเวบไซตคอขอใด ก. .jpg ข. .psd ค. .fla ง. .swf

10. (Paint Bucket Tool) เปนเครองมอทท าหนาทอะไร

ก. ระบายส ข. เทส ค. เทวตถ ง. ถกทกขอ

หนา 31

บรรณำนกรม

นายสทธชย ทพยสงห . ควำมรเบองตนเกยวกบ Flash . 2551. สบคนเมอวนท 21 ธนวาคม 2559, http://www.kroojan.com/flash

อนศกด แสงอบล. กำรใชโปรแกรม Flash .2555. สบคนเมอวนท 17 ธนวาคม 2559, http://teacher.rts.ac.th/anusuk/212

จนทรจรา บญเทยม . กำรใชเครองมอวำดเสนและกำรวำดรปทรง .2554. สบคนเมอวนท 5 มกราคม 2560, http://krujane.com

หนา 32

ภาคผนวก ก: แผนกำรจดกำรเรยนร กำรสรำงกำรตนแอนเมชน

เบองตน ง20247

ข: -เฉลยแบบทดสอบ กอนเรยน-หลงเรยน

-เฉลยใบงำน

ค: แบบประเมน ผลกำรเรยนร

หนา 33

ภำคผนวก ก : แผนกำรจดกำรเรยนร

กำรสรำงกำรตนแอนเมชน เบองตน ง20247

หนา 34

แผนกำรจดกำรเรยนรท 1

หนวยการเรยนรท 1 การใชงานโปรแกรม Flash รายวชา ง30247 การสรางการตนแอนเมชนเบองตน เรอง ความรเบองตนเกยวกบโปรแกรม Flash ชนมธยมศกษาปท 4 เวลา 1 ชวโมง กลมสาระการเรยนร การงานอาชพและเทคโนโลย ภาคเรยนท 2 ปการศกษา 2559 ผสอน นางรษา วลาจนทร

1. มำตรฐำนกำรเรยนร มาตรฐาน ง 3.1 เขาใจ เหนคณคา และใชกระบวนการเทคโนโลยสารสนเทศในการสบคนขอมล การเรยนร การสอสาร การแกปญหา การท างาน และอาชพอยางมประสทธภาพ ประสทธผล และมคณธรรม

2. ผลกำรเรยนร ขอท 1. นกเรยนสามารถใชงานโปรแกรม Flash พนฐานได จดประสงคกำรเรยนร 2.1 อธบายวธการเรยกใชงานโปรแกรม Flash ได (K) 2.2 อธบายสวนประกอบตางๆ ของโปรแกรม Flash ได (K) 2.3 อธบายวธการการสรางไฟลงานได (K) 2.4 อธบายวธการบนทกไฟลงานและการเปดไฟลงานได (K) 2.5 สามารถเรยกใชงานโปรแกรม สรางไฟลงาน บนทกไฟลงาน และเปดไฟลงานได (P) 2.6 มเจตคตทดมความใฝร ใฝเรยน มคณธรรมจรยธรรมในการใชคอมพวเตอร (A)

3. สมรรถนะทส ำคญ 3.1 ความสามารถในการใชทกษะชวต 3.2 ความสามารถในการใชเทคโนโลย

4. คณลกษณะอนพงประสงค 4.1 มวนย 4.2 ใฝเรยนร 4.3 มงมนในการท างาน

5. สำระส ำคญ โปรแกรม Flash เปนโปรแกรมกราฟกอยางหนงทอยในกลมของ Adobe ซงจะแตกตางจากโปรแกรม Photoshop และ Illustrator ตรงท Photoshop และ Illustrator จะใช ในการตกแต งภาพภาพและวาดภาพกราฟก งานทไดจะเปนภาพนง สวน Flash จะเปนการน าภาพทแตงแลวหรอภาพวาดกราฟกทนงๆ นนมาขยบหรอท าใหเคลอนไหวได Flash จงเปนโปรมแกรมทใชในการท างานแอนเมชน

6. สำระกำรเรยนร/เนอหำยอย 6.1 การเรยกใชงานโปรแกรม Flash 6.2 รจกกบสวนประกอบของโปรแกรม Flash 6.3 การสรางไฟลงาน 6.4 การบนทกไฟลงานและการเปดไฟลงาน

หนา 35

7. ภำระงำน/ชนงำน ใบงานท 1 ความรเบองตนเกยวกบโปรแกรม Flash CS6

8. เกณฑกำรประเมนภำระงำน/ชนงำน แนบทายแผน

9. กจกรรมกำรเรยนร 9.1 ครกลาวทกทายกบนกเรยนหนาชนเรยนและแจงจดประสงคการเรยนรใหนกเรยนไดทราบ 9.2 นกเรยนรบใบความรท 1 เรองความรเบองตนเกยวกบโปรแกรม Flash CS6 และศกษาท าความเขาใจจากใบความร 9.3 ครใหนกเรยนเปดบทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash และท าแบบทดสอบกอนเรยน 9.4 ครสาธตการเรยกใชงานโปรแกรม Flash CS6 พรอมอธบายประกอบทละขนตอนอยางชาๆ เพอใหนกเรยนสงเกต จดจ า และสามารถน าไปปฏบตไดอยางถกตอง เมอนกเรยนตามไมทนหรออยากศกษาเพมเตมสามารถเรยนรเพมเตมไดจากบทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash 9.5 ครอธบายสวนประกอบตางๆ ของโปรแกรม Flash CS6 ใหนกเรยนไดทราบวาสวนประกอบแตละสวนมการท างานอยางไร 9.6 ครสาธตการสรางไฟลงาน การบนทกไฟลงาน และการเปดไฟลงาน พรอมอธบายประกอบทละขนตอนอยางชาๆ เพอใหนกเรยนสงเกต จดจ า และสามารถน าไปปฏบตไดอยางถกตอง 9.7 นกเรยนฝกปฏบตการเรยกใชงานโปรแกรม Flash CS6 การสรางไฟลงาน การบนทกไฟลงาน และการเปดไฟลงาน ตามขนตอนทครสาธต โดยครสงเกตการฝกปฏบตของนกเรยน หากนกเรยนคนใดท าไมถกตอง ครใหค าแนะน าเพอใหนกเรยนแกไขและปฏบตไดอยางถกตอง 9.8 นกเรยนท าใบงานท 1 เรองความรเบองตนเกยวกบโปรแกรม Flash CS6 และท าแบบทดสอบหลงเรยนจากบทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash 9.9 นกเรยนรวมกนสรปความรเกยวกบการเรยกใชงานโปรแกรม Flash สวนประกอบของโปรแกรม Flash การสรางไฟลงาน การบนทกไฟลงาน และการเปดไฟลงาน 9.10 ครสรปเพมเตมในสวนทนกเรยนยงสรปไมครบถวน

10. สอกำรเรยนร/แหลงเรยนร 10.1 ใบความรท 1 ความรเบองตนเกยวกบโปรแกรม Flash 10.2 ใบงานท 1 ความรเบองตนเกยวกบโปรแกรม Flash 10.3 บทเรยนคอมพวเตอรชวยสอน “เรองการใชงานโปรแกรม Flash ” 10.3 เครองคอมพวเตอร 10.4 โปรเจคเตอร 10.5 โปรแกรม Adobe Flash 10.6 โปรแกรม NetSupport School

หนา 36

11. กำรวดและประเมนผล 11.1 วธการการประเมน - ตรวจใบงานท 1 เรอง ความรเบองตนเกยวกบโปรแกรม Flash - ตรวจแบบทดสอบหลงเรยนจากบทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash - สงเกตพฤตกรรมรายบคคล 11.2 เครองมอประเมน - แบบประเมนพฤตกรรมรายบคคล

- บทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash 11.3 เกณฑการประเมน - ใบงานท 1 เรอง ความรเบองตนเกยวกบโปรแกรม Flash ไดคะแนนมากกวารอยละ 80 - สงเกตพฤตกรรมรายบคคล ไดคะแนนมากกวารอยละ 50

หนา 37

แผนกำรจดกำรเรยนรท 2

หนวยท 1 การใชงานโปรแกรม Flash รายวชา ง30247 การสรางการตนแอนเมชนเบองตน เรอง การใชงานเครองมอ Flash ชนมธยมศกษาปท 4 เวลา 1 ชวโมง กลมสาระการเรยนร การงานอาชพและเทคโนโลย ภาคเรยนท 2 ปการศกษา 2559 ผสอน นางรษา วลาจนทร

1. มำตรฐำนกำรเรยนร มาตรฐาน ง 3.1 เขาใจ เหนคณคา และใชกระบวนการเทคโนโลยสารสนเทศในการสบคนขอมล การเรยนร การสอสาร การแกปญหา การท างาน และอาชพอยางมประสทธภาพ ประสทธผล และมคณธรรม

2. ผลกำรเรยนร ขอท 2. นกเรยนสามารถสรางสรรคชนงานดวยเครองมอวาดภาพและลงสใหกบชนงานไดอยางเหมาะสม จดประสงคกำรเรยนร 2.1 อธบายรปแบบการวาดภาพในโปรแกรม Flash ได (K) 2.2 บอกเครองมอการวาดเสนและการวาดรปทรงเรขาคณตได (K) 2.3 บอกวธการลบเสนและสพนดวยเครองมอ Eraser Tool ได (K) 2.4 สามารถใชเครองมอการวาดเสนและเครองมอการวาดรปทรงเรขาคณตได (P) 2.5 มเจตคตทดมความใฝร ใฝเรยน มคณธรรมจรยธรรมในการใชคอมพวเตอร (A)

3. สมรรถนะทส ำคญ 3.1 ความสามารถในการใชทกษะชวต 3.2 ความสามารถในการใชเทคโนโลย

4. คณลกษณะอนพงประสงค 4.1 มวนย 4.2 ใฝเรยนร 4.3 มงมนในการท างาน

5. สำระส ำคญ ในการสรางสรรคผลงานดวยโปรแกรม Flash เปนความจ าเปนอยางยงทจะตองมความรในเรองเครองมอทใชในการท างานอยางถกตองและถกวธ เพอใหสามารถเลอกใชเครองมอไดอยางเหมาะสมกบการท างานและใหไดผลงานทตรงตามความตองการ และมประสทธภาพมากทสดในการสรางสรรคผลงาน

6. สำระกำรเรยนร/เนอหำยอย 6.1 รปแบบการวาดภาพในโปรแกรม Flash - การวาดภาพแบบ Object Drawing - การวาดภาพแบบ Shape 6.2 การวาดเสน - การวาดเสนตรงดวยเครองมอ Line Tool - การวาดเสนอสระดวยเครองมอ Pencil Tool

หนา 38

6.3 การวาดรปทรงเรขาคณต - การวาดสเหลยมหรอสเหลยมมมโคงดวยเครองมอ Rectangle Tool และ Rectangle Primitive Tool - การวาดวงกลมหรอวงรดวยเครองมอ Oval Tool และ Oval Primitive Tool - การวาดรปทรงหลายเหลยมและรปดาวดวยเครองมอ PolyStar Tool 6.4 การลบเสนและสพนดวยเครองมอ Eraser Tool

7. ภำระงำน/ชนงำน ใบงานท 2 เรองการใชงานเครองมอ Flash Workshop 1 เรองการใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต

8. เกณฑกำรประเมนภำระงำน/ชนงำน แนบทายแผน

9. กจกรรมกำรเรยนร 9.1 ครกลาวทกทายกบนกเรยนหนาชนเรยนและชแจงจดประสงคการเรยนรในคาบเรยนนและทบทวนบทเรยนชวโมงทผานมา 9.2 นกเรยนรบใบความรท 2 เรองการใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต และศกษาท าความเขาใจจากใบความร 9.3 ครใหนกเรยนเปดบทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash ศกษาวดโอการสอนและเนอหา 9.4 ครสาธตการวาดภาพแบบ Object Drawing และ การวาดภาพแบบ Shape พรอมอธบายประกอบทละขนตอนอยางชาๆ เพอใหนกเรยนสงเกต จดจ า และสามารถน าไปปฏบตไดอยางถกตอง 9.5 ครอธบายการก าหนดสเสนและสพน การก าหนดความหนาของเสน และการก าหนดรปแบบของเสน กอนการวาดทพาเนล Properties 9.6 ครสาธตการวาดเสนตรงดวยเครองมอ Line Tool และการวาดเสนอสระดวยเครองมอ Pencil Tool ทละขนตอนอยางชาๆ เพอใหนกเรยนปฏบตตามไดทน 9.7 ครสาธตการวาดรปทรงเรขาคณตดวยเครองมอ Rectangle Tool, Rectangle Primitive Tool, Oval Tool, Oval Primitive Tool, PolyStar Tool ทละขนตอนอยางชาๆ เพอใหนกเรยนปฏบตตามไดทน หากปฏบตตามไมไดหรอไมทนใหยกมอขนถามทนท

9.8 ครอธบายและสาธตการลบเสนและสพนดวยเครองมอ Eraser Tool ในรปแบบตางๆ การเปลยนขนาดของยางลบทละขนตอนอยางชาๆ เพอใหนกเรยนปฏบตตามไดทน

9.9 ครใหนกเรยนเปดบทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash และกดทปม VDO การใชงานโปรแกรม Flash เพอศกษาเพมเตม

9.10 นกเรยนฝกปฏบตการใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต ตามขนตอนทครสาธต โดยครสงเกตการฝกปฏบตของนกเรยน หากนกเรยนคนใดท าไมถกตอง ครใหค าแนะน าเพอใหนกเรยนแกไขและปฏบตไดอยางถกตอง

หนา 39

9.11 นกเรยนท าใบงานท 2 เรองการใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต และท าแบบฝกในบทเรยนส าเรจรปในเมน WORKSHOP1 เรอง การใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต เมอท าเสรจแลวใหตรวจสอบความถกตองใหเรยบรอย กอนสงงานท \\192.168.1.9 9.12 ท าแบบทดสอบหลงเรยนจากบทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash 9.13 นกเรยนรวมกนสรปเกยวกบรปแบบการวาดภาพในโปรแกรม Flash การวาดเสน การวาดรปทรงเรขาคณต และการลบเสนและสพนดวยเครองมอ Eraser Tool 9.14 ครสรปเพมเตมในสวนทนกเรยนยงสรปไมครบถวน

10. สอกำรเรยนร/แหลงเรยนร 10.1 ใบความรท 2 เรองการใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต 10.2 ใบงานท 2 เรองการใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต 10.3 WORKSHOP1 เรอง การใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต 10.4 บทเรยนคอมพวเตอรชวยสอน “เรองการใชงานโปรแกรม Flash ” 10.5 เครองคอมพวเตอร 10.6 โปรเจคเตอร 10.7 โปรแกรม Adobe Flash CS6 10.8 โปรแกรม NetSupport School

11. กำรวดและประเมนผล 11.1 วธการการประเมน - ตรวจใบงานท 2 เรอง การใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต - ตรวจงานการฝกปฏบตจากบทเรยนคอมพวเตอรชวยสอน “การใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต” - สงเกตพฤตกรรมรายบคคล 11.2 เครองมอประเมน - แบบประเมนพฤตกรรมรายบคคล

- บทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash 11.3 เกณฑการประเมน - ใบงานท 2 เรอง การใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต ไดคะแนนมากกวารอยละ 80

- ผานการปฏบตจากบทเรยนคอมพวเตอรชวยสอน WORKSHOP1 เรอง การใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต

ไดคะแนนมากกวารอยละ 50 - แบบทดสอบหลงเรยนจากบทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash ไดคะแนนมากกวาแบบทดสอบกอนเรยน และผานเกณฑรอยละ 50

- สงเกตพฤตกรรมรายบคคล ไดคะแนนมากกวารอยละ 50

หนา 40

ภำคผนวก ข : -เฉลยแบบทดสอบ กอนเรยน-หลงเรยน -เฉลยใบงำน

หนา 41

เฉลยแบบทดสอบกอนเรยน-หลงเรยน เฉลย แบบทดสอบกอนเรยน 1. ข 2. ก 3. ค 4. ก 5. ค 6. ค 7. ก 8. ค 9. ง 10. ข เฉลย แบบทดสอบหลงเรยน 1. ข 2. ก 3. ค 4. ก 5. ค 6. ค 7. ก 8. ค 9. ง 10. ข

หนา 42

ชอ-สกล.....................................................................................................หอง................ .........เลขท...................

ค ำชแจง ใหนกเรยนอธบายและตอบค าถามตอไปน

1. ใหนกเรยนเขยนอธบายการเรยกใชงานโปรแกรม Flash มาทง 2 วธ 1. Start >> All Programs >> Adobe Master Collection CS6 >> Adobe Flash CS6

2. Start >> พมพชอง Search Flash และ Enter >> คลกท Flash

2. ใหนกเรยนเตมสวนประกอบของโปรแกรม Flash ใหถกตอง

ตวอกษร A คอ Toolbar ตวอกษร B คอ Stage ตวอกษร C คอ Timeline ตวอกษร D คอ Panel ตวอกษร E คอ Toolbox

เฉลยใบงำนท 1 ควำมรเบองตนเกยวกบโปรแกรม Flash CS6

หนา 43

ตวอกษร A คอ Layer ตวอกษร B คอ เสนควบคมการเลน ตวอกษร C คอ Frame ตวอกษร D คอ New Layer, New Folder , Delete

หนา 44

ชอ........................................................................................ชน .............. .............เลขท......................................

กจกรรมท 1 ใหนกเรยนตอบค ำถำมตอไปน

1. เขยนอธบายการวาดภาพแบบ Object Drawing มาพอสงเขป การวาดวตถทเปนอสระจากกน ดวยการกดปม หรอกดคยลด J สามารถเอามาวางทบซอนกนได โดยรปรางไมเปลยน

2. เขยนอธบายการวาดภาพแบบ Shape มาพอสงเขป การน าวตถมาผสมกนใหเปนรปราง โดยดดแปลงใหโคง และปรบมมดวยเครองมอ Selection Tool 3. ใหนกเรยนบอกชอเครองมอการวาดเสนและเครองมอการวาดรปทรงเรขาคณต

4. ใหนกเรยนบอกโหมดของการลบสเสนและสพน

4.1 Erase Normal คอลากผานอะไรกลบหมด 4.2 Erase Fills คอลบเฉพาะในสวนของพน (Fill) 4.3 Erase Lines คอลบเสน ลบขอบ (Stroke) 4.4 Erase Selected คอลบเฉพาะในพนททเราเลอก (ลบแต Fill ไมลบ Stroke) เลอกโดย Selection Tool หรอ Lasso Tool 4.5 Erase Inside คอลบในพน (Fill) ทเราคลกครงแรกเพอเรม

เฉลย ใบงำนท 2 กำรใชเครองมอวำดเสนและกำรวำดรปทรงเรขำคณต

หนา 45

ภำคผนวก ค : -แบบประเมน ผลกำรเรยนร

หนา 46

คะแนนหนวยกำรเรยนรรหสวชำ ง30247 กำรสรำงกำรตนแอนเมชน หนวยท1 เรอง กำรใชงำนโปรแกรม Flash

ระดบชน ม..../.....

เลขประจ ำตว

ชอสกล หอง เลขท

คะแนนหนวย หนวยท1

รวม 20

คดเปน 5 คะแนน กอ

นเรย

น

หลงเร

ยน

ใบงา

นท1

ใบงา

นท2

works

hop1

10 5 5 10

- ใบงานท 1 เรอง ความรเบองตนเกยวกบโปรแกรม Flash - ใบงานท 2 เรอง การใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต - Workshop 1 เรองการใชเครองมอวาดเสนและการวาดรปทรงเรขาคณต ไดคะแนนมากกวารอยละ 80 - แบบทดสอบหลงเรยนจากบทเรยนคอมพวเตอรชวยสอนเรอง การใชงานโปรแกรม Flash ไดคะแนนมากกวาแบบทดสอบกอนเรยน และผานเกณฑรอยละ 50

ลงชอ

นางรษา วลาจนทร ครช านาญการ

หนา 47

แบบสงเกตพฤตกรรม วชำ กำรสรำงกำรตนแอนเมชนเบองตน รหส ง30247 หนวยท 1 เรอง กำรใชงำนโปรแกรม Flash

ระดบชน ม..../..... เลข

ประจ ำตว ชอสกล หอง เลขท พฤตกรรม คะแนน(10) หมำยเหต

- สงเกตพฤตกรรมรายบคคล ไดคะแนนมากกวารอยละ 50

ลงชอ

นางรษา วลาจนทร ครช านาญการ