พื้นฐาน Adobe Flash CS3 ตอนที่1

1. CHAPTER 1
INTRODUCTION TO
FLASH CS3
แนะนํา Flash CS3

2. 1. Introduction to Flash CS3 [ แนะนํา Flash CS3 ]
1.1 โปรแกรม Flash คืออะไร
Flash CS3 เป็นผลิตภัณฑ์ทีพัฒนามาเพือสนับสนุนการสร้างงานกราฟิก ทั งภาพนิง และ
ภาพเคลือนไหว สําหรับการนําเสนอผ่านเครือข่ายอินเทอร์เน็ตFlash มีฟังก์ชันช่วยอํานวยความสะดวก
ในการสร้างผลงานหลากหลายรูปแบบ ตลอดจนชุดคําสังโปรแกรมมิงทีเรียกว่าFlash Action Script ที
เพิมประสิทธิภาพในการทํางาน และสามารถคอมไพล์ (Compile) เป็นโปรแกรมใช้งาน (Application
Program) เช่น การทําเป็น e-Card เพือแนบไปพร้อมกับE-Mail ในโอกาสต่างๆ
Flash เดิมเป็นของ Macromedia แต่ปัจจุบันได้เปลียนมาเป็นของAdobe ซึงได้ถูกพัฒนาให้มี
ลักษณะการทํางานทีสอดคล้องต่อโปรแกรมต่างๆ ในชุดAdobe มากยิงขึ นซึงในการอบรมครังนี ได้ใช้
Adobe Flash CS3 Professional
. ส่วนประกอบของหน้าต่างโปรแกรม Flash CS3

3. 1. แถบชือหัวเรือง(Title Bar) แสดงปุ่มควบคุมหลัก (Control Menu)
ชือโปรแกรม และปุ่มควบคุมหน้าต่างโปรแกรม
2. เมนูบาร์ (Menu Bar) แสดงรายการคําสังต่างๆ ของโปรแกรม
3. ทูลบ็อกซ์ (Toolbox) แสดงปุ่มเครืองมือเกียวกับการวาดภาพ สร้างภาพซึงสามารถ ซ่อน /
แสดง ได้ด้วยการคลิกเมนู Windows > Tools
4. สเตจ (Stage) พื นทีส่วนทีใช้ในการวางวัตถุต่างๆ หรืออาจจะเรียกว่า "เวที"
เมือมีการนําเสนอผลงานจะ แสดงเฉพาะวัตถุบนStage เท่านั น
5. ไทม์ไลน์ (Timeline) หน้าต่างแสดงเส้นควบคุมเวลาสําหรับการนําเสนอผลงาน
ประกอบด้วยส่วนทํางานเกียวกับLayer และ Timeline
6. แถบแก้ไข (Edit Bar) ใช้แสดงชือซีน จัดการกับหน้าจอโปรแกรม ปรับขนาดมุมมองของสเตจ
ซึงสามารถซ่อน/แสดง ได้ด้วยการคลิกเมนู Windows > Toolbars > Edit Bar
7. แถบคุณสมบัติ (Properties) ใช้กําหนดค่าคุณสมบัติของ สเตจและออบเจ็กต์ต่างๆ โดย
รายละเอียดทีปรากฏขึ นมาจะเปลียนแปลงไปตามเครืองมือหรือออบเจ็กต์ทีกําลังคลิกเลือก
สามารถซ่อน/แสดง ได้ด้วยการคลิกเมนู Windows > Properties > Properties หรือกดปุ่ม
Ctrl + F3
8. พาเนล (Panel) หน้าต่างหรือชุดคําสังพิเศษทีใช้ทํางานเฉพาะด้าน เช่น พาเนลColor ใช้เลือก
และผสมสี พาเนล Library ใช้จัดเก็บออบเจ็กต์ต่างๆ เป็นต้น ซึงสามารถเปิดเรียกได้ด้วยการ
คลิกทีเมนู Windows
1.3 Toolbox
ทูลบ็อกซ์(Toolbox) เป็นกล่องเก็บอุปกรณ์ทีใช้ในการสร้าง ปรับแต่ง และแก้ไขวัตถุ เราสามรถ
เรียกใช้งานทูลบ็อกซ์ ได้โดยเลือกคําสังWindows > Tools แล้วคลิ กเลือกเครืองมือได้ตามต้องการ

4. เครืองมือต่างๆ บนทูลบ็อกซ์
Selection Tool ( V ) คําสังSelection การเลือกวัตถุ
Subselection Tool ( A ) คําสังSelection การเลือกวัตถุ
Free Transform Tool ( Q ) ยืด หด ย่อ หรือขยายขนาดของวัตถุ
Gradient Transform Tool ( F ) ปรับแต่งการไล่โทนสีแบบLinear และ Radial
Lasso Tool ( L ) คําสังSelection การเลือกวัตถุ
Pen Tool ( P ) วาดเส้นและส่วนโค้งต่าง
Add Anchor Point Tool ( = ) เพิมจุดแองเคอร์
Delete Anchor Point Tool ( - ) ลบจุดแองเคอร์
Convert Anchor Point Tool ( C ) ปรับเปลียนเส้นโค้งให้เป็นมุม
Text Tool ( T ) พิมพ์ตัวอักษร
Line Tool ( N ) วาดเส้นตรง
Rectangle Tool ( R ) วาดสีเหลียม
Oval Tool ( O ) วาดวงกลม

5. Rectangle Primitive Tool ( R ) วาดสีเหลียมแบบปรับแต่งรูปทรงได้
Oval Primitive Tool ( O ) วาดวงกลมแบบปรับแต่งรูปทรงได้
PolyStar Tool วาดรูปหลายเหลียม/รูปดาว
Pencil Tool ( Y ) ดินสอวาดภาพ
Brush Tool ( B ) แปรงระบายสี
Ink Bottle Tool ( S ) ปรับแต่งเส้นขอบของวัตถุ
Paint Bucket Tool ( K ) เทสีพื น
Eyedropper Tool ( I ) คัดลอกสีทีต้องการ
Eraser Tool ( E ) ยางลบ
Hand Tool ( H ) จับStage เลือนไปยังทีต้องการ
Zoom Tool ( M,Z ) ซูมย่อ/ขยายหน้าจอ
Stroke color ปรับแต่งสีของเส้นขอบ
Fill color ปรับแต่งสีของพื น
Black and white เปลียนสี Stroke Color กับ Fill Color เป็นสีขาว/ดํา
Swap colors สลับสีระหว่างStroke Color กับFill Color
No color เปลียนสี Stroke Color ให้ไม่มีสี
. การสร้างไฟล์งาน
ในการเปิดโปรแกรมจะปรากฏหน้าจอ Welcome Screen เพือให้คลิกเลือกรูปแบบในการสร้าง
ไฟล์งาน จากนั นจึงสามารถปรับขนาดของสเตจได้ตามต้องการ
1. คลิกเลือก Flash File (ActionScript 2.0) จากส่วนของCreate New เพือสร้างไฟล์งานใหม่

6. 2. คลิกปุ่ม จากนั นจะปรากฏไดอะล็อกบ็อกซ์Document Properties ขึ นมา
3. พิมพ์กําหนดขนาดความกว้าง ความสูงของพื นทีทํางานลงในช่องDimensions
4. ปรับสีพื นหลังทีBackground color ตามต้องการ
5. กําหนดอัตราการเล่นเฟรมต่อวินาทีทีFrame rate โดยปกติจะอยู่ที fps
6. คลิกปุ่ม เพือยืนยันคําสัง จากนั นพื นทีสเตจจะมีขนาดเปลียนแปลงไปตามค่าที
กําหนดไว้
7. ออกแบบผลงานได้ตามต้องการ
1.5 มุมมองจอภาพ

7. Stage เป็นพื นทีหลักของการสร้างงานดังนั นเครืองมือชุดแรกทีควรทราบก็คือเครืองมือในกลุ่ม
View ซึงจะใช้ในการควบคุมStage เป็นหลักเช่น การย่อ/ขยาย Stage การเลือน Stage เป็นต้น
Hand tool เป็นเครืองมือทีใช้เลือนและปรับขนาดของ Stage
 Drag & Drop เพือเลือน Stage
 ดับเบิลคลิกที กําหนดขนาดของ Stage ให้มีขนาดพอดีกับความกว้างของจอภาพ(Fit on
screen)
Zoom tool เป็นเครืองมือปรับขนาดของ Stage
 คลิกที จะปรากฏรายการเลือกย่อยที Modifier คลิกเลือกรูปแบบการย่อ หรือขยาย
จากนั นนําเมาส์มาคลิกบนStage
 ดับเบิลคลิกที เพือกําหนดให้ Stage มีขนาดเป็น 100% อย่างรวดเร็ว
การควบคุมStage ยังสามารถใช้ปุ่มZoom ทีปรากฏอยู่มุมบนขวาของStage
หรือเลือกจากเมนูคําสังView, Zoom in/Zoom out/Magnifier ได้เช่นเดียวกัน
. การทดสอบผลงาน
ภายหลังจากการออกแบบภาพเคลือนไหวเรียบร้อยแล้ว จากนั นเราสามารถตรวจสอบผลงานที
สร้างไว้ได้ ดังนี
1. คลิกเมนู Control > Test Movie หรือกดปุ่มCtrl + Enter จากนั นผลงานทีสร้างไว้จะปรากฏ
ขึ นมาในลักษณะเป็นมูฟวี
2. หรือสามารถดูการเคลือนไหวของออบเจ็กต์ทีอยู่ในแต่ล่ะเฟรมได้โดยคลิกทีเมนูControl > Play
หรือกดปุ่มEnter ออบเจ็กต์บนสเตจก็จะเคลือนไหวตามทีได้ออกแบบไว้
. การบันทึกไฟล์
ภาพทีวาดทีสร้างเสร็จแล้ว หรือปรับแต่งแก้ไขแล้วควรบันทึกไฟล์เก็บไว้ทุกครั งโดยไฟล์
ต้นฉบับจะได้ส่วนขยายเป็น.fla การบันทึกไฟล์สามารถใช้คําสังFile > Save เพือบันทึกลงไฟล์เดิม
หรือ File > Save As… เพือบันทึกเป็นไฟล์ใหม่
เนืองจากไฟล์ .fla เป็นไฟล์ต้นฉบับไม่สามารถนําไปใช้งานได้ ก่อนนําไฟล์ภาพทีสร้าง
ด้วย Flash ไปใช้งาน จําเป็นต้องบันทึกในฟอร์แมตทีเหมาะสม ดังนี
) การบันทึกภาพนิงในฟอร์แมต GIF
การบันทึกภาพวาดในฟอร์แมตGIF ทําได้โดยเลือกคําสังFile > Export > Export Image…

8. เลือกรายการ Save as Type เป็น GIF Image (*.GIF)
รายการเลือกของ GIF Format ได้แก่
 Dimension กําหนดขนาดของภาพ
 Resolution กําหนดความละเอียด มีค่าเท่ากับ72 dpi
 Include เลือกรูปแบบการบันทึกพื นทีรอบภาพกรณีทีต้องการบันทึกเฉพาะพื นทีทีมีภาพเท่านั น
ให้เลือกเป็น Minimum Image Area โปรแกรมจะไม่นําพื นทีรอบภาพมาบันทึกด้วยแต่ถ้าเลือก
เป็นรายการ Full Document Size จะเป็นการบันทึกเท่ากับขนาดทีระบุจริงในรายการ
Dimension
 Colors เลือกจํานวนค่าสีทีเหมาะสมกับภาพดังนั นหากบางภาพมีการใช้สีน้อยก็สามารถระบุ
จํานวนสีทีเหมาะสมได้
 Interlace เลือกเมือภาพทีวาดมีขนาดโตกว่า200 pixel เพือกําหนดให้ภาพแสดงผลแบบโครง
ร่างก่อน แล้วค่อยๆชัดขึ นเมือเวลาผ่านไป
 Transparent เลือกเพือกําหนดให้ภาพมีลักษณะของพื นแบบโปร่งใส
 Smooth เลือกให้ภาพมีลักษณะขอบกระด้างหรือขอบมน
 Dither solid colors เลือกลักษณะการเกลียสีทีมีลักษณะใกล้เคียงกัน
2) การบันทึกภาพนิงในฟอร์แมต JPEG
การบันทึกภาพวาดในฟอร์แมตJPEG ทําได้โดยเลือกคําสังFile > Export > Export Image…
เมือเลือกไดร์ฟ/โฟลเดอร์ และตั งชือไฟล์ภาพให้เลือกรายการ Save as Type เป็น JPEG Image
(*.jpg) แล้วคลิกปุ่มSave จะปรากฏรายการเลือกค่าควบคุมดังนี

9.  Dimension กําหนดขนาดของภาพ
 Resolution กําหนดความละเอียด มีค่าเท่ากับ72 dpi
 Include เลือกรูปแบบการบันทึกพื นทีรอบภาพกรณีทีต้องการบันทึกเฉพาะพื นทีทีมีภาพเท่านั น
ให้เลือกเป็น Minimum Image Area โปรแกรมจะไม่นําพื นทีรอบภาพมาบันทึกด้วยแต่ถ้าเลือก
เป็นรายการ Full Document Size จะเป็นการบันทึกเท่ากับขนาดทีระบุจริงในรายการ
Dimension
 Quality คุณภาพของภาพ กรณีทีนําไปใช้กับเอกสารเว็บควรกําหนดไว้ที 60 – 90 แต่ถ้า
ต้องการบันทึกเป็นภาพต้นฉบับเพือไปตกแต่งด้วยโปรแกรมอืนต่อไปควรกําหนดเป็น 100
 Progressive เลือกเมือภาพทีวาดมีขนาดโตกว่า200 pixel เพือกําหนดให้ภาพแสดงผลแบบ
โครงร่างก่อน แล้วค่อยๆชัดขึ นเมือเวลาผ่านไปคล้ายๆ กับคุณสมบัติInterlace ของ GIF
) การบันทึกเป็นภาพเคลือนไหว
การบันทึกผลงานของFlash เป็นภาพเคลือนไหว หรือ Flash Movie สามารถเลือกได้สอง
คําสังคือ File > Export > Export Movie… เมือเลือกไดร์ฟ/โฟลเดอร์ และตั งชือไฟล์ภาพให้เลือก
รายการ Save as Type เป็น Flash Movie (*.swf) แล้วคลิกปุ่มSave จะปรากฏรายการเลือกค่าควบคุม
ต่างๆ โดยสามารถกดOK เพือบันทึกได้โดยทันที
นอกจากนี ยังสามารถเลือกได้จากคําสังFile > Publish > Settings… ซึงเป็นคําสังทีนิยม
เลือกใช้มากกว่ากรณีทีเป็นภาพเคลือนไหว โดยจะปรากฏหน้าต่างทํางานดังนี

10. เลือกฟอร์แมตทีต้องการใช้งาน
 ใช้งานในเครือข่ายอินเทอร์เน็ตให้คลิกเลือกรายการ Flash และ HTML
 สร้าง Movie ในฟอร์แมต QuickTime ให้เลือกรายการ QuickTime ซึงจะได้ไฟล์ Movie ทีมีส่วน
ขยายเป็น .mov
 สร้าง Movie ทีสามารถนําเสนอได้ทันที โดยไม่ต้องอาศัยPlug-Ins ใดๆ ให้เลือกรายการ
Windows Projector ซึงจะได้ไฟล์ทีมีส่วนขยาย.exe หรือเลือกรายการ Macintosh Projector
สําหรับการนําเสนอบนเครืองคอมพิวเตอร์ Macintosh
เมือเลือกรูปแบบไฟล์ทีต้องการแล้ว ให้คลิกปุ่มPublish โปรแกรมจะแปลงงานบน Stage
เป็น Movie ตามฟอร์แมตทีเลือก โดยใช้ชือไฟล์เดียวกับไฟล์Flash ต้นฉบับ