ความรู้พื้นฐานโปรแกรม Flash CS6

1. บทที่1
ความรูพื้นฐานเกี่ยวโปรแกรม FLASH CS6

2. มารูจักกับเทคโนโลยี ADOBE FLASH CS5
FLASH คืออะไร FLASH
โปรแกรม FLASH เปนโปรแกรมที่ทํางานในดานมัลติมีเดียในดานแอนนิเมชั่นตาง ๆ ทั้งเว็บแอนนิเมชั่น การตูนแอน
นิเมชั่น งานแบนเนอรภาพเคลื่อนไหวหรืองานมัลติมีเดียแบบอินเตอรแอคทีฟที่โตตอบกับผูใชงาน งาน FLASH นั้น
แบงเปน 2 ประเภทใหญ คือ งาน ONLINE และงาน OFFLINE ซึ่งมีงานประเภทตาง ๆ ดังตอไปนี้
งาน FLASH แบบ ONLINE
1. WEB BANNER
งานปายโฆษณาบนเว็บไซตพัฒนามาจาก GIF ANIMATION ที่โหลดชาและคุณภาพตางในสมัยกอนมาเปน
ANIMATION ของ FLASH ที่เคลื่อนไหวตอเนื่องมีขนาดเล็กและยังมี GRAPHIC ที่สวยงาม
2. WEB ANIMATION
สวนประกอบของเว็บไซตที่เคยใชเปนภาพนิ่ง สามารถสื่อสาร และดึงดูดความสนใจไดมากขึ้นดวย FLASH

3. 3. WEB INTRODUCTION
ถา 1 ภาพแทนคําพูด 1000 ค า ภาพเคลื่อนไหวยอมพูดไดมากขึ้นอีกหลายเทาตัว การใชภาพเคลื่อนไหวอธิบายบุคลิก
ตัวตนของเว็บไซตเปนอีกอยางที่ FLASH ทําไดดีและไดรับความนิยมอยางสูง
4. FLASH WEBSITE
ถาไมใชเว็บไซตจะไมเพียงแคตกแตงประดับประดาดวย FLASH เทานั้น มันสามารถใชทําเว็บไซตทั้งกระบวนการได
ดวย ไมจํากัดแคเพียง ANIMATION และเนื้อหาอยางเดียว หากยังการเชื่อมโยงกับฐานขอมูล และการสราง
APPLICATION ที่มีรูปแบบเฉพาะตัวอีกดวย
งาน FLASH แบบ OFFLINE
1. PRODUCT INTRODUCTION
งานเปดตัวสินคา งาน EVENT งานคอนเสิรต งานแตงงาน ที่จะตองมีการน าเสนอความนาสนใจของสินคา หรือ
กิจกรรมตาง ๆ การ ทํา ANIMATION อธิบายวิธีการใช หรือแนะนํากิจกรรมลูกคา
ดวยโปรแกรม FLASH ก็เปนทางเลือกใหมที่กําลังมาแรง ดวยวิธีการที่สะดวก และประหยัดคาใชจายกวางานดาน
VDO

4. 2. PRESENTATION, CD INTERACTIVE
เมื่องาน FLASH สามารถตอบโตกับผูใชงานได การสรางงานแบบ PRESENTATION ก็ไมเปนปญหาสําหรับ
FLASH อีกทั้งยังมีประโยชนในเรื่องความยืดหยุนของการเขียนโปรแกรม จึงเปดโอกาสใหสรางงาน
INTERACTIVE แบบจินตนาการกวางไกล โดยไมยึดติดอยูในโครงรางตายตัวเหมือนกับ POWERPOINT อีก
ตอไป
3. APPLICATION
ในขั้นสูง การเขียนโปรแกรมชวยใหสามารถสราง APPLICATION เฉพาะทางขึ้นเอง เอาไวใชสวนตัว หรือใช
กันเองในบริษัท

5. งาน FLASH ทั้ง ONLINE และ OFFLINE
1. FULL ANIMATION, CARTOON, E-CARD, MUSIC VIDEO
ไมวาจะเปนการสราง CARTOON บนเว็บไซตหรือการท า MUSIC VIDEO รวมถึง ANIMATION ที่สงไปตาม
อีเมล ในลักษณะ ELECTRONIC-CARDS งานประเภทเหลานี้จะใชโปรแกรม FLASH เปนตัวเลือกแรกๆ ดวย
เหตุที่กลาวขางตน
2. GAMES
การพัฒนาในสวนของการเขียนโปรแกรมในชวงหลังๆ ทําให FLASH สามารถสรางเกมที่มีประสิทธิภาพมากขึ้น
เรื่อย ๆ ถึงแมวาอาจจะยังไมใชเกมที่ขายไดอยางจริงจัง แตมันสามารถไดซึ่ง FLASH ทําใหการสรางเกมไมใช
เรื่องยากจนเกินไป

6. เกี่ยวกับทางผูผลิตและเวอรชั่นของโปรแกรม FLASH
ขาวใหญในแวดวง WEB DESIGNER, GRAPHIC DESIGNER หรือ ANIMATOR ในชวงที่ผานมา คงหนีไมพน
การที่บริษัทยักษใหญทางดาน GRAPHIC EDITOR SOFTWARE อยาง ADOBE ที่เปนเจาของ SOFTWARE
ประจําเครื่องของ GRAPHIC DESIGNER อยาง PHOTOSHOP และ ILLUSTRATOR ไดซื้อ บริษัท
MACROMEDIA เจาของ SOFTWARE ที่เปนมือฉมังทางดานเว็บไซตและเปนผูผลิต FLASH เวอรชั่นใหม
ออกมาพรอมกับหลายๆ โปรแกรมภายใต SERIES ที่ชื่อ CS5 เพื่อแสดงถึงความเปนอันหนึ่งอันเดียวกันของ
ADOBE นั่นเอง
ADOBE FLASH CS5 หรือ FLASH เวอรชั่น 11 นั้นไดถูกพัฒนาขึ้นโดยอาศัยเทคโนโลยีทางดาน GRAPHIC
ของ ADOBE อยางมากมาย ทําใหการสราง GRAPHIC ใน FLASH นั้นสะดวกสบายกวาเวอรชั่นกอน
อีกทั้งยังรองรับเทคโนโลยีที่กําลังมาแรงอยางการใช VDO และการสราง APPLICATION สําหรับโทรศัพทมือถือ
เปนอยางดีอีกดวย ซึ่งความสามารถตาง ๆ เหลานี้จะไดกลาวถึงในบทตอ ๆ ไป

7. FLASH ใชทําอะไรไดบาง
โปรแกรม FLASH เปนโปรแกรมยอดนิยมสําหรับการสรางผลงานไดหลายประเภท ไมวาจะเปนการตูน
แอนิเมชัน , เกม, สื่อโฆษณาบนเว็บไซต หรืออินเตอรเฟสแผนซีดีที่มีการตอบโตกับผูใช โดยในหัวขอนี้เราจะ
มาท าความรูจักกับความสามารถของโปรแกรม FLASH ไวเปนแนวทางเพื่อนําไปพัฒนาชิ้นงานตอไป
ความสามารถในการสรางชิ้นงาน INTERACTIVE
ชิ้นงาน INTERACTIVE คือ ชิ้นงานที่มีการตอบสนองกับผูใช เชน ผูใชสามารถคลิกเลือกเมนูตาง ๆ ได ซึ่ง
สวนใหญงานประเภท INTERACTIVE ที่สรางดวยโปรแกรม FLASH นั้นจะนําไปใชเปนสื่อการสอน
(E-LEARNING) หรือหนาจอควบคุมการท างานของแผน CD เปนตน

8. ความสามารถในการสรางชิ้นงาน ANIMATION
ความสามารถในการสรางชิ้นงาน ANIMATION
การสราง ANIMATION หรือภาพการตูนเคลื่อนไหวนั้น ถือเปนหัวใจหลักของการท างานในโปรแกรม
FLASH เนื่องจากมีเครื่องอํานวยความสะดวกมากมาย จึงทําใหโปรแกรม FLASH สรางผลงาน
ANIMATION ไดงายกวาโปรแกรมอื่น ซึ่งเราสามารถพบเห็นงานแอนิเมชันไดทั่วไป ไมวาจะเปนสื่อโฆษณา
(BANNER) บนเว็บไซต หรือการตูนแอนิเมชันตาง ๆ

9. ความสามารถในการสรางเว็บไซต (WEBSITE)
งานประเภทเว็บไซต ก็เปนการสรางชิ้นงานอีกรูปแบบหนึ่งที่ใชโปรแกรม FLASH สรางผลงาน
ได เนื่องจากโปรแกรม FLASH สามารถสรางเว็บไซตไดสวยงาม และสรางลูกเลนตาง ๆ ไดงายกวาการใช
โปรแกรมอื่น แตมีขอเสียคือ เว็บไซตที่สรางดวยโปรแกรม FLASH แกไขขอมูลไดยาก และขนาดของไฟล
เว็บไซตจะมีขนาดคอนขางใหญ ดังนั้น หากตองการสรางเว็บไซตควรพิจารณาถึงรูปแบบของเว็บไซตกอนวา
เหมาระสมที่จะสรางดวยโปรแกรม FLASH หรือไม

10. ความสามารถในการสรางเกม (GAME)
ปจจุบันไดมีเกมที่สรางจากโปรแกรม FLASH ออกมาอยางแพรหลายตามเว็บไซตตาง ๆ
เนื่องจากโปรแกรม FLASH มีเครื่องมือชวยสรางองคประกอบตาง ๆ ของเกมใหสวยงาม, มีเครื่องมือสําหรับ
ใสคําสั่งควบคุมการเลนเกม อีกทั้งไฟลเกมที่สรางออกมามีขนาดเล็ก ทําใหอัพโหลดขึ้นสูเว็บไซตไดอยาง
รวดเร็ว

11. เตรียมตัวอยางไร สําหรับการสรางแอนิเมชัน
สําหรับการเตรียมตัวในการท างานโปรแกรม FLASH CS5 นั้น จะตองเริ่มจากวางโครงรางเรื่องราว
แอนิเมชัน หลังจากนั้นก็จะสรางตัวละครใหเหมาะสมกับเรื่องราว สรางฉากแลวน าทุกอยางมาประกอบกัน
ใหเปนชิ้นงาน
วางโครงรางสําหรับสรางงานแอนิเมชัน (STORYBOARD)
การวางโครงราง (STORYBOARD) คือการคิดเนื้อเรื่องขึ้นมา และวาดออกมาเปนภาพตั่งแตตนจนจบอยาง
คราวๆ ซึ่งก็เหมือนกับการวางแผนการท างานในเบื้องตน เพื่อใหผลงานที่ออกมาเปนระบบและรวดเร็ว

12. สรางตัวละครสําหรับงานแอนิเมชัน
เมื่อเราสรางผลงานแอนิเมชันขึ้นมาสักชิ้นหนึ่ง สิ่งที่จําเปนจะตองทําก็คือ การสรางตัวละครเพื่อเปนตัว
ดําเนินเรื่องราว โดยตองคิดเนื้อเรื่องขึ้นมากอน วาเราตองการที่จะสรางเรื่องราวอะไรขึ้นมา และคนหา
เอกลักษณของตัวละครนั้น ๆ เพื่อใหตัวละครมีความโดดเดนและนาสนใจ แตสําหรับผูที่ไมมีทักษะทางดาน
การวาดรูปอาจขอใหเพื่อน หรือคนรูจักวาดรูปใหนํามาสแกน แลวปรับแตงเพื่อใชงานในโปรแกรม FLASH ก็
ได
1. วาดโครงรางของตัวละครดวยดินสอ จากนั้นนําไปสแกน
2. ใชเครื่องมือที่มีในโปรแกรม FLASH ปรับตางภาพตัวละคร
3. ลงสี และเก็บรายละเอียดใหกับตัวละคร

13. FLASH CS6 มีอะไรใหม
ในโปรแกรม FLASH CS6 แตกตางจากโปรแกรม FLASH เวอรชันกอนหนาหลายสวนตั้งแต
หนาจอโปรแกรม และเครื่องมือใหมๆ ที่เพิ่มขึ้นมา ซึ่งจะมีอะไรบางนั้นเราจะไดเรียนรูกันในสวนนี้
หนาตาของโปรแกรมที่เปลี่ยนไป (USER INTERFACE)
สําหรับโปรแกรม FLASH CS6 เวอรชั่นลาสุด หนาตาของโปรแกรมไดเปลี่ยนไปจากเดิม เปลี่ยนตําแหนงการ
วางแถบเครื่องมือตาง ๆ ทั้ง TIMLINE, SCENE และ PANEL ตาง ๆ ทําใหผูที่ใชงานนั้นสามารถทํางานได
สะดวกสบายยิ่งขึ้น

14. เครื่องมือใหมที่เพิ่มขึ้นมา
เมื่อเปดโปรแกรม FLASH CS6 เราจะเห็นวาเครื่องมือใหมๆ เพิ่มขึ้นมาหลายชิ้น โดยแบง
ออกเปน 5 หมวดหลักๆ ดังตอไปนี้
เครื่องมือสําหรับปรับแตงภาพ 3 มิติ
เครื่องมือ (3D ROTATION TOOL) และเครื่องมือ (3D TRANSLATION TOOL) เปนเครื่องมือที่
สามารถปรับตางภาพ หมุน บิด ใหออกมาเปนรูปแบบ 3 มิติ ซึ่งเปนความสามารถที่ทําใหเราสรางงาน
แอนิเมชันที่ดูเปนมิติมากยิ่งขึ้น

15. เครื่องมือสําหรับสรางหัวแปรงทาสี
เครื่องมือ (DECO TOOL) เปนเครื่องมือสําหรับสรางวัตถุที่มีลักษณะคลายๆ กับเครื่องมือแปรงทาสี
(BRUSH) แตเราสามารถสรางหัวแปรงใหม โดยเปลี่ยน SYMBOL ใหกลายเปนหัวแปรงได

16. เครื่องมือสําหรับสรางโครงกระดูก
เครื่องมือสําหรับสรางโครงกระดูก (BONE TOOL) และเครื่องมือ (BIND TOOL) เปน
เครื่องมือที่สามารถเชื่อมตอโครงกระดูกเพื่อใสเขาไปบนการตูน ทําใหการตูนมีการเคลื่อนไหวที่
เปนอิสระมากยิ่งขึ้น โดยขั้นตอนการใชงานของเครื่องมือ (BONE TOOL)

17. พาแนล MOTION EDITOR
พาแนล MOTION EDITOR เปนลูกเลนใหมของ FLASH CS5 เพราะจะทําใหเราสามารถ
ปรับแตงรายละเอียดของการเคลื่อนไหวไดละเอียดขึ้น

18. คําสั่ง MOTION TWEEN รูปแบบใหม
สําหรับคําสั่ง MOTION TWEEN ในโปรแกรม FLASH เปนเวอรชันลาสุดนี้จะตางออกไปจากเดิม ไมวา
จะเปนการใชงานในลักษณะที่ตางกันแลว เราจะพบวามีลูกเลนใหมๆ ที่เสริมขึ้นมาอีกมากมาย

19. สรางงานมัลติมีเดียดวยกราฟก
รูปแบบของไฟลรูปภาพกราฟกที่ใชในการตกแตงนั้นมีหลากหลาย
รูปแบบแลวแตจะใชเกณฑไหนมาแบง ในที่ นี้จะแบงรูปภาพตามระบบ
ของโปรแกรมกราฟก โดยเฉพาะในโปรแกรม FLASH นั้นแบงออกเปน
2 อยาง เมื่อพิจารณาจากรูปเดียวกันแตรูปแบบตางกันเมื่อขยายภาพ
จะมีรายละเอียด ดังนี้

20. ภาพบิตแมป หรือราสเตอร (BITMAP OR RASTER)
เปนภาพที่เกิดจากชิ้นสวนเล็ก ๆ ของภาพมาเรียงตอกัน ซึ่งความละเอียดของ
ชิ้นสวนเหลานี้จะเล็กขนาดไหน มีการกําหนดคาความละเอียดของหนาจอ ภาพ
แบบนี้จะเปนภาพที่มีความละเอียดของสีสันมาก แตเมื่อขยายภาพใหใหญขึ้นก็จะ
เห็นรอยตอของภาพคลายขั้นบันไดเหมือนกับรูปถายที่เราไปขยายจากขนาด 4X6
นิ้ว ไปเปน 8X10 นิ้ว ก็จะเห็นแกนของรูปภาพขยายขึ้นอยางชัดเจน รูปแบบที่พบ
อยูบอย ๆ คือ ไฟลที่มีนามสกุล *.BMP นั่นเอง

21. ภาพเวคเตอร (VECTOR PICTURE)
จะเปนภาพที่เกิดจากลายเสน แทนที่จะเปนชิ้นสวนภาพ ดังนั้นเมื่อทําการขยายภาพใหใหญ
ขึ้นโอกาสที่แกนของภาพจะหยาบมีนอย ทําใหขอบของรูปภาพแทบจะไมเห็นเปนขั้นบันไดเลย
จึงเหมาะสํา หรับการสรางงานกราฟกที่ตองการความสวยงามมาก ๆหรือการสรางตัวอักษร
หรือภาพเคลื่อนไหวในเว็บไซตอยางที่เห็นกันทั่วไป สําหรับโปรแกรม FLASH แลวสวนใหญจะ
ทํางานกับภาพแบบเวคเตอรเปนสวนใหญโดยเรียกชื่อวา
ซิมโบล(SYMBOL)

22. การเปดโปรแกรม ADOBE FLASH CS6
1. คลิกเมาสที่ปุม START บนแถบงานจะเกิดปอปอัพเมนูของโปรแกรม
2. น าเมาสเลือกคําสั่ง ALL PROGRAMS เลื่อนเมาสไปที่ ADOBE MASTER COLLECTION CS5>
ADOBE FLASH CS5 PROFESSIONAL

23. 3. คลิก 1 ครั้งที่ ADOBE FLASH CS5 ก็จะทําการเปดหนาตางโปรแกรมขึ้นมาจะปรากฏหนาจอดังรูป

25. รูปแบบการทํางาน
•ในขั้นตอนนี้ การเรียนใชงานโปรแกรม จะพบหนาจอ WELCOME SCREEN สําหรับเลือกรูปแบบ
เริ่มตนการท างานดังนี้
•OPEN A RECENT ITEM เปนการเปดไฟลเกาที่สรางไวแลว โดยคลิกเลือกรายชื่อที่แสดง (เรียงจาก
การบันทึกไฟลครั้งหลังสุดเปนตนไป สูงสุด 8 ไฟล) หรือคลิก OPEN เพื่อเปดไฟลอื่น
• CREATE NEW สรางไฟลใหม โดยคลิกเลือกรูปแบบของไฟลที่ตองการสราง เชน เลือก FLASH
FILE (ACTIONSCRIPT 3.0) เพื่อสรางไฟลมูฟวี่ใหมที่มีโหมดการเขียน ACTIONSCRIPT เปนเวอร
ชั่น 3 เปนตน สําหรับเนื้อหาในเลมนี้จะแนะนําใหใช ACTIONSCRIPT 2.0 เปนหลัก
•CREATE FROM TEMPLATE สรางไฟลใหมจากรูปแบบเทมดเพลตที่โปรแกรมมีใหโดยคลิกเลือก
หมวดของเทมเพลตที่ตองการกอนแลวคลิกเลือกไฟลอีกทีหนึ่ง

26. ใหคลิกเลือกหัวขอ FLASH FILE (ACTIONSCRIPT 2.0) จะพบ
กับหนาจอดังรูป