การทำสื่อการศึกษาแบบ 2D Animation งานประชุมวิชาการประจำปี ครั้งที่ ๑๐ เทคโนโลยีสารสนเทศเพื่อสุขภาพถ้วนหน้า วันศุกร์ที่ ๒๓ พฤศจิกายน ๒๕๔๔ โดย บุญเลิศ อรุณพิบูลย์ - นพเก้า นาคามดี http://www.nectec.or.th/courseware [email_address]

Animation Graphic ภาพเคลื่อนไหว ชุดลำดับของภาพนิ่ง การ นำ ภาพนิ่งหลายๆ ภาพ มาลำดับกันอย่างต่อเนื่อง เพื่อให้ปรากฏเป็นการเคลื่อนไหวบนแผ่นระนาบ แผ่นระนาบ - > จอภาพ , แผ่นกระดาษ ปรากฏการณ์ “ภาพติดตา” - Persistence of vision

ภาพเคลื่อนไหว

ชุดลำดับของภาพนิ่ง

การ นำ ภาพนิ่งหลายๆ ภาพ มาลำดับกันอย่างต่อเนื่อง เพื่อให้ปรากฏเป็นการเคลื่อนไหวบนแผ่นระนาบ

แผ่นระนาบ - > จอภาพ , แผ่นกระดาษ

ปรากฏการณ์ “ภาพติดตา” - Persistence of vision

Computer & Animation คอมพิวเตอร์ถูกนำมาใช้เป็นเครื่องมือสร้าง ลำดับภาพเคลื่อนไหว สร้างภาพกราฟิกทีละภาพ ( หรือเรียกว่า “เฟรม” ) วัตถุแต่ละเฟรม มีการเปลี่ยนแปลงของ “ตัวแปร” ทีละน้อย ตัวแปร เช่น ตำแหน่งวัตถุ , ขนาด , การหมุน , การแปลงรูปร่าง , สี เป็นต้น การเปลี่ยนแปลงของตัวแปรเหล่านั้น อาศัย “หลักการประมาณค่าในช่วงระหว่างภาพแรก กับภาพถัดไป”

คอมพิวเตอร์ถูกนำมาใช้เป็นเครื่องมือสร้าง ลำดับภาพเคลื่อนไหว

สร้างภาพกราฟิกทีละภาพ ( หรือเรียกว่า “เฟรม” )

วัตถุแต่ละเฟรม มีการเปลี่ยนแปลงของ “ตัวแปร” ทีละน้อย

ตัวแปร เช่น ตำแหน่งวัตถุ , ขนาด , การหมุน , การแปลงรูปร่าง , สี เป็นต้น

การเปลี่ยนแปลงของตัวแปรเหล่านั้น อาศัย “หลักการประมาณค่าในช่วงระหว่างภาพแรก กับภาพถัดไป”

Types Video Format - Video for Windows, QuickTime, MPEG Flash Movie GIF Animation Programming - JavaScript, Java, DirectX

Video Format - Video for Windows, QuickTime, MPEG

Flash Movie

GIF Animation

Programming - JavaScript, Java, DirectX

Using PowerPoint 95/97 Presentation PowerPoint 2000 Presentation CAI Web Video for Windows (.avi) Video for Windows (.avi), GIF Animation Video format, GIF Animation, Flash Movie Video format, GIF Animation, Flash Movie, Web Programming

PowerPoint 95/97 Presentation

PowerPoint 2000 Presentation

CAI

Web

Processing Video Clip Video Converter (.mpg -> .avi , .qt -> avi) www.download.com - video converter Video Capture DigitalViewCam DigitalCamera Paint Software - Adobe PhotoShop, Flash, CorelDraw Animator Software - Ulead GIF Animator, Flash, Xara3D, Cool3D

Video Clip

Video Converter (.mpg -> .avi , .qt -> avi)

www.download.com - video converter

Video Capture

DigitalViewCam

DigitalCamera

Paint Software - Adobe PhotoShop, Flash, CorelDraw

Animator Software - Ulead GIF Animator, Flash, Xara3D, Cool3D

Video Capture อุปกรณ์แปลงสัญญาณภาพแบบ Analog เป็นสัญญาณ Digital เพื่อนำเสนอบนจอภาพ ภาพที่ผ่านการแปลงสัญญาณ สามารถตกแต่งเพิ่มเติมได้ง่าย อาศัยโปรแกรมในการปรับแต่ง และบันทึกฟอร์แมตภาพ

อุปกรณ์แปลงสัญญาณภาพแบบ Analog เป็นสัญญาณ Digital เพื่อนำเสนอบนจอภาพ

ภาพที่ผ่านการแปลงสัญญาณ สามารถตกแต่งเพิ่มเติมได้ง่าย

อาศัยโปรแกรมในการปรับแต่ง และบันทึกฟอร์แมตภาพ

DigitalViewCam

Digital Camera MPEG Movie Clip Motion Animated GIF

MPEG Movie

Clip Motion Animated GIF

ชุดภาพนิ่ง ----- > ภาพเคลื่อนไหว GIF Animation Video for Windows (.avi) Execute File (.exe) Flash Movie แปลง avi < ----- > .gif/.exe/.swf

ชุดภาพนิ่ง ----- > ภาพเคลื่อนไหว

GIF Animation

Video for Windows (.avi)

Execute File (.exe)

Flash Movie

แปลง avi < ----- > .gif/.exe/.swf

Text Animation GIF Animation Video for Windows (.avi)

Text Animation

GIF Animation

Video for Windows (.avi)

โปรแกรมสร้าง ตกแต่งภาพ สร้าง ออกแบบภาพต้นฉบับเพื่อนำมาใช้เป็นทำชุดลำดับของภาพเคลื่อนไหว มีเครื่องมือ และคำสั่งสำหรับสร้าง และ ตกแต่งภาพครบถ้วน ไฟล์ฟอร์แมตสำหรับนำไปใช้งาน มีให้เลือกหลายฟอร์แมต บางภาพอาจจะต้องสร้างต้นแบบภาพด้วยการวาดลายเส้น

โปรแกรมสร้าง ตกแต่งภาพ

สร้าง ออกแบบภาพต้นฉบับเพื่อนำมาใช้เป็นทำชุดลำดับของภาพเคลื่อนไหว

มีเครื่องมือ และคำสั่งสำหรับสร้าง และ ตกแต่งภาพครบถ้วน

ไฟล์ฟอร์แมตสำหรับนำไปใช้งาน มีให้เลือกหลายฟอร์แมต

บางภาพอาจจะต้องสร้างต้นแบบภาพด้วยการวาดลายเส้น

Macromedia Flash เซอฟต์แวร์ที่ช่วยในการสร้างสื่อมัลติมีเดีย , กราฟิกสำหรับงานเว็บ ผลิตภัณฑ์ของบริษัท Macromedia สื่อภาพนิ่ง ภาพเคลื่อนไหว สื่อมัลติมีเดีย ตลอดจนสื่อที่มีระบบโต้ตอบกับผู้ใช้ (Interactive Multimedia) สามารถนำเสนอได้ทั้งบนเว็บ หรือผ่านโปรแกรม Flash Player หรือสร้างเป็น exe file เพื่อเรียกใช้งานได้ทันที นอกจากนี้ยังสามารถแปลงไฟล์ไปอยู่ในฟอร์แมตอื่นได้ด้วย เช่น Animation Gif, AVI, QuickTime

เซอฟต์แวร์ที่ช่วยในการสร้างสื่อมัลติมีเดีย , กราฟิกสำหรับงานเว็บ

ผลิตภัณฑ์ของบริษัท Macromedia

สื่อภาพนิ่ง ภาพเคลื่อนไหว สื่อมัลติมีเดีย ตลอดจนสื่อที่มีระบบโต้ตอบกับผู้ใช้ (Interactive Multimedia)

สามารถนำเสนอได้ทั้งบนเว็บ หรือผ่านโปรแกรม Flash Player หรือสร้างเป็น exe file เพื่อเรียกใช้งานได้ทันที นอกจากนี้ยังสามารถแปลงไฟล์ไปอยู่ในฟอร์แมตอื่นได้ด้วย เช่น Animation Gif, AVI, QuickTime

การสร้างสื่อภาพเคลื่อนไหวด้วย Flash Frame by Frame Motion Tweening Shape Tweening

Frame by Frame

Motion Tweening

Shape Tweening

เทคนิคของ Flash ที่น่าสนใจ แบ่งวัตถุด้วย Layer ควบคุมการทำงานด้วย Timeline & Keyframe มีฟังก์ชันควบคุมการทำภาพเคลื่อนไหว แปลงภาพเป็นฟอร์แมตต่างๆ ได้หลากหลาย ทำระบบโต้ตอบกับผู้ใช้ด้วยภาษา Action Script

แบ่งวัตถุด้วย Layer

ควบคุมการทำงานด้วย Timeline & Keyframe

มีฟังก์ชันควบคุมการทำภาพเคลื่อนไหว

แปลงภาพเป็นฟอร์แมตต่างๆ ได้หลากหลาย

ทำระบบโต้ตอบกับผู้ใช้ด้วยภาษา Action Script