สร้างวิดีโอแรกด้วย Prompt เดียว | Prompt-First Video: สร้างวิดีโอด้วย HyperFrames + Claude Code | Vibe Coding Thailand$ cat 05-first-video-with-one-prompt.md บทที่ 5สร้างวิดีโอแรกด้วย Prompt เดียว
ตอนนี้โปรเจกต์พร้อมแล้ว
Claude อ่าน official HyperFrames repo แล้ว และติดตั้ง HyperFrames skills แล้ว
บทนี้เราจะสร้างวิดีโอแรก แต่มีหลักสำคัญหนึ่งข้อ:
ระหว่างลองงาน ให้ดูจาก HTML preview ก่อน อย่า render MP4 ทุกครั้ง
การ render MP4 ช้ากว่า เพราะต้องแปลงทุก frame เป็นไฟล์วิดีโอจริง
ตอนทำงานจริง workflow ที่เร็วกว่า คือ:
- ให้ Claude สร้าง/แก้ไฟล์ HTML ของ HyperFrames
- เปิด preview แล้วกด play ดูใน browser
- สั่งแก้จากสิ่งที่เห็น
- วนแบบนี้จนพอใจ
- ค่อย render MP4 final ครั้งเดียว หรือเฉพาะตอนต้องส่งงาน
นี่คือวิธีที่ควรใช้จริง
ภาพตัวอย่างการสร้างวิดีโอแรกแบบ HTML preview ก่อน render MP4
ภาพนี้ย้ำจังหวะทำงานจริง: เริ่มจาก prompt เดียว ให้ Claude สร้าง HTML preview ก่อน แก้จนพอใจ แล้วค่อยปลดล็อกขั้น final render เป็น MP4
วิดีโอแรกควรเรียบง่าย
อย่าเริ่มด้วยวิดีโอที่ซับซ้อนเกินไป
วิดีโอแรกควรมีแค่นี้พอ
- ความยาว 10–15 วินาที
- แนวตั้ง 9:16
- ข้อความ 3 ประเด็น
- พื้นหลังเคลื่อนไหวง่ายๆ
- caption อ่านง่าย
- outro สั้นๆ
- preview ได้เร็วใน browser
รอบแรกยังไม่ต้องรีบ render MP4
โครง prompt สำหรับวิดีโอ
เวลาสั่ง Claude ให้สร้างวิดีโอ ให้บอก 8 อย่างนี้
- สัดส่วน — แนวตั้ง 9:16, แนวนอน 16:9, หรือ square
- ความยาว — เช่น 12 วินาที
หัวข้อ — วิดีโอพูดเรื่องอะไรกลุ่มคนดู — ใครจะดูวิดีโอนี้สไตล์ — สดใส, มินิมอล, พรีเมียม, สนุก, จริงจังข้อความบนจอ — ประเด็นหลักที่ต้องขึ้นในวิดีโอโหมดทำงาน — ให้ทำเป็น HTML preview ก่อนเงื่อนไข final — ห้าม render MP4 จนกว่าจะสั่งว่า finalข้อ 7 และ 8 สำคัญมาก เพราะช่วยประหยัดเวลา
Prompt สร้างวิดีโอแรกแบบ preview-first
หลังส่ง prompt นี้ ให้ Claude ทำไฟล์และเปิด preview
Screenshot: หน้า official docs ของ HyperFrames CLIภาพนี้ใช้ยืนยันว่าเรื่อง preview/check/render เป็นงานฝั่งเครื่องมือ HyperFrames CLI แต่ในเล่มนี้คุณไม่ต้องจำคำสั่ง ให้ Claude เป็นคนจัดการและอธิบายก่อนรัน
ถ้า Claude ขออนุมัติรันคำสั่งเพื่อเปิด preview ให้ดูว่าคำสั่งเกี่ยวกับโปรเจกต์นี้จริงไหม แล้วอนุมัติ
ถ้า Claude รีบ render MP4
บางครั้ง Claude อาจทำตามนิสัยเดิม คือสร้างเสร็จแล้ว render ทันที
จำไว้: preview ก่อน render เสมอ
วิธีดูวิดีโอรอบแรก
เมื่อ Claude เปิด preview หรือบอก URL ให้คุณแล้ว ให้ดู 5 อย่าง
- hook 2 วินาทีแรกดึงความสนใจไหม
- ข้อความไทยอ่านง่ายไหม
- มีอะไรล้นจอไหม
- animation รกเกินไปไหม
- call to action ตอนท้ายชัดไหม
ยังไม่ต้องสนใจความ perfect
ขอแค่เห็นว่าโครงวิดีโอถูกทาง
ถ้าข้อความล้นจอ
การแก้แบบนี้จะเร็วกว่า render ใหม่ทุกครั้งมาก
ถ้าพอใจแล้วค่อย final render
เมื่อดู preview แล้วพอใจ ค่อยสั่ง render เป็น MP4
คำว่า “ตอนนี้อนุญาตให้ render MP4 ได้” ช่วยให้ Claude รู้ว่าผ่านขั้น preview แล้ว
ถ้าต้องการเก็บเวอร์ชัน
ให้ใช้เวอร์ชันเฉพาะตอน render final หรือ milestone สำคัญ
วิธีนี้ทำให้โฟลเดอร์ไม่รกและประหยัดเวลา
เช็กก่อนจบบท
ก่อนข้ามไปบทต่อไป คุณควรทำได้
- ให้ Claude สร้างวิดีโอเป็น HTML preview
- เปิด preview แล้วกด play ดูได้
- แก้ข้อความหรือ layout โดยไม่ render MP4 ทุกครั้ง
- เข้าใจว่า MP4 ควร render เมื่อพอใจแล้วเท่านั้น
บทต่อไปเราจะใช้หลัก preview-first นี้กับการแก้งานหลายรอบ เหมือนคุยกับ editor จริงๆ
อัปเดตล่าสุด: 25 พ.ค. 2569
ความคิดเห็น
ยังไม่มีความคิดเห็น
เป็นคนแรกได้เลย