การตัดต่อ Video ด้วย Claude Code และ Remotion
ถ้าการตัดต่อทำได้ด้วยโค้ด แปลว่าการปรับแก้ สามารถทำได้ด้วย Claude Code
สวัสดีครับทุกคน หัวหน้าฮงกลับมาแล้ว วันก่อนฮงไปเจอคลิปสอนการตัดต่อ video ของ June Aekkaluk ด้วย Claude code และใช้ tool ชื่อ Remotion ซึ่งเดี่ยวฮงจะมาสรุปให้ฟังครับ 🚀
Outline
- Remotion คืออะไร
- การติดตั้ง
- ตัวอย่างการ prompt เพื่อตัดต่อ video
Remotion คืออะไร 🎥
Remotion เป็น tool (library) ที่เขียนด้วยภาษา javascript, typescript เพื่อใช้สำหรับการตัดต่อ video ซึ่งเหมือนกับการทำ website เลย
ใช้งานผ่าน google chrome browser ได้เลย
✅ สามารถวาง element ข้อความ รูปภาพ รูปทรงต่างๆ บน frame/scene ของเราได้ ✅ สามารถปรับแก้ transition event (fade in, fade out, etc) ได้ ✅ ใส่ เพลง ✅ มี UI ในการปรับแก้ และเล่น video ได้ด้วยตัวเอง
การติดตั้ง ⬇️
สิ่งจำเป็นสำหรับ การใช้งาน Claude + Remotion คือ
-
Claude Code - ซึ่งเราสามารถใช้งานได้ผ่าน 3 วิธี 1️⃣ การใช้งาน ผ่าน Claude Code CLI (รับใน cmd/terminal) 2️⃣ Claude app (อันเดียวกับที่รัน Claude cowork) 3️⃣ Claude extension ใน VS Code ซึ่งใน video สอนการติดตั้ง วิธีนี้ https://claude.com/download
-
Text Editor เครื่องมือสำหรับการเขียนโค้ด เช่น VS Code, Cursor AI https://code.visualstudio.com/download
-
Node JS - Remotion ถูกเขียนในภาษา javascript, typescript เราเลยต้องการ Node JS ซึ่งเป็นเครื่องมือที่ใช้ในการรันโปรแกรมนี้ https://nodejs.org/en/download
ในการติดตั้ง project การสามารถ setup project ได้ด้วยคำสั่ง npx create-video@latest
ซึ่งจะให้เราเลือกว่าจะติดตั้งแบบไหน จากใน video เราเลือก blank project ตามคุณจูนได้เลย
ข้อดีคือ การติดตั้งผ่านคำสั่งนี้ คือ เราจะได้ AI skill ที่ช่วยในการตัดต่อ video มาเลย ว้าวมาก 🥳
ตัวอย่างการ prompt เพื่อตัดต่อ video 🎥
คุณจูนต้องการสร้าง video โปรโมท website สำหรับให้ข้อมูและรณรงค์การเลือกตั้ง และใช้ตัวอย่าง prompt ตามนี้
สร้าง video animation แนวนอนขนาด 16:9
สำหรับรณรงค์ให้ทุกคนมีส่วนร่วมในการเลือกตั้งปี 69
โดยใช้ข้อมูล, รูปภาพ, โทนสีและฟอนต์จากเว็ปไซต์อ้างอิง
ประกอบการนำเสนอ https://conforall.com
ซึ่งเราสามารถกำหนด รายละเอียดต่างๆได้ดังนี้
- ratio สัดส่วนของ video: (16:9 หรือ 4:3) หรือแล้วแต่เราจะกำหนด
- ข้อมูล, รูปภาพ: ซึ่งเป็นเนื้อหาของ video
- โทนสีและฟอนต์: styling
เราสามารถให้แหล่งอ้างอิงเป็นลิ้ง website ได้ ซึ่ง Claude จะไปหารายละเอียดมาเพิ่มเอง
ซึ่งเราสามารถใช้ สำหรับนี้ร่วมกับ skill อื่นๆ เช่น /grill-me หรือ /grill-with-docs เพื่อใช้ในการพูดคุยรายละเอียดและแนวทางการตัดต่อ video ได้
และการสั่ง Claude ปรับแก้ไขรายละเอียดได้ในภายหลังด้วย 🥳
สรุปโดยหัวหน้าฮง
Remotion เป็นเครื่องมือที่ช่วยแก้ปัญหาการตัดต่อด้วยโค้ด ทำให้เราสามารถกำหนดสิ่งต่างๆได้เหมือน program
ยิ่งใช้ผ่าน ภาษา javascript/typescript ซึ่งเป็นภาษายอดนิยม ในการทำ website ทำให้เรามีลูกเล่นในการทำ video เพิ่มขึ้น
และเพราะเป็นโค้ด เราสามารถที่จะกำหนด design system (company branding - font, color, theme) ได้ และทุก video นำเสนอที่เราทำด้วย AI จะมีลักษณะเหมือนกัน
หวังว่าบทความนี้จะเป็นประโยคนะครับ ถ้าใช้ Remotion แล้ว มาแลกเปลี่ยนประสบการณ์กันได้ครับ ลิ้ง video ใน comment ครับ
ขอบคุณครับ