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

ผลงานทสรางขนภายในอาจมการเชอมโยงขอมลมากมายจนกลายเปนผลงานชนหนงขนมา เชน อาจมการสรางปมขนมาใหผเขาชมไดใชส าหรบคลกโตตอบ เพอเชอมโยงไปยงขอมลหรอเวบไซตตางๆ ซงการท างานดงกลาวเปนการท างานในลกษณะ Interactive ส าหรบตวอยางตอไปนจะท าการสรางเลเยอรขนมา 3 เลเยอร โดยเลเยอรท 1 เปนไฟลภาพรปภาพพรอมกบปมคลก 1 ปม เลเยอรท 2 เปนไฟลภาพพรอมกบปมคลก 2 ปม และเลเยอรท 3 สรางขนเพอใชส าหรบสงค าสง Actions ตางๆ เชน ค าสง stop ทใชในการหยดแสดงขอมลเมอถงเฟรมทก าหนด ค าสง goto เพอใหเลนไปยงเฟรมทก าหนดเมอมการคลกเมาสเกดขน รวมถงสงใหเชอมโยงไปยงเวบไซตทก าหนดไว ลกษณะการท างานคอ เมอมการคลกปมทอยในเลเยอร 1 จะใหท าการเชอมโยงไปยงเลเยอร 2 และเมอมการคลกบนปมท 1 ของเลเยอร 2 จะใหกลบสเลเยอร 1 แตหากคลกปมท 2 แทน กจะใหท าการเชอมโยงไปสเวบไซตทก าหนดไว

1. คลกเมนค าสง File เลอกค าสง Import และ Import to Stage เพอน าไฟลรปภาพท 1 ทตองการเขามาใชงาน

2. คลกเมาสขวาเฟรมท 5 และเลอกค าสง Insert frame เฟรมทงหมดจะมความยาวจ านวน 5 เฟรม

หนา 144

3. ดรากสเมาสสรางปม 1 ปม เพอใชคลกไปสไฟลภาพท 2 4. คลกปม Insert Layer ทไทมไลน นนจะปรากฏเลเยอรใหม ( คอ เลเยอร 2 ) ขนมาจ านวน 1

เลเยอร 5. คลกเมนค าสง File เลอกค าสง Import และ Import to Stage เพอน าไฟลภาพท 2 ทตองการ

เขามาใชงาน จากนนไฟลภาพท 2 จะวางซอนทบอยบนไฟลภาพท 1

คลกเมน File > Import

คลกเมาสขวาเฟรมท 5 และเลอกค าสง Insert Frame

หนา 145

6. ดรากสเมาสสรางปม 2 ปม เพอใชคลกไปสไฟลภาพท 1 และคลกไปสเวบไซตทก าหนด 7. ดบเบลคลก Layer 2 และดรากสเมาสลากมาไวเฟรมท 10 เพอวางภาพท 2 ในเลเยอร 2 ตอทาย

ชนงาน (ภาพท 1) ในเลเยอรท 1 8. คลกปม Insert Layer ทไทมไลน จากนนจะปรากฏเลเยอรใหม (คอ Layer 3 ) ขนมา

จ านวน 1 เลเยอร 9. คลกเมนค าสง Window เลอกค าสง Development Panels เลอก Actions ใหปรากฏ

เครองหมายถก จากนนจะปรากฏ Actions Panel ขนมา

ดรากสเมาสสรางปม 1 ปม

คลกปม Insert Layer

คลกเมน File > Import > Import to Stage

หนา 146

10. คลกเลอก Global Function แลวเลอก Timeline control แลวเลอกค าสง Stop ดบเบลคลกทค าสง stop เพอหยดการแสดงผลเมอเลนมาถงเฟรมน

ดบเบลคลก Layer 2 จากนนให ดรากสเมาสลากมาไวเฟรมท 10

ดรากสเมาสสรางปม 2 ปม

คลกปม Insert Layer

คลกเมน Window > Actions

หนา 147

11. คดลอกค าสง stop จากเฟรมท 1 มาไวเฟรมท 5 เพอก าหนดจดหยดของขอมลเฟรมสดทายในเล

เยอรท 1 12. คดลอกค าสง stop จากเฟรมท 1 มาไวเฟรมท 10 เพอก าหนดจดหยดของขอมลใน

เลเยอรท 2

13. กลบมาทเลเยอรท 1 คลกปม ซงแสดงเปนชวงจงหวะในการแสดงขอมลในเลเยอรท 2 14. คลกเลอก Global function เลอก Movie Control แลวดบเบลคลกค าสง on แลวใสคาใน

วงเลบเปน release

คดลอกค าสง stop มาไวเฟรมท 5

ดบเบลคลกทค าสง stop

ดรากสเมาสค าสง stop มาไวเฟรมท 10

หนา 148

15. แลวคลกเลอก Global function เลอก Timeline Control แลวดบเบลคลกค าสง gotoAndPlay เพอก าหนดการท างานหลงจากคลกทปมแลว

16. ในวงเลบใหพมพหมายเลขเฟรมเปน 10 เมอคลกทปมกจะเชอมโยงเขาสเฟรมท 10 ในเลเยอรท 2 ตวอยาง gotoAndPlay (10) เปนตน

17. คลกปมท 1 ใน Layer 2 18. คลกเลอก Global function เลอก Movie Control แลวดบเบลคลกค าสง on แลวใสคาใน

วงเลบเปน release 19. แลวคลกเลอก Global function เลอก Timeline Control แลวดบเบลคลกค าสง

gotoAndPlay เพอก าหนดท างานหลงจากคลกทปมแลว 20. ในวงเลบใหพมพหมายเลขเฟรมเปน 1 เมอคลกทปมกจะเชอมโยงเขาสเฟรมท 1 ใน เลเยอรท 1

ตวอยาง gotoAndPlay (1) เปนตน

คลกทปม ในเลเยอรท 1

ดบเบลคลกทค าสง on เลอก release

ดบเบลคลกทค าสง gotoAnd Play พมพหมายเลขของเฟรม

หนา 149

21. คลกปมท 2 ใน Layer 2 22. คลกเลอก Global function เลอก Movie Control แลวดบเบลคลกค าสง on แลวใสคาใน

วงเลบเปน release 23. คลกเลอกค าสง Browser/Network ดบเบลคลกทค าสง getURL เพอก าหนดเวบไซตทตองการ

เชอมโยง 24. ชอง URL ใหพมพชอเวบไซตทตองการเชอมโยงเปน http://www.tapraya.ac.th

คลกปมท 2

ดบเบลคลกทค าสง getURL

พมพชอเวบไซต

คลกป มท 1

ดบเบลคลกทค าสง goto

พมพหมายเลขเฟรม

“http://www.tapraya.ac.th”);

หนา 150

ซน (Scene) เปรยบเสมอนเรองราวของฉากละครแตละฉาก ดงนนหากตองการใหผลงานของ เราเปนทนาสนใจยงขน เพยงแคคลกเมนค าสง Insert เลอกค าสง Scene เรากไดซนใหมทสามารถสรางขอมลแตละฉากไดอกมากมาย จากนนจงน าซนเหลานนมาท าการเชอมโยงใหเกดเปนมฟวขนมา

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

1. ใหเลอกเมนค าสง File เลอกค าสง Import เขามาไวบนเฟรมท 1 และท าเปน Symbol โดยเลอกเมนค าสง Insert เลอกค าสง Convert to Symbol เลอกเปน Graphic ตงชอวา Pic1 แลวคลกทปม OK

2. คลกเมาสขวาเฟรมท 10 และเลอกค าสง Insert Keyframe จากนนจะปรากฏคยเฟรมขนมาบนเฟรมท 10

1 ใสชอ

เลอกเปน Graphic

คลก OK

หนา 151

3. คลกเมาสเฟรมท 10 และเลอกเมนค าสง Window เลอกค าสงProperties จากนนใหคลกทรปภาพและใน Properties ในชอง Color เลอกเปน Alpha ปรบคาใหเปน 0%

4. ใหคลกเมาสขวาทเฟรมท 1 เลอกค าสง Create Classic Tween

เลอกเปน Alpha

ปรบคาใหเปน 0%

หนา 152

5. คลกเมาสขวาทเฟรมท 11 เลอกค าสง Insert Keyframe จะปรากฏ Keyframeขนมา 6. คลกเมาสขวาทเฟรมท 20 เลอกค าสง Insert Keyframe จากนนใหคลกทรปภาพ 1 ครง ใหคลก

หนาตาง Properties ขนมาและตรงชอง Color เลอกเปน Alpha ปรบคาใหเปน 100%

7. ใหกลบมาทเฟรมท 11 คลกเมาสขวาทเฟรมท 11 เลอกค าสง Create Motion Tween

เลอก Alpha

ปรบคาใหเปน 100%

หนา 153

8. คลกเมาสขวาทเฟรมท 25 เลอกค าสง Insert Keyframe และสรางปมบนสเตจขนมา 1 ปม เพอทจะสามารถคลกไปยงซนท 2

คลกเมาสขวาทเฟรมท 11 เลอก Create Motion Tween

สรางปมขนมา 1 ปม

หนา 154

9. สราง Layer ขนมา อก 1 Layer โดยคลก จากนนใหคลกเมาสขวาทเฟรมท 25 ในเลเยอรท 2เลอกค าสง Insert Keyframe เพอทใสค าสงในเฟรมน

10. ใหเลอกเมนค าสง Window เลอกค าสง Actions 11. เลอกค าสง Global Functions แลวเลอก Timeline Control และดบเบลคลกทค าสง Stop

เพอทจะใหภาพเคลอนไหวหยดเฟรมท 25 ใหเราสามารถทจะคลกปมทสรางขนเพอเชอมโยงไปยงซนท 2

คลกเพอสรางเลเยอรใหม

คลกเมาสขวาทเฟรมท 25 เลอก Insert Keyframe

ดบเบลคลกทค าสง Stop

คลกเลอกเฟรมท 25

ค าสง Stop

ค าสงจะปรากฏใน Frame ท 25

หนา 155

12. คลกเลอกปมทจะใสค าสงเพอเมอคลกแลวขามไปเลนในซนท 2 13. คลกเลอก Global function เลอก Movie Control แลวดบเบลคลกค าสง on แลวใสคาใน

วงเลบเปน release

14. แลวคลกเลอก Global function เลอก Timeline Control แลวดบเบลคลกค าสง gotoAndPlay เพอก าหนดท างานหลงจากคลกทปมแลว

15. ในวงเลบใหพมพชอ Scene เมอคลกทปมกจะเชอมโยงเขาส Scene ท 2 ในเฟรมท 1 ตวอยาง gotoAndPlay (“Scene 2”, “1”) เปนตน

คลกทปม

คลกทค าสง on

ดบเบลคลกทค าสง gotoAndPlay

ใสชอ Scene และ Frame Number

หนา 156

1. คลกเมนค าสง Insert เลอกค าสง Scene จะปรากฏซนใหมเพอใชสรางขอมลทจะน ามาเชอมโยงเขาเปนมฟวขนมา

2. คลกเมนค าสง Modify เลอกค าสง Document จะปรากฏไดอะลอกบอกซ Document Properties ขนมา

3. ท Background Color ใหคลกเลอกคาสเทาจากนนทฉากหลงจะเปลยนเปนสเทาและคลกปม OK เพอยนยนค าสง

4. คลกเมน File > Import > Import to Stage เพอน าไฟลภาพทตองการขนมา

คลกเลอกค าสง Insert > Scene

คลก Modify > Document

เลอกBackground Color ใหเปนสเทา

หนา 157

5. คลกเมาสขวาเฟรมท 20 เลอกค าสง Insert Frame

6. คลกปม Insert Layer ทไทมไลน จากนนจะปรากฏเลเยอรใหมขนมา

7. สรางออบเจกตไวใน Layer 2 8. คลกเมาสขวาเฟรมท 20 เลอก Insert Keyframe และเลอกค าสง Create Motion Tween

น าไฟลภาพมา

คลกเมาสขวาเลอก Insert Frame

คลก Insert Layer

หนา 158

9. ดรากสเมาสลากออบเจกตไปอกดานหนงของออบเจกตทอยในเลเยอร 1

คลกเมาสขวาเฟรมท 20 เลอก Insert Keyframe และ Create Classic Tween

สรางออบเจกตในเลเยอรท 2

ดรากสเมาสลากเคลอนยายออบเจกต

หนา 159

10. คลกเมาสขวาทเลเยอร 2 เลอกค าสง Mask จากนนออบเจกตในเลเยอรท 1 ทไดถก Mask ไวอย

จะปรากฏขนมาเฉพาะบรเวณทออบเจกต ในเลเยอรท 2 วางซอนทบไวอยเทานน

เมอไดท าการเชอมโยนระหวางซนเสรจเรยบรอยแลวใหลองทดสอบดวาแตละซนท างานตามปกต โดยลองกดคยบอรดปม < Ctrl+Enter >

คลกเมาสขวา Layer 2 เลอกค าสง Mask

ออบเจกตท 1ไดถก Mask ไว

หนา 160

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

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

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

1. ใหเปดไฟลงานทเราสรางเอาไวกอนหนานนมาแลวจากนนให คลกเมนค าสง File เลอกค าสง Import แลวเลอก Import to Library จะปรากฏไดอะลอกบอกซ Import to Library ขนมา

2. ดบเบลคลกไฟลเสยงทตองการเลนเมอมการคลกทปม จากนนไฟลเสยงจะถกเกบอยใน Library Panel

หนา 161

3. ใชไฟลเสยงทโปรแกรมจดเตรยมไวให โดยคลกเลอกเมนค าสง Window เลอกค าสง Common Libraries เลอกค าสง Sounds

เลอกค าสง File >Import > Import to Library

เลอก Sound ทตองการ

หนา 162

4. ในพาเนล TimeLine สรางเลเยอรใหม เพอใสเสยง โดยเลอกเมนค าสง Insert เลอกค าสง Layer

ใหตงชอวา Sound

5. เลอกเลเยอรของเสยงนน แลวลากไฟลเสยงจากพาเนล Library มาใสลงในสเตจเสยงนนจะถก

บรรจเขาในเลเยอรขณะนน

6. ในพาเนล Timeline คลกทเฟรมของเสยง แลวตงคาของเสยงไดในพาเนล Properties

คลนเสยงของไฟลเสยง

หนา 163

ในสวนของ Effect เลอกเอฟเฟคในการเลนเสยงตามตองการ ซงอาจเปน None ไมใสเอฟเฟค Left Channel เสยงออกเฉพาะล าโพงซายเทานน Right Channel เสยงออกเฉพาะล าโพงขวาเทานน Fade Left to Right สลบเสยงจากล าโพงดานหนงไปยงอกดานหนง Fade Right to Right สลบเสยงจากล าโพงดานหนงไปยงอกดานหนง Fade In เสยงคอยๆ ดงขน Fade Out เสยงคอยๆ เบาลง Custom ปรบแตงเอง เลอกการเกดเสยงจากสวนของ Sync ซงอาจเปน Event เกดเสยงตามเหตการณทเกดขน เชน เมอคลกปม Start เหมอน Event แตไมสามารถเกดเสยงจากหลายๆอนสแตนซพรอมๆ กนได Stop การปดเสยง Stream เกดเสยงแบบกระแสเสยงทอานไปเลนไปไมตองรอใหอานจบไฟลกอน มกใชในเวบเพจ เราสามารถก าหนดจ านวนรอบในการเกดเสยงในสวนของ Loop

หนา 164

ในทน เราจะใสเสยงใหเฟรมสดทายของ มฟวเรา

1. เลอกค าสงเมน File เลอกค าสง Import แลวเลอก Import to Library เพอน าไฟลเสยง มาใสในไลบราร

2. ในเลเยอร Sound คลกทเฟรมสดทาย แลวเลอกเมนค าสง Insert เลอกค าสง Keyframe

3. ในสวนของ Sound ในพาเนล Properties คลกเลอกเสยงทตองการ

ใสจ านวนรอบทตองการใหเกดเสยง

หนา 165

สามารถใสเสยงใหกบปมในภาวะตางๆ ได เชน ใหเกดเสยงเมอคลกทปมนน ซงจะกระท าไดดงน 1. กอนอน จะตองน าไฟลเสยงทจะใชเขามาไวในโปรแกรมเสยกอนดวยคลกเลอกค าสงเมน File

เลอกค าสง Import แลวเลอก Import to Library เพอน าไฟลเสยงมาใสในไลบราร 2. ในพาเนล Library เลอกปมทจะใสเสยง แลวดบเบลคลกปมทตองการใสเสยง 3. ในพาเนล Timeline สรางเลเยอรใหมเพอใสเสยง ใหตงชอวา Sound

4. ในเลเยอรของเสยงนน ใหคลกทเฟรมในภาวะทจะใสเสยง ตวอยางเชน ถาตองการใหเกดเสยงเมอคลกปม ใหคลกทเฟรมตรงภาวะ Down เปนตน แลวใหคลกเมาสขวาตรงเฟรม Down แลวเลอกเมนค าสง Insert เลอกค าสงKeyframe

5. ในพาเนล Properties เลอกเสยงในสวนของ Sound

หนา 166

6. ตงคาตางๆ ในการเกดเสยง เมอก าหนดเสยง ในปมเรยบรอยแลวใหทดสอบคาโดยลองกดคยบอรดปม < Ctrl+Enter >

เลอกเทคนคในการเกดเสยง

เลอกวาจะใหเกดเสยงเมอใด

แกไขเสยง

หนา 167