หน้าแรก

การสร้างสื่อการเรียนรู้ สื่อนำเสนอ หรืองานออกแบบต่างๆ ย่อมจะหนีไม่พ้นการออกแบบ สร้างสรรค์งานกราฟิก หากสามารถสร้างงาน ออกแบบงานกราฟิกด้วยตนเอง คงจะสร้างความภูมิใจได้มาก แต่ปัญหาใหญ่ของการสร้างสรรค์งานกราฟิกของหลายๆ ท่านก็คือ “วาดภาพไม่เป็น”หรือ “สร้างผลงานไม่ได้” แต่ด้วยความสามารถของโปรแกรม Macromedia Flash เครื่องมือช่วยสร้างสรรค์งานกราฟิกที่ง่ายในการเรียนรู้ และประยุกต์ใช้งาน พร้อมๆ กับแนวทางการวาดภาพจากคู่มือฉบับนี้ จะลืมคำว่า “วาดยาก” ไปเลย เนื่องจาก Flash เป็นซอฟต์แวร์สร้างสรรค์งานกราฟิกในฟอร์แมต Vector ที่ภาพกราฟิกทุกภาพประกอบจากเส้นโครงร่างที่ทำให้การปรับแต่ง แก้ไข หรือ ออกแบบภาพ ทำได้ง่ายด้วยเทคนิค “ตัด เชื่อม ปรับเปลี่ยนรูปร่าง”

Macromedia Flash CS3 เป็นผลิตภัณฑ์จากค่าย Macromedia ที่พัฒนามาเพื่อสนับสนุนการสร้างงานกราฟิก ทั้งภาพนิ่ง และภาพเคลื่อนไหว สำหรับการนำเสนอผ่านเครือข่ายอินเทอร์เน็ต Flash มีฟังก์ชันช่วยอำนวยความสะดวก ในการสร้างผลงานหลากหลายรูปแบบตลอดจนชุดคำสั่งโปรแกรมมิ่งที่เรียกว่า Flash Action Script ที่เพิ่มประสิทธิภาพในการทำงาน และสามารถคอมไพล์ (Compile) เป็นโปรแกรมใช้งาน (Application Program) เช่น การทำเป็น e-Cardเพื่อแนบไปพร้อมกับ e-Mail ในโอกาสต่างๆ

(ที่มา : https://www.youtube.com/watch?v=IxvE_1nbRUA)

การเรียกใช้โปรแกรม Flash

การเรียกใช้งานโปรแกรม Flash มีหลักการคล้ายๆ กับการเรียกโปรแกรมทั่วๆ ไปของระบบปฏิบัติการวินโดวส์ โดยเริ่มจากการคลิกปุ่ม Start จากนั้นเลื่อนไปคลิกที่รายการ Program, Adobe Flash CS3 Professional รอสักครู่จะปรากฏหน้าต่างการทำงานซึ่งมีโหมดการทำงานให้เลือกได้หลายลักษณะได้แก่

• การเปิดไฟล์จากคำสั่ง Open a Recent Item

• การสร้างงานผลงานจากรายการ Create New

• การสร้างผลงานแม่แบบ Create from Template

จอภาพการทำงานของ Flash

เมื่อคลิกเลือกการสร้างผลงานใหม่ของ Flash จากรายการ Create New Flash File จะปรากฏส่วนประกอบจอภาพการทำงานดังนี้

( ที่มา : https://chalad.files.wordpress.com/2011/02/flashcs3.pdf )

แถบเครื่องมือหลัก (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

( ที่มา : https://chalad.files.wordpress.com/2011/02/flashcs3.pdf )

Panel

หน้าต่างเล็กๆ ที่ทำหน้าที่แสดงคำสั่งควบคุมย่อยต่างๆ ของโปรแกรม โดยจะปรากฏรายการคำสั่งในเมนู Window

ควบคุม Panel

Panel เป็นจอภาพเล็กๆ ที่แสดงฟังก์ชันการทำงานเฉพาะอย่าง เช่น การทำงานเกี่ยวกับสีจะควบคุมด้วย

Color Mixer หรือ Color Swatches การจัดตำแหน่งวัตถุต่างๆ ควบคุมด้วย Align Panelเป็นต้น การเรียกใช้หรือเปิด/ปิด Panel จะใช้คำสั่ง Window แล้วตามด้วยชื่อ Panel นั้นๆ


( ที่มา : https://chalad.files.wordpress.com/2011/02/flashcs3.pdf )

ทำงานกับไฟล์ Flash

โปรแกรม Flash สามารถสร้างผลงานได้ทั้งภาพนิ่ง ที่เรียกว่า (Still Image) และภาพเคลื่อนไหว ซึ่งจะเรียกว่า Movie ทั้งภาพนิ่ง และภาพเคลื่อนไหว จำเป็นต้องเริ่มต้นจากไฟล์ Flash ต้นฉบับ ที่มีส่วนขยายเป็น .fla จากนั้นจึงบันทึกเป็นไฟล์ภาพใช้งาน สำหรับภาพนิ่ง สามารถเลือกบันทึกได้หลายฟอร์แมต เช่น

( ที่มา : https://chalad.files.wordpress.com/2011/02/flashcs3.pdf )

สร้างไฟล์ใหม่

ไฟล์ 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 ต้นฉบับ

( ที่มา : https://chalad.files.wordpress.com/2011/02/flashcs3.pdf )

ทำงานกับ 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) ของวัตถุ


( ที่มา : https://chalad.files.wordpress.com/2011/02/flashcs3.pdf )