เรอง รจกกบเทคโนโลยของ Adobe Flash CS5 Professional

Flash คออะไร

หากกลาวกนถงโปรแกรม Flash ในปจจบน ในแวดวงของนกพฒนาเวบไซต นกออกแบบ Multimedia หรอเหลาคนท า Animation คงไมมใครไมรจกเจาโปรแกรมนเปนแน ในฐานะทเปนเครองมอสราง Animation ททรงคณภาพ และสามารถสรางงานทตอบโตกบผใชไดอยางยอดเยยม อกทงยงเปนทรจกในฝงของผชมในฐานะ Animation ตนตาตนใจทท าใหการทองเวบไซต หรอการนงชม Presentation ไมใชภาพนงๆ

งาน Flash นนแบงเปน 2 ประเภทใหญ คอ งาน Online และงาน Offline ซงมงานประเภทตางๆ ดงตอไปน

งาน Flash แบบ Online

1. Web Banner

งานปายโฆษณาบนเวบไซตพฒนามาจาก Gif Animation ทโหลดชาและคณภาพต าในสมยกอน มาเปน Animation ของ Flash ทเคลอนไหวตอเนองมขนาดเลกและยงม Graphic ทสวยงาม

2. Web Animation

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

3. Web Introduction

ถา 1 ภาพแทนค าพด 1000 ค า ภาพเคลอนไหวยอมพดไดมากขนอกหลายเทาตว การใชภาพเคลอนไหวอธบายบคลก ตวตนของเวบไซตเปนอกอยางท Flash ท าไดดและไดรบความนยมอยางสง

4. Flash Website

ถาไมใชเวบไซตจะไมเพยงแคตกแตงประดบประดาดวย Flash เทานน มนสามารถใชท าเวบไซตทงกระบวนการไดดวย ไมจ ากดแคเพยง Animation และเนอหาอยางเดยว หากยงการเชอมโยงกบฐานขอมล และการสราง Application ทมรปแบบเฉพาะตวอกดวย

2

งาน Flash แบบ Offline

1. Product Introduction

งานเปดตวสนคา งาน Event งานคอนเสรต งานแตงงาน ทจะตองมการน าเสนอความนาสนใจของสนคา หรอกจกรรมตางๆ การท า Animation อธบายวธการใช หรอแนะน ากจกรรมลกคาดวยโปรแกรม Flash กเปนทางเลอกใหมทก าลงมาแรง ดวยวธการทสะดวก และประหยดคาใชจายกวางานดาน VDO

2. Presentation, CD Interactive

เมองาน Flash สามารถตอบโตกบผใชงานได การสรางงานแบบ Presentation กไมเปนปญหาส าหรบ flash อกทงยงมประโยชนในเรองความยดหยนของการเขยนโปรแกรม จงเปดโอกาสใหสรางงาน Interactive แบบจนตนาการกวางไกล โดยไมยดตดอยในโครงรางตายตวเหมอนกบ PowerPoint อกตอไป

3. Application

ในขนสง การเขยนโปรแกรมชวยใหสามารถสราง Application เฉพาะทางขนเอง เอาไวใชสวนตว หรอใชกนเองในบรษท

ทงนยงมงานทสามารถใชไดทง Online และ Offline ไดอกดวย

1. Full Animation, Cartoon, E-Card, Music Video

ไมวาจะเปนการสราง Cartoon บนเวบไซตหรอการท า Music Video รวมถง Animation ทสงไปตามอเมล ในลกษณะ Electronic-Cards งานประเภทเหลานจะใชโปรแกรม Flash เปนตวเลอกแรกๆ ดวยเหตทกลาวขางตน

2. Games

การพฒนาในสวนของการเขยนโปรแกรมในชวงหลงๆ ท าให Flash สามารถสรางเกมทมประสทธภาพมากขนเรอยๆ ถงแมวาอาจจะยงไมใชเกมทขายไดอยางจรงจง แตมนสามารถไดซง flash ท าใหการสรางเกมไมใชเรองยากจนเกนไป

3

เกยวกบทางผผลตและเวอรชนของโปรแกรม 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 ส าหรบโทรศพทมอถอเปนอยางดอกดวย ซงความสามารถตางๆ เหลานจะไดกลาวถงในบทตอๆ ไป

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

ความสามารถในการสรางชนงาน Interactive ชนงาน Interactive คอ ชนงานทมการตอบสนองกบผใช เชน ผใชสามารถคลกเลอกเมนตางๆ ได ซงสวนใหญงานประเภท Interactive ทสรางดวยโปรแกรม Flash นนจะน าไปใชเปนสอการสอน (E-Learning) หรอหนาจอควบคมการท างานของแผน CD เปนตน

4

ความสามารถในการสรางชนงาน Animation การสราง Animation หรอภาพการตนเคลอนไหวนน ถอเปนหวใจหลกของการท างานในโปรแกรม Flash เนองจากมเครองอ านวยความสะดวกมากมาย จงท าใหโปรแกรม Flash สรางผลงาน Animation ไดงายกวาโปรแกรมอน ซงเราสามารถพบเหนงานแอนเมชนไดทวไป ไมวาจะเปนสอโฆษณา (Banner) บนเวบไซต หรอการตนแอนเมชนตางๆ

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

5

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

เตรยมตวอยางไร ส าหรบการสรางแอนเมชน

ส าหรบการเตรยมตวในการท างานโปรแกรม Flash CS5 นน จะตองเรมจากวางโครงรางเรองราวแอนเมชน หลงจากนนกจะสรางตวละครใหเหมาะสมกบเรองราว สรางฉากแลวน าทกอยางมาประกอบกนใหเปนชนงาน

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

6

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

1. วาดโครงรางของตวละครดวยดนสอ จากนนน าไปสแกน

2. ใชเครองมอทมในโปรแกรม Flash ปรบตางภาพตวละคร

3. ลงส และเกบรายละเอยดใหกบตวละคร

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

หนาตาของโปรแกรมทเปลยนไป (User Interface) ส าหรบโปรแกรม Flash CS5 เวอรชนลาสด หนาตาของโปรแกรมไดเปลยนไปจากเดม เปลยนต าแหนงการวางแถบเครองมอตางๆ ทง Timline, Scene และ Panel ตางๆ ท าใหผทใชงานนนสามารถท างานไดสะดวกสบายยงขน

7

เครองมอใหมทเพมขนมา เมอเปดโปรแกรม Flash CS5 เราจะเหนวาเครองมอใหมๆ เพมขนมาหลายชน โดยแบงออกเปน 5 หมวดหลกๆ ดงตอไปน

เครองมอส าหรบปรบแตงภาพ 3 มต

เครองมอ (3D Rotation Tool) และเครองมอ (3D Translation Tool) เปนเครองมอทสามารถปรบตางภาพ หมน บด ใหออกมาเปนรปแบบ 3 มต ซงเปนความสามารถทท าใหเราสรางงานแอนเมชนทดเปนมตมากยงขน

เครองมอส าหรบสรางหวแปรงทาส เครองมอ (Deco Tool) เปนเครองมอส าหรบสรางวตถทมลกษณะคลายๆ กบเครองมอแปรงทาส (Brush) แตเราสามารถสรางหวแปรงใหม โดยเปลยน Symbol ใหกลายเปนหวแปรงได

8

เครองมอส าหรบสรางโครงกระดก

เครองมอส าหรบสรางโครงกระดก (Bone Tool) และเครองมอ (Bind Tool) เปนเครองมอทสามารถเชอมตอโครงกระดกเพอใสเขาไปบนการตน ท าใหการตนมการเคลอนไหวทเปนอสระมากยงขน โดยขนตอนการใชงานของเครองมอ (Bone Tool)

พาแนล Motion Editor พาแนล Motion Editor เปนลกเลนใหมของ Flash CS5 เพราะจะท าใหเราสามารถปรบแตง

รายละเอยดของการเคลอนไหวไดละเอยดขน

ค าสง Motion Tween รปแบบใหม

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

9

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

มาแบง ในทนจะแบงรปภาพตามระบบของโปรแกรมกราฟก โดยเฉพาะในโปรแกรม Flash นนแบงออกเปน 2 อยาง เมอพจารณาจากรปเดยวกนแตรปแบบตางกนเมอขยายภาพจะมรายละเอยด ดงน

ภาพบตแมป หรอราสเตอร (Bitmap or Raster) เปนภาพทเกดจากชนสวนเลกๆ ของภาพมาเรยงตอกน ซงความละเอยดของชนสวนเหลานจะเลก

ขนาดไหน มการก าหนดคาความละเอยดของหนาจอ ภาพแบบนจะเปนภาพทมความละเอยดของสสนมาก แตเมอขยายภาพใหใหญขนกจะเหนรอยตอของภาพคลายขนบนไดเหมอนกบรปถายทเราไปขยายจากขนาด 4x6 นว ไปเปน 8x10 นว กจะเหนแกนของรปภาพขยายขนอยางชดเจน รปแบบทพบอยบอยๆ คอ ไฟลทมนามสกล *.BMP นนเอง

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

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

การเปดโปรแกรม Adobe Flash CS5 ขนมาใชงาน 1. คลกเมาสทปม Start บนแถบงานจะเกดปอปอพเมนของโปรแกรม 2. น าเมาสเลอกค าสง All Programs เลอนเมาสไปท Adobe Master Collection CS5> Adobe

Flash CS5 Professional

10

3. คลก 1 ครงท Adobe Flash CS5 กจะท าการเปดหนาตางโปรแกรมขนมาจะปรากฏหนาจอดงรป

11

รปแบบการท างาน

ในขนตอนน การเรยนใชงานโปรแกรม จะพบหนาจอ Welcome Screen ส าหรบเลอกรปแบบเรมตนการท างานดงน

Open a Recent Item เปนการเปดไฟลเกาทสรางไวแลว โดยคลกเลอกรายชอทแสดง (เรยงจากการบนทกไฟลครงหลงสดเปนตนไป สงสด 8 ไฟล) หรอคลก Open เพอเปดไฟลอน

คลกเลอกรปแบบเรมตนการท างาน

คลกเลอกสวนของการแนะน าโปรแกรม คลกเพอดาวนโหลดโปรแกรมหรอ ดขอมลจากเวบ Adobe

คลกเลอกในชองน หากไมตองการใหแสดงหนาจอ Welcome Screen อกในครงตอไป

12

Create New สรางไฟลใหม โดยคลกเลอกรปแบบของไฟลทตองการสราง เชน เลอก Flash File (ActionScript 3.0) เพอสรางไฟลมฟวใหมทมโหมดการเขยน ActionScript เปนเวอรชน 3 เปนตน ส าหรบเนอหาในเลมนจะแนะน าใหใช ActionScript 2.0 เปนหลก

Create From Template สรางไฟลใหมจากรปแบบเทมดเพลตทโปรแกรมมใหโดยคลกเลอกหมวดของเทมเพลตทตองการกอนแลวคลกเลอกไฟลอกทหนง

ใหคลกเลอกหวขอ Flash File (ActionScript 2.0) จะพบกบหนาจอดงรป