1. ขั้นตอนในการพัฒนาเว็บไซต์
 เตรียมเนือหาทีจะนาเสนอ
้ ่
 กาหนดเป้ าหมาย(Target) : Animation "การสร้างภาพเคลื่อนไหว" ด้วยการนาภาพนิ่งมา
เรี ยงลาดับกัน และแสดงผลอย่างต่อเนื่ อง ทาให้ดวงตาเห็นภาพที่มีการเคลื่อนไหวใน
ลักษณะภาพติดตา (Persistence of Vision) เมื่อตามนุษย์มองเห็นภาพที่ฉาย อย่างต่อเนื่ อง
เรตินาระรักษาภาพนี้ไว้ในระยะสั้นๆ ประมาณ 1/3 วินาที หากมีภาพอื่นแทรกเข้ามาใน
ระยะเวลาดังกล่าว สมองของมนุษย์จะเชื่อมโยงภาพทั้งสองเข้าด้วยกันทาให้เห็นเป็ น
่
ภาพเคลื่อนไหว ที่มีความต่อเนื่องกัน แม้วาแอนิเมชันจะใช้หลักการเดียวกับวิดิโอ แต่
่
ั
แอนิ เมชันสามารถนาไปประยุกต์ใช้กบงานต่างๆได้มากมาย เช่น งานภาพยนตร์ งาน
่
โทรทัศน์ งานพัฒนาเกมส์ งานสถาปัตย์ หรื องานพัฒนาเว็บไซต์ เป็ นต้น การสร้าง
ภาพเคลื่อนไหวโดยการฉายภาพนิ่งหลายๆภาพต่อเนื่องกันด้วยความเร็ วสู ง การใช้
คอมพิวเตอร์กราฟิ กส์ในการคานวณสร้างภาพจะเรี ยกการสร้างภาพเคลื่อนไหวด้วย
คอมพิวเตอร์หรื อ คอมพิวเตอร์แอนิเมชัน หากใช้เทคนิคการถ่ายภาพหรื อวาดรู ป หรื อ
หรื อรู ปถ่ายแต่ละขณะของหุ่ นจาลองที่ค่อย ๆ ขยับ จะเรี ยกว่า ภาพเคลื่อนไหวแบบการ
่
เคลื่อนที่หยุด หรื อ สตอปโมชัน (stop motion) โดยหลักการแล้ว ไม่วาจะสร้างภาพ หรื อ
เฟรมด้วยวิธีใดก็ตาม เมื่อนาภาพดังกล่าวมาฉายต่อกันด้วยความเร็ ว ตั้งแต่ 16 เฟรมต่อ
วินาทีข้ ึนไป เราจะเห็นเหมือนว่า ภาพดังกล่าวเคลื่อนไหวได้ต่อเนื่องกัน ทั้งนี้เนื่องจาก
การเห็นภาพติดตา ในทางคอมพิวเตอร์ การจัดเก็บภาพแบบแอนิ เมชันที่ใช้กนอย่าง ั
แพร่ หลายในอินเทอร์ เน็ต มีหลายรู ปแบบไฟล์เช่น GIF APNG MNG SVG แฟลช และ
ไฟล์สาหรับเก็บวีดิทศน์ประเภทอื่นๆ
ั
 ทาให้ใคร(Visitor) : ให้บุคคลที่มีความสนใจในเรื่ องเกียวกับ Animation
่
 กาหนดกรอบแนวคิด (Concept) : ยังคงมุ่งมันที่จะสร้างสรรค์ผลงานต่อไป บนพื้นฐาน
่
่
แนวคิดที่วา “เราไม่จาเป็ นต้องทาให้เหมือนใคร แต่เราจะพยายามสร้างสรรค์ในสิ่ งที่เรามี
และเราให้ในสิ่ งที่ดีที่สุดที่เราทาได้”
 Technology : เทคโนโลยีการสร้าง Animation

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

3.  การจัดเตรี ยมทรัพยากร (Resource) : 1.1 ส่ วนประกอบของหน้ าต่ างโปรแกรม
Flas h CS3
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
้

4. 7. แถบคุณสมบัติ (Properties) ใช้กาหนดค่าคุณสมบัติของ สเตจและออบเจ็กต์ต่างๆ โดยรายละเอียด
ที่ปรากฏขึ้นมาจะเปลี่ยนแปลงไปตามเครื่ องมือหรื อออบเจ็กต์ท่ีกาลังคลิกเลือก สามารถซ่อน/แสดง
ได้ดวยการคลิกเมนู Windows > Properties > Properties หรื อกดปุ่ ม Ctrl + F3
้
8. พาเนล (Panel) หน้าต่างหรื อชุดคาสั่งพิเศษที่ใช้ทางานเฉพาะด้าน เช่น พาเนล Color ใช้เลือกและ
ผสมสี พาเนล Library ใช้จดเก็บออบเจ็กต์ต่างๆ เป็ นต้น ซึ่ งสามารถเปิ ดเรี ยกได้ดวยการคลิกที่เมนู
ั ้
Windows
1.3 Toolbox
ทูลบ็อกซ์ (Toolbox) เป็ นกล่องเก็บอุปกรณ์ที่ใช้ในการสร้าง ปรับแต่ง และแก้ไขวัตถุ เราสามรถเรี ยกใช้งาน
ทูลบ็อกซ์ ได้โดยเลือกคาสั่ง Windows > Tools แล้วคลิ้กเลือกเครื่ องมือได้ตามต้องการ

5. เครื่ องมือต่างๆ บนทูลบ็อกซ์
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 ) วาดวงกลม
Rectangle Primitive Tool ( R ) วาดสี่ เหลี่ยมแบบปรับแต่งรู ปทรงได้
Oval Primitive Tool ( O ) วาดวงกลมแบบปรับแต่งรู ปทรงได้
PolyStar Tool วาดรู ปหลายเหลี่ยม/รู ปดาว
Pencil Tool ( Y ) ดินสอวาดภาพ

6. 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 ให้ไม่มีสี
1.4 การสร้ างไฟล์งาน
ในการเปิ ดโปรแกรมจะปรากฏหน้าจอ Welcome Screen เพื่อให้คลิกเลือกรู ปแบบในการสร้างไฟล์งาน
จากนั้นจึงสามารถปรับขนาดของสเตจได้ตามต้องการ

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

8. 7. ออกแบบผลงานได้ตามต้องการ
1.5 มุมมองจอภาพ
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.6 การทดสอบผลงาน
ภายหลังจากการออกแบบภาพเคลื่อนไหวเรี ยบร้อยแล้ว จากนั้นเราสามารถตรวจสอบผลงานที่สร้างไว้ได้
ดังนี้
1. คลิกเมนู Control > Test Movie หรื อกดปุ่ ม Ctrl + Enter จากนั้นผลงานที่สร้างไว้จะปรากฏขึ้นมาใน
ลักษณะเป็ นมูฟวี่
2. หรื อสามารถดูการเคลื่อนไหวของออบเจ็กต์ที่อยูในแต่ล่ะเฟรมได้โดยคลิกที่เมนู Control > Play
่
หรื อกดปุ่ ม Enter ออบเจ็กต์บนสเตจก็จะเคลื่อนไหวตามที่ได้ออกแบบไว้

9. 1.7 การบันทึกไฟล์
ภาพที่วาดที่สร้างเสร็ จแล้ว หรื อปรับแต่งแก้ไขแล้ว ควรบันทึกไฟล์เก็บไว้ทุกครั้ง โดยไฟล์
ต้นฉบับจะได้ส่วนขยายเป็ น .fla การบันทึกไฟล์สามารถใช้คาสัง File > Save เพื่อบันทึกลงไฟล์เดิม หรื อ
่
File > Save As… เพื่อบันทึกเป็ นไฟล์ใหม่
เนื่องจากไฟล์ .fla เป็ นไฟล์ตนฉบับ ไม่สามารถนาไปใช้งานได้ ก่อนนาไฟล์ภาพที่สร้าง
้
ด้วย Flash ไปใช้งาน จาเป็ นต้องบันทึกในฟอร์ แมตที่เหมาะสม ดังนี้
1) การบันทึกภาพนิ่งในฟอร์ แมต GIF
การบันทึกภาพวาดในฟอร์ แมต GIF ทาได้โดยเลือกคาสั่ง File > Export > Export Image…
เลือกรายการ Save as Type เป็ น GIF Image (*.GIF)
รายการเลือกของ GIF Format ได้แก่
 Dimension กาหนดขนาดของภาพ
 Resolution กาหนดความละเอียด มีค่าเท่ากับ 72 dpi
 Include เลือกรู ปแบบการบันทึกพื้นที่รอบภาพ กรณี ที่ตองการบันทึกเฉพาะพื้นที่ที่มีภาพเท่านั้น ให้
้
เลือกเป็ น Minimum Image Area โปรแกรมจะไม่นาพื้นที่รอบภาพมาบันทึกด้วย แต่ถาเลือกเป็ น
้
รายการ Full Document Size จะเป็ นการบันทึกเท่ากับขนาดที่ระบุจริ งในรายการ Dimension
 Colors เลือกจานวนค่าสี ที่เหมาะสมกับภาพ ดังนั้นหากบางภาพมีการใช้สีนอย ก็สามารถระบุ
้
จานวนสี ที่เหมาะสมได้

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

11. 3) การบันทึกเป็ นภาพเคลื่อนไหว
การบันทึกผลงานของ Flash เป็ นภาพเคลื่อนไหว หรื อ Flash Movie สามารถเลือกได้สอง
คาสั่ง คือ File > Export > Export Movie… เมื่อเลือกไดร์ ฟ/โฟลเดอร์ และตั้งชื่อไฟล์ภาพ ให้เลือกรายการ
Save as Type เป็ น Flash Movie (*.swf) แล้วคลิกปุ่ ม Save จะปรากฏรายการเลือกค่าควบคุมต่างๆ โดย
สามารถกด OK เพื่อบันทึกได้โดยทันที
นอกจากนี้ยงสามารถเลือกได้จากคาสั่ง File > Publish > Settings… ซึ่ งเป็ นคาสั่งที่นิยมเลือกใช้
ั
มากกว่า กรณี ท่ีเป็ นภาพเคลื่อนไหว โดยจะปรากฏหน้าต่างทางาน ดังนี้
เลือกฟอร์ แมตที่ตองการใช้งาน
้
 ใช้งานในเครื อข่ายอินเทอร์ เน็ต ให้คลิกเลือกรายการ Flash และ HTML
 สร้าง Movie ในฟอร์ แมต QuickTime ให้เลือกรายการ QuickTime ซึ่งจะได้ไฟล์ Movie ที่มีส่วน
ขยายเป็ น .mov
 สร้าง Movie ที่สามารถนาเสนอได้ทนที โดยไม่ตองอาศัย Plug-Ins ใดๆ ให้เลือกรายการ Windows
ั ้
Projector ซึ่ งจะได้ไฟล์ที่มีส่วนขยาย .exe หรื อเลือกรายการ Macintosh Projector สาหรับการ
นาเสนอบนเครื่ องคอมพิวเตอร์ Macintosh

12. เมื่อเลือกรู ปแบบไฟล์ที่ตองการแล้ว ให้คลิกปุ่ ม Publish โปรแกรมจะแปลงงานบน Stage
้
เป็ น Movie ตามฟอร์ แมตที่เลือก โดยใช้ชื่อไฟล์เดียวกับไฟล์ Flash ต้นฉบับ
2. Color [ ทางานกับสี ]
วัตถุใน Flash จะประกอบด้วยส่ วนประกอบอย่างน้อยๆ 2 ส่ วน ได้แก่ พื้นของวัตถุ
(Background หรื อ Fill) และเส้นขอบวัตถุ (Stroke) แต่ละส่ วนสามารถแสดงผลด้วยสี ที่แตกต่างกันได้ เช่น
รู ปสี่ เหลี่ยมที่มีเส้นขอบสี ดา และพื้นข้างในเป็ นสี น้ าเงิน ดังนั้นการทางานเกี่ยวกับสี จึงเป็ นการทางานที่
จะต้องเกี่ยวข้องตลอดเวลา โดยอาศัยชุดเครื่ องมือเลือกสี จาก Toolbox
รายละเอียดเกี่ยวกับส่ วนควบคุมสี ใน Toolbox
รายการเลือก No Color จะแสดงผลเมื่อคลิกเลือกวาดสี่ เหลี่ยม หรื อวาดวงกลม ดังนั้น
ั
ก่อนเลือกสี ให้กบการวาดสี่ เหลี่ยม, วงกลม ควรคลิกเลือกเครื่ องมือวาดสี่ เหลี่ยม หรื อวาดวงกลม
ก่อนที่จะคลิกปุ่ มเลือกสี ซึ่ ง เป็ นรายการสาคัญมาก และมักจะเป็ นรายการที่เข้าใจผิด เช่น ถ้า
ั
ต้องการวาดวงกลมไม่มีสีพ้ืน หลายๆ ท่าน จะใช้วธีการเลือก Fill Color ให้กบสี ของ Background
ิ
เช่น ถ้า Background เป็ นสี ขาว ก็จะเลือก Fill Color เป็ นสี ขาว ซึ่ งมีความหมายที่ต่างไป

13. การเลือกสี ให้กบกราฟิ กต่างๆ ที่วาดด้วยเครื่ องมือของ Flash นอกจากจะใช้ส่วนควบคุมสี ที่กล่าวไป
ั
แล้ว ก็จะมีรายการเลือกสี ใน Properties Panel ของเครื่ องมือนั้นๆ
แผงควบคุมสี (Color Panel)
Color Panel เป็ นการเพิ่มประสิ ทธิ ภาพของการทางานเกี่ยวกับสี โดยเฉพาะในส่ วนที่เป็ น
การไล่โทนสี (Gradient) เนื่องจากการสร้างชุดสี การไล่โทน ไม่สามารถทาได้จากส่ วนควบคุมสี
ปกติ Flash เตรี ยม Panel เกี่ยวกับสี ไว้ 2 ชุดคือ
 Swatches ซึ่งมีการทางาน/ใช้งานลักษณะเดียวกับ Toolbox

14.  Color มีส่วนเพิ่มเติมการใช้สีมากกว่าปกติ เช่น การทาสี แบบไล่โทนลักษณะต่างๆ, การใช้
ภาพกราฟิ กมาเป็ นพื้นของกราฟิ ก (Texture) รวมทั้งการปรับค่าความโปร่ งใสของสี (Alpha)
การเลือกรายการจาก Color มีรายการที่น่าสนใจ คือ Fill Type ซึ่ งจะช่วยให้ผใช้สามารถ
ู้
เลือกรู ปแบบของสี ได้หลากหลายลักษณะ เช่น สี พ้น (Solid Color), สี ไล่โทนแบบเส้นตรง (Linear
ื
Gradient), สี ไล่โทนแบบรัศมี (Radial Gradient) และการนาภาพจากภายนอกมาเป็ นพื้นของวัตถุ
(Bitmap Background)

15. ชุดสี แบบไล่ โทน
 คลิกเลือกรายการ Fill Type เป็ น Linear (ไล่โทนในแนวระนาบ) หรื อ Radial (ไล่โทนในแนวรัศมี)
 นาเมาส์ไปคลิกใต้ Gradient definition bar จะปรากฏ Gradient Pointer กาหนดจานวน Gradient
Pointer ตามต้องการ
 ถ้าต้องการลบ Gradient Pointer ให้นาเมาส์ไปชี้ ณ Gradient Pointer ที่ตองการลบ แล้วลากออกจาก
้
Gradient definition bar
 ั
กาหนดสี ให้กบ Gradient Pointer โดยคลิกที่ Gradient Pointer ชิ้นที่ตองการ จากนั้นคลิกเลือกสี จาก
้
Current Color ทาซ้ ากับ Gradient Pointer ตาแหน่งอื่น
 สามารถเลื่อนปรับตาแหน่งของ Gradient Pointer โดยใช้หลัก Drag & Drop
 ั
คลิกปุ่ ม Color Mixer Option Menu แล้วเลือกคาสั่ง Add Swatch เพื่อเพิ่มสี ที่กาหนดให้กบ
โปรแกรม

16. ความโปร่ งใสของสี วตถุ (Alpha)
ั
รู ปด้านหน้าที่ไม่ได้กาหนดค่าความโปร่ งใส ก็จะซ้อนทับรู ปด้านหลังแบบไม่เห็นภาพด้านหลัง แต่
ถ้ากาหนดรู ปด้านหน้าให้มีค่าโปร่ งใส ก็จะทาให้สีของรู ปด้านหน้ามีลกษณะจาง และมองทะลุไปเห็นรู ป
ั
ด้านหลังได้
3. Shape [ วาดรู ปทรงพืนฐาน ]
้
3.1 รู ปแบบการวาดภาพ
การวาดภาพจากโปรแกรม Flash สามารถแบ่งออกเป็ น 2 รู ปแบบ ดังนี้
1) การวาดแบบ Merge Drawing รู ปทรงที่วาดจะมีผลต่อรู ปทรงอื่น เช่น เมื่อนารู ปทรงที่มีพ้นเป็ นสี
ื
เดียวมาซ้อนทับ ก็จะถูกรวมเป็ นชิ้นเดียวกัน แต่หากมีสีแตกต่าง เมื่อเคลื่อนย้ายส่ วนที่ถูกซ้อนทับก็จะหายไป
โดยอัตโนมัติ ซึ่งสามารถวาดได้ดวยการคลิกยกเลิกปุ่ ม Object Drawing ที่
้
ทูลพาเนล

17. รู ปทรงที่มีพ้นและเส้นขอบ เมื่อนามาซ้อนทับและ เส้นขอบจะกลายเป็ นของรู ปทรงนั้น
ื
ดับเบิลคลิกลากออกมา
2) การวาดแบบ Object Drawing ซึ่ งรู ปทรงทั้งในส่ วนของเส้นและพื้นผิวจะกลายเป็ นชิ้นเดียวกัน
หากนามาซ้อนทับก็จะไม่ส่งผลทาให้รูปทรงเปลี่ยนแปลงรู ปร่ างไปแต่อย่างใด โดยสามารถวาดได้โดยการ
คลิกปุ่ ม Object Drawing ซึ่ งจะปรากฏกรอบสี่ เหลี่ยมขึ้นมาเมื่อเลือกหรื อวาดรู ปทรงเสร็ จ
เมื่อนารู ปทรงแบบ Object Drawing รู ปทรงก็จะมีลกษณะดังเดิม
ั
มาซ้อนทับและคลิกลากออกมา
3.2 การกาหนดคุณสมบัติของรู ปทรง
เริ่ มต้นก่อนที่จะวาดภาพใดๆ อาจกาหนดค่าคุณสมบัติเกี่ยวกับส่ วนของเส้นและพื้นของรู ปทรง แล้วจึงเลือก
ปุ่ มเครื่ องมือ เพื่อวาดภาพต่างๆ ก็ได้ ซึ่ งค่าคุณสมบัติต่างๆ เป็ นดังนี้
 Stroke Color สี เส้น
 Stroke Height ความหนาของเส้น
 Stroke Style รู ปแบบของเส้น
 Custom Stroke Style เลือกกาหนดรู ปแบบเส้นเอง
 Cap รู ปแบบของปลายเส้น สาหรับรู ปทรงแบบปลายเปิ ด โดยมีให้เลือก 3 แบบ ดังนี้

18.  ั ั
None ปลายเส้นมีลกษณะเป็ นเส้นตัดพอดีกบความยาวของเส้น
 Round ปลายเส้นมีลกษณะโค้งมน
ั
 Square ปลายเส้นมีลกษณะเป็ นเส้นตัดออกมา
ั
None Round Square
 Fill Color สี พ้ืน
 Stroke hinting ช่วยลดการเบลอในส่ วนโค้งของเส้นตรง
 Scale ความหนาของเส้นที่สัมผัสกับมุมมอง
 ั
Miter ความแหลมของมุม โดยจะสัมพันธ์กบรู ปแบบของมุมที่กาหนดไว้ในช่อง Join
 Join รู ปแบบของมุม โดยมีให้เลือก 3 แบบ ดังนี้
 Miter มุมแหลม
 Round มุมโค้งมน
 Beval มุมตัด
Miter Round Beval

19. 3.3 การวาดเส้ น
การวาดเส้นสามารถแบ่งได้เป็ นการวาดเส้นตรงด้วย Line Tool และการวาดเส้นอิสระด้วย Pencil Tool โดย
สี ที่ปรากฏขึ้นมาจะเป็ นสี ท่ีเลือกไว้ในช่อง Stroke Color
1) การวาดเส้ นตรงด้ วย Line Tool
การวาดเส้นตรงจะมีรูปแบบการทางานที่ง่าย เพียงเลือกกาหนดสี ขนาดความหนา และลวดลาย จาก
ส่ วนของ Properties ก่อนจากนั้นดาเนินการตามขั้นตอนดังนี้
1. คลิกปุ่ ม Line Tool ที่ทูลพาเนล หรื อกดปุ่ ม N จากนั้นตัวชี้เมาส์จะมีลกษณะเปลี่ยน เป็ น
ั
2. คลิกเมาส์ 1 ครั้ง เพื่อกาหนดจุดเริ่ ม
็
3. ลากเมาส์มายังตาแหน่งและทิศทางที่ตองการ เมื่อปล่อยเมาส์กจะปรากฏเส้นตรงขึ้นมา โดยสามารถ
้
กดปุ่ มค้างไว้ในขณะลากเมาส์ได้ ดังนี้
 ปุ่ ม Shift เปลี่ยนทิศทางของเส้นไปครั้งละ 45 องศา
 ปุ่ ม Alt ให้จุดเริ่ มต้นเป็ นจุดศูนย์กลางของเส้น

20. 2) การวาดเส้ นอิสระด้ วย Pencil Tool
การวาดเส้นอิสระด้วย Pencil Tool ผลงานที่ได้จะมีลกษณะเหมือนกับการใช้ดินสอวาดภาพลงบนกระดาษ
ั
โดยสามารถเลือกปรับให้เป็ นเส้นตรง เส้นโค้ง หรื อเป็ นเส้นอิสระได้
1. คลิกปุ่ ม Pencil Tool ที่พาเนล หรื อกดปุ่ ม Y จากนั้นตัวชี้เมาส์จะมีลกษณะเปลี่ยนเป็ น
ั
2. คลิกปุ่ ม Pencil Mode ค้างไว้ แล้วลากมาทางขวา เลือกปรับปรับรู ปแบบของเส้น
 Straighten ปรับให้เป็ นเส้นตรง
 Smooth ปรับให้เป็ นเส้นโค้ง โดยสามารถปรับความโค้งมนได้ที่ช่อง Smoothing ของ
Properties
 Ink ไม่มีการปรับรู ปแบบใดๆ ให้ภาพใกล้เคียงการวาดมากที่สุด
3. ลากเมาส์วาดรู ปทรงที่ตองการ โดยสามารถกดปุ่ ม Shift ค้างไว้ เพื่อวาดเส้นตรงในแนวตั้งหรื อ
้
แนวนอน

21. 3.4 การวาดรู ปทรงเรขาคณิต
1) วาดรู ปสี่ เหลี่ยมด้ วย Rectangle Tool
การวาดรู ปสี่ เหลี่ยมด้วย Rectangle Tool จะสามารถปรับแต่งเส้น Path ด้วยปุ่ มเครื่ องมือ Pen ได้ แต่จะต้อง
กาหนดค่าความโค้งของมุมก่อนที่จะทาการวาด สาหรับขั้นตอนมีดงนี้ ั
1. คลิกปุ่ ม Rectangle Tool ที่ทูลพาเนล หรื อกดปุ่ ม R จากนั้นตัวชี้เมาส์จะมีลกษณะ
ั
เปลี่ยนเป็ น
2. กาหนดค่าคุณสมบัติพร้อมทั้งความโค้งของมุมทั้ง 4 ของรู ปสี่ เหลี่ยมลงใน Properties โดย
ในที่น้ ีใช้ค่า 0 ซึ่ง จะได้เป็ นสี่ เหลี่ยมมุมฉาก
3. คลิกเมาส์ 1 ครั้ง เพื่อกาหนดจุดเริ่ มต้น
4. ลากเมาส์ทแยงไปยังตาแหน่งและทิศทางที่ตองการ เมื่อปล่อยเมาส์ก็จะปรากฏรู ปสี่ เหลี่ยม
้
ขึ้นมา โดยสามารถกดปุ่ มค้างไว้ในขณะลากเมาส์ได้ ดังนี้
 ปุ่ ม Shift วาดรู ปสี่ เหลี่ยมจัตุรัส
 ปุ่ ม Alt วาดรู ปสี่ เหลี่ยมออกมาจากศูนย์กลาง
 ปุ่ ม  เพิ่มความโค้งของมุม
 ปุ่ ม  ลดความโค้งของมุม
 ปุ่ ม Alt ค้างไว้และคลิกลงบนสเตจ เพื่อกาหนดค่าในการวาดรู ปสี่ เหลี่ยมที่มีขนาด
แน่นอน

22. 2) วาดรู ปสี่ เหลี่ยมพร้ อมปรั บแต่ งรู ปทรงด้ วย Rectangle Primitive Tool
เมื่อวาดรู ปสี่ เหลี่ยมด้วยปุ่ ม Rectangle Primitive Tool จะปรากฏจุดควบคุมขึ้นมา ซึ่ งช่วยให้สามารถ
ปรับแต่งรู ปทรงในภายหลังได้ และหากกดปุ่ มต่างๆ ค้างไว้ก็จะให้ผลเช่นเดียวกับการสร้างรู ปสี่ เหลี่ยมด้วย
ปุ่ ม Rectangle Tool
1. คลิกปุ่ ม Rectangle Primitive Tool ที่ทูลพาเนล หรื อกดปุ่ ม R จากนั้นตัวชี้ เมาส์จะมีลกษณะ
ั
เปลี่ยนเป็ น
2. คลิกเมาส์ 1 ครั้ง เพื่อกาหนดจุดเริ่ มต้น
3. ลากเมาส์ทแยงไปยังตาแหน่งและทิศทางที่ตองการ เมื่อปล่อยเมาส์ก็จะปรากฏรู ปสี่ เหลี่ยมพร้อมทั้ง
้
จุดควบคุมขึ้นมา ซึ่ งสามารถพิมพ์เปลี่ยนค่าความโค้งของมุมทั้ง 4 ลงใน Properties หรื อให้
ดาเนินการตามขั้นตอนที่ 4
4. คลิกปุ่ ม Selection Tool ที่ทูลพาเนล หรื อจะกดปุ่ ม V
5. คลิกบริ เวณมุมของรู ปสี่ เหลี่ยม จากนั้นตัวชี้ เมาส์จะมีลกษณะเปลี่ยนเป็ น
ั
6. ลากเมาส์เข้า-ออกเปลี่ยนความโค้งมนของมุม ได้ตามต้องการ

23. 3) วาดรู ปวงกลมด้ วย Oval Tool
การวาดรู ปวงกลมจะสามารถกาหนดค่าคุณสมบัติต่างๆ พร้อมทั้งค่ามุมเริ่ มต้น มุมสุ ดท้าย และรัศมีวงกลม
ใน รวมถึงกาหนดให้เป็ นรู ปทรงแบบปิ ดหรื อแบบเปิ ดที่มีเฉพาะเส้นก็ได้
1. คลิกปุ่ ม Oval Tool ที่ทูลพาเนล หรื อกดปุ่ ม O จากนั้นตัวชี้เมาส์จะมีลกษณะเปลี่ยน เป็ น
ั
2. กาหนดค่าคุณสมบัติพร้อมทั้งค่ามุมเริ่ มต้น มุมสุ ดท้าย และรัศมีวงกลมในของรู ปวงกลม ลงใน
Properties โดยในที่น้ ีใช้ค่า 0 ซึ่งจะได้เป็ นรู ปวงกลม/วงรี
3. คลิกเมาส์ 1 ครั้ง เพื่อกาหนดจุดเริ่ มต้น
4. ลากเมาส์ทแยงไปยังตาแหน่งและทิศทางที่ตองการ เมื่อปล่อยเมาส์ก็จะปรากฏรู ปวงกลมขึ้นมา
้
 ปุ่ ม Shift วาดรู ปวงกลม
 ปุ่ ม Alt วาดรู ปวงกลมออกมาจากศูนย์กลาง
 ปุ่ ม Alt ค้างไว้และคลิกลงบนสเตจ เพื่อกาหนดค่าในการวาดรู ปวงกลมที่มีขนาด
แน่นอน

24. 4) วาดรู ปวงกลมพร้ อมปรั บแต่ งรู ปทรงด้ วย Oval Primitive Tool
สาหรับรุ ปวงกลมที่สร้างด้วยปุ่ ม Oval Primitive Tool จะสามารถเลือกกาหนดค่าคุณสมบัติหรื อเลือก
ปรับแต่งรู ปทรงจากจุดควบคุมที่ปรากฏขึ้นมาในภายหลังก็ได้
1. คลิกปุ่ ม Oval Primitive Tool ที่ทูลพาเนล หรื อกดปุ่ ม O จากนั้นตัวชี้ เมาส์จะมีลกษณะ
ั
เปลี่ยนเป็ น
2. คลิกเมาส์ 1 ครั้ง เพื่อกาหนดจุดเริ่ มต้น
3. ลากเมาส์ทแยงไปยังตาแหน่งและทิศทางที่ตองการ เมื่อปล่อยเมาส์ก็จะปรากฏรู ปวงกลมพร้อมทั้ง
้
จุดควบคุมขึ้นมา ซึ่ งสามารถพิมพ์เปลี่ยนค่าลงใน Properties หรื อให้ดาเนินการตามขั้นตอนที่ 4
4. คลิกปุ่ ม Selection Tool ที่ทูลพาเนล หรื อจะกดปุ่ ม V

25. 5. คลิกที่จุดควบคุม จากนั้นตัวชี้เมาส์จะมีลกษณะเปลี่ยนเป็ น
ั
6. ลากเมาส์ข้ ึน-ลง เพื่อปรับมุมเริ่ มต้น
7. คลิกที่จุดควบคุม
8. ลากเมาส์ข้ ึน-ลง เพื่อปรับมุมสุ ดท้าย
9. คลิกที่จุดควบคุม
10. ลากเมาส์เข้า-ออก เพื่อปรับรัศมีของวงกลมใน

26. 5) วาดรู ปหลายเหลี่ยม/รู ปดาวด้ วย PolyStar Tool
สาหรับปุ่ ม PolyStar Tool จะช่วยให้สามารถวาดรู ปหลายเหลี่ยมหรื อรู ปดาวได้ตามต้องการ โดยสามารถ
กาหนดด้านหรื อแฉกได้ต้ งแต่ 3-32 ด้าน
ั
1. คลิกปุ่ ม PolyStar Tool ที่ทูลพาเนลจากนั้นตัวชี้เมาส์จะมีลกษณะเปลี่ยนเป็ น
ั
2. ที่ Properties ให้คลิกปุ่ ม จากนั้นปรากฏไดอะล็อกบ็อกซ์ Tool Settings ขึ้นมา
3. ที่ช่อง Style ให้คลิกเลือกรู ปแบบของรู ปทรง โดยมีรายละเอียดดังนี้
o polygon วาดรู ปหลายเหลี่ยม
o star วาดรู ปดาว
4. พิมพ์จานวนด้าน/แฉกลงในช่อง Number of Sides โดยพิมพ์ค่าได้ต้ งแต่ 3-32
ั
5. พิมพ์ค่าความลึกของแฉกดาวลงในช่อง Star point size โดยพิมพ์ค่าได้ต้ งแต่ 0-1 ซึ่ งค่า 0 รู ปดาวจะมี
ั
ความแหลมมากที่สุด
6. คลิกปุ่ ม เพื่อยืนยันคาสัง
่
7. คลิกเมาส์ 1 ครั้ง เพื่อกาหนดจุดเริ่ มต้น
8. ลากเมาส์ทแยงออกมาจากจุดศูนย์กลาง เมื่อปล่อยเมาส์ก็จะปรากฏรู ปหลายเหลี่ยม/รู ปดาว ขึ้นมา

27. 3.5 การใช้ แปรงพู่กน
ั
่ ั
Brush Tool เปรี ยบเสมือนแปรงพูกนที่ใช้วาดภาพลาดเส้นหรื อระบายสี ลงบนรู ปทรงต่างๆ โดยสามารถ
กาหนดขนาดของหัวแปรง ลักษณะของหัวแปรง และรู ปแบบในการระบายสี ได้ดวย ้
1) วาดภาพลายเส้ นด้ วย Brush Tool
การวาดเส้นอิสระด้วย Pencil Tool สี ที่ปรากฏขึ้นมาจะเป็ นสี เส้น (Stroke) แต่สาหรับการวาดภาพลายเส้น
ด้วย Brush Tool จะใช้สีพ้ืน (Fill) แทน สาหรับขั้นตอนมีดงนี้
ั
1. คลิกปุ่ ม Brush Tool ที่ทูลพาเนล หรื อกดปุ่ ม B จากนั้นตัวชี้เมาส์จะมีลกษณะเปลี่ยน เป็ น
ั
2. คลิกปุ่ ม Brush Size ค้างไว้ และเลือกขนาดของหัวแปรง
3. คลิกปุ่ ม Brush Shape ค้างไว้ และเลือกลักษณะของหัวแปรง
4. ลากเมาส์วาดรู ปทรงที่ตองการ โดยสามารถกดปุ่ ม Shift ค้างไว้ เพื่อวาดเส้นตรงในแนวตั้งหรื อ
้
แนวนอน

28. 2) ระบายสี ด้วย Brush Tool
นอกจากการวาดภาพลายเส้นแล้ว Brush Tool ยังสามารถใช้ระบายสี ได้อีก โดยหากกาหนดขนาดและ
ลักษณะของหัวแปรงเรี ยบร้อยแล้ว ก็ยงสามารถเลือกรู ปแบบในการระบายสี ได้ดวย
ั ้
1. คลิกปุ่ ม Brush Tool ที่ทูลพาเนล หรื อกดปุ่ ม B จากนั้นตัวชี้เมาส์จะมีลกษณะเปลี่ยน เป็ น
ั
2. คลิกปุ่ ม Brush Mode ค้างไว้ แล้วเลือกรู ปแบบในการระบายสี
o Paint Normal ระบายทับเส้นและพื้นของรู ปทรง
o Paint Fills ระบายทับเฉพาะส่ วนของพื้นโดยไม่มีผลต่อเส้น
o Paint Behind ระบายเป็ นพื้นหลังโดยไม่มีผลต่อรู ป
o Paint Selection ระบายเฉพาะพื้นของบริ เวณที่เลือกโดยไม่มีผลต่อเส้นและพื้นหลัง
o Paint Inside ระบายภายในขอบเขตของพื้นที่ดานใน
้

29. 3. ลากเมาส์ระบายสี ลงบนรู ปทรงได้ตามต้องการ
Paint Normal Paint Fills Paint Behind
Paint Selection Paint Inside

30. 3.6 การลบรู ปทรง
การลบด้วยปุ่ ม Eraser Tool จะสามารถเลือกลบทั้งรู ปทรงหรื อเลือกลบเฉพาะเส้นหรื อพื้นก็ได้ อีกทั้งยัง
สามารถเลือกเปลี่ยนขนาดและลักษณะของหัวยางลบได้อีกด้วย
1) ลบรู ปทรงด้วย Eraser Tool
เมื่อเลือกลบรู ปทรงด้วย Eraser Tool จะมีรูปแบบในการลบเพิมขึ้นมาให้เลือก เช่น สามารถลบเส้นและพื้น
่
ลบเฉพาะพื้น ลบเฉพาะเส้น ลบเฉพาะส่ วนที่เลือก หรื อลบเฉพาะขอบเขตของพื้นที่ดานในก็ได้ สาหรับ
้
ขั้นตอนมีดงนี้
ั
1. คลิกปุ่ ม Eraser Tool ที่ทูลพาเนล หรื อกดปุ่ ม E จากนั้นตัวชี้เมาส์จะมีลกษณะเปลี่ยน เป็ น
ั
2. คลิกปุ่ ม Eraser Mode ค้างไว้ แล้วเลือกรู ปแบบในการลบ
o Eraser Normal ลบเส้นและพื้นของรู ปทรง
o Eraser Fills ลบเฉพาะส่ วนของพื้นโดยไม่มีผลต่อเส้น
o Eraser Lines ลบเฉพาะส่ วนของเส้นโดยไม่มีผลต่อพื้น
o Eraser Selected Fills ลบเฉพาะพื้นของบริ เวณที่เลือกโดยไม่มีผลต่อเส้น
o Eraser Inside ลบภายในขอบเขตของพื้นที่ดานใน
้
3. คลิกปุ่ ม Eraser Shape ค้างไว้ และเลือกขนาดของหัวยางลบ
4. ลากเมาส์ลบบริ เวณพื้นที่ที่ตองการ
้

31. Eraser Normal Eraser Fills Eraser Lines
Eraser Selected Fills Eraser Inside
2) ลบเส้ น/พืนด้ วย Eraser Tool โดยใช้ ปุ่ม Faucet
้
ไม่เพียงแต่การลบในรู ปแบบปกติเท่านั้น แต่หากต้องการลบเส้นหรื อพื้นของรู ปทรงอย่างรวดเร็ ว ก็สามารถ
ทาได้เพียงคลิกปุ่ ม Faucet ไว้ก่อนเท่านั้น สาหรับขั้นตอนมีดงนี้
ั

32. 1. คลิกปุ่ ม Eraser Tool ที่ทูลพาเนล หรื อกดปุ่ ม E
2. คลิกปุ่ ม Faucet จากนั้นตัวชี้เมาส์จะมีลกษณะเปลี่ยนเป็ น
ั
3. คลิกลงบนเส้นหรื อพื้นของรู ปทรงที่ตองการลบ
้
4. Selection [ การเลือกวัตถุ ]
วัตถุในความหมายนี้ ก็คือ รู ปทรง รู ปภาพ ภาพกราฟิ กที่วาด หรื อนาเข้ามาใช้งานใน Flashนันเอง
่
การเลือกวัตถุ เป็ นขั้นตอนสาคัญในการปรับเปลี่ยน แก้ไข แปลงวัตถุ โดยโปรแกรมเตรี ยมเครื่ องมือเลือก
วัตถุดงนี้
ั
 Selection Tool สาหรับเลือกวัตถุในสภาวะปกติ
 Subselection Tool สาหรับการเลือกวัตถุในโหมดจุดเชื่อม

33.  Lasso Tool สาหรับการเลือกวัตถุที่มีรูปทรงอิสระ หรื อกาหนดขอบเขตการเลือกอิสระรวมทั้ง
การเลือกโดยใช้ค่าสี ที่มีค่าเดียวกันหรื อใกล้เคียงกัน
สิ่ งสาคัญที่สุดในการเลือกวัตถุใน Flash ก็คือ อย่าลืมว่าวัตถุทุกชิ้นเกิดจาก “จุด” หลายๆ จุดมา
ประกอบรวมกัน และแต่ละวัตถุจะประกอบด้วยโครงสร้างอย่างน้อย 2 ส่ วนคือ ส่ วนที่เป็ น “Fill” และส่ วนที่
เป็ น “Stroke” ดังนี้
4.1 การเลือกวัตถุ หรือกลุ่มวัตถุด้วย Selection Tool
 คลิกเลือกเครื่ องมือ Selection Tool
 เลือกวัตถุ โดยยึดหลักดังนี้
 เลือกเส้นขอบของวัตถุ นาเมาส์ไปชี้ที่เส้นขอบวัตถุ แล้วคลิกหรื อ ดับเบิลคลิก

34.  เลือกพื้นวัตถุ นาเมาส์ไปชี้ท่ีพ้ืนวัตถุ แล้วคลิกหรื อ ดับเบิลคลิก
 เลือกวัตถุท้ งชิ้น นาเมาส์ไปชี้ที่วตถุ แล้วดับเบิลคลิก
ั ั
 เลือกวัตถุท้ งชิ้น นาเมาส์ไปชี้ ณ ตาแหน่งมุมของวัตถุ แล้วลากกรอบสี่ เหลี่ยมคลุมวัตถุ
ั
 เลือกวัตถุหลายๆ ชิ้น นาเมาส์ ไปชี้ ณ ตาแหน่งมุมของวัตถุ แล้วลากกรอบสี่ เหลี่ยมคลุมวัตถุ
 เลือกวัตถุหลายๆ ชิ้น คลิกวัตถุชิ้นที่ 1 กดปุ่ ม Shift ค้างไว้ แล้วคลิกวัตถุชิ้นถัดไปเรื่ อยๆ
 เลือกวัตถุทุกชิ้นบน Workspace และ Stage กดปุ่ ม Ctrl + A
4.2 ยกเลิกการเลือกวัตถุ
 นาเมาส์ไปคลิกบนตาแหน่งว่างๆ ของ Stage หรื อ เลือกเมนูคาสั่ง Edit > Deselect All
4.3 ซ่ อนการเลือกวัตถุ
บางครั้งผูใช้อาจจะต้องการซ่ อนการเลือก (Selection) ไว้ชวคราว เพื่อทางานหรื อ
้ ั่
ตรวจสอบผลให้ถูกต้องก่อนการใช้งานจริ ง ซึ่ งกระทาได้โดยเลือกเมนูคาสั่ง View > Hide Edges

35. หรื อกดปุ่ ม Ctrl + H
4.4 การยกเลิกคาสั่ ง (Undo)
เมื่อสั่งงานใดๆ ผิดพลาด สามารถย้อนกลับ หรื อยกเลิกคาสั่งนั้นๆ ได้โดยคลิกปุ่ ม Ctrl + Z
หรื อ Edit > Undo… ซึ่ งสามารถยกเลิกคาสั่งย้อนหลังได้มากกว่า 1 ครั้ง
4.5 ปรับแต่ ง แก้ ไขวัตถุ
จุดเด่นของการสร้างวัตถุดวย Flash ก็คือวัตถุ หรื อกราฟิ กที่สร้างไว้แล้ว สามารถปรับแต่ง
้
แก้ไข ปรับเปลี่ยนรู ปทรง ขนาด และลักษณะได้ง่าย รวดเร็ ว
1) เปลี่ยนรู ปทรง
กราฟิ กจาก Flash เกิดจากการรวมกันของ “จุด” ทาให้การปรับแต่ง เปลี่ยนรู ปทรงกระทา
ได้ง่าย และสะดวก เพียงแต่ใช้หลักการ Drag & Drop ก็ทาให้รูปทรงพื้นฐาน เช่น วงกลม, วงรี ,
สี่ เหลี่ยม เป็ นสภาพเป็ นรู ปทรงอิสระอื่นๆ ได้ตามต้องการ เช่น
การเปลี่ยนรู ปทรงของวัตถุ มีหลักการดังนี้
 วาดรู ปทรงพื้นฐานที่ตองการ จากตัวอย่างคือรู ปสี่ เหลี่ยม
้

36.  เลือกเครื่ องมือ Selection
 นาเมาส์ไปชี้บริ เวณเส้นขอบของรู ป สังเกตเมาส์จะมีรูปร่ างเป็ น กดปุ่ มเมาส์คางไว้ เมื่อลากเมาส์
้
รู ปทรงจะถูกยึดหรื อขยาย หรื อหดตัวตามทิศทางการลากเมาส์
 นาเมาส์ไปชี้บริ เวณมุมเหลี่ยมของรู ป สังเกตเมาส์จะมีรูปร่ างเป็ น กดปุ่ มเมาส์คางไว้ เมื่อลาก
้
เมาส์รูปทรงจะถูกยึดหรื อขยาย หรื อบิดตัวตามทิศทางการลากเมาส์
2) ตัวอย่ างการวาดจรวดแบบง่ าย
1. วาดสี่ เหลี่ยมผืนผ้า
2. เลือกเครื่ องมือ Move เลื่อนไปชี้ที่มุมบนขวาของสี่ เหลี่ยม ดึงเข้ามาตาแหน่งกึ่งกลางของ
ด้านขวา ถ้าดึงแล้วสัดส่ วนบิดเบี้ยวให้คลิก เพือตรึ งตาแหน่งการบิดภาพ จากนั้น ทาซ้ า
่
กับมุมล่างขวา
3. เลื่อนไปชี้ที่ขอบซ้าย แล้วดึงเข้ามาด้านใน ให้ได้เป็ นรู ปจรวดดังตัวอย่าง
3) การย้ ายวัตถุ
 คลิกเลือกเครื่ องมือ Selection Tool
 เลือกวัตถุ แล้วลากเมาส์เพื่อย้ายวัตถุไปยังตาแหน่งใหม่
 เลื่อนวัตถุเป็ นแนวเฉียง 45 องศา ให้กด Shift ด้วย
 เลื่อนวัตถุเป็ นระยะทางสั้นๆ ครั้งละ 1 pixel ให้ใช้ปุ่มลูกศร
 เลื่อนวัตถุเป็ นระยะทางสั้นๆ ครั้งละ 10 pixel ให้ใช้ปุ่มลูกศร พร้อมกับการกด Shift

37.  ั ั
เลื่อนวัตถุไปยังตาแหน่งต่างๆ โดยระบุพิกด ให้ระบุพิกด x, y จาก Shape Propertiesตาแหน่งมุมบน
ั
ซ้ายของ Stage จะมีพิกดเป็ น 0, 0
4) การย่ อ/ขยาย และปรั บรู ปทรงของวัตถุ
 เลือกวัตถุ
 คลิกปุ่ มเครื่ องมือ Free Transform Tool
 นาเมาส์ไปชี้ที่มุม หรื อขอบวัตถุ แล้ว Drag & Drop เพื่อปรับขนาด หรื อรู ปทรงตามต้องการ
 คลิกเลือกจากเมนูคาสั่ง Modify > Transform,… ซึ่ งมีคาสังให้เลือกทั้งคาสั่งหมุนวัตถุ,คาสั่งกลับ
่
ด้านของวัตถุ เป็ นต้น

38. 4.6 การจัดเรียงวัตถุ (Alignment)
่
บางครั้งวัตถุที่ตองใช้งานจะมีมากกว่า 1 ชิ้น ซึ่ งจาเป็ นต้องจัดเรี ยงตาแหน่งให้อยูในแนว
้
ระดับเดียวกัน หากใช้เมาส์ลากแล้วปล่อยโอกาสที่จะตรงกัน หรื อในแนวเดียวกันก็ทาได้ยาก Flash ได้
เตรี ยมคาสั่ง Align เพื่อช่วยจัดเรี ยงวัตถุได้สะดวก รวดเร็ ว
่
1. วาดวัตถุให้อยูนอก Stage
2. เลือกวัตถุดวยเครื่ องมือ Move
้
3. เปิ ด Align Panel
4. คลิก ต่อด้วย และ
4.7 การคัดลอกลักษณะเส้ นขอบวัตถุ
การคัดลอกลักษณะเส้นขอบวัตถุ จะช่วยให้การปรับแต่งแก้ไขวัตถุมากกว่า 1 ชิ้นทาได้
สะดวกกว่าการปรับเปลี่ยนทีละชิ้น ตัวอย่างมีวตถุบน Stage 3 ชิ้นลักษณะต่างๆ กัน ดังภาพ
ั

39. ต้องการให้วงกลม และสี่ เหลี่ยมเส้นขอบดา มีเส้นขอบเดียวกับสี่ เหลี่ยมชิ้นที่สอง ที่มีเส้น
ขอบเป็ นจุดสี แดง หากต้องเลือกแล้วปรับเปลี่ยนทีละชิ้น ก็จะเสี ยเวลามาก วิธีการที่สะดวก คือ
 คลิกเลือกเครื่ องมือ Eyedropper
 นาเมาส์ซ่ ึ งมีรูปร่ างเป็ น Eyedropper ไปชี้ที่เส้นขอบของสี่ เหลี่ยมชิ้นต้นฉบับ (สี่ เหลี่ยมด้านขวาสุ ด)
่
สังเกตได้วาเมาส์จะมีรูปร่ างเป็ น แสดงว่าได้เลือกเส้นขอบวัตถุได้ถูกต้อง เมื่อคลิกเมาส์ 1 ครั้ง
เมาส์จะเปลี่ยนรู ปร่ างเป็ น ่
แสดงว่าขณะนี้ Flash อยูในโหมด Ink Bottle ซึ่งเป็ นโหมดใน
การคัดลอกลักษณะเส้นขอบนันเอง ่
 นาเมาส์ที่เป็ นรู ปร่ าง ไปคลิกบนวัตถุชิ้นอื่นๆ ที่ตองการปรับเปลี่ยนลักษณะเส้นขอบ
้
4.8 กลุ่มวัตถุ (Group)
ภาพกราฟิ กหลายๆ ภาพ ได้จากภาพ หรื อรู ปทรงย่อยหลายๆ ชิ้นมารวมกัน เพื่อให้การ
ปรับแต่งแก้ไข เคลื่อนย้ายกระทาได้สะดวก มักจะรวมภาพกราฟิ ก หรื อรู ปทรงทุกชิ้นที่เกี่ยวข้อง ให้
เป็ นกลุ่มเดียวกันโดยเลือกวัตถุทุกชิ้น แล้วเลือกเมนูคาสั่ง Modify > Group และเมื่อต้องการแยกกลับสู่
สภาพเดิมก็เลือกคาสั่ง Modify > Ungroup
รู ปการ์ ตูนที่เกิดจาก Shape หลายชิ ้นประกอบรวมกัน

40. ปั ญหาจากการย้ าย Shape รู ปที่ยงไม่ ได้ รวมกลุ่ม
ั
รู ปที่ผ่านการรวมกลุ่มแล้ วจะมีเส้ นขอบสี ฟ้าล้ อมรอบ
4.9 การแยกชิ้นส่ วนของวัตถุ
วัตถุบางชิ้นที่เป็ น Group หรื อ Instance เมื่อจะต้องนามาทาเป็ น Movie แบบ Shape
่
Tweening จาเป็ นต้องแยกชิ้นส่ วนของวัตถุให้อยูในสภาวะ “จุด” ก่อนเสมอ ซึ่ งทาได้โดยเลือกวัตถุ
ก่อน จากนั้นจึงใช้เมนูคาสั่ง Modify > Break Apart หรื อกดปุ่ ม Ctrl + B
รู ปภาพในสภาวะกลุ่ม
รู ปภาพที่ผ่านการ Break Apart แล้ ว

41. 4.10 การปรับแต่ งแก้ ไขวัตถุทเี่ ป็ น Group
วัตถุที่อยูในสภาวะ Group สามารถย่อ/ขยาย หมุนได้อิสระ แต่จะไม่สามารถปรับแต่งแก้ไขเกี่ยวกับ
่
สี ได้ หากต้องการปรับเปลี่ยนสี ของวัตถุที่เป็ น Group จะต้องเข้าไปแก้ไขในโหมดจอภาพเฉพาะเกี่ยวกับ
Group ซึ่ งกระทาได้โดยการดับเบิลคลิกที่วตถุน้ นๆ จอภาพจะเข้าสู่ โหมดการแก้ไข Group ซึ่งสังเกตได้จาก
ั ั
 Scene 1 หมายถึงจอภาพในโหมดหลัก
 ่
Group หมายถึงจอภาพในโหมดแก้ไข Group จะสังเกตได้วาวัตถุชิ้นอื่น จะมีสีที่จางไป
จอภาพโหมดปกติ (Scene1) โหมดแก้ ไข Group จะพบว่ าภาพคลื่นทะเลจะจางกว่ าปกติ
เมื่อปรับแต่งแก้ไขวัตถุเรี ยบร้อยแล้ว ให้คลิกที่ Scene 1 เพื่อกลับสู่ โหมดการทางานปกติ
ด้วยทุกครั้ง
5. SYMBOL AND INSTANCE [ซิมโบลและอินสแตนซ์ ]
การสร้าง Movie ด้วย Flash จาเป็ นต้องเกี่ยวข้องกับ Symbol และ Instance ดังนั้นการศึกษาว่า
Symbol และ Instance คืออะไร มีความสาคัญอย่างไร ใช้งานอย่างไร จึงเป็ นสิ่ งสาคัญมาก อย่างไรก็ตาม
Flash มีการกาหนดประเภทของวัตถุไว้หลากหลายลักษณะ โดยสามารถแบ่งได้ดงนี้ ั
 Dot หรือ Part เป็ นส่ วนย่อยที่สุดของวัตถุ มีลกษณะเป็ นจุดเล็กๆ
ั
 Shape เป็ นวัตถุที่เกิดจาก Dot หลาย Dot มาผสมกัน โดยจะเรี ยกวัตถุที่สร้างด้วยเครื่ องมือสร้าง
กราฟิ กพื้นฐานว่า Shape ยกเว้น Text Tool

42.  Group เป็ น Shape หลายๆ ชิ้นที่รวมกันเป็ นชุดเดียว เกิดจากคาสัง Modify, Group รวมทั้งข้อความ
่
จาก Text Tool
 Symbol เป็ นวัตถุที่ถูกแปลงสภาพเพื่อพร้อมสร้าง Movie เกิดจากการแปลงวัตถุต่างๆ รวมถึงการ
่
สร้าง Button, Movie Clip และการนาเข้าภาพจากแหล่งอื่นๆ สามารถตรวจสอบได้วาไฟล์ที่ทางาน
มี Symbol อะไร ประเภทใด จาก Library Panel (เรี ยกด้วยคาสั่ง Window, Library)
 Graphic เป็ น Symbol ภาพนิ่ ง
 Button เป็ น Symbol ปุ่ มกดที่สามารถคลิกได้
 Movie Clip เป็ น Symbol ภาพเคลื่อนไหว
 Instance เป็ น Symbol ที่นามาใช้งานบน Stage

43. 5.1 ตรวจสอบ Symbol สาหรับไฟล์
เมื่อมีการเปิ ดไฟล์หรื อสร้างไฟล์ใดๆ บางครั้งอาจจะไม่ทราบว่าไฟล์น้ นๆ มี Symbol ใด
ั
บ้าง โปรแกรมมีคาสังในการตรวจสอบ Symbol โดยเปิ ด Library Panel ด้วยเมนู Window > Library
่
Library ที่มี Symbol
5.2 แปลงวัตถุเป็ น Symbol
การสร้างภาพเคลื่อนไหวแบบ Motion Tweening หรื อการทาระบบโต้ตอบ จาเป็ นต้อง
ทางานกับ Symbol ดังนั้นวัตถุหรื อภาพกราฟิ กใดๆ ก็ตาม จะต้องแปลงสภาพจาก Shape, Group
หรื อ Picture ให้เป็ น Symbol ก่อนและจะต้องเลือก Behavior ของ Symbol ให้ตรงกับลักษณะการ
ใช้งาน เช่น Symbol ที่ตองการกาหนดให้คลิกได้เพื่อสั่งงานใดๆ จะต้องกาหนดเป็ น Button ภาพ
้
ใดๆ ที่มีการเคลื่อนที่หรื อการเคลื่อนไหว เช่น ล้อรถที่ตองหมุน ควรกาหนดเป็ น Movie Clip หรื อ
้
Symbol ที่แสดงเป็ นเพียงภาพนิ่ง ก็เลือกเป็ น Graphic เป็ นต้น
การแปลงวัตถุให้เป็ น Symbol มีหลักการดังนี้
 วาด/สร้าง หรื อนาเข้าวัตถุ
 เลือกวัตถุ

44.  เลือกคาสัง Modify > Convert to Symbol… หรื อกดปุ่ ม <F8>
่
 ตั้งชื่อในช่อง Name แล้วเลือก Behavior ให้เหมาะสม
 คลิกปุ่ ม OK เพื่อยืนยันการแปลงวัตถุเป็ น Symbol
5.3 การสร้ าง Symbol
นอกจากการแปลงวัตถุให้เป็ น Symbol ด้วยวิธีการดังข้างต้น ยังสามารถเข้าสู่ โหมดการ
สร้าง Symbol ได้โดยตรง ซึ่ งมีข้ นตอนดังนี้
ั
 เลือกคาสัง Insert > New Symbol…
่
 ปรากฏจอภาพ Create New Symbol
 ตั้งชื่อ Symbol และเลือก Behavior จากนั้นคลิกปุ่ ม OK ก็จะปรากฏจอภาพสร้างSymbol ที่มีหน้าตา
คล้ายกับ Stage เกือบทุกอย่าง เพียงแต่จะมีสัญลักษณ์ + อยูก่ ึงกลางจอ เป็ นการระบุตาแหน่งพิกด
่ ั
0,0 เพื่อให้สะดวกต่อการวางตาแหน่ง หรื อสร้างวัตถุ
 เมื่อสร้างวัตถุให้กบ Symbol เรี ยบร้อยแล้วก็คลิกที่ Scene 1 เพื่อกลับสู่ สภาวะการทางานปกติ
ั
 รายละเอียดการสร้าง Movie Clip และ Button Symbol จะกล่าวในหัวข้อถัดไปการสร้าง Symbol
ั
ใดๆ ควรยึดตาแหน่งสัญลักษณ์ + เป็ นจุดเริ่ มต้นของวัตถุ ตาแหน่งพิกด 0,0

45. 5.4 การสร้ างซิมโบลชนิดต่ างๆ
1) การสร้ างซิ มโบลกราฟิ ก
การสร้างซิ มโบลกราฟิ ก จะมีรูปแบบการทางานที่ง่าย เพียงเลือกสร้างซิ มโบลใหม่ จากนั้นจึงสร้างหรื อ
นาเข้าออบเจ็กต์ต่างๆ เพื่อให้กลายเป็ นซิ มโบลกราฟิ ก
1. คลิกเมนู Insert > New Symbol หรื อกดปุ่ ม Ctrl + F8 จากนั้นจะปรากฏไดอะล็อกบ็อกซ์ Create
New Symbol ขึ้นมา
2. พิมพ์ต้ งชื่อซิ มโบลลงในช่อง Name
ั
3. ในส่ วนของ Type ให้คลิกเลือก Graphic
4. คลิกปุ่ ม เพื่อยืนยันคาสั่ง จากนั้นจะเข้าสู่ ชโหมดแก้ไขซิ มโบล
5. สร้างหรื อนาเข้าออบเจ็กต์ที่ตองการให้เป็ นซิมโบล โดยจะปรากฏ ที่ใช้เป็ นจุดอ้างอิงในการวาง
้
ซิ มโบลขึ้นมา
6. คลิกชื่อซีนหรื อคลิกปุ่ ม เพื่อกลับสู่ มูฟวีหลัก
่

46. 7. คลิกเลือกซิ มโบลที่ตองการนามาใช้งาน โดยจะปรากฏตัวอย่างขึ้นมาทางด้านบน
้
8. ลากเมาส์นามาวางบนสเตจ จากนั้นจะปรากฏอินสแตนซ์ข้ ึนมา
2) การสร้ างซิ มโบลปุ่ ม
เมื่อสร้างปุ่ มจะประกอบด้วยเฟรม Up, Over, Down และ Hit ซึ่ งหากนาไปแสดงผลก็จะปรากฏขึ้นมาตาม
สถานะในการทางานของเมาส์ โดยเฟรม Hit ใช้กาหนดขอบเขตที่ตองการให้มีการตอบสนองต่อเมาส์
้
่
ดังนั้นเนื้อหาที่อยูในเฟรมนี้จะไม่ถูกแสดงผลออกมาเมื่อนาไปใช้งานจริ ง
1. คลิกเมนู Insert > New Symbol หรื อกดปุ่ ม Ctrl + F8 จากนั้นจะปรากฏไดอะล็อกบ็อกซ์ Create
New Symbol ขึ้นมา
2. พิมพ์ต้ งชื่อซิ มโบลลงในช่อง Name
ั
3. ในส่ วนของ Type ให้คลิกเลือก Button
4. คลิกปุ่ ม เพื่อยืนยันคาสั่ง จากนั้นจะเข้าสู่ ชโหมดแก้ไขซิ มโบล
5. ที่เฟรม Up ให้สร้างปุ่ มในสถานะปกติที่ยงไม่มีการคลิกเมาส์
ั

47. ่
6. คลิกเฟรม Over และกดปุ่ ม F6 เพื่อสร้างคียเ์ ฟรมใหม่และคัดลอกออบเจ็กต์ที่อยูในเฟรม Up
7. แก้ไขออบเจ็กต์ของเฟรม Over เช่น เปลี่ยนสี เปลี่ยนรู ปทรง เพื่อให้แสดงเป็ นปุ่ มในสถานะที่มีการ
นาเมาส์มาวาง
่
8. คลิกเฟรม Down และกดปุ่ ม F6 เพื่อสร้างคียเ์ ฟรมใหม่และคัดลอกออบเจ็กต์ที่อยูในเฟรม Over
9. แก้ไขออบเจ็กต์ของเฟรม Down เพื่อให้แสดงเป็ นปุ่ มในสถานะที่มีการนาเมาส์มาคลิก

48. ่
10. คลิกเฟรม Down และกดปุ่ ม F6 เพื่อสร้างคียเ์ ฟรมใหม่และคัดลอกออบเจ็กต์ที่อยูในเฟรม Down
11. วาดรู ปทรงกาหนดขอบเขตที่ตองการให้มีการตอบสนองต่อเมาส์
้
12. คลิกชื่อซีนหรื อคลิกปุ่ ม เพื่อกลับสู่ มูฟวีหลัก
่
13. เลือกและลากเมาส์นาซิ มโบลมาวางบนสเตจ จากนั้นจะปรากฏปุ่ มขึ้นมา
14. คลิกเมนู Control > Test Movie หรื อกดปุ่ ม ctrl + Enter เพื่อทดสอบการทางานผ่านทาง Flash
Player

49. 2) การสร้ างซิ มโบลมูฟวี่คลิป
การสร้างซิมโบลมูฟวีคลิปเพื่อให้มีการเคลื่อนไหวในลักษณะต่างๆ เช่น Frame by Frame, Motion Tween,
่
Shape Tween จะต้องทางานผ่านไทม์ไลน์ของมูฟวีคลิป ซึ่ งจะช่วยให้สามารถแบ่งภาพเคลื่อนไหวออกเป็ น
่
ตอนย่อยๆ ได้
1. คลิกเมนู Insert > New Symbol หรื อกดปุ่ ม Ctrl + F8 จากนั้นจะปรากฏไดอะล็อกบ็อกซ์ Create
New Symbol ขึ้นมา
2. พิมพ์ต้ งชื่อซิ มโบลลงในช่อง Name
ั
3. ในส่ วนของ Type ให้คลิกเลือก Movie Clip
4. คลิกปุ่ ม เพื่อยืนยันคาสั่ง จากนั้นจะเข้าสู่ ชโหมดแก้ไขซิ มโบล
5. สร้างหรื อนาออบเจ็กต์ที่ตองการให้เป็ นซิมโบลมูฟวีคลิป
้ ่