:: บทเรียนบนเครือข่ายอินเทอร์เน็ต เรื่องการสร้างภาพเคลื่อนไหวด้วยโปรแกรม Adobe Flash CS6 ::

6.1 หลักการสร้างภาพเคลื่อนไหว

หลักการสร้างภาพเคลื่อนไหว

หลักการสร้างภาพเคลื่อนไหว เป็นการนำภาพนิ่งหลายๆ ภาพซึ่งมีความต่อเนื่องกัน มาแสดงด้วยความเร็วที่เหมาะสม เรียกว่า Frame Rates ทำให้เกิดภาพลวงตาของการเคลื่อนไหว หรือการจำภาพติดตา (Iconic Memory) ในภาพเคลื่อนไหวทุกชนิดจะมี Frame Rate ซึ่งหมายถึงจำนวน Frame หรือจำนวนภาพนิ่ง ที่แสดงต่อวินาที โดยมีหน่วยเป็น Per Second เรียกย่อๆ ว่า FPS (Frame Per Second) เช่น 24 FPS หมายความว่า ใน 1 วินาที จะมีภาพนิ่งแสดงต่อเนื่องกัน 24 ภาพ เป็นต้น โดยปกติ ในการทำภาพเคลื่อนไหวจะจำกัดไว้ที่ 60 FPS เนื่องจากสายตาของมนุษย์สามารถรับรู้การเคลื่อนไหวได้เพียงเท่านี้ ซึ่งเกินกว่านี้จะไม่มีผลอะไรต่อการรับรู้ และยังสิ้นเปลืองพื้นที่ในการจัดเก็บข้อมูล

ในการสร้างภาพเคลื่อนไหวนั้นเราต้องกำหนดคุณสมบัติให้ความเหมาะสมกับชิ้นงาน สามารถทำได้โดยคลิกเลือกเมนูคำสั่ง Modify > Document หรือ คลิกที่ ในพาเนล Property Inspector หรือกดปุ่ม Ctrl+J จะปรากฏหน้าต่าง Document Setting

ภาพที่ 6.1 กำหนดคุณสมบัติของชิ้นงานภาพเคลื่อนไหว

ที่มา : สุชาดา ทิพโรจน์, 2560

หมายเลข 1 Dimensions สำหรับกำหนดขนาดของสเตจ โดยระบุความกว้างและความสูง

หมายเลข 2 Adjust 3D Perspective Angle to preserve current stage projection สำหรับกำหนด

ให้ปรับมุมองศา และขนาดของวัตถุ 3 มิติอัตโนมัติตามขนาดของสเตจ

Scale content with stage สำหรับกำหนดปรับขนาดเนื้อหาอัตโนมัติตามขนาดของสเตจ

หมายเลข 3 Ruler units สำหรับกำหนดหน่วยของไม้บรรทัดที่ใช้ในสเตจ ค่าเริ่มต้นกำหนดเป็น Pixels

หมายเลข 4 Background Color สำหรับกำหนดสีพื้นของสเตจ

หมายเลข 5 Frame rate กำหนดอัตราความเร็วในการแสดงภาพเคลื่อนไหว (จำนวน Frame ต่อวินาที)

หมายเลข 6 Auto Save สำหรับกำหนดให้มีการบันทึกอัตโนมัติตามเวลาที่กำหนด

การเคลื่อนไหวในโปรแกรม Adobe Flash CS6 มีลักษณะการเคลื่อนไหว 2 ลักษณะ ดังนี้

1. การเคลื่อนไหวแบบย้ายตำแหน่ง (Motion) เช่น วัตถุเคลื่อนที่จากจุด A ไปจุด B

ภาพที่ 6.2 ลักษณะการเคลื่อนไหวแบบ Motion

ที่มา : สุชาดา ทิพโรจน์, 2560

2. การเคลื่อนไหวแบบเปลี่ยนแปลงรูปร่างลักษณะ (Transform)

ภาพที่ 6.3 ลักษณะการเคลื่อนไหวแบบ Transform

ที่มา : สุชาดา ทิพโรจน์, 2560

การสร้างภาพเคลื่อนไหว จะมีส่วนที่เกี่ยวข้อง ประกอบไปด้วย ฉากการแสดง (Scene) ซึ่งเป็นเนื้อหาย่อยๆ ของเรื่อง ในแต่ละฉากก็จะมีตัวละครหรือสิ่งที่ต้องแสดง เรียกว่า เลเยอร์ (Layer) ตัวละครจะแสดงท่าทาง เรียกว่า เฟรม (Frame) และเมื่อนำเฟรมต่างๆ มาแสดงจะได้ภาพเคลื่อนไหวของตัวละครนั้น ซึ่งตัวละครและฉากจะแสดงบนเวทีการแสดง (Stage)

ภาพที่ 6.4 องค์ประกอบในการสร้างภาพเคลื่อนไหว

ที่มา : สุชาดา ทิพโรจน์, 2560

Scene (ฉากการแสดง)

ฉากหรือตอนของมูฟวี เปรียบได้กับฉากหนึ่งๆ ในภาพยนตร์หรือละคร ซึ่งจะมีการเปลี่ยนสถานที่เกิดเหตุการณ์และตัวละครที่แตกต่างกันไป โดยแต่ละ Scene จะมีไทม์ไลน์ของตัวเอง ประโยชน์ของการแบ่ง Scene จะช่วยลดความสับสนในกรณีที่มูฟวีมีความยาวมากๆ ทำให้ง่ายต่อการสร้าง จัดการ และแก้ไขในมูฟวีที่มีหลาย Scene การทำงานของโปรแกรม Adobe Flash CS6 จะเล่นแต่ละซีนเรียงกันไปตามลำดับโดยอัตโนมัติ โดยปกติเมื่อเปิดโปรแกรม Adobe Flash CS6 ขึ้นมา โปรแกรมจะทำการสร้างและกำหนดให้ทำงานอยู่ใน Scene 1 อย่างอัตโนมัติ

การเพิ่ม ลบ และคัดลอก Scene สามารถทำได้โดยการคลิกที่เมนูคำสั่ง Window > Other Panels > Scene หรือกดปุ่ม Shift+F2 จะปรากฏพาเนล Scene

ภาพที่ 6.5 การเรียกใช้งานพาเนล Scene

ที่มา : สุชาดา ทิพโรจน์, 2560

ภาพที่ 6.6 องค์ประกอบของพาเนล Scene

ที่มา : สุชาดา ทิพโรจน์, 2560

การเปลี่ยนชื่อ และจัดลำดับ Scene เป็นสิ่งสำคัญในการสร้างภาพเคลื่อนไหว เพราะการเปลี่ยนชื่อ Scene จะทำให้ไม่สับสนและสะดวกในการจัดการเกี่ยวกับ Scene ว่า ใดแสดงก่อนหรือแสดงหลัง โดยการเปลี่ยนชื่อ Scene และจัดลำดับ Scene

สามารถทำได้ดังนี้

ภาพที่ 6.7 การเปลี่ยนชื่อ Scene

ที่มา : สุชาดา ทิพโรจน์, 2560

ภาพที่ 6.8 การจัดลำดับ Scene

ที่มา : สุชาดา ทิพโรจน์, 2560

Frame (ท่าทางของตัวละคร)

เป็นช่องแสดงภาพแต่ละช่วงเวลา ซึ่งเมื่อเปรียบเทียบกับละคร Frame คือ ท่าทางของตัวละครที่เคลื่อนไหวในลักษณะต่างๆ ในแต่ละช่วงเวลา โดยการแสดงแต่ละครั้งจะต้องใช้ Frame จำนวนหลาย Frame

ลักษณะการทำงานของ Frame จะมีลักษณะเป็นช่องเล็กๆ เรียงกันเป็นแถวยาว ทำหน้าที่บรรจุภาพและเสียงที่จัดวางบนสเตจ เพื่อแสดงออกมาเป็น Flash Movie โดยแต่ละ Frame จะแสดงเมื่อมีการเลื่อนผ่านของ Playhead โดย Frame

แต่ละประเภทมีลักษณะการทำงานดังนี้

การเพิ่ม Frame และ Keyframe สามารถทำได้ดังนี้

การเพิ่ม Frame คลิกเลือกเมนูคำสั่ง Insert > Timeline > Frame หรือคลิกเมาส์ขวาที่ Frame เลือก Insert Frame หรือกดปุ่ม F5

ภาพที่ 6.9 การเพิ่ม Frame

ที่มา : สุชาดา ทิพโรจน์, 2560

การเพิ่ม Keyframe คลิกเลือกเมนูคำสั่ง Insert > Timeline > Keyframe หรือคลิกเมาส์ขวาที่ Frame เลือก Insert Keyframe หรือกดปุ่ม F6

ภาพที่ 6.10 การเพิ่ม Keyframe

ที่มา : สุชาดา ทิพโรจน์, 2560

การลบ Frame หรือ Keyframe สามารถทำได้โดยคลิกเลือกเมนูคำสั่ง Edit > Timeline > Remove Frames หรือคลิกเมาส์ขวาที่ Frame แล้วเลือก Remove Frames หรือกดปุ่ม Shift+F5

ภาพที่ 6.11 การลบ Frame

ที่มา : สุชาดา ทิพโรจน์, 2560

Page updated

Google Sites

Report abuse