Flash
การสร้างสื่อการเรียนรู้ สื่อนำเสนอ หรืองานออกแบบต่างๆ ย่อมจะหนีไม่พ้นการออกแบบ สร้างสรรค์งานกราฟิก หากสามารถสร้างงาน ออกแบบงานกราฟิกด้วยตนเอง คงจะสร้างความ
ภูมิใจได้มาก แต่ปัญหาใหญ่ของการสร้างสรรค์งานกราฟิกของหลายๆ ท่านก็คือ “วาดภาพไม่เป็น”หรือ “สร้างผลงานไม่ได้” แต่ด้วยความสามารถของโปรแกรม Macromedia Flash เครื่องมือช่วยสร้างสรรค์งานกราฟิกที่ง่ายในการเรียนรู้
และประยุกต์ใช้งาน พร้อมๆ กับแนวทางการวาดภาพจากคู่มือฉบับนี้ จะลืมคำว่า “วาดยาก” ไปเลย เนื่องจาก Flash เป็นซอฟต์แวร์สร้างสรรค์งานกราฟิกในฟอร์แมต Vector ที่ภาพกราฟิกทุกภาพประกอบจากเส้นโครงร่างที่ทำให้การปรับแต่ง แก้ไข หรือ
ออกแบบภาพ ทำได้ง่ายด้วยเทคนิค “ตัด เชื่อม ปรับเปลี่ยนรูปร่าง”
Macromedia Flash CS3 เป็นผลิตภัณฑ์ล่าสุดจากค่าย Macromedia ที่พัฒนามาเพื่อสนับสนุนการสร้างงานกราฟิก ทั้งภาพนิ่ง และภาพเคลื่อนไหว สำหรับการนำเสนอผ่านเครือข่ายอินเทอร์เน็ต Flash มีฟังก์ชันช่วยอำนวยความสะดวก ในการสร้างผลงานหลากหลายรูปแบบตลอดจนชุดคำสั่งโปรแกรมมิ่งที่เรียกว่า Flash Action Script ที่เพิ่มประสิทธิภาพในการทำงาน และสามารถคอมไพล์ (Compile) เป็นโปรแกรมใช้งาน (Application Program) เช่น การทำเป็น e-Cardเพื่อแนบไปพร้อมกับ e-Mail ในโอกาสต่างๆ
การเรียกใช้โปรแกรม Flash
การเรียกใช้งานโปรแกรม Flash มีหลักการคล้ายๆ กับการเรียกโปรแกรมทั่วๆ ไปของระบบปฏิบัติการวินโดวส์ โดยเริ่มจากการคลิกปุ่ม Start จากนั้นเลื่อนไปคลิกที่รายการ
Program, Adobe Flash CS3 Professional รอสักครู่จะปรากฏหน้าต่างการทำงาน ซึ่งมีโหมดการทำงานให้เลือกได้หลายลักษณะได้แก่• การเปิดไฟล์จากคำสั่ง Open a Recent Item
• การสร้างงานผลงานจากรายการ Create New
• การสร้างผลงานแม่แบบ Create from Template
จอภาพการทำงานของ Flash
เมื่อคลิกเลือกการสร้างผลงานใหม่ของ Flash จากรายการ Create New Flash File จะ ปรากฏส่วนประกอบจอภาพการทำงานดังนี้
แถบเครื่องมือหลัก (Main Toolbar)
แถบเครื่องมือควบคุมการทำงานหลักของโปรแกรม เช่น การสร้างไฟล์ใหม่, การเปิดไฟล์,
การคัดลอกข้อมูลเป็นต้น โดยสามารถควบคุมให้แสดง หรือไม่ต้องแสดงโดยคลิกเลือกคำสั่ง
Window, Toolbars, Main
แถบเครื่องมือ (Toolbox)
กลุ่มเครื่องมือสร้างงานและจัดการวัตถุ ประกอบด้วยปุ่มเครื่องมือย่อยต่างๆ สามารถเปิด/
ปิดด้วยคำสั่ง Window, Tools โดยสามารถแบ่งเครื่องมือเป็นหมวดๆ ได้ 5 หมวด คือ เครื่องมือ
หมวดเลือกวัตถุ (Selection) เครื่องมือหมวดวาดภาพ (Drawing) เครื่องมือจัดแต่งวัตถุ (Modify)
เครื่องมือควบคุมมุมมอง (View) และเครื่องมือควบคุมสี (Color)
Document Tab
ส่วนควบคุมเอกสาร สามารถคลิกเพื่อสลับเปลี่ยนจอภาพเอกสาร
Timeline & Layer
Timeline เป็นส่วนสำคัญที่ทำหน้าที่ควบคุมการนำเสนอผลงาน สามารถเปิด/ปิดด้วยคำสั่ง
Window, Timeline
Layer ส่วนควบคุมการสร้างชั้นวัตถุ เพื่อให้การควบคุมวัตถุแต่ละชิ้น มีอิสระ และสะดวก
ต่อการแก้ไข ปรับแต่ง
Stage & Workspace
จากรูปตัวอย่างนี้ เมื่อสั่งนำเสนอผลงาน แสดงว่าจะกำหนดให้เรือยังไม่ต้องแสดงผลทันที
บนจอภาพ เพราะเรือถูกนำไปวางไว้ในพื้นที่สีเทา เมื่อนำมาทำเป็น Movie ให้เรือวิ่งผ่านจอภาพไป
อีกด้านหนึ่ง ก็จะปรากฏเรือวิ่งผ่านจอจากด้านซ้ายไปด้านขวาของจอ ตามช่วงเวลาที่กำหนด
Panel
หน้าต่างเล็กๆ ที่ทำหน้าที่แสดงคำสั่งควบคุมย่อยต่างๆ ของโปรแกรม โดยจะปรากฏ
รายการคำสั่งในเมนู Window
ควบคุม Panel
Panel เป็นจอภาพเล็กๆ ที่แสดงฟังก์ชันการทำงานเฉพาะอย่าง เช่น การทำงานเกี่ยวกับสีจะ
ควบคุมด้วย Color Mixer หรือ Color Swatches การจัดตำแหน่งวัตถุต่างๆ ควบคุมด้วย Align Panel
เป็นต้น การเรียกใช้หรือเปิด/ปิด Panel จะใช้คำสั่ง Window แล้วตามด้วยชื่อ Panel นั้นๆ
ทำงานกับไฟล์ Flash
โปรแกรม Flash สามารถสร้างผลงานได้ทั้งภาพนิ่ง ที่เรียกว่า (Still Image) และ
ภาพเคลื่อนไหว ซึ่งจะเรียกว่า Movie ทั้งภาพนิ่ง และภาพเคลื่อนไหว จำเป็นต้องเริ่มต้นจากไฟล์
Flash ต้นฉบับ ที่มีส่วนขยายเป็น .fla จากนั้นจึงบันทึกเป็นไฟล์ภาพใช้งาน สำหรับภาพนิ่ง สามารถ
เลือกบันทึกได้หลายฟอร์แมต เช่น
Adobe Illustrator = .ai
GIF Image = .gif
Bitmap = .bmp
AutoCAD DXF Image = .dxf
Enhanced Metafile = .emf
EPS 3.0 = .eps
JPEG Image = .jpg
PICT = .pct
PNG Image = .png
Windows Metafile = .wmf
ภาพเคลื่อนไหว หรือ Flash Movie สามารถบันทึกในฟอร์แมตที่พร้อมใช้งาน ได้ดังนี้
Flash Movie = .swf
Animation GIF Image = .gif
QuickTime = .mov
Windows AVI = .avi
Execute File = .exe
สร้างไฟล์ใหม่
ไฟล์ Flash ที่สร้างใหม่ทุกครั้ง ควรกำหนดคุณสมบัติให้เหมาะสม ด้วยคำสั่ง Modify
Document เช่น ความกว้าง/ความสูงของ Stage ลักษณะสีพื้นของ Stage เป็นต้น
เปิดไฟล์
การเปิดไฟล์ภาพใช้คำสั่ง File, Open... หรือคลิกปุ่ม Open จากMain Toolbar
นอกจากนี้ยังสามารถเลือกไฟล์ที่เคยเปิดได้จากเมนูคำสั่ง File, Open Recent
การคืนสู่สภาพเดิม (Revert)
ไฟล์ที่กำลังแก้ไข ถ้าต้องการคืนกลับสู่สภาพก่อนการแก้ไข ใช้คำสั่ง File, Revert
ปิดไฟล์
ไฟล์ที่สร้าง หรือเปิดอยู่ หากต้องการปิดไฟล์ สามารถใช้คำสั่ง File, Close หรือ File, Close
All ทั้งนี้ไฟล์ที่ยังไม่ได้ผ่านการบันทึก โปรแกรมจะแสดงกรอบเตือน ถ้าต้องการบันทึกไฟล์ก่อน
ปิด ก็คลิกปุ่ม Yes เพื่อเข้าสู่โหมดการบันทึกไฟล์ แต่ถ้าต้องการปิดไฟล์โดยไม่บันทึกก็คลิกปุ่ม No
หรือคลิกปุ่ม Cancel เพื่อยกเลิกการปิดไฟล์ กลับสู่จอภาพสร้างงานตามปกติ
บันทึกไฟล์
ภาพที่วาดที่สร้างเสร็จแล้ว หรือปรับแต่งแก้ไขแล้ว ควรบันทึกไฟล์เก็บไว้ทุกครั้ง โดยไฟล์
ต้นฉบับจะได้ส่วนขยายเป็น .fla การบันทึกไฟล์สามารถใช้คำสั่ง File, Save… หรือ File, Save
As…
จุดสังเกตว่าไฟล์ได้ผ่านการบันทึกแล้วหรือไม่ ก็ดูได้จากชื่อไฟล์ใน Title Bar หากมี
เครื่องหมาย * แสดงว่ายังไม่ผ่านการบันทึก
การบันทึกเป็นภาพนิ่งใช้งาน
เนื่องจากไฟล์ .fla เป็นไฟล์ต้นฉบับ ไม่สามารถนำไปใช้งานได้ ก่อนนำไฟล์ภาพที่สร้าง
ด้วย Flash ไปใช้งาน จำเป็นต้องบันทึกในฟอร์แมตที่เหมาะสม สำหรับภาพนิ่ง ให้เลือกคำสั่ง File,
Export, Export Image…
ฟอร์แมตของภาพนิ่ง ก็เป็นรายการที่ควรนำมาพิจารณาประกอบ เช่น ถ้าต้องการเป็น
ภาพประกอบสื่อสิ่งพิมพ์ แนะนำให้เลือกเป็น .bmp หรือ .ai แต่ถ้าต้องการใช้บนเว็บไซต์ ก็ควร
เลือกเป็น .gif, .jpg หรือ .png โดยมีหลักในการพิจารณา ดังนี้
• ภาพโครงร่าง หรือภาพที่มีการใช้สีแบบ Solid ให้เลือกเป็น GIF Format
• ภาพที่มีการใช้สีแบบไล่โทน หรือมีการใช้สีจำนวนมาก ให้เลือกเป็น JPEG Format
การบันทึกในฟอร์แมต 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 เลือกจำนวนค่าสีที่เหมาะสมกับภาพ ดังนั้นหากบางภาพมีการใช้สีน้อย ก็
สามารถระบุจำนวนสีที่เหมาะสมได้
• Interlace เลือกเมื่อภาพที่วาดมีขนาดโตกว่า 200 pixel เพื่อกำหนดให้ภาพแสดงผล
แบบโครงร่างก่อน แล้วค่อยๆ ชัดขึ้นเมื่อเวลาผ่านไป
• Transparent เลือกเพื่อกำหนดให้ภาพมีลักษณะของพื้นแบบโปร่งใส
• Smooth เลือกให้ภาพมีลักษณะขอบกระด้าง หรือขอบมน
• Dither solid colors เลือกลักษณะการเกลี่ยสีที่มีลักษณะใกล้เคียงกัน
การบันทึกในฟอร์แมต 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
การบันทึกเป็นภาพเคลื่อนไหว
การบันทึกผลงานของ Flash เป็นภาพเคลื่อนไหว หรือ Flash Movie สามารถเลือกได้สอง
คำสั่ง คือ File, Export, Export Movie… โดยมีหน้าต่างการบันทึก และการเลือกฟอร์แมตคล้ายกับ
การบันทึกภาพนิ่งที่แนะนำไปก่อน นอกจากนี้ยังสามารถเลือกได้จากคำสั่ง File, Publish
Settings… ซึ่งเป็นคำสั่งที่นิยมเลือกใช้มากกว่า กรณีที่เป็นภาพเคลื่อนไหว โดยจะปรากฏหน้าต่าง
ทำงาน ดังนี้
เลือกฟอร์แมตที่ต้องการใช้งาน
• ใช้งานในเครือข่ายอินเทอร์เน็ต ให้คลิกเลือกรายการ Flash และ HTML
• สร้าง Movie ในฟอร์แมต QuickTime ให้เลือกรายการ QuickTime ซึ่งจะได้ไฟล์
Movie ที่มีส่วนขยายเป็น .mov
• สร้าง Movie ที่สามารถนำเสนอได้ทันที โดยไม่ต้องอาศัย Plug-Ins ใดๆ ให้เลือก
รายการ Windows Projector ซึ่งจะได้ไฟล์ที่มีส่วนขยาย .exe หรือเลือกรายการ
Macintosh Projector สำหรับการนำเสนอบนเครื่องคอมพิวเตอร์ Macintosh
เมื่อเลือกรูปแบบไฟล์ที่ต้องการแล้ว ให้คลิกปุ่ม Publish โปรแกรมจะแปลงงานบน Stage
เป็น Movie ตามฟอร์แมตที่เลือก โดยใช้ชื่อไฟล์เดียวกับไฟล์ Flash ต้นฉบับ
ทำงานกับ Stage
Stage เป็นชื่อเรียกพื้นที่สร้างภาพกราฟิกของ Flash นับเป็นพื้นที่สำคัญในการสร้างสรรค์
งานกราฟิก หรือสร้าง Movie มีลักษณะเป็นพื้นที่สี่เหลี่ยมสีขาวล้อมด้วยกรอบสีเทา ภาพกราฟิก
หรือวัตถุใดๆ สามารถวางได้บนพื้นที่สีขาว และสีเทา แต่เมื่อสั่งนำเสนอผลงาน เฉพาะภาพกราฟิก
หรือวัตถุที่วางบนพื้นที่สีขาวเท่านั้น ที่จะแสดงผล
ขนาดของ Stage
ขนาดของ Stage จะหมายถึงพื้นที่การแสดงผลของ Movie นั่นเอง ดังนั้นก่อนสร้างงานควร
กำหนดขนาดของ Stage ให้เหมาะสมและตรงกับการใช้งานจริง การกำหนดขนาดของ Stage กระทำได้โดย
• เลือกคำสั่ง File, New… เพื่อเข้าสู่โหมดการสร้าง Movie
• คลิกเลือกคำสั่ง Modify, Document…
• กำหนดค่าความกว้าง ความสูงของ Stage (หน่วยปกติจะเป็น pixel) จากรายการ Dimensions:
o กรณีที่มีข้อมูลบน Stage สามารถคลิกปุ่ม Match: Printer หรือ Contents เพื่อให้
Flash ปรับขนาดให้เหมาะสมกับข้อมูลโดยอัตโนมัติ
• เลือกสีพื้นของ Stage จากตัวเลือก Background color:
• รายการ Frame rate: เป็นหน่วยวัดการสร้างภาพเคลื่อนไหว หมายถึงในเวลา 1 วินาที
จะต้องมีภาพกี่เฟรม จึงจะทำให้ภาพเคลื่อนไหวมีความสมจริง ถ้ากำหนดน้อยเกินไปก็
จะทำให้มีอาการกระตุก และหากเร็วเกินไปก็จะทำให้สูญเสียรายละเอียด การนำเสนอ
บนเว็บ ค่า 12 เฟรมต่อวินาที เป็นค่าที่เหมาะสมที่สุด แต่การสร้างภาพยนตร์เช่น
QuickTime หรือ AVI จะต้องกำหนดไว้ที่ 24 เฟรมต่อวินาที
• Ruler units: หน่วยวัดของไม้บรรทัด และหน่วยวัดการสร้างวัตถุต่างๆ แนะนำให้ใช้
หน่วยเป็น pixels
การกำหนดขนาดและคุณสมบัติอื่นๆ ของ Stage ยังสามารถเลือกได้จาก Properties Panel
โดยต้องอยู่ในโหมดการใช้เครื่องมือ Selection
ข้อแนะนำการกำหนดขนาดของ Stage
วัตถุประสงค์หลักของการพัฒนา Flash Movie ก็คือการนำไปใช้เป็นองค์ประกอบของ
เว็บไซต์ ในปัจจุบันหน้าเว็บไซต์ที่ถือว่าเป็นมาตรฐานจะมีขนาดที่เหมาะสมกับการแสดงบนจอภาพ
ขนาด 1024 x 768 pixels
ดังนั้นขนาดของ Stage ควรกำหนดให้มีความกว้าง ความสูงสัมพันธ์กับเลย์เอาท์ของหน้าเว็บ
Ruler, Grid, Guides
Ruler, Grid, Guides เครื่องมือช่วยกำหนดขอบเขต และวางตำแหน่งการสร้างกราฟิกบน
Stage โดย
• Ruler แถบไม้บรรทัดจะปรากฏที่ขอบด้านซ้าย และด้านบนของ Stage สามารถ
เปิด/ปิดได้จากคำสั่ง View, Rulers
• Grid มีลักษณะเป็นตารางตาหมากรุก ที่แบ่งเป็นช่องเล็ก ช่วยในการกำหนด
ตำแหน่งในการสร้าง ย่อ/ขยาย หรือเคลื่อนย้ายวัตถุบน Stage สามารถเปิด/ปิดได้จาก
คำสั่ง View, Grids, Show Grids
โดยปกติขนาดของช่องตารางจะมีค่าเท่ากับ 18 × 18 pixels ซึ่งปรับแต่งได้จากคำสั่ง View,
Grids, Edit Grid…
Guide มีลักษณะเป็นเส้นตรงที่ผู้ใช้สามารถกำหนดตำแหน่ง เพื่อช่วยในการกะระยะต่างๆ
ช่วยในการวาดภาพ เคลื่อนย้ายตำแหน่งลักษณะเดียวกับกริด แต่มีความอิสระมากกว่า โดยการ
ทำงานจะต้องอยู่ในสภาวะการเปิดใช้งาน Ruler ก่อนเสมอ จากนั้นนำเมาส์ไปชี้ในแถบไม้บรรทัด
(ด้านใดก็ได้) กดปุ่มเมาส์ค้างไว้ เมื่อลากเมาส์จะปรากฏเส้นตรงสีเขียววาง ณ ตำแหน่งที่ปล่อยเมาส์
การปรับย้ายตำแหน่งเส้นไกด์ กระทำได้โดยคลิกเลือกเครื่องมือ Move แล้วนำเมาส์ไปชี้ที่เส้น
ไกด์ เพื่อปรับย้ายตำแหน่ง
คำสั่งที่เกี่ยวข้องกับแถบไม้บรรทัด, Grids และไกด์ คือคำสั่ง Snap to… ซึ่งมีหลายคำสั่ง
เช่น
• Snap to Grids ช่วยให้การวาด/สร้างวัตถุ, การย่อขยาย หรือย้ายตำแหน่งอิง
เส้นกริดที่กำหนดไว้
• Snap to Guides ช่วยให้การวาด/สร้างวัตถุ, การย่อขยาย หรือย้ายตำแหน่งอิงเส้น
ไกด์ที่กำหนดไว้
• Snap to Objects ช่วยให้การวาด/สร้างวัตถุ, การย่อขยาย หรือย้ายตำแหน่งอิงจุด
กึ่งกลาง (Center Point) ของวัตถุ
การใช้เครื่องมือของ Flash
การสร้างภาพกราฟิกต่างๆ สามารถใช้เครื่องมือกราฟิกจากชุดเครื่องมือ Toolbox โดยมี
เครื่องมือหลายกลุ่ม และเปิด/ปิด Toolbox ได้จากเมนูคำสั่ง Window, Tools
|
Tools Modifier
Tools Modifier เป็นส่วนขยายคำสั่งของเครื่องมือปกติ โดยรายการในส่วนนี้จะปรับเปลี่ยน
ไปตามเครื่องมือที่เลือก ดังนั้นการเลือกเครื่องมือใดๆ ควรตรวจสอบคำสั่งย่อยของเครื่องมือนั้นๆ
จากส่วนควบคุมนี้ด้วยเสมอ
Tool modidier ของเครื่องมือ Tool modidier ของเครื่องมือ
มุมมองจอภาพ
Stage เป็นพื้นที่หลักของการสร้างงาน ดังนั้นเครื่องมือชุดแรกที่ควรทราบ ก็คือเครื่องมือใน
กลุ่ม View ซึ่งจะใช้ในการควบคุม Stage เป็นหลัก เช่น การย่อ/ขยาย Stage การเลื่อน Stage เป็นต้น
Hand tool เป็นเครื่องมือที่ใช้เลื่อนและปรับขนาดของ Stage
o Drag & Drop เพื่อเลื่อน Stage
o ดับเบิลคลิกที่ กำหนดขนาดของ Stage ให้มีขนาดพอดีกับความกว้าง
ของจอภาพ (Fit on screen)
Zoom tool เป็นเครื่องมือปรับขนาดของ Stage
o คลิกที่ จะปรากฏรายการเลือกย่อยที่ Modifier คลิกเลือกรูปแบบการย่อ
หรือขยาย จากนั้นนำเมาส์มาคลิกบน Stage
o ดับเบิลคลิกที่ เพื่อกำหนดให้ Stage มีขนาดเป็น 100% อย่างรวดเร็ว
การควบคุม Stage ยังสามารถใช้ปุ่ม Zoom ที่ปรากฏอยู่มุมบนขวาของ Stage
หรือเลือกจากเมนูคำสั่ง View, Zoom in/Zoom out/Magnifier ได้เช่นเดียวกัน
ทำงานกับสี (Color)
วัตถุใน Flash จะประกอบด้วยส่วนประกอบอย่างน้อยๆ 2 ส่วน ได้แก่ พื้นของวัตถุ
(Background หรือ Fill) และเส้นขอบวัตถุ (Stroke) แต่ละส่วนสามารถแสดงผลด้วยสีที่แตกต่างกัน
ได้ เช่น รูปสี่เหลี่ยมที่มีเส้นขอบสีดำ และพื้นข้างในเป็นสีน้ำเงิน ดังนั้นการทำงานเกี่ยวกับสี จึงเป็น
การทำงานที่จะต้องเกี่ยวข้องตลอดเวลา โดยอาศัยชุดเครื่องมือเลือกสี จาก Toolbox
|
รายละเอียดเกี่ยวกับส่วนควบคุมสีใน Toolbox
|
|
|
รายการเลือก No Color จะแสดงผลเมื่อคลิกเลือกวาดสี่เหลี่ยม หรือวาดวงกลม ดังนั้น
ก่อนเลือกสีให้กับการวาดสี่เหลี่ยม, วงกลม ควรคลิกเลือกเครื่องมือวาดสี่เหลี่ยม หรือวาดวงกลม
ก่อนที่จะคลิกปุ่มเลือกสี ซึ่ฝ เป็นรายการสำคัญมาก และมักจะเป็นรายการที่เข้าใจผิด เช่น ถ้า
ต้องการวาดวงกลมไม่มีสีพื้น หลายๆ ท่าน จะใช้วิธีการเลือก Fill Color ให้กับสีของ Background
เช่น ถ้า Background เป็นสีขาว ก็จะเลือก Fill Color เป็นสีขาว ซึ่งมีความหมายที่ต่างไป
เพิ่มสี
การเพิ่มรายการสี สามารถทำได้โดยคลิกที่เครื่องมือเลือกสี (จะเป็นFill หรือ Stroke) ก็ได้
แล้วคลิกที่ปุ่ม Color Picker ซึ่งปรากฏที่มุมบนขวาของจอภาพแสดงค่าสี
|
2 ปรากฏจอภาพผสมสีใหม่
3 คลิกในช่อง Custom colors
4 ผสมสีตามต้องการ
5 คลิกปุ่ม Add to Custom Colors
การเลือกสีให้กับกราฟิกต่างๆ ที่วาดด้วยเครื่องมือของ Flash นอกจากจะใช้ส่วนควบคุมสีที่
กล่าวไปแล้ว ก็จะมีรายการเลือกสีใน Properties Panel ของเครื่องมือนั้นๆ
แผงควบคุมสี (Color Panel)
Color Panel เป็นการเพิ่มประสิทธิภาพของการทำงานเกี่ยวกับสี โดยเฉพาะในส่วนที่เป็น
การไล่โทนสี (Gradient) เนื่องจากการสร้างชุดสีการไล่โทน ไม่สามารถทำได้จากส่วนควบคุมสี
ปกติ Flash เตรียม Panel เกี่ยวกับสีไว้ 2 ชุดคือ
• Swatches ซึ่งมีการทำงาน/ใช้งานลักษณะเดียวกับ Toolbox
• Color มีส่วนเพิ่มเติมการใช้สีมากกว่าปกติ เช่น การทำสีแบบไล่โทนลักษณะต่างๆ,
การใช้ภาพกราฟิกมาเป็นพื้นของกราฟิก (Texture) รวมทั้งการปรับค่าความโปร่งใส
ของสี (Alpha)
การเลือกรายการจาก Color มีรายการที่น่าสนใจ คือ Fill Type ซึ่งจะช่วยให้ผู้ใช้สามารถ
เลือกรูปแบบของสีได้หลากหลายลักษณะ เช่น สีพื้น (Solid Color), สีไล่โทนแบบเส้นตรง (Linear
Gradient), สีไล่โทนแบบรัศมี (Radial Gradient) และการนำภาพจากภายนอกมาเป็นพื้นของวัตถุ
(Bitmap Background)
ชุดสีแบบไล่โทน
• คลิกเลือกรายการ 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 เพื่อเพิ่มสีที่กำหนด
ให้กับโปรแกรม
ความโปร่งใสของสีวัตถุ (Alpha)
รูปวงกลมไม่ได้กำหนดค่าความโปร่งใส ก็จะซ้อนทับสี่เหลี่ยมแบบไม่เห็นภาพด้านหลัง
แต่ถ้ากำหนดวงกลมให้มีค่าโปร่งใส ก็จะทำให้สีของวงกลมมีลักษณะจาง และมองทะลุไปเห็นรูป
ด้านหลังได้
เครื่องมือวาดภาพ
สี่เหลี่ยม, วงกลม, วงรี
• คลิกเลือกเครื่องมือ Rectangle สามารถคลิกค้างไว้เพื่อเลือกรูปแบบการวาด
• กำหนดสีพื้น, สีเส้นขอบ และลักษณะของเส้นขอบจาก Properties
- กำหนดลักษณะของเส้นขอบวงรี วงกลมได้โดยคลิกปุ่ม Custom... แล้ว
ปรับแต่งลักษณะของเส้นขอบได้จาก Stroke Style Dialog Box ดังภาพ
• นำเมาส์มาคลิก ณ ตำแหน่งที่ต้องการวาดรูป กดปุ่มเมาส์ค้างไว้ แล้วลากเมาส์ เมื่อได้
ขนาดและรูปทรงที่ต้องการ จึงปล่อยนิ้วจากเมาส์
• ถ้าต้องการรูปที่สมบูรณ์ ควรกดปุ่ม <Shift> ค้างไว้ ขณะลากเมาส์
ลบวัตถุด้วย Eraser Tool
วัตถุต่างๆ ที่วาดไว้แล้ว สามารถลบได้ 3 วิธี คือ
• ลบวัตถุทั้งหมดโดยดับเบิลคลิกที่ Eraser Tool
• ลบเฉพาะ Fill หรือ Stroke ของวัตถุ โดย
- คลิกเลือก Eraser Tool
- คลิกที่ปุ่ม Faucet
- นำเมาส์ไปคลิก ณ ตำแหน่งที่ต้องการ
* ถ้าคลิก ณ ตำแหน่ง Stroke โปรแกรมจะลบเส้นขอบของวัตถุออกทั้งหมด
* ถ้าคลิกในพื้นวัตถุ โปรแกรมก็จะลบพื้นวัตถุออกอย่างรวดเร็ว
• ลบวัตถุชิ้นที่ต้องการ โดย
-คลิกเลือก Eraser Tool
- เลือกโหมดการลบโดยคลิกที่
* Erase Normal ลบในสภาวะปกติ คือ ลบทั้ง Stroke และ Fill
* Erase Fills ลบเฉพาะส่วนที่เป็น Fill
* Erase Lines ลบเฉพาะเส้นขอบ Stroke
* Erase Selected Fills ลบเฉพาะส่วนที่เลือกไว้
* Erase Inside ลบเฉพาะส่วนที่เป็น Fill แต่ถ้ามีการลากผ่าน
ตำแหน่งที่เป็น Fill ว่างๆ จะไม่ลบให้
- เลือกลักษณะหรือขนาดของ Eraser โดยคลิกที่
- นำเมาส์มาคลิก หรือลากผ่าน ณ ตำแหน่งที่ต้องการลบ
|
การเลือกวัตถุ (Selection)
วัตถุในความหมายนี้ ก็คือ รูปทรง รูปภาพ ภาพกราฟิกที่วาด หรือนำเข้ามาใช้งานใน Flash
นั่นเอง การเลือกวัตถุ เป็นขั้นตอนสำคัญในการปรับเปลี่ยน แก้ไข แปลงวัตถุ โดยโปรแกรมเตรียม
เครื่องมือเลือกวัตถุดังนี้
Selection Tool สำหรับเลือกวัตถุในสภาวะปกติ
Subselection Tool สำหรับการเลือกวัตถุในโหมดจุดเชื่อม
Lasso Tool สำหรับการเลือกวัตถุที่มีรูปทรงอิสระ หรือกำหนดขอบเขตการ
เลือกอิสระรวมทั้งการเลือกโดยใช้ค่าสีที่มีค่าเดียวกันหรือใกล้เคียงกัน
สิ่งสำคัญที่สุดในการเลือกวัตถุใน Flash ก็คือ อย่าลืมว่าวัตถุทุกชิ้นเกิดจาก “จุด” หลายๆ จุด
มาประกอบรวมกัน และแต่ละวัตถุจะประกอบด้วยโครงสร้างอย่างน้อย 2 ส่วนคือ ส่วนที่เป็น “Fill”
และส่วนที่เป็น “Stroke” ดังนี้
Stroke Fill Shape |
รูปด้านบนนี้ แสดง “จุด” อันเกิดจากการเลือกบางส่วนของวงกลม
การเลือกวัตถุ หรือกลุ่มวัตถุด้วย Selection Tool
• คลิกเลือกเครื่องมือ Selection Tool
• เลือกวัตถุ โดยยึดหลักดังนี้
- เลือกเส้นขอบของวัตถุ
นำเมาส์ไปชี้ที่เส้นขอบวัตถุ แล้วคลิกหรือ ดับเบิลคลิก
- เลือกพื้นวัตถุ นำเมาส์ไปชี้ที่พื้นวัตถุ แล้วคลิกหรือ ดับเบิลคลิก
เลือกเส้นขอบ เลือกพื้นวัตถุ |
- เลือกวัตถุทั้งชิ้น
นำเมาส์ไปชี้ที่วัตถุ แล้วดับเบิลคลิก
- เลือกวัตถุทั้งชิ้น
นำเมาส์ไปชี้ ณ ตำแหน่งมุมของวัตถุ แล้วลากกรอบสี่เหลี่ยมคลุมวัตถุ
- เลือกวัตถุหลายๆ ชิ้น
นำเมาส์ไปชี้ ณ ตำแหน่งมุมของวัตถุ แล้วลากกรอบสี่เหลี่ยมคลุมวัตถุ
การเลือกวัตถุโดยการลากคลุมพื้นที่
- เลือกวัตถุหลายๆ ชิ้น
คลิกวัตถุชิ้นที่ 1 กดปุ่ม Shift ค้างไว้ แล้วคลิกวัตถุชิ้นถัดไปเรื่อยๆ
- เลือกวัตถุทุกชิ้นบน Workspace และ Stage
กดปุ่ม Ctrl + A
ยกเลิกการเลือกวัตถุ
นำเมาส์ไปคลิกบนตำแหน่งว่างๆ ของ Stage หรือ เลือกเมนูคำสั่ง Edit, Deselect All
ซ่อนการเลือกวัตถุ
บางครั้งผู้ใช้อาจจะต้องการซ่อนการเลือก (Selection) ไว้ชั่วคราว เพื่อทำงานหรือ
ตรวจสอบผลให้ถูกต้องก่อนการใช้งานจริง ซึ่งกระทำได้โดยเลือกเมนูคำสั่ง View, Hide Edges
หรือกดปุ่ม Ctrl + H
การยกเลิกคำสั่ง (Undo)
เมื่อสั่งงานใดๆ ผิดพลาด สามารถย้อนกลับ หรือยกเลิกคำสั่งนั้นๆ ได้โดยคลิกปุ่ม Ctrl + Z
หรือ Edit, Undo… ซึ่งสามารถยกเลิกคำสั่งย้อนหลังได้มากกว่า 1 ครั้ง
ปรับแต่ง แก้ไขวัตถุ
จุดเด่นของการสร้างวัตถุด้วย Flash ก็คือวัตถุ หรือกราฟิกที่สร้างไว้แล้ว สามารถปรับแต่ง
แก้ไข ปรับเปลี่ยนรูปทรง ขนาด และลักษณะได้ง่าย รวดเร็ว
เปลี่ยนรูปทรง
กราฟิกจาก Flash เกิดจากการรวมกันของ “จุด” ทำให้การปรับแต่ง เปลี่ยนรูปทรงกระทำ
ได้ง่าย และสะดวก เพียงแต่ใช้หลักการ Drag & Drop ก็ทำให้รูปทรงพื้นฐาน เช่น วงกลม, วงรี,
สี่เหลี่ยม เป็นสภาพเป็นรูปทรงอิสระอื่นๆ ได้ตามต้องการ เช่น
การเปลี่ยนรูปทรงของวัตถุ มีหลักการดังนี้
• วาดรูปทรงพื้นฐานที่ต้องการ จากตัวอย่างคือรูปสี่เหลี่ยม
• เลือกเครื่องมือ Selection
• นำเมาส์ไปชี้บริเวณเส้นขอบของรูป สังเกตเมาส์จะมีรูปร่างเป็น กดปุ่มเมาส์ค้างไว้
เมื่อลากเมาส์รูปทรงจะถูกยึดหรือขยาย หรือหดตัวตามทิศทางการลากเมาส์
• นำเมาส์ไปชี้บริเวณมุมเหลี่ยมของรูป สังเกตเมาส์จะมีรูปร่างเป็น กดปุ่มเมาส์ค้าง
ไว้ เมื่อลากเมาส์รูปทรงจะถูกยึดหรือขยาย หรือบิดตัวตามทิศทางการลากเมาส์
ตัวอย่างการวาดจรวดแบบง่าย
1. วาดสี่เหลี่ยมผืนผ้า 2. เลือกเครื่องมือ Move เลื่อนไปชี้ที่มุมบนขวา
ของสี่เหลี่ยม ดึงเข้ามาตำแหน่งกึ่งกลางของ
ด้านขวา ถ้าดึงแล้วสัดส่วนบิดเบี้ยวให้คลิก
เพื่อตรึงตำแหน่งการบิดภาพ จากนั้น ทำซ้ำกับ
มุมล่างขวา
3. เลื่อนไปชี้ที่ขอบซ้าย แล้วดึงเข้า
มาด้านใน ให้ได้เป็นรูปจรวดดัง
ตัวอย่าง
การย้ายวัตถุ
• คลิกเลือกเครื่องมือ Selection Tool
• เลือกวัตถุ แล้วลากเมาส์เพื่อย้ายวัตถุไปยังตำแหน่งใหม่
• เลื่อนวัตถุเป็นแนวเฉียง 45 องศา ให้กด Shift ด้วย
• เลื่อนวัตถุเป็นระยะทางสั้นๆ ครั้งละ 1 pixel ให้ใช้ปุ่มลูกศร
• เลื่อนวัตถุเป็นระยะทางสั้นๆ ครั้งละ 10 pixel ให้ใช้ปุ่มลูกศร พร้อมกับการกด Shift
• เลื่อนวัตถุไปยังตำแหน่งต่างๆ โดยระบุพิกัด ให้ระบุพิกัด x, y จาก Shape Properties
ตำแหน่งมุมบนซ้ายของ Stage จะมีพิกัดเป็น 0, 0
การย่อ/ขยาย และปรับรูปทรงของวัตถุ
• เลือกวัตถุ
• คลิกปุ่มเครื่องมือ Free Transform Tool
วัตถุสภาวะปกติ วัตถุในสภาวะ Free Transform
• นำเมาส์ไปชี้ที่มุม หรือขอบวัตถุ แล้ว Drag & Drop เพื่อปรับขนาด หรือรูปทรงตามต้องการ
• คลิกเลือกจากเมนูคำสั่ง Modify, Transform,… ซึ่งมีคำสั่งให้เลือกทั้งคำสั่งหมุนวัตถุ,
คำสั่งกลับด้านของวัตถุ เป็นต้น
ภาพต้นฉบับ Distort
Envelop Skew
การจัดเรียงวัตถุ (Alignment)
บางครั้งวัตถุที่ต้องใช้งานจะมีมากกว่า 1 ชิ้น ซึ่งจำเป็นต้องจัดเรียงตำแหน่งให้อยู่ในแนว
ระดับเดียวกัน หากใช้เมาส์ลากแล้วปล่อยโอกาสที่จะตรงกัน หรือในแนวเดียวกันก็ทำได้ยาก Flash
ได้เตรียมคำสั่ง Align เพื่อช่วยจัดเรียงวัตถุได้สะดวก รวดเร็ว
1. วาดวัตถุให้อยู่นอก Stage 2. เลือกวัตถุด้วยเครื่องมือ Move 3. เปิด Align Panel
4. คลิก ต่อด้วย และ
การคัดลอกลักษณะเส้นขอบวัตถุ
การคัดลอกลักษณะเส้นขอบวัตถุ จะช่วยให้การปรับแต่งแก้ไขวัตถุมากกว่า 1 ชิ้นทำได้
สะดวกกว่าการปรับเปลี่ยนทีละชิ้น ตัวอย่างมีวัตถุบน Stage 3 ชิ้นลักษณะต่างๆ กัน ดังภาพ
ต้องการให้วงกลม และสี่เหลี่ยมเส้นขอบดำ มีเส้นขอบเดียวกับสี่เหลี่ยมชิ้นที่สอง ที่มีเส้น
ขอบเป็นจุดสีแดง หากต้องเลือกแล้วปรับเปลี่ยนทีละชิ้น ก็จะเสียเวลามาก วิธีการที่สะดวก คือ
• คลิกเลือกเครื่องมือ Eyedropper
• นำเมาส์ซึ่งมีรูปร่างเป็น Eyedropper ไปชี้ที่เส้นขอบของสี่เหลี่ยมชิ้นต้นฉบับ (สี่เหลี่ยม
ด้านขวาสุด) สังเกตได้ว่าเมาส์จะมีรูปร่างเป็น แสดงว่าได้เลือกเส้นขอบวัตถุได้
ถูกต้อง เมื่อคลิกเมาส์ 1 ครั้งเมาส์จะเปลี่ยนรุปร่างเป็น แสดงว่าขณะนี้ Flash อยู่ใน
โหมด Ink Bottle ซึ่งเป็นโหมดในการคัดลอกลักษณะเส้นขอบนั่นเอง
• นำเมาส์ที่เป็นรูปร่าง ไปคลิกบนวัตถุชิ้นอื่นๆ ที่ต้องการปรับเปลี่ยนลักษณะเส้นขอบ
กลุ่มวัตถุ (Group)
ภาพกราฟิกหลายๆ ภาพ ได้จากภาพ หรือรูปทรงย่อยหลายๆ ชิ้นมารวมกัน เพื่อให้การ
ปรับแต่งแก้ไข เคลื่อนย้ายกระทำได้สะดวก มักจะรวมภาพกราฟิก หรือรูปทรงทุกชิ้นที่เกี่ยวข้อง ให้
เป็นกลุ่มเดียวกันโดยเลือกวัตถุทุกชิ้น แล้วเลือกเมนูคำสั่ง Modify, Group และเมื่อต้องการแยกกลับ
สู่สภาพเดิมก็เลือกคำสั่ง Modify, Ungroup
รูปการ์ตูนที่เกิดจาก Shape หลายชิ้นประกอบรวมกัน
ปัญหาจากการย้าย Shape รูปที่ยังไม่ได้รวมกลุ่ม
รูปที่ผ่านการรวมกลุ่มแล้วจะมีเส้นขอบสีฟ้าล้อมรอบ
การแยกชิ้นส่วนของวัตถุ
วัตถุบางชิ้นที่เป็น Group หรือ Instance เมื่อจะต้องนำมาทำเป็น Movie แบบ Shape
Tweening จำเป็นต้องแยกชิ้นส่วนของวัตถุให้อยู่ในสภาวะ “จุด” ก่อนเสมอ ซึ่งทำได้โดยเลือกวัตถุ
ก่อน จากนั้นจึงใช้เมนูคำสั่ง Modify, Break Apart หรือกดปุ่ม Ctrl + B
รูปภาพในสภาวะกลุ่ม
รูปภาพที่ผ่านการ Break Apart แล้ว
การปรับแต่งแก้ไขวัตถุที่เป็น Group
วัตถุที่อยู่ในสภาวะ Group สามารถย่อ/ขยาย หมุนได้อิสระ แต่จะไม่สามารถปรับแต่งแก้ไข
เกี่ยวกับสีได้ หากต้องการปรับเปลี่ยนสีของวัตถุที่เป็น Group จะต้องเข้าไปแก้ไขในโหมดจอภาพ
เฉพาะเกี่ยวกับ Group ซึ่งกระทำได้โดยการดับเบิลคลิกที่วัตถุนั้นๆ จอภาพจะเข้าสู่โหมดการแก้ไข
Group ซึ่งสังเกตได้จาก
• Scene 1 หมายถึงจอภาพในโหมดหลัก
• Group หมายถึงจอภาพในโหมดแก้ไข Group จะสังเกตได้ว่าวัตถุชิ้นอื่น จะมีสีที่
จางไป
จอภาพโหมดปกติ (Scene1)
โหมดแก้ไข Group จะพบว่าภาพคลื่นทะเลจะจางกว่าปกติ
เมื่อปรับแต่งแก้ไขวัตถุเรียบร้อยแล้ว ให้คลิกที่ Scene 1 เพื่อกลับสู่โหมดการทำงานปกติด้วยทุกครั้ง
การหัดวาดภาพ
เมื่อรู้จักโปรแกรมและเครื่องมือต่างๆ ของ Flash แล้ว ก็จะเข้าสู่บทเรียนฝึกหัดวาดภาพ ซึ่ง
มีหลักที่ไม่ยากอย่างที่คิด ขอให้นึกถึงหลัก “เชื่อม ตัด ปรับเปลี่ยน” เท่านั้นก็พอ
แผนที่
การวาดแผนที่แสดงเส้นทาง โดยอาศัยหลักการเชื่อมและตัด
• วาดเส้น ให้มีลักษณะ ดังนี้
• จากภาพจะพบว่าเป็นการนำกรอบสี่เหลี่ยมหลายขนาดมาวางซ้อนกันทับ ลักษณะนี้คือ
การใช้เทคนิค “เชื่อม” การที่จะทำให้มีลักษณะเป็นเส้นทางแผนที่ จะต้องตัดส่วน
บางส่วนของกรอบสี่เหลี่ยมออกไป ดังนี้
- การตัดส่วนดังกล่าวทิ้ง เริ่มจากการเลือกเครื่องมือ Selection
- นำเมาส์ไปคลิก ณ ส่วนที่ต้องการตัด จะพบว่าส่วนที่เลือกมีลักษณะเป็น “จุดเล็กๆ
หลายจุด” ดังตัวอย่าง
- จากนั้นกดปุ่ม Del เพื่อลบส่วนที่เลือก จะปรากฏผลดังนี้
- ทำซ้ำกับส่วนอื่น ที่ต้องการลบ โดยการใช้เครื่องมือ Selection เลือกก่อนแล้วกดปุ่ม Del เพื่อลบทิ้ง
หน้าคนจากวงกลมและเส้นตรง
วาดวงกลม วาดเส้นตรงผ่าน เลือกเครื่องมือ Selection เลื่อนเมาส์
ส่วนบนของวงกลมใน ไปชี้ที่เส้นตรง ให้เมาส์มีรูปร่างเป็น
ลักษณะเฉียงดังภาพ กดปุ่มเมาส์ค้างไว้ แล้วดึงให้เส้น
มีลักษณะโค้ง
คลิกเลือกเส้นที่อยู่นอกวงกลม เลือกสีผม แล้วเติมสี วาดตา จมูก และปากด้วยเครื่องมือ
กดปุ่ม = เพื่อลบทิ้ง วาดเส้น หรือ ดินสอ แล้วปรับให้มี
ความโค้งตามต้องการ
หน้าคนจากหลายๆ วัตถุ
เด็กชายสวมหมวก
เด็กหญิง
คนสูงอายุ
ดวงอาทิตย์
รองเท้าสเก็ต
ถุงเท้าเด็ก
ใบไม้
หมวก
ต้นคริสมาตส์
ต้นไม้
ดอกไม้
ดินสอ
ตุ๊กตาหมี
ฮิปโป
ผลไม้การ์ตูน
สตอร์เบอร์รี่
Symbol และ Instance
การสร้าง Movie ด้วย Flash จำเป็นต้องเกี่ยวข้องกับ Symbol และ Instance ดังนั้นการศึกษา
ว่า Symbol และ Instance คืออะไร มีความสำคัญอย่างไร ใช้งานอย่างไร จึงเป็นสิ่งสำคัญมาก
อย่างไรก็ตาม Flash มีการกำหนดประเภทของวัตถุไว้หลากหลายลักษณะ โดยสามารถแบ่งได้ดังนี้
• Dot หรือ Part เป็นส่วนย่อยที่สุดของวัตถุ มีลักษณะเป็นจุดเล็กๆ
• Shape เป็นวัตถุที่เกิดจาก Dot หลาย Dot มาผสมกัน โดยจะเรียกวัตถุที่
สร้างด้วยเครื่องมือสร้างกราฟิกพื้นฐานว่า Shape ยกเว้น Text Tool
• 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
ภาพโหมด Shape/Dot โหมด Group โหมด Instance/Symbol
มีลักษณะเป็นจุด มีกรอบสีล้อมรอบ มีจุดกึ่งกลางกลมและกากบาทกำกับ
ตรวจสอบ Symbol สำหรับไฟล์
เมื่อมีการเปิดไฟล์หรือสร้างไฟล์ใดๆ บางครั้งอาจจะไม่ทราบว่าไฟล์นั้นๆ มี Symbol ใด
บ้าง โปรแกรมมีคำสั่งในการตรวจสอบ Symbol โดยเปิด Library Panel ด้วยเมนู Window, Library
Library ที่มี Symbol
แปลงวัตถุเป็น Symbol
การสร้างภาพเคลื่อนไหวแบบ Motion Tweening หรือการทำระบบโต้ตอบ จำเป็นต้อง
ทำงานกับ Symbol ดังนั้นวัตถุหรือภาพกราฟิกใดๆ ก็ตาม จะต้องแปลงสภาพจาก Shape, Group
หรือ Picture ให้เป็น Symbol ก่อนและจะต้องเลือก Behavior ของ Symbol ให้ตรงกับลักษณะการ
ใช้งาน เช่น Symbol ที่ต้องการกำหนดให้คลิกได้เพื่อสั่งงานใดๆ จะต้องกำหนดเป็น Button ภาพ
ใดๆ ที่มีการเคลื่อนที่หรือการเคลื่อนไหว เช่น ล้อรถที่ต้องหมุน ควรกำหนดเป็น Movie Clip หรือ
Symbol ที่แสดงเป็นเพียงภาพนิ่ง ก็เลือกเป็น Graphic เป็นต้น
การแปลงวัตถุให้เป็น Symbol มีหลักการดังนี้
• วาด/สร้าง หรือนำเข้าวัตถุ
• เลือกวัตถุ
• เลือกคำสั่ง Insert, Convert to Symbol… หรือกดปุ่ม <F8>
• ตั้งชื่อในช่อง Name แล้วเลือก Behavior ให้เหมาะสม
• คลิกปุ่ม OK เพื่อยืนยันการแปลงวัตถุเป็น
การสร้าง 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
Symbol และ Instance
วัตถุที่พร้อมสำหรับการสร้าง Movie ลักษณะต่างๆ รวมถึงการลงรหัส ActionScript เพื่อทำ
ระบบโต้ตอบ (Interactive) เมื่อมีการสร้างและเก็บไว้ใน Library จะเรียกว่า Symbol แต่เมื่อนำ
Symbol มาวางใช้งานบน Stage จะเรียกว่า Instance ทั้งนี้ Instance จะเปรียบเสมือนตัวแทนของ
Symbol หากมีการแก้ไข Instance จะไม่มีผลกระทบต่อ Symbol แต่ถ้าแก้ไข Symbol ตัวแทนหรือ
Instance ทุกตัวที่เกิดจาก Symbol นั้นๆ จะถูกแก้ไขตามไปโดยอัตโนมัติ
การเรียกใช้ Symbol
การนำ Symbol จาก Library มาใช้งาน กระทำได้โดยการเปิด Library Panel แล้วคลิกเลือก
Symbol ชิ้นที่ต้องการ ลากมาวางบน Stage และ Symbol จะเปลี่ยนสถานะเป็น Instance ทันที
เรียกใช้ Symbol สำเร็จรูปของโปรแกรม
โปรแกรมได้เตรียม Symbol สำเร็จรูปเพื่อสะดวกต่อการสร้างงาน โดยเรียกใช้ได้จากเมนู
คำสั่ง Window, Other Panels, Common Libraries… ซึ่งมี Library สำเร็จรูปให้เลือกใช้ได้ 3 กลุ่ม
เมื่อเลือก Symbol ที่ต้องการได้แล้ว ก็สามารถนำมาวางบน Stage โดยการนำเมาส์ชี้ที่ Symbol นั้น
แล้วลากออกจาก Library มาวางบน Stage ได้เลย และ Symbol จะเปลี่ยนสถานะเป็น Instance ทันที
เรียกใช้ Symbol จากไฟล์อื่น
จุดเด่นของ Symbol คือ สามารถโอนใช้งานได้กับไฟล์อื่น หรือเรียกใช้ Symbol จากไฟล์
อื่น โดยมีหลักการดังนี้
• เปิดไฟล์เอกสารที่ต้องการสร้างงาน
• เรียกใช้คำสั่ง File, Import, Open External Library…
• เลือกไฟล์ที่ต้องการนำ Library มาใช้งาน
• โปรแกรมจะเปิด Library มาให้เลือกทำงาน เมื่อเลือกใช้ Symbol ๆ นั้นจะถูกโอนไปยัง
ไฟล์เอกสารปัจจุบันโดยอัตโนมัติ
แก้ไข Symbol
Symbol ที่สร้างไว้แล้ว สามารถปรับเปลี่ยนแก้ไขได้ โดย
• เปิด Library Panel ดับเบิลคลิกที่ชื่อ Symbol ชิ้นที่ต้องการแก้ไข หรือกรณีที่มี Instance
ของ Symbol ปรากฏบน Stage ก็สามารถดับเบิลคลิกที่ Instance นั้นๆ ได้ทันที
• ปรากฏหน้าต่างการทำงานในโหมดแก้ไข Symbol โดยสังเกตได้ว่าตรงกลางจอภาพ มี
สัญลักษณ์ + และปรากฏชื่อหน้าต่างเป็นชื่อ Symbol นั้นที่มุมบนซ้ายของ Stage
• แก้ไข Symbol เหมือนกับการแก้ไขวัตถุปกติทั่วไป
• เมื่อแก้ไขเรียบร้อยแล้ว สามารถกลับมาทำงานในโหมดปกติได้โดยคลิกที่ชื่อ Scene1
(หรือ Scene หมายเลขใดๆ ก็ได้ตามลักษณะของชิ้นงาน)
หมายเหตุ การแก้ไข Symbol จะส่งผลต่อ Instance ที่เกิดจาก Symbol นั้นๆ ทุก Instance ที่นำมาใช้
งานบน Stage
แก้ไข Instance
Instance เปรียบเสมือนวัตถุชิ้นหนึ่ง ซึ่งสามารถใช้คำสั่งจัดการวัตถุ มาดำเนินการ
ปรับเปลี่ยนได้ โดยไม่ส่งผลกระทบต่อ Symbol ต้นฉบับ โดยมีวิธีจัดการดังนี้
วิธีที่ 1
• คลิกเลือก Instance
• ใช้เครื่องมือ Arrow ปรับขนาดหรือหมุนวัตถุ
วิธีที่ 2
• คลิกเลือก Instance
• กำหนดลักษณะของสีที่ต้องการจาก Instance Properties
* Brightness ความสว่าง
* Tint การปรับแก้ไขสี/ความโปร่งแสง
* Alpha การปรับแก้ไขความโปร่งแสง
* Advanced การปรับแก้ไขสีและค่าความโปร่งแสงแบบ Advanced
เฟรมและ Timeline
การสร้างภาพยนต์ หรือภาพเคลื่อนไหวใด ก็คือการสร้างอิริยาบถของภาพให้มีการ
เปลี่ยนแปลงไปตามช่วงเวลา เช่น การวาดการ์ตูนลงกระดาษแต่ละใบ ให้มีอิริยาบถแตกต่างกันไป
เมื่อนำการ์ตูนทุกภาพมาแสดงอย่าง รวดเร็ว ก็จะทำให้ภาพมีลักษณะเป็นภาพเคลื่อนไหว เมื่อมีการ
นำคอมพิวเตอร์มาใช้สร้างสรรค์ภาพยนต์ หรือภาพเคลื่อนไหว เฟรมก็เปรียบเสมือนกระดาษแต่ละ
ใบ ที่มีการวาดอิริยาบถของการ์ตูนลงไป และ Timeline ก็คือช่วงเวลาที่ใช้ควบคุมการนำเสนอ
ดังนั้น Frame และ Timeline จึงเป็นส่วนสำคัญอีกส่วนในการสร้างภาพเคลื่อนไหวของ Flash โดยมี
ลักษณะหน้าต่าง ดังนี้
Timeline
เปรียบเสมือนเวลาที่ใช้ในการสร้างภาพเคลื่อนไหว หรือ Movie โปรแกรมจะแบ่งช่วงให้
หน่วยละ 5 ช่วงเวลา
เฟรม
คือช่องเล็กที่เรียงต่อกันตามช่วงเวลา แต่จะช่องเปรียบเสมือนกระดาษ 1 แผ่นที่วาด Movie
1 อิริยาบถ และเปลี่ยนไปทุกๆ เฟรม เพื่อให้เกิดการเคลื่อนไหวของวัตถุ เช่น เฟรมช่องที่ 1 วาด
วงกลมไว้ริมซ้ายสุดของ Stage เฟรมที่ 2 วาดวงกลม ให้เลื่อนมาด้านขวานิดหนึ่ง และทำซ้ำๆ ไปเรื่อยๆ
ซึ่ง เป็นการสร้าง Movie ให้วงกลมวิ่งจากด้านซ้ายมาด้านขวานั่นเอง
Playhead
ตำแหน่งของเฟรมปัจจุบันที่จะปรากฏบน Stage
เฟรม และคีย์เฟรม (Frame & Keyframe)
คีย์เฟรม คือ การกำหนดตำแหน่งการสร้างภาพเคลื่อนไหวที่มีเนื้อหาภายในแตกต่างกันไป
โดยตำแหน่งเฟรมใดที่ต้องการกำหนดให้มีสถานะเป็น Keyframe ให้ใช้คำสั่ง Insert, Timeline, Keyframe
เฟรม คือ การกำหนดตำแหน่งภาพที่ไม่มีการเปลี่ยนแปลง ไม่มีการเคลื่อนไหว เช่นการทำ
ฉากหลัง โดยตำแหน่งเฟรมใดที่ต้องการกำหนดให้มีสถานะเป็น Frame ให้ใช้คำสั่ง Insert, Timeline, Frame
ควบคุมเฟรม
การควบคุมเฟรม เช่น การใส่คีย์เฟรม หรือแทรกเฟรม นอกจากใช้คำสั่งจากเมนู Insert ยัง
สามารถใช้ Context Menu ซึ่งเป็นวิธีที่สะดวกกว่า โดยคลิกขวาในเฟรมที่ต้องการ แล้วเลือกคำสั่งที่ต้องการ
ลบเฟรม
• เลือกเฟรมที่ต้องการลบ (สามารถใช้การคลิกเมาส์ขวาในเฟรมที่ต้องการ)
• เลือกคำสั่ง Remove, Frames
Movie File
Movie คือ ภาพนิ่งหรือภาพเคลื่อนไหวที่สร้างด้วย Flash โดยมีลักษณะการสร้าง 3 รูปแบบ คือ
• Movie แบบ Frame by frame เป็น Movie ที่มีการเปลี่ยนแปลงของวัตถุตลอดเวลา
และวัตถุมีการเปลี่ยนแปลงที่ไม่ต่อเนื่อง หรือเปลี่ยนแปลงทุกส่วนอย่างไม่สม่ำเสมอ
ไม่เป็นมาตรฐาน เช่น ดอกไม้บาน, การงอกของต้นไม้, การบินของนก, การเดินของ
สัตว์ การสร้างจะต้องสร้างต้นแบบงานหลายชิ้น การสร้าง Movie แบบนี้วัตถุที่นำมา
สร้างจะอยู่ในสถานะใดก็ได้
• Movie แบบ Motion Tweening เป็น Movie ที่อาศัยหลักการเปลี่ยนรูปทรง ขนาดโดย
การคำนวณของโปรแกรม การสร้างกระทำได้ง่าย โดยสร้างเฉพาะภาพแรก กับภาพ
สุดท้าย โปรแกรม Flash จะเติมขบวนการเปลี่ยนแปลงให้โดยอัตโนมัติ เช่น ลูกบอล
ตกจากที่สูงมากระทบพื้น, การบินของเครื่องบิน, การหมุนรอบวัตถุใดๆ การสร้าง
Movie แบบนี้ วัตถุจะต้องอยู่ในสถานะ Symbol ก่อน
• Movie แบบ Shape Tweening เป็น Movie ที่วัตถุมีการเปลี่ยนแปลงรูปทรง รูปร่างจาก
รูปต้นฉบับไปอย่างสิ้นเชิง เช่น เปลี่ยนจากสี่เหลี่ยมเป็นวงกลม, เปลี่ยนจากไข่นก เป็น
ตัวนก การสร้าง Movie แบบนี้ วัตถุจะต้องอยู่ในสถานะ Break Apart
Motion Tween
การสร้าง Movie แบบ Motion Tween เป็น Movie ที่สร้างได้ง่าย รวดเร็ว โดยยึดหลักสร้าง
วัตถุในตำแหน่งเริ่มต้น และตำแหน่งสุดท้าย Flash จะสร้าง Effect การเคลื่อนที่ให้โดยอัตโนมัติ
รวมทั้งผู้สร้างสามารถเลือกรูปแบบการเคลื่อนที่ได้จาก Properties Panel
หลักการสร้าง Movie แบบ Motion Tween
• กำหนดเฟรมเริ่มต้น (ไม่จำเป็นต้องเป็นเฟรมที่ 1) โดยการคลิกเมาส์ในเฟรมที่ต้องการ
แล้วเลือกคำสั่ง Insert, Timeline, Keyframe หรือคลิกปุ่มขวาของเมาส์ แล้วเลือก Insert, Keyframe
• สร้างวัตถุ โดยวัตถุจะต้องอยู่ในสภาวะ Group หรือ Symbol
- การสร้างวัตถุในสภาวะ Group
* เลือกวัตถุที่สร้าง
* ใช้คีย์ลัด Ctrl + G
- การสร้างวัตถุในสภาวะ Symbol
* เลือกวัตถุที่สร้าง
* กดปุ่ม F8
* ตั้งชื่อ Symbol และเลือก Behavior ที่เหมาะสม
• เลือกเฟรมปลายทาง แล้วเลือกคำสั่ง Insert, Timeline, Keyframe หรือคลิกปุ่มขวาของ
เมาส์ แล้วเลือก Insert, Keyframe
• ปรับแต่งวัตถุ หรือย้ายวัตถุตามต้องการ
• เลื่อนเมาส์กลับมาคลิกที่เฟรมต้นทาง แล้วคลิกปุ่มขวาของเมาส์ เลือกคำสั่ง Create Motion Tween
ตัวอย่าง Motion Tween – ดินสอ
สร้าง Motion Tween เป็นรูปดินสอเคลื่อนที่จากตำแหน่งหนึ่ง ไปอีกตำแหน่งหนึ่ง มี 4 ขั้นตอน ดังนี้
ขั้นแรก สร้างวัตถุ (ดินสอ)
• สร้างไฟล์ Flash แล้วกำหนด ลักษณะ Stage ให้เหมาะสมด้วยคำสั่ง Modify, Document
• วาดสี่เหลี่ยมรูปทรงแท่งยาว กำหนดลักษณะเส้นขอบตามความหมาะสม
• เติมสีให้กับดินสอ โดยการใช้ชุดสีไล่โทน “ส้ม/ขาว” โดย เปิด Color Mixer Panel เลือก
รายการชุดสีเป็น Linear กำหนด Color Maker 3 ตำแหน่ง โดยตำแหน่งที่ 1 และตำแหน่งที่ 3 ให้กำหนด
เป็นสีส้ม ตำแหน่งที่ 2 กำหนด เป็นสีขาว
• เลือกเครื่องมือ Paint Bucket เติมสีลงในรูปสี่เหลี่ยม
• ใช้เครื่องมือวาดเส้น ตี เส้นตรงตัดรูปสี่เหลี่ยม 2 ตำแหน่ง เพื่อแปลงสภาพเป็น
ปลายดินสอ และยางลบ
• เลือกเครื่องมือ Selection ปรับปลายด้านหนึ่งสี่เหลี่ยม ให้เป็นสามเหลี่ยม ดังรูป
• ลบเส้นตรงส่วนที่คั่นปลายดินสอกับตัวดินสอออก โดย ใช้เครื่องมือ Selection คลิก
เลือกแล้วกดปุ่ม Del
• ดัดแปลงปลายดินสออีกด้าน ให้เป็นยางลบ ดังตัวอย่าง
• แปลงรูปดินสอที่วาดเรียบร้อย แล้ว เป็น Symbol แบบ Graphics โดยใช้เครื่องมือ
Selection เลือกดินสอ กดปุ่ม* ตั้งชื่อ Symbol เช่น Pencil เลือก Behavior เป็น Graphic
แล้วคลิกปุ่ม OK เพื่อยืนยัน การสร้าง Symbol
ขั้นที่สอง กำหนดจุดเริ่มต้นของ Movie
• กำหนดจุดเริ่มต้นของ Movie |
อัตโนมัติ สามารถใช้หลักการ Drag & Drop ย้ายตำแหน่ง Keyframe จากเฟรม 1 ไปเฟรม 5 ได้
• ใช้เครื่องมือ Selection และ Free Transform ย้าย/ ปรับเปลี่ยนรูปทรงของดินสอ ให้เหมาะสม
ขั้นที่สาม กำหนดตำแหน่งปลายทาง
• คลิกเมาส์เลือกเฟรมปลายทาง เช่นเฟรม 50 แล้วคลิกปุ่มขวา ของเมาส์ เลือกคำสั่ง Insert Keyframe
• ใช้เครื่องมือ Selection ย้าย ตำแหน่งดินสอไปตำแหน่งใหม่
ขั้นที่ 4 ใส่ Motion Tween ที่เฟรมต้นทาง
• คลิกเมาส์ในเฟรมต้นทางของ Motion จากตัวอย่างคือเฟรมที่ 5
• คลิกปุ่มขวาของเมาส์ แล้วเลือก คำสั่ง Create Motion Tween
• ทดสอบ Movie โดยใช้คีย์ลัด Ctrl + Enter
- กลับมาสู่จอภาพแก้ไข Movie โดยกดปุ่ม Ctrl + W
• บันทึกไฟล์ (ยกตัวอย่างชื่อ pen) แล้ว Publish เป็น SWF
Shape Tween
Shape Tween เป็น Movie อีกลักษณะที่ใช้เทคนิคการเปลี่ยนรูปร่างของวัตถุ เช่น จากวัตถุ
ขนาดเล็กๆ สั้นๆ เมื่อเวลาผ่านไปก็กลายสภาพเป็นวัตถุขนาดยาว หรือจากรูปทรงวงกลม เป็นรูป
หลายเหลี่ยม เป็นต้น
หลักการสร้าง Movie แบบ Shape Tween
• กำหนดเฟรมเริ่มต้น (ไม่จำเป็นต้องเป็นเฟรมที่ 1) โดยการคลิกเมาส์ในเฟรมที่ต้องการ
แล้วเลือกคำสั่ง Insert, Timeline, Keyframe หรือคลิกปุ่มขวาของเมาส์ แล้วเลือก
Insert, Keyframe
• สร้างวัตถุ โดยวัตถุจะต้องอยู่ในสภาวะ Shape เท่านั้น
- กรณีที่วัตถุอยู่ในสภาวะ Group หรือ Symbol ต้องแปลงให้อยู่ในสภาวะ Shape ก่อน โดย
* เลือกวัตถุ
* กดปุ่ม Ctrl + B (อาจจะต้องทำหลายครั้ง) จนกว่าวัตถุมีจุดพิกเซล เล็กๆ ประกอบในวัตถุ
• เลือกเฟรมปลายทาง แล้วเลือกคำสั่ง Insert, Timeline, Keyframe หรือคลิกปุ่มขวาของ
เมาส์ แล้วเลือก Insert, Keyframe
• สร้างวัตถุชิ้นใหม่ หรือปรับแต่งวัตถุเดิมตามต้องการ
• เลื่อนเมาส์กลับมาคลิกที่เฟรมต้นทาง กำหนดค่า Tween จาก Properties เป็น Shape
ตัวอย่าง Shape Tween – Magic Flower
ฝึกปฏิบัติการสร้าง Movie – Magic Flowerโดยการใช้วัตถุวงกลม และหลายเหลี่ยม แบบ
Shape Tween
• สร้างไฟล์ใหม่ กำหนดลักษณะ/ ขนาด Stage ตามต้องการ
• สร้างชุดสีไล่เฉด ส้ม, ขาว, ส้ม โดยเปิด Color Mixer Panel
• เลือกรูปแบบการลงสีแบบ Radial
• กำหนดจุด Marker 3 จุด จุดที่ 1 และจุดที่ 3 กำหนดเป็นสีส้ม จุด ที่ 2 กำหนดเป็นสีขาว
• วาดรูปวงกลม กำหนดตำแหน่ง ให้เหมาะสม
• กำหนดเฟรมสุดท้ายของ Movie เช่น เลือกเฟรม 50 ให้คลิกปุ่ม ขวาของเมาส์ในเฟรม 50 แล้ว
เลือกคำสั่ง Insert, Keyframe
• ลบรูปวงกลมในเฟรม 50 ออกไป
• เลือกเครื่องมือ PolyStar
• คลิกปุ่ม Options ใน Properties Panel เลือกเป็น Star กำหนดค่า ตามต้องการ
• วาดรูปหลายเหลี่ยม ให้อยู่ใน ตำแหน่งเดียวกับวงกลมที่ลบไป เดิม
• เลื่อนเมาส์มาคลิกที่เฟรมแรก เฟรมที่ 1) เปลี่ยนค่า Tween เป็น Shape
• ทดสอบ Movie บันทึกไฟล์
ตัวอย่าง Shape Tween – การขีดเส้นด้วยดินสอ
นำ Motion Tween รูปดินสอเคลื่อนที่จากตัวอย่างก่อนหน้า มาใส่ Shape Tween เป็นการ
ขีดเส้นด้วยดินสอ โดยใช้หลักการเปลี่ยนรูปร่างของเส้นจากเส้นบางสั้นๆ จนกลายเป็นเส้นที่มี
ความยาว เสมือนกับการขีดเส้นด้วยดินสอ ตัวอย่างนี้จะแนะนำการทำงานกับเลเยอร์ การสร้าง
Shape Tween ไปในขณะเดียวกัน
• เปิดไฟล์ pen.fla
• เปลี่ยนชื่อเลเยอร์ Motion Tween ของดินสอ เป็น Pencil โดยดับเบิลคลิกที่ชื่อ Layer 1
ป้อนชื่อใหม่แล้วกดปุ่ม Enter
• สร้างเลเยอร์ใหม่ โดยคลิกที่ ปุ่ม Insert Layer ใน Timeline
• เปลี่ยนชื่อเลเยอร์ใหม่ เป็น Line
• กำหนดเฟรมต้นทางของ Shape Tween เช่น เฟรม 5 โดยคลิกเมาส์ในเฟรม 5 แล้ว
คลิกปุ่มขวาของเมาส์ เลือก คำสั่ง Insert Keyframe
• วาดเส้นบางๆ สั้นๆ ด้วย เครื่องมือ Pencil
• พยายามวาดให้อยู่ใต้ดินสอ
• เลือกเฟรมปลายทาง ให้อยู่ ตำแหน่งเดียวกับเลเยอร์ดินสอ (เช่นเฟรม 50) คลิกปุ่มขวาของ
เมาส์ แล้วเลือกคำสั่ง Insert Keyframe
• ขยายเส้นที่ขีดในเลเยอร์ Line ให้ยาว มีระยะทางเท่ากับจุดปลายทางของดินสอ โดยใช้
เครื่องมือ Free Transform คลิกเลือกเส้นขีด จากนั้นย้าย จุดศูนย์กลางของเส้นขีดไปอยู่
ริมด้านซ้าย (ใช้เครื่องมือ Zoom เพื่อขยายภาพให้เห็นเด่นชัด)
• ลากจุด Handle ด้านขวาให้ยาวเท่ากับปลายทางของดินสอ
• เลื่อนเมาส์กลับมาคลิกที่เฟรม ต้นทางของเลเยอร์ Line
• เปลี่ยนค่า Tween จาก Properties เป็น Shape
• ทดสอบ Movie โดยใช้คีย์ลัด Ctrl + Enter
- กลับมาสู่จอภาพ แก้ไข Movie โดยกด ปุ่ม Ctrl + W
• บันทึกไฟล์ แล้ว Publish เป็น SWF
ตัวอักษร/ข้อความ
เมื่อทราบถึงการสร้างกราฟิก และการจัดการกราฟิกที่ใช้ใน Flash แล้ว ส่วนประกอบอีก
ส่วนหนึ่ง ซึ่งจะขาดไม่ได้ ก็คือ ตัวอักษร หรือข้อความ โดยมีคำสั่งที่เกี่ยวข้องดังนี้
สร้างข้อความ
• คลิกเลือกเครื่องมือ Text Tool
• เลือกลักษณะตัวอักษร และพารากราฟ จาก Text Property
โหมดตัวอักษร – Static คือตัวอักษรในสภาวะปกติ, Dynamic คือ
ตัวอักษรที่รับค่าจาก ตัวแปร, Input คือตัวอักษรที่สามารถป้อนผ่านแป้นพิมพ์
• นำเมาส์ไปคลิก ณ ตำแหน่งที่ต้องการพิมพ์งาน ปรากฏกรอบพิมพ์งาน
- ถ้าคลิกเมาส์ 1 ครั้งจะเป็นการพิมพ์งานแบบบรรทัดเดียว สังเกตได้จากมุมบนขวา
ของกรอบข้อความ มีสัญลักษณ์วงกลมเล็กๆ
- ถ้ากดปุ่มเมาส์ค้างไว้ แล้วลากขยายขนาดของกรอบข้อความ จะเป็นการพิมพ์งาน
แบบหลายบรรทัด สังเกตได้จากมุมบนขวาของกรอบข้อความ มีสัญลักษณ์
สี่เหลี่ยมเล็กๆ
• พิมพ์งานที่ต้องการ สามารถยกเลิกโดยนำเมาส์ไปคลิก ณ ที่ว่างๆ บน Stage
ตัวอย่างการจัดข้อมูลให้มีระยะห่างระหว่างตัวอักษร 4 หน่วย โดยคลิกที่
ปรับเปลี่ยนกรอบข้อความ
• เปลี่ยนจาก กรอบบรรทัดเดียว เป็นหลายบรรทัด ให้นำเมาส์ไปชี้ที่วงกลม มุมบนขวา
ของกรอบข้อความ กดปุ่มเมาส์ค้างไว้ แล้วลากออก
• เปลี่ยนจากกรอบหลายบรรทัด เป็นบรรทัดเดียว ให้ดับเบิ้ลคลิกที่สัญลักษณ์สี่เหลี่ยม
มุมบนขวาของกรอบข้อความ
ปรับเปลี่ยนรูปร่างตัวอักษร
ก่อนที่จะปรับเปลี่ยนรูปร่างของตัวอักษร ซึ่งสามารถกระทำได้รายตัวอักษร จะต้องแยก
องค์ประกอบของข้อความนั้นๆ ก่อน โดย
• คลิกเลือกข้อความ
• เลือกเมนูคำสั่ง Modify, Break Apart (อาจจะใช้คำสั่งนี้หลายครั้ง)
• ตัวอักษรจะกลายเป็น Shape ซึ่งจะสังเกตได้จากจุดเล็กๆ ในตัวอักษรนั้นๆ
• สามารถปรับแต่งรูปร่างได้อิสระ โดยอาศัย Arrow Tool
• นอกจากการใช้คำสั่ง Break Apart ในการปรับเปลี่ยนลักษณะตัวอักษร ยังสามารถ
เคลื่อนย้าย, หมุน, บิดตัวอักษรได้เหมือนกับวัตถุทั่วไป
ทำงานกับเลเยอร์ (Layer)
เลเยอร์ (Layer) หมายถึงชั้นของชิ้นงาน เนื่องจากการวาดภาพใดๆ ก็ตามหากรวมอยู่ใน
ชั้นเลเยอร์เดียวกัน จะเกิดปัญหาการแก้ไขได้ง่าย ดังนั้นการสร้างวัตถุใดๆ ก็ตามด้วย Flash ให้ยึด
หลักที่ว่าวัตถุ 1 ชิ้นต่อ 1 เลเยอร์เพื่อให้การควบคุม การสร้างงานกระทำได้อย่างสมบูรณ์
เปลี่ยนชื่อเลเยอร์
• ดับเบิ้ลคลิกที่ชื่อเลเยอร์เดิม แล้วป้อนชื่อใหม่จากนั้นกดปุ่ม <Enter>
เปลี่ยนลำดับของเลเยอร์
• นำเมาส์ไปคลิกที่ชื่อเลเยอร์ที่ต้องการเปลี่ยนลำดับ กดปุ่มเมาส์ค้างไว้ แล้วลากไป
ปล่อย ณ ตำแหน่งใหม่
ควบคุมเลเยอร์
• ซ่อน/แสดงเลเยอร์ โดยให้คลิกที่จุดกลมเล็กๆ ของเลเยอร์ใต้ปุ่มนี้
• ล็อกเลเยอร์ ป้องกันการแก้ไข
• แสดงผลแบบโครงร่าง เหมาะสำหรับการสร้าง Movie กับเครื่องที่มีแรม ไม่มากนัก
การแสดงผลแบบปกติ การแสดงผลแบบโครงร่าง
ไฟล์เสียง (Sound)
การสร้างสื่อด้วย Flash นอกจากมีจุดเด่นเกี่ยวกับภาพเคลื่อนไหวรูปแบบต่างๆ ยังสามารถ
นำเสนอเสียงพร้อมๆ กับการนำเสนอภาพเคลื่อนไหว เป็นการสร้างสื่อมัลติมีเดียอย่างสมบูรณ์ โดย
การนำเสนอไฟล์เสียงด้วย Flash ทำได้ 2 รูปแบบคือ
• Event Sound ซึ่งจะมีรูปแบบการนำเสนอ (บรรเลงเพลง) เมื่อเพลง
นั้นๆ ถูกดาวน์โหลดมายังเครื่องลูกข่าย (คอมพิวเตอร์ผู้เรียกดูเว็บ) ครบสมบูรณ์
• Stream Sound เพลงจะบรรเลงทันทีที่เพลงส่วนแรกถูกดาวน์โหลด ไมต่ ้องรอ
ให้ครบทั้งไฟล์ และสามารถควบคุมการหยุดชั่วคราวได้ตามช่วงเวลาบน Timeline
นับเป็นรูปแบบที่ดีที่สุดสำหรับการนำเสนอผ่านเครือข่ายอินเทอร์เน็ต
ฟอร์แมตไฟล์เสียง
ไฟล์เสียงที่สนับสนุน Flash ได้แก่
• WAV ไฟล์เสียง/เพลงที่สามารถทำงานได้บนระบบปฏิบัติ Windows โดยจะต้อง
มีการบันทึกในฟอร์แมต 8 หรือ 16-bit ค่า sample rate ที่ 11 kHz, 22 kHz, หรือ 44 kHz Mono เท่านั้น
• AIFF ไฟล์เสียง/เพลงที่ทำงานในคอมพิวเตอร์ระบบ Macintosh
• MP3 ไฟล์เสียง/เพลงที่ทำงานได้ทั้งระบบปฏิบัติการ Windows และ
คอมพิวเตอร์ระบบ Macintosh ซึ่งมีจุดเด่นคือขนาดไฟล์จะมีขนาดเล็กกว่า ฟอร์แมต WAV และ AIFF
ทำงานกับไฟล์เสียง
การทำงานหรือควบคุมไฟล์เสียงของ Flash มีสองรูปแบบ คือแบบฝังไฟล์เสียงกับไฟล์
Flash (Embedded) และแบบเชื่อมไฟล์ (Linking) โดยไฟล์ฟอร์แมต WAV และ AIFF มักจะใช้
รูปแบบ Embedded ทำให้ไฟล์ Movie มีขนาดโต ในขณะที่ไฟล์ MP3 จะใช้รูปแบบ Linking ทำให้
ไฟล์ Movie มีขนาดเล็ก แต่มีจุดเสีย คือ การนำไปใช้จะต้องนำไปทั้งไฟล์ Movie และไฟล์เพลง
MP3
ควบคุมไฟล์เสียงฟอร์แมต WAV
การทำงานและควบคุมไฟล์เสียงฟอร์แมต WAV มี 3 ขั้นตอนหลัก คือ การนำเข้าไฟล์เสียง
ไปเก็บไว้ใน Library, การทำงานกับไฟล์เสียงบน Timeline และการสร้างปุ่มควบคุมเสียงด้วย
Action Script
การนำเข้าไฟล์เสียง
• เตรียมไฟล์เสียงฟอร์แมต WAV
• สร้าง Flash Movie กำหนดขนาดของ Flash Movie และคุณสมบัติอื่นๆ จากเมนูคำสั่ง Modify, Document
• เปิด Library Panel ด้วยคำสั่ง Window, Library
• เลือกคำสั่ง File, Import, Import to Library
• เลือกไฟล์เสียงที่เตรียมไว้ คลิกปุ่ม Open เพื่อนำเข้า
• ไฟล์เสียงที่นำเข้า จะเก็บไว้ใน Library Panel
การทำงานกับไฟล์เสียง
เมื่อนำเข้าไฟล์เสียงเก็บไว้ใน Library เรียบร้อยแล้ว ก็สามารถนำมาสร้าง Movie หรือ
ควบคุมการนำเสนอได้โดย
• สร้าง Layer ควบคุมไฟล์เสียง
• ลากไฟล์เสียงจาก Library มาวางบน Stage
• จะปรากฏสัญลักษณ์เส้นเสียงในเฟรม 1 ของ Layer เสียง
• ขยายเฟรมจนสิ้นสุดเส้นเสียง โดยคลิกเฟรมปลายทาง เช่นเฟรม 500 แล้วเลือกคำสั่ง
Insert, Frame (อาจจะต้องทำหลายครั้งจนกว่าเส้นเสียงจะปรากฏเป็นเส้นเสียงเรียบ)
การควบคุมเสียงใน Movie
เมื่อนำเสียงเพลง หรือเพลงบรรยายในฟอร์แมต WAV มาวางใน Movie ควรสร้างปุ่ม
ควบคุมการนำเสนอ ได้แก่ ปุ่ม Stop, ปุ่ม Pause และปุ่ม Play
• สร้างเลเยอร์ใหม่ ตั้งชื่อเป็น Button
• เปิด Button Panel ด้วยคำสั่ง Window, Other Panels, Common Libraries, Button
• เลือกปุ่มควบคุมเสียงมาวางบน Stage ให้ ครบ 3 ปุ่ม เพื่อทำหน้าที่เป็นปุ่ม Stop, ปุ่ม
Pause และปุ่ม Play
• คลิกเฟรม 1 ของเลเยอร์ Sound
• เปิด Properties Panel
• เปลี่ยนค่า Sync จาก Event เป็น Stream เพื่อให้การนำเสนอไฟล์เสียงเป็นแบบ Streaming
- สามารถเปลี่ยนไฟล์เสียงได้จากรายการ Sound
- การยกเลิกไฟล์เสียง ให้เลือก None จาก รายการ Sound
- รายการ Effect เป็นการใส่ลักษณะพิเศษ ให้กับเสียงเช่น เสียงเริ่มแบบเบาๆ แล้ว
ค่อยๆ ดังขึ้น (Fade in)
• เลือกปุ่ม Stop on (press) {
• เปิด Action Panel โดยกดปุ่ม F9 gotoAndStop(1);
• ป้อนคำสั่ง Action Script ควบคุมปุ่ม Stop } โดยจะหมายถึงการสั่งให้ Play Head ของ
Timeline Timeline หยุด1 แล้วหยุดการทำงานนั่นเอง
• เลือกปุ่ม Pause on (press)
• เปิด Action Panel โดยกดปุ่ม F9 stop();
• ป้อนคำสั่ง Action Script ควบคุมปุ่ม Pause }
โดยจะหมายถึงการสั่งให้ Play head ของ Timeline หยุด ณ ตำแหน่งที่คลิกปุ่ม
• เลือกปุ่ม Play on (press) {
• เปิด Action Panel โดยกดปุ่ม F9 play();
• ป้อนคำสั่ง Action Script ควบคุมปุ่ม Play } โดยจะหมายถึงการสั่งให้ Play Head ของ
Timeline เล่นต่อจากตำแหน่งที่หยุดครั้ง ล่าสุด
• บันทึกไฟล์ แล้ว Publish เป็น .swf
• ทดสอบไฟล์ .swf
ควบคุมเพลง MP3
การนำเสนอและควบคุมเพลง MP3 ด้วย Flash สามารถใช้ Media Playback ซึ่งเป็นหนึ่งใน
ชุดควบคุมสื่อ (Media Components) ที่ Flash จัดเตรียมพร้อมใช้งาน โดยมีขั้นตอนดังนี้
• เตรียมไฟล์เพลงในฟอร์แมต MP3
• สร้าง Flash Movie กำหนดขนาดของ Flash Movie ด้วยคำสั่ง Modify, Document
• บันทึกไฟล์ไว้ในโฟลเดอร์เดียวกับไฟล์ mp3
• เปิด Components Panel ด้วยคำสั่ง
• คลิกเลือก MediaPlayback บน Stage เปิด
|
ควบคุม VDO
การนำเสนอ VDO และควบคุม VDO ด้วย Flash ก็มีหลักการคล้ายๆ กับการนำเสนอ/
ควบคุมไฟล์เสียง คือสามารถเลือกได้ทั้งแบบ Embedded และแบบ Linking โดยไฟล์ในฟอร์แมต
AVI หรือ MPEG มักจะใช้รูปแบบ Embedded ส่วนไฟล์ฟอร์แมต Macromedia Flash Video (FLV)
จะใช้รูปแบบ Linking อย่างไรก็ตามการใช้งาน VDO ใน Flash จำเป็นต้องมีการติดตั้งโปรแกรม
ประกอบในคอมพิวเตอร์ก่อนจึงจะสามารถทำงานได้ เช่น QuickTime หรือ DirectX 7 ขึ้นไป โดย
ฟอร์แมต VDO ที่สนับสนุนเมื่อติดตั้ง QuickTime ได้แก่
Audio Video Interleaved = .avi
Digital video = .dv
Motion Picture Experts Group = .mpg, .mpeg
QuickTime movie = .mov
สำหรับฟอร์แมตไฟล์ VDO ที่สามารถนำเข้าเมื่อติดตั้ง DirectX 7.0 ขึ้นไป ได้แก่
Audio Video Interleaved = .avi
Motion Picture Experts Group = .mpg, .mpeg
Windows Media file = .wmv, .asf
VDO แบบ Embedded
• เตรียมไฟล์ VDO
• สร้าง Flash Movie กำหนดขนาด/คุณสมบัติ ตามต้องการ
• นำเข้าไฟล์ VDO ด้วยคำสั่ง File, Import, Import to Stage
• เข้าสู่โหมดการนำเข้า VDO
- นำเข้า VDO ทันที เลือกรายการ Import the entire video
- เข้าสู่ส่วนการควบคุม ตัดต่อ VDO ให้ เลือก Edit the video first
• เลือกรายการ Import the entire video เพื่อเข้า VDO ทันที จากนั้นคลิกปุ่ม Next
• เข้าสู่ส่วนการเข้ารหัส VDO ให้เหมาะสม กับช่องทางการเผยแพร่ เช่น ถ้าต้องการ
สร้าง Flash Movie นำเสนอ VDO สำหรับ ผู้ใช้ที่เรียกดูอินเทอร์เน็ตผ่าน MODEM
56Kbps ก็ให้เลือก Compression profile เป็น 56Kbps หรือเลือกระบบอื่นๆ ตาม
ความเหมาะสม จากนั้นคลิกปุ่ม Finish
• รอสักครู่ Flash จะนำเข้าไฟล์ VDO
• โปรแกรมจะแสดงเวลาทั้งหมดของ VDO คลิกปุ่ม Yes เพื่อยืนยันการนำเข้า
• ปรากฏจอภาพ VDO บน Stage
• สร้างเลเยอร์ใหม่ ตั้งชื่อเป็น Button สร้าง ปุ่มควบคุม VDO 3 ปุ่มได้แก่ ปุ่ม Stop, ปุ่ม
Pause และปุ่ม Play
• เลือกปุ่ม Stop on (press) {
• เปิด Action Panel โดยกดปุ่ม F9 gotoAndStop(1);
• ป้อนคำสั่ง Action Script ควบคุมปุ่ม Stop }
โดยจะหมายถึงการสั่งให้ Play Head ของ Timeline วิ่งกลับไปที่เฟรม 1 แล้วหยุดการ ทำงานนั่นเอง
• เลือกปุ่ม Pause on (press) {
• เปิด Action Panel โดยกดปุ่ม F9 stop();
• ป้อนคำสั่ง Action Script ควบคุมปุ่ม Pause }
โดยจะหมายถึงการสั่งให้ Play head ของ Timeline หยุด ณ ตำแหน่งที่คลิกปุ่ม
• เลือกปุ่ม Play on (press) {
• เปิด Action Panel โดยกดปุ่ม F9 play();
• ป้อนคำสั่ง Action Script ควบคุมปุ่ม Play }
โดยจะหมายถึงการสั่งให้ Play Head ของTimeline เล่นต่อจากตำแหน่งที่หยุดครั้งล่าสุด
• บันทึกไฟล์ แล้ว Publish เป็น .swf
• ทดสอบไฟล์ .swf
กรอบ VDO
เทคนิคที่น่าสนใจของ Flash ก็คือ Masking ซึ่งเป็นการซ่อนบางส่วนของวัตถุ (Object) ด้วย
วัตถุที่ซ้อนทับอยู่ด้านบน (เลเยอร์บน) เช่น เลเยอร์ล่างเป็น VDO หรือรูปภาพ จากนั้นสร้างอีกเล
เยอร์ซ้อนทับขึ้นไปเป็นรูปหัวใจ เมื่อสั่ง Mask เลเยอร์รูปหัวใจ ก็จะปรากฏ VDO หรือรูปภาพที่
อยู่เลเยอร์ด้านล่าง ถูกแสดงผลเป็นรูปหัวใจตามรูปทรงของวัตถุที่ซ้อนอยู่ด้านบนนั่นเอง ด้วย
เทคนิค Masking จะช่วยให้การนำเสนอ VDO มีจุดเด่นในเรื่องกรอบ VDO
• นำไฟล์ VDO จากแบบฝึกหัดก่อนหน้า มา ปรับแต่งโดยสร้างเลเยอร์ใหม่ ให้อยู่ชั้น
บนสุด ตั้งชื่อเป็น Mask
• วาดรูปทรงตามต้องการ โดยรูปทรงที่วาดจะถูกนำมาใช้เป็นส่วนแสดง VDO
• เลือกเลเยอร์ Mask กดปุ่มขวาของเมาส์ แล้ว เลือกคำสั่ง Mask
• บันทึกไฟล์ แล้ว Publish เป็น .swf
• ทดสอบไฟล์ .swf
ตัดต่อ VDO
ก่อนที่จะนำไฟล์ VDO เข้ามาใช้งานใน Flash Movie บางครั้งอาจจะจำเป็นต้องตัดต่อ
VDO ให้เหมาะสม เช่น VDO ต้นฉบับหลายๆ เรื่องอาจจะมีความยาวมากเกินไป การนำมาสร้าง
เป็น Flash Movie จะทำให้ขนาดไฟล์โตเกินกว่าจะแสดงผลผ่านเครือข่ายอินเทอร์เน็ตได้อย่าง
เหมาะสม การแบ่งหรือตัดต่อ VDO แล้วสร้างเป็น Flash Movie ย่อยๆ จะช่วยให้การนำเสนอมี
ความเหมาะสมมากกว่า
• เตรียมไฟล์ VDO
• สร้าง Flash Movie
• นำเข้าไฟล์ VDO ด้วยคำสั่ง File,Import, Import to Stage
• เข้าสู่ส่วนการควบคุม ตัดต่อ VDOเลือก Edit the video first
• เมื่อคลิกปุ่ม Next จะปรากฏส่วนการตัดต่อ VDO ดังนี้
• การตัดต่อ VDO ทำได้โดยเลื่อนสัญลักษณ์ ไป ณ ตำแหน่งจุดเริ่มต้นของ VDO จากนั้น
เลื่อนสัญลักษณ์ เข้ามา ณ ตำแหน่งจุดสุดท้ายของ VDO
• คลิกปุ่ม Create Clip เพื่อตัด VDO ส่วนที่เลือก สามารถเลือกส่วน VDO แล้วตัดได้หลายส่วน พร้อมๆ กัน
ถ้าคลิกเลือกรายการ Combine list of clips into a single library item after import จะเป็น
การระบุให้ VDO ที่เลือกตัดแต่ละส่วน รวมเป็น VDO ใน Library รายการเดียวกัน (เทคนิคการผสม
VDO จากหลายคลิป)
• คลิกปุ่ม Next เพื่อเข้าสู่จอภาพการเลือกคุณภาพ และการบีบอัด VDO (Compression) เลือก
รูปแบบที่เหมาะสมแล้วคลิกปุ่ม Finish
• รอสักครู่จะปรากฏ VDO ใน Library Panel พร้อมใช้งานต่อไป