Gif flie ที่ผมทำขึ้นมา เป็นตัวอย่าง :]

สร้างไฟล์ Gif ยังไงให้คมชัด

วันนี้ผมจะมาบอกวิธีสร้างไฟล์ Gif ให้มีความคมชัด หรือเรียกได้ว่าชัดที่สุดเท่าที่ไฟล์ Gif จะทำได้แล้ว 😉

gif by giphy

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

ตัวอย่างรูป Animation Frame by Frame by disney

.Gif ย่อมาจาก
Graphics Interchange Format โดยการทำงานของไฟล์ Gif นั้นจะนำไฟล์ PNG มาเรียงกันและวิ่งเรียงกันจากไฟล์แรกไปจนถึงไฟล์สุดท้าย กระบวนการนี้เรียกว่า Frame by Frame(หลักการทำ Animation พื้นฐาน) โดยเราสามารถกำหนดอัตราการวิ่ง 1 วินาที ว่าจะให้วิ่งกี่ Frame และสามารถกำหนดค่า Delay ในแต่ละ Frame ได้ว่าต้องการเท่าไร เพื่อความสมูทในการเล่นของรูปที่เราจะสร้าง ปัจจัยหลายๆอย่างที่ทำให้ไฟล์ Gif ไม่ชัด ยกตัวอย่างเช่น จำนวนเม็ดสี, การไล่สี, Frame rate, Delay และอื่นๆ เพราะฉะนั้นการทำไฟล์ Gif ที่ผมกำลังเสนอ อาจจะเป็นวิธีที่ดีที่สุด หรือถ้าใครมีวิธีที่ดีสามารถแนะนำเข้ามาได้ครับผม 😁

เริ่มแรกโปรแกรมที่เราต้องมี **ใช้เครื่อง MAC ในการอธิบาย**

เริ่มแรกโปรแกรมที่เราต้องใช้งานคือ
1. โปรแกรมตัดต่อวีดีโอที่สามารถ Export งานเป็น PNG sequence ได้ (ในที่นี้ผม จะขอยกตัวอย่างโดยใช้โปรแกรม Adobe After effect นะครับ)
2. โปรแกรม Photoshop เพื่อนำ PNG ที่ได้ไปเรียงและสร้างไฟล์ Gif ครับ

Export ไฟล์ PNG เป็น PNG sequence

ให้นำไฟล์ที่เสร็จเรียบร้อยพร้อมที่จะ Export ไปที่การตั้งค่าการ Render เลือก Format ให้เป็น PNG Sequence ก่อนกด Render ให้เช็ค Output module อีกครั้งว่าเป็น PNG Sequence หรือยัง จากนั้นกด Render ได้เลย

จากนั้นไฟล์ที่เราทำการ Render จะได้เป็นไฟล์ PNG ที่โดนตั้งชื่อจากงานของเรา และตามด้วยเลขจาก Frame แรกเรียงไปจนถึง Frame สุดท้ายตามรุปตัวอย่าง

จากนั้นให้เราเปิด Photoshop ขึ้นมา เลือก Open จะขึ้นหน้าต่าง popup ขึ้นมาเลือกไฟล์แรกของ PNG Sequence ที่เรา Render ไว้ จากนั้นอย่าลืมติ๊กช่อง Image sequence เพราะถ้าเราลืมติ๊กช่องนี้ เวลา Open ไฟล์ มันจะไม่เรียงภาพให้เรา

จากนั้นเราจะได้ ไฟล์ Movie หนึ่งชิ้นในโปรแกรม พร้อมหน้าต่างป็อปอัพขึ้นมาถามว่า เราต้องการใส่ Framerate ให้วีดีโอนี้เท่าไร ขั้นตอนนี้สำคัญ เราต้องใส่ Framerate ให้ตรงกับ Framerate ของตัววีดีโอที่เราทำการ Render ถ้าใส่ไม่ตรงอาจจะทำให้ไฟล์ Gif ที่ได้เล่นไม่สมูทหรือกระตุกได้

โดยพื้นฐานแล้วจะใช้ Frame rate อยู่ที่ 30 หรือ 32 ต่อ 1 วิ

หลังจากที่เรากดตกลงเพื่อยืนยัน Framerate แล้ว ให้เรากด Command+Alt+shift+S เพื่อทำการ Save for Web หรือไปที่ Flie>Export>Save for Web ทำการเรียกหน้าต่างเซฟขึ้นมา

ให้เราสังเกตหน้าต่าง Save for web ใน Panal ทางด้านขวามือ หลักๆให้เลือกตามที่ผมวางไว้
1. Preset เป็น Gif
2. Color 256
3. Quality:Bicubic Smoother เพื่อให้เม็ดสีสมูท
4. Looping option: มีสองตัวเลือกคือ /Forever ให้วนไปเรื่อยๆ/Once คือให้แสดงแค่รอบเดียว

ตัวอย่างงาน ของผมที่ทำการ Export เป็นไฟล์ Gif เสร็จครับ

จากนั้นเราจะได้ไฟล์ Gif ที่คมชัด เป็นอันเสร็จเรียบร้อยครับผม 😘
จบไปแล้วกับการสอน Export .Gif Flie ที่ชัดที่สุดในโลก ฮ่าๆ หวังว่าจะได้ความรู้และนำไปใช้งานได้จริงครับ สุดท้ายนี้ขอให้ทุกท่านสนุกกับการทำไฟล์ Gif ครับ