วิธีทำภาพ GIF เคลื่อนไหวจากภาพวาดของคุณ

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

นี่ไม่ใช่ AI สร้างภาพเคลื่อนไหวและไม่ใช่เครื่องมือแปลงวิดีโอเป็น GIF คุณเริ่มจากผ้าใบว่าง เส้นของ WigglyPaint จะสั่นเบา ๆ อยู่แล้ว และแผง Animation จะเล่นภาพแต่ละเฟรมตามลำดับ

เฟรมคือภาพวาดหนึ่งภาพ ลูปคือช่วงที่ภาพสุดท้ายย้อนกลับไปภาพแรก และ onion skin คือภาพจางของเฟรมก่อนหน้า วิธีนี้จึงเป็นการ วาดภาพเคลื่อนไหว ทีละภาพ ไม่ใช่การใส่เอฟเฟกต์อัตโนมัติให้รูปเดิม เหมาะกับ ภาพวาดเคลื่อนไหว สั้น ๆ มากกว่างานยาว

ก่อนเริ่มวาด

• เลือกวัตถุหนึ่งอย่างและการเคลื่อนไหวหนึ่งแบบ
• ใช้สีเด่นสองหรือสามสี
• วาดตัวแบบให้ใหญ่พอสำหรับหน้าตัวอย่างในแชต
• งานแรกใช้เพียงสามถึงสี่เฟรม

วิธีทำภาพ GIF เคลื่อนไหวทีละขั้น

1. วาดท่าแรก

เปิด WigglyPaint เลือกแปรงและสี แล้ววาดจุดเริ่มของการเคลื่อนไหว เฟรมแรกมักเป็นภาพตัวอย่างนิ่ง จึงควรดูเข้าใจได้แม้ยังไม่เล่น

2. เปิดแผง Animation

เปิด Animation frames ด้านล่าง จะเห็นรูปย่อเฟรม ปุ่มเล่น ปุ่ม onion skin และปุ่มบวกขนาดใหญ่ ตรวจว่าเลือกเฟรมแรกอยู่

3. คัดลอกเฟรม

ใช้ Copy frame เมื่อรูปหลักควรอยู่ที่เดิม แล้วแก้เฉพาะตา ปาก หรือตำแหน่ง ใช้เฟรมว่างเมื่อภาพถัดไปต่างจากเดิมมากเท่านั้น

4. เปิด onion skin

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

5. เพิ่มท่าที่สาม

คัดลอกอีกครั้งและเปลี่ยนเล็กน้อย การเด้งใช้ บน-ล่าง-บน ส่วนกะพริบตาใช้ เปิด-ปิด-เปิด สามท่าก็พอสำหรับแอนิเมชันทีละเฟรมชิ้นแรก

6. ดูการวนซ้ำ

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

7. ส่งออกและเปิดไฟล์อีกครั้ง

กด Export บันทึกเป็น GIF แล้วเปิดไฟล์นอกตัวแก้ไข ตรวจว่าภาพยังเคลื่อนไหว มองเห็นชัดเมื่อย่อ และไม่กระโดดตอนเริ่มลูปใหม่

ผลลัพธ์ GIF

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

ทำให้ GIF ดูง่ายและแชร์ง่าย

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

แก้ปัญหาที่พบบ่อย

• GIF เร็วเกินไป: คัดลอกท่าที่ต้องการให้แสดงนานขึ้น
• ลูปกระโดด: ทำตำแหน่งสุดท้ายกับแรกให้ใกล้กัน หรือเพิ่มท่าระหว่างกลาง
• ขนาดตัวแบบเปลี่ยน: เปิด onion skin และจัดส่วนที่ไม่ขยับก่อน
• เห็นเพียงภาพเดียว: ตรวจว่ารูปย่อทุกเฟรมมีภาพ และส่งออกหลังทำครบทุกเฟรม
• ไฟล์ใหญ่หรือภาพไม่ชัด: ลดจำนวนเฟรม สี รายละเอียด และพื้นที่ว่าง
• ไฟล์ที่ดาวน์โหลดไม่ขยับ: เปิดด้วยเบราว์เซอร์หรือแอปที่เล่น GIF ได้ เพราะแกลเลอรีบางตัวแสดงแค่เฟรมแรก

นำ GIF ไปใช้ที่ไหน

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

คำถามที่พบบ่อย

ทำ GIF ได้ฟรีไหม

ได้ คุณวาดเฟรมและส่งออก GIF ในตัวแก้ไขบนเว็บโดยไม่ต้องติดตั้งโปรแกรมเดสก์ท็อป

ทำให้ภาพถ่ายหรือวิดีโอขยับอัตโนมัติได้ไหม

ไม่ได้ ขั้นตอนนี้ใช้วาดเองทีละเฟรม ไม่ใช่เครื่องมือแปลงภาพหรือวิดีโอ

มือใหม่ควรใช้กี่เฟรม

เริ่มสามหรือสี่เฟรม แล้วเพิ่มเมื่อการเคลื่อนไหวยังไม่ต่อเนื่อง

ปรับความเร็วเฉพาะเฟรมได้ไหม

ตอนนี้ยังไม่มีเวลาต่อเฟรม ให้คัดลอกเฟรมนั้นเพื่อค้างท่านานขึ้น

ทำลูปให้ต่อเนื่องอย่างไร

เทียบเฟรมสุดท้ายกับเฟรมแรก ทำตำแหน่งให้ใกล้กัน หรือเพิ่มเฟรมเปลี่ยนผ่านกลับไปจุดเริ่ม

GIF มีเสียงได้ไหม

ไฟล์ GIF ไม่เก็บเสียง จึงต้องสื่อความหมายด้วยการเคลื่อนไหวและจังหวะ

ขั้นตอนบนเว็บนี้ส่งออกวิดีโอได้ไหม

บทความนี้อธิบายการส่งออก GIF จากตัวแก้ไขเว็บ ไม่ได้ระบุว่าส่งออกไฟล์วิดีโอจากชุดเฟรมเดียวกันได้