Resources

ใช้ Claude Design ตัดต่อวิดีโอ

Prompts + pipeline ที่ใช้จริงในวิดีโอ — copy แล้วใช้ได้เลย ไม่ต้องตั้งค่าอะไรเพิ่ม

Pipeline

MP4source video
Claude Designgenerate HTML
HTMLanimation overlay
Screen Record / Claude Codeexport to mp4

Prompts

กด Copy แล้ว paste ใน Claude Design ได้เลย

EN Landscape
I just gave you a video, an mp4 called 'intro'. I want you to create a landscape video. I want you to animate this so that people can watch the video and there will be text, motion graphics, and animations that sync up and go along with what I'm actually saying in the video. It should be engaging and keep their attention while visually illustrating the concepts.
TH Vertical — แนวตั้ง
ผมอัปไฟล์ intro_parameter.mp4 ไป ช่วยสร้างวิดีโอแนวตั้ง แบบมี animation มี text , motion graphic และ effect ต่างๆ เพื่อให้คนดูแล้วน่าสนใจน่าติดตาม animation ที่ใส่เข้าไปต้อง sync กับสิ่งที่พูดในวิดีโอ ผลลัพธ์ต้องน่าสนใจ น่าดูต่อ สะกดคนดูได้ และมี visual illustration ไปในทางเดียวกับเนื้อหาของวิดีโอ
With Brand Assets
Please create a branded HTML video animation using these assets:

Brand color: [HEX]
Logo: [attached or described]
Font: [name]
Style: [minimal/bold/playful]
Include: animated intro card, caption overlays, outro with CTA
Output: single HTML file
Face Repositioning

ต้องใช้ source วิดีโอแบบ vertical/cropped เท่านั้น — ไม่ work กับ horizontal

This is a vertical/cropped video. Please reposition the face to the upper-right
quadrant and add animated text in the lower half. Use the freed space for:

Animated stats or key points
Caption overlays
Brand watermark bottom-left
Output as HTML.

วิธีเอาวิดีโอออกจาก Claude Design

Claude Design ให้ผลลัพธ์เป็น HTML — มี 3 วิธีแปลงเป็นไฟล์วิดีโอ

01ง่ายที่สุด

Screen Capture

  1. 1.เปิด HTML ใน browser แบบ fullscreen
  2. 2.ใช้ QuickTime / OBS บันทึกหน้าจอ
  3. 3.Play วิดีโอ แล้ว record ไปพร้อมกัน
  4. 4.Export เป็น .mp4
02แนะนำ

Claude Code + Handoff

  1. 1.คลิก "Share to Claude Code" ใน Claude Design
  2. 2.Claude Code รับ HTML + assets ต่อ
  3. 3.สั่งให้ render เป็น mp4 ด้วย Puppeteer / ffmpeg
  4. 4.ได้ไฟล์ mp4 โดยตรง
03ยืดหยุ่น

Copy HTML → Claude Code

  1. 1.Copy source HTML จาก Claude Design
  2. 2.Paste ให้ Claude Code พร้อม instruction
  3. 3.บอกให้ render + export เป็น "mp4 ด้วย headless browser"
  4. 4.ปรับแต่ง output ได้เต็มที่

Limitations

สิ่งที่ควรรู้ก่อนใช้
  • Output เป็น HTML ไม่ใช่ .mp4 — ต้อง screen record หรือส่งต่อ Claude Code
  • ต้นทุน token ~$3.13 ต่อ 30 วินาที
  • Face repositioning ทำได้เฉพาะ vertical source เท่านั้น
  • ไม่ใช่ NLE — เหมาะสำหรับ motion graphics / captions / lower thirds

อยากเรียนรู้เพิ่มเติม? Subscribe เลย

วิดีโอใหม่ทุกสัปดาห์ — AI tools, prompts, และ workflows ใช้งานได้จริง