วิธีการทำภาพเคลื่อนไหว

โปรแกรมที่มากด้วยความสามารถ เช่น สร้างภาพเคลื่อนไหวได้ดีเยี่ยม ตัดแบ่งภาพออกเป็นส่วนๆ สร้างเทคนิคตัวอักษรหลากหลาย และอื่นๆ แถมมาพร้อมกับโปรแกรม PhotoShop ตั้งแต่เวอร์ชั่น 5.5 เป็นต้นมาจนบัดนี้ถึงเวอร์ชั่น 7.0 ก็แถมมาให้อีกแล้ว



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

เปิดโปรแกรม ImageReady แล้วเลือกการสร้างงานใหม่ด้วยการคลิกที่เมนู File > New เลือกขนาดชิ้นงาน (ตัวอย่างนี้ผมเลือกขนาดมาตรฐาน Web Banner (468 x 60) เลย) เลือกตามรูปแบบที่โปรแกรมมีให้หรือกำหนดเองได้ เลือกสีพื้นหลังเป็นพื้นขาว พื้นสีที่กำหนดหรือพื้นโปร่งใส



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



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




คลิกที่ภาพที่ต้องการเลือกเมนู Select > All > Copy แล้วนำไปวางในแบนเนอร์และจัดตำแหน่งตามที่ต้องการ



จัดการพิมพ์ข้อความที่ต้องการลงไป จัดวางตำแหน่ง กำหนดขนาดและสีตามที่ต้องการ


สร้างข้อความอื่นๆ ตามต้องการเพิ่มเติม (วิธีการที่สะดวกที่สุดคือเปิดหน้าต่างเลเยอร์แล้วเล ือก Duplicate layer จากนั้นจึงแก้ไขข้อความเพิ่มเติมตามต้องการ)



ถ้ามีข้อความและรูปภาพหลายระดับเพื่อให้สะดวกในการจั ดวางและสร้างเลเยอร์ใหม่ ให้ปิดเลเยอร์ที่ปรับแต่งแล้วเสียก่อน ด้วยการคลิกที่รูปดวงตา เมื่อต้องการให้เลเยอร์ใดแสดงก็สามารถคลิกเปิดได้ทัน ที ตัวอย่างนี้ผมสร้างเลเยอร์ขึ้นมา 10 เลเยอร์ด้วยกัน



เมื่อสร้างจนครบแล้วก็มาถึงขั้นกำหนดเฟรมแสดงภาพเคลื ่อนไหวแล้วครับ ที่กรอบหน้าต่าง Animation เราจะแทรกเฟรมด้วยการคลิกที่ปุ่มแทรกเฟรม (รูปมือ)

กำหนดการแสดงข้อความและรูปภาพในแต่ละเฟรมด้วยการปิด/เปิดดวงตาตามต้องการ เพื่อให้เกิดการเคลื่อนไหวของแบนเนอร์แต่ละเฟรมตามต้ องการ



การกำหนดเวลาในการแสดงผลสามารถทำได้ด้วยการคลิกที่แต ่ละเฟรม แล้วคลิกเมาท์ขวาเลือกเวลาที่โปรแกรมกำหนดไว้หรือกำห นดเองได้ด้วยการคลิกที่ Other... แล้วกำหนดตัวเลขหน่วยวินาทีที่ต้องการลงไป




เมื่อแทรกเฟรม กำหนดรายละเอียดของแต่ละเฟรม เช่น การแสดงของภาพหรือตัวอักษร (ด้วยการปิด/เปิดดวงตา) กำหนดระยะเวลาแสดงผลของแต่ละเฟรม แล้วก็ลองทดสอบการแสดงผลด้วยการคลิกที่ปุ่ม Play ในวงกลม เมื่อพบว่าส่วนใดไม่เป็นไปตามต้องการก็ปรับแก้ให้ถูก ต้อง


เมื่อตรงกับความต้องการแล้วก็ถึงเวลาจัดเก็บไฟล์นำไป ใช้งานด้วยการคลิกที่เมนู File > Save Optimized As.. ตั้งชื่อไฟล์ตามที่ต้องการ แน่นอนต้องเป็นไฟล์แบบ GifAnimation


ลองเปรียบเทียบขนาดของไฟล์ต้นฉบับกับไฟล์ที่ผ่านกระบ วนการบีบอัดไฟล์แล้ว จะเห็นว่ามีขนาดที่ลดลงมากทีเดียว (ต้นฉบับมีขนาดไฟล์ 690 KB และไฟล์สำเร็จมีขนาดเพียง 18.4 KB)







และข้างล่างนี้คือผลจากการสร้างงานตามตัวอย่างด้วยโป รแกรม Adobe ImageReady 7.0 ซึ่งใช้เวลาไม่มากนักในการสร้าง และให้งานที่ตรงความต้องการของเรามากทีเดียว


(ใครมีโปรแกรมนี้ช่วยโพสด้วยด้วย)