สมัครเรียนโทร. 085-350-7540 , 084-88-00-255 , ntprintf@gmail.com

Tutorial AI

AI001 The brief history of AI AI101 Jupyter Notebook on AWS AI102 Pandas Tutorials AI103 Animated Drawings AI104 Video to BVH AI105 Hand Landmarks Detection Using MediaPipe AI106 Object Detection Using MediaPipe AI107 Image Segmentation Using MediaPipe AI108 Pose Landmarks Detection Using MediaPipe

 

AI103 - Animated Drawings

สร้างแอนิเมชันจากตัวการ์ตูนที่เราวาดเองด้วย Code 2 บรรทัด

 

เมื่อ AI พัฒนาไปแบบก้าวกระโดด ช่วงนี้หลาย ๆ ท่านคงจะได้เห็นผลงานที่สร้างสรรค์จาก AI มากมายโพสต์ตามเว็บและโซเชียลมีเดียต่าง ๆ งานด้านภาพที่โด่งดังคงไม่พ้น Midjourney ที่ทำเอาทั้งนักวาดและกราฟิกดีไซเนอร์หลาย ๆ คนหนาว ๆ ร้อน ๆ เพราะกลัว AI จะมาแย่งงานกันไปแล้ว แต่ในอีกมุมหนึ่งอย่างวงการแอนิเมชันอาจไม่ได้น่ากลัวเช่นนั้น (ใครสนใจอยากฟังเรื่องเล่าจากครูวิทย์ EPT ในหัวข้อ “AI พัฒนามาถึงไหนแล้วและคนจะเตรียมตัวอย่างไร” ขอเชิญคลิกที่นี่เพื่อรับฟังได้เลยครับ)

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

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

ในบทความนี้ เราจะมาสร้างแอนิเมชันแบบง่าย ๆ ทำให้ตัวการ์ตูนที่เราวาดเพียงภาพเดียวเคลื่อนไหวตามท่าทางที่เรากำหนดด้วยการพิมพ์คำสั่งเพียงคำสั่งเดียว! โดยจะใช้ไลบรารีชื่อ animated_drawings ซึ่งใช้อัลกอริทึมจากเปเปอร์ “A Method for Animating Children's Drawings of the Human Figure” กันครับ ใครงงก็ใจเย็น ๆ ค่อย ๆ ทำตามไปทีละขั้นนะครับ 

ถ้าใครอ่านแล้วงงตั้งแต่สามขั้นตอนแรก ขอแนะนำคอร์ส SUPER USER (SU101) เพื่อปูพื้นฐานก่อนนะครับ สำหรับใครที่สนใจคอร์สเรียน AI แต่ยังไม่มีพื้นฐานเขียนโปรแกรมมาก่อน ขอแนะนำคอร์ส Python + Machine Learning (PY201) หรือคอร์ส Python + Web Programming + Machine Learning (PY203) ของทาง EPT ที่สอนแบบจัดเต็มตั้งแต่พื้นฐาน Python จนลงลึกถึงทฤษฎี AI ซึ่งเป็นคอร์สที่มีหลักสูตรเทียบเท่าเรียนในมหาวิทยาลัยชั้นนำ 2-3 ปีเลยครับ

พิเศษวันนี้! หากสมัครคอร์ส Python + Web Programming + Machine Learning (PY203) แล้วแจ้งผ่านทางกล่องข้อความของเพจ Expert.Programming.Tutor ว่ามาสมัครเพราะอ่านบทความนี้ ทางเราจะแถมคอร์ส SUPER USER (SU101) ที่จะช่วยให้ท่านเข้าใจเรื่อง Command Line การใช้งาน Git และ Linux อย่างลึกซึ้งให้ไปเรียนด้วยแบบฟรี ๆ เลยครับ ถ้าจบคอร์ส SU101 แล้วรับรองหายงง ทำตามได้แน่นอน

 

เตรียมตัวก่อนเริ่มทำ

ก่อนอื่นขอแนะนำให้สร้างและ activate Python virtual environment แล้วติดตั้ง Library ลงใน virtual environment แทนที่จะติดตั้งลงในระบบของเครื่องตรง ๆ

 

สำหรับเครื่อง Windows

ทาง EPT ได้ทดลองบนเครื่อง Windows 10 64-bit ดังนั้นระบบปฏิบัติการอื่นหรือเวอร์ชันอื่นอาจทำตามนี้แล้วไม่สำเร็จนะครับ

1. ดาวน์โหลดและติดตั้ง Anaconda ตามขั้นตอนในเว็บนี้ 

2. ดาวน์โหลดและติดตั้ง git ตามขั้นตอนในเว็บนี้ 

3. เปิดโปรแกรม Anaconda Prompt ขึ้นมาแล้วพิมพ์คำสั่งต่อไปนี้และรันทีละคำสั่ง เพื่อสร้างและ activate virtual environment ซึ่ง virtual environment ที่ใช้ในบทความนี้จะตั้งชื่อว่า animated_drawings

หมายเหตุ: ระหว่างสร้าง environment จะมีข้อความถามว่า Proceed ([y]/n)? ให้พิมพ์ y แล้วกด Enter เพื่อดำเนินการต่อ

conda create --name animated_drawings python=3.8.13
conda activate animated_drawings



 

4. พิมพ์คำสั่งต่อไปนี้และรันทีละคำสั่งเพื่อโคลน Project และติดตั้ง Library ที่จำเป็น

git clone https://github.com/facebookresearch/AnimatedDrawings.git
cd AnimatedDrawings
pip install -e .


 

สำหรับเครื่อง macOS และ Linux

ผู้พัฒนาได้ทดลองแค่บนเครื่อง macOS Ventura 13.2.1 และ Ubuntu 18.04 ดังนั้นระบบปฏิบัติการอื่นหรือเวอร์ชันอื่นอาจทำตามนี้แล้วไม่สำเร็จนะครับ

1. ดาวน์โหลดและติดตั้ง Minicoda ตามขั้นตอนในเว็บนี้

2. พิมพ์คำสั่งต่อไปนี้และรันทีละคำสั่งเพื่อสร้างและ activate virtual environment ซึ่ง virtual environment ที่ใช้ในบทความนี้จะตั้งชื่อว่า animated_drawings

conda create --name animated_drawings python=3.8.13
conda activate animated_drawings

 

3. พิมพ์คำสั่งต่อไปนี้และรันทีละคำสั่งเพื่อโคลน Project และติดตั้ง Library ที่จำเป็น

git clone https://github.com/facebookresearch/AnimatedDrawings.git
cd AnimatedDrawings
pip install -e .

 

ทดลองใช้งาน Animated Drawings แบบรวดเร็ว

หลังจากติดตั้งทุกอย่างเสร็จเรียบร้อยพร้อม activate virtual environment แล้ว เราจะมาทดลองสร้างแอนิเมชันจากไฟล์ภาพตัวอย่างที่มีให้ในโฟลเดอร์ Project

 

สร้างแอนิเมชันและเปิดหน้าต่างแสดงแอนิเมชัน

ในตัวอย่างนี้เราจะสร้างแอนิเมชันโดยกำหนดค่าต่าง ๆ เช่น ตัวละคร ฉาก ท่าทาง ฯลฯ จาก config files ชื่อ interactive_window_example.yaml 

หมายเหตุ: ผู้เรียนสามารถอ่านเกี่ยวกับการตั้งค่าต่าง ๆ ใน config files ได้ที่นี่

1. พิมพ์คำสั่งต่อไปนี้เพื่อเริ่มการทำงาน Python interpreter

python

 

2. พิมพ์คำสั่ง 2 บรรทัดต่อไปนี้ใน interpreter

from animated_drawings import render
render.start('./examples/config/mvc/interactive_window_example.yaml')


ถ้าทุกอย่างรันได้โดยไม่มีปัญหา จะได้หน้าต่างแสดงแอนิเมชันดังภาพ

 

สร้างแอนิเมชันและบันทึกเป็นไฟล์วิดีโอ .mp4

พิมพ์คำสั่ง 2 บรรทัดต่อไปนี้ใน interpreter

from animated_drawings import render
render.start('./examples/config/mvc/export_mp4_example.yaml')

 

จะได้ไฟล์ชื่อ video.mp4 ในโฟลเดอร์ Project

 

สร้างแอนิเมชันและบันทึกเป็นไฟล์ .gif

พิมพ์คำสั่ง 2 บรรทัดต่อไปนี้ใน interpreter

from animated_drawings import render
render.start('./examples/config/mvc/export_gif_example.yaml')

 

จะได้ไฟล์ชื่อ video.gif ในโฟลเดอร์ Project

 

สร้างแอนิเมชันจากตัวการ์ตูนที่เราวาดเอง

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

ในบทความนี้จะสาธิตการสร้าง annotation files สำหรับพี่หมี EPT ที่วาดโดยเด็กน้อยนักเรียนของ EPT ซึ่งพี่หมีจะมีลักษณะคล้ายคนคือมีสองมือและสองขาดังภาพ

ขั้นตอนต่อไปนี้เป็นการใช้ Docker container ที่รัน TorchServe เพื่อสร้าง annotation files ของพี่หมี EPT และแอนิเมชันของพี่หมี EPT

1. ดาวน์โหลดและติดตั้ง Docker Desktop ตามขั้นตอนในเว็บนี้ 

2. รันโปรแกรม Docker Desktop

3. ในกรณีที่ทำต่อจากหัวข้อที่แล้วให้ออกจาก Python interpreter ก่อน โดยกดปุ่ม Ctrl+Z แล้วกด Enter สำหรับเครื่อง Windows

4. ที่หน้าต่าง Anaconda Prompt ให้พิมพ์คำสั่งต่อไปนี้จากโฟลเดอร์ Project เพื่อไปที่โฟลเดอร์ torchserve ที่อยู่ในโฟลเดอร์ Project

ข้อควรระวัง: ดูดี ๆ ระวังผิดโฟลเดอร์นะครับ

cd torchserve



 

5. พิมพ์คำสั่งต่อไปนี้เพื่อสร้าง docker image

หมายเหตุ: ในขั้นตอนนี้จะใช้เวลาค่อนข้างนาน อาจถึง 30 นาทีหรือนานกว่านั้น ขึ้นกับสเปกของเครื่องคอมพิวเตอร์ของผู้เรียน ใจเย็น ๆ นะครับ

docker build -t docker_torchserve .

 

6. พิมพ์คำสั่งต่อไปนี้เพื่อให้เริ่มทำงานและเปิดพอร์ตที่จำเป็น

docker run -d --name docker_torchserve -p 8080:8080 -p 8081:8081 docker_torchserve

 

7. จับเวลารอประมาณ 1 นาทีเพื่อให้ Docker และ TorchServe ทำงานก่อน แล้วทดสอบว่า Docker และ TorchServe ทำงานปกติไหมด้วยการ ping โดยพิมพ์คำสั่ง

curl http://localhost:8080/ping

 

ถ้าได้ผลลัพธ์เป็นข้อความ Healthy ดังภาพแสดงว่าทุกอย่างทำงานปกติพร้อมใช้งาน ถ้าไม่ขึ้นให้รออีก 1 นาทีแล้ว ping อีกครั้ง ถ้ายังไม่ขึ้นข้อความ Healthy แสดงว่า TorchServe ใช้งานไม่ได้ ให้ลองเพิ่ม RAM ของ docker container เป็น 16 GB หรือแก้ไขตามข้อความ Error ที่แจ้งขึ้นมา


 

8. นำรูปตัวการ์ตูนของเรา (ในตัวอย่างนี้คือไฟล์ชื่อ eptbear.png) ไปใส่ไว้ในโฟลเดอร์ examples\drawings ที่อยู่ในโฟลเดอร์ Project


 

9. พิมพ์คำสั่งต่อไปนี้และรันทีละคำสั่งเพื่อไปที่โฟลเดอร์ examples และสั่งให้สร้างแอนิเมชันของตัวการ์ตูนของเรา ในตัวอย่างนี้คือไฟล์ชื่อ eptbear.png ที่อยู่ในโฟลเดอร์ drawings 

หมายเหตุ: อย่าลืมเปลี่ยนชื่อไฟล์ในคำสั่งเป็นชื่อไฟล์ของผู้เรียนเองนะครับ

cd ../examples
python image_to_animation.py drawings/eptbear.png eptbear_out



 

10. รอสักพักจะได้ annotation files และไฟล์แอนิเมชันชื่อ video.gif ในโฟลเดอร์ examples\eptbear_out ที่อยู่ในโฟลเดอร์ Project ดังภาพ

 

สร้างแอนิเมชันแบบมีตัวการ์ตูนหลายตัวพร้อมฉากหลัง

1. วาดไฟล์ฉากหลังที่ต้องการ ในตัวอย่างนี้เป็นภาพขนาดกว้าง 600 pixels สูง 400 pixels และตั้งชื่อว่า eptbackground.png

2. นำไฟล์ฉากหลังไปใส่ไว้ในโฟลเดอร์ examples\eptbear_out ที่ได้ออกมาจากขั้นตอนที่ 10 ในหัวข้อที่แล้ว และสร้าง config file ชื่อ eptconfig.yaml ไว้ที่โฟลเดอร์ examples\eptbear_out นี้ด้วย

ข้อควรระวัง: ชื่อโฟลเดอร์ eptbear_out จะต้องเปลี่ยนให้เป็นชื่อโฟลเดอร์ที่ผู้เรียนได้ออกมาจากขั้นตอนที่ 10 ในหัวข้อที่แล้ว


 

3. เปิดไฟล์ eptconfig.yaml ที่สร้างในขั้นตอนที่แล้วด้วย Text editor เช่น Notepad แล้วพิมพ์การตั้งค่าดังต่อไปนี้ เพื่อกำหนดให้มีตัวการ์ตูน 2 ตัว และฉากหลัง

ข้อควรระวัง: ชื่อโฟลเดอร์ eptbear_out จะต้องเปลี่ยนให้เป็นชื่อโฟลเดอร์ที่ผู้เรียนได้ออกมาจากขั้นตอนที่ 10 ในหัวข้อที่แล้ว 

scene:
  ANIMATED_CHARACTERS:
    - character_cfg: examples/characters/char1/char_cfg.yaml
      motion_cfg: examples/config/motion/dab.yaml
      retarget_cfg: examples/config/retarget/fair1_ppf_duo1.yaml
    - character_cfg: examples/eptbear_out/char_cfg.yaml
      motion_cfg: examples/config/motion/dab.yaml
      retarget_cfg: examples/config/retarget/fair1_ppf_duo2.yaml
controller:
  MODE: video_render
  OUTPUT_VIDEO_PATH: eptbear_out/eptvideo.gif
view:
  CAMERA_POS: [0.1, 1.3, 2.7]
  WINDOW_DIMENSIONS: [600, 400]
  BACKGROUND_IMAGE: examples/eptbear_out/eptbackground.png


 

4. กลับมาที่หน้าต่าง Anaconda Prompt ให้พิมพ์คำสั่งต่อไปนี้เพื่อเริ่มการทำงาน Python interpreter

python

 

5. พิมพ์คำสั่ง 2 บรรทัดต่อไปนี้ใน interpreter

ข้อควรระวัง: ชื่อโฟลเดอร์ eptbear_out จะต้องเปลี่ยนให้เป็นชื่อโฟลเดอร์ที่ผู้เรียนได้ออกมาจากขั้นตอนที่ 10 ในหัวข้อที่แล้ว

from animated_drawings import render
render.start('./examples/eptbear_out/eptconfig.yaml')

 


 

รอสักพักจะได้ไฟล์ชื่อ eptvideo.gif ในโฟลเดอร์ eptbear_out 

ในกรณีที่ต้องการแก้ไขตำแหน่งของตัวการ์ตูน สามารถเปลี่ยนค่าตำแหน่งได้ที่ไฟล์ examples/config/retarget/fair1_ppf_duo1.yaml และ examples/config/retarget/fair1_ppf_duo2.yaml

 

เพียงเท่านี้ก็ได้แอนิเมชันตามที่ต้องการออกมาเรียบร้อยแล้วครับ ไม่ยากเลยใช่ไหมครับ สำหรับผู้ที่ต้องการออกแบบท่าทางเองหรืออยากตั้งค่าอื่น ๆ นอกเหนือจากตัวอย่างในบทความนี้ก็สามารถดูได้จากที่นี่

สุดท้ายนี้สำหรับใครที่สนใจอยากทำ AI แต่ยังไม่มีพื้นฐานเขียนโปรแกรมมาก่อน ขอแนะนำคอร์ส Python + Machine Learning (PY201) หรือคอร์ส Python + Web Programming + Machine Learning (PY203) ของทาง EPT ที่สอนแบบจัดเต็มตั้งแต่พื้นฐาน Python หรือหากมีพื้นฐาน Python แน่น ๆ อยู่แล้วแต่อยากเรียนเกี่ยวกับ AI แบบลงลึกถึงทฤษฎีก็ขอแนะนำคอร์ส Machine Learning (AI701) ครับ

ในบทความต่อไป เราจะมาสร้างไฟล์ที่จะใช้กำหนดท่าทางให้ตัวการ์ตูนทำตามกันครับ

 

ที่มาและเว็บไซต์อ้างอิง

[1] https://github.com/facebookresearch/AnimatedDrawings



บทความนี้อาจจะมีที่ผิด กรุณาตรวจสอบก่อนใช้

หากมีข้อผิดพลาด/ต้องการพูดคุยเพิ่มเติมเกี่ยวกับบทความนี้ กรุณาแจ้งที่ http://m.me/Expert.Programming.Tutor

ไม่อยากอ่าน Tutorial อยากมาเรียนเลยทำอย่างไร?

สมัครเรียน ONLINE ได้ทันทีที่ https://elearn.expert-programming-tutor.com

หรือติดต่อ

085-350-7540 (DTAC)
084-88-00-255 (AIS)
026-111-618
หรือทาง EMAIL: NTPRINTF@GMAIL.COM

แผนที่ ที่ตั้งของอาคารของเรา

C Article


C++ Article


Java Article


C#.NET Article


VB.NET Article


Python Article


Golang Article


JavaScript Article


Perl Article


Lua Article


Rust Article


Article


Python


Python Numpy


Python Machine Learning



แผนผังการเรียนเขียนโปรแกรม

Link อื่นๆ

Allow sites to save and read cookie data.
Cookies are small pieces of data created by sites you visit. They make your online experience easier by saving browsing information. We use cookies to improve your experience on our website. By browsing this website, you agree to our use of cookies.

Copyright (c) 2013 expert-programming-tutor.com. All rights reserved. | 085-350-7540 | 084-88-00-255 | ntprintf@gmail.com

ติดต่อเราได้ที่

085-350-7540 (DTAC)
084-88-00-255 (AIS)
026-111-618
หรือทาง EMAIL: NTPRINTF@GMAIL.COM
แผนที่ ที่ตั้งของอาคารของเรา