DEV Community

Nokka
Nokka

Posted on AI-assisted

คลิปไวรัลจาก AI ที่คุณดูอยู่ อาจเป็นโค้ด HTML ไม่ใช่วิดีโอ?

โดย Nokka (นก-กา) | 5 พ.ย. 2026

บทความนี้เขียนโดย AI (deepseek-v4.1-flash · ผู้ให้บริการโมเดล: ollama-cloud) ผ่าน Hermes Agent ภายใต้การควบคุมและตรวจสอบคุณภาพโดยมนุษย์ - Nokka (นก-กา)

ภาพประกอบ: ห้องมืดที่มีกรอบแสงสี่เหลี่ยมลอยอยู่กลางอากาศ ข้างในมีเส้นแสงเคลื่อนไหวคล้ายแอนิเมชัน

คลิปที่คุณกำลังดูอาจไม่มีไฟล์วิดีโออยู่เลย

ไม่มีกล้อง ไม่มีทีมตัดต่อ ไม่มีไฟล์ mp4 ที่ส่งต่อกันในแชต

สิ่งที่วิ่งอยู่ในเบราว์เซอร์คือโค้ดชุดเดียวที่ AI เขียนขึ้นตามคำสั่งสั้น ๆ ของคนคนหนึ่ง

ปลายเดือนกันยายน 2026 คลิปแบบนี้เริ่มถูกแชร์กันให้ว่อน ผมเองก็รู้จักมันจากโพสต์สรุปของเพจ Vibe Coding Thailand [6]

คลังที่มีพร้อมต์อยู่ 703 อัน

คลังนั้นชื่อ awesome-opus5-5-videos บน GitHub [3]

มันเก็บคลิปที่คนทำด้วย Claude Opus 5.5 พร้อมพร้อมต์ที่เจ้าของแชร์ไว้

ณ วันที่ผมเขียนบทความนี้ คลังมีดาว 13,674 ดวง และมีคน fork 1,446 ครั้ง [3] ในไฟล์ข้อมูลมีชื่อผู้สร้างไม่ซ้ำกัน 616 คน [4]

ผมเปิดไฟล์ข้อมูลดิบในรีโปมานับเอง ไม่ได้อ่านจากคำโปรย

ผลออกมาตรงกับที่รีโปเขียนไว้ คือมีพร้อมต์ 703 อัน [4]

ในจำนวนนั้น 418 อันมี "เรมิก" คือเวอร์ชันที่ Skillry รันใหม่จากพร้อมต์เดียวกันแล้วอัดวิดีโอเทียบให้ดู [5]

อีก 285 อันมีแค่คลิปต้นฉบับกับพร้อมต์ [4]

และในหน้าแรกของรีโป มีไฮไลต์ 100 คลิป ซึ่งรีโปบอกว่าคัดมาแบบหนึ่งคลิปต่อหนึ่งพร้อมต์ที่ไม่ซ้ำกัน [3]

แล้ว Opus 5.5 เกี่ยวกับเรื่องนี้ตรงไหน

Anthropic เปิดตัว Claude Opus 5.5 เมื่อ 22 กันยายน 2026 [1]

จุดที่เกี่ยวกับเรื่องนี้คือมันเก่งงานเขียนโค้ดฝั่งหน้าจอมาก

Anthropic เล่าว่าในงานจูนความเร็วเว็บแอป มีเทสต์หนึ่งสั่งให้ลดเวลาโหลดทุกหน้า โมเดลทำสำเร็จ 39 จาก 40 ครั้ง [1]

อีกรายเล่าว่ามีคนให้โมเดล Claude หลายตัวสร้างเกมจากพร้อมต์เดียว แล้ว Opus 5.5 ได้คะแนนด้านภาพและความเนียนสูงที่สุดในกลุ่ม [1]

อินพุตหนึ่งล้านโทเคนคิด 4 ดอลลาร์ [1] ส่วนขาออกที่ความยาวเท่ากันคิด 20 ดอลลาร์ [1] ถูกกว่า Opus 5 อยู่ 20 เปอร์เซ็นต์ และเป็นตัวเลขเดียวกับที่ Reuters ยืนยัน [2]

ส่วนค่าอ่านแคชเหลือ 0.20 ดอลลาร์ต่อล้านโทเคน ซึ่งเป็นส่วนที่กินเงินมากที่สุดในงานเขียนโค้ด [1]

นี่คือเหตุผลทางเศรษฐศาสตร์ที่ทำให้คนกล้าสั่งให้ AI วาดแอนิเมชันทั้งเรื่อง แทนที่จะซื้อไลเซนส์ซอฟต์แวร์ตัดต่อ

ทำไมโค้ดถึงได้เปรียบไฟล์พิกเซล

ลองนึกภาพคลิปแก้วค็อกเทลที่วัตถุดิบลอยลงแก้วทีละชิ้น

ถ้าเป็นไฟล์วิดีโอ การจะขยับจังหวะให้ช้าลงครึ่งวินาทีหมายถึงการตัดต่อใหม่ทั้งท่อน

ถ้าเป็นโค้ด การขยับคือการแก้ตัวเลขตัวเดียว

ความต่างที่ทบกันหลายรอบ

ความต่างข้อนี้ฟังดูเล็ก แต่ผลมันทบกันหลายรอบ

ข้อแรก แก้ทีละจุดได้ เพราะโค้ดแยกเป็นชิ้น ส่วนวิดีโอรวมทุกอย่างไว้ในพิกเซลเดียวกัน

ข้อสอง ปรับขนาดได้ ไฟล์เดียวใช้ได้ทั้งจอตั้ง จอนอน และจอสี่เหลี่ยม โดยไม่ต้องเรนเดอร์ใหม่

ข้อสาม อ่านออกว่าอะไรเปลี่ยน ถ้าเก็บโค้ดไว้ใน git คุณเห็นได้ว่าวันนี้แก้สีหรือแก้ความเร็ว และย้อนกลับได้

ข้อสี่ ไฟล์เล็กกว่ามาก ในหลายกรณี หน้า HTML ไฟล์เดียวเบากว่าคลิปความละเอียดสูงที่ความยาวเท่ากัน

ข้อนี้ไม่ใช่กฎตายตัว ขึ้นกับงาน แต่เป็นเหตุผลที่คนทำคอนเทนต์เริ่มสนใจ

แท็กในคลังบอกว่าควรเลือกอะไร

ในไฟล์ข้อมูลมีแท็กกำกับว่าแต่ละคลิปสร้างด้วยเครื่องมืออะไร [4]

ผมนับดูแล้วได้ภาพแบบนี้

  • canvas 267 อัน เป็นกลุ่มใหญ่สุด เหมาะกับงานวาดซ้ำ ๆ ทุกเฟรม เช่น อนุภาค กราฟ หรือเกมเล็ก
  • svg 183 อัน เหมาะกับเส้นคม ตัวอักษร และภาพที่ต้องคมทุกขนาดจอ
  • threejs 131 อัน คือสายสามมิติ
  • shader 92 อัน สำหรับเอฟเฟกต์ที่ต้องใช้ GPU
  • gsap 86 อัน เป็นไลบรารีจัดจังหวะและ easing
  • css 57 อัน สำหรับงานง่ายที่ไม่ต้องเขียนลูปเอง
  • audio 39 อัน และ playable 22 อัน สำหรับงานที่มีเสียงหรือเล่นได้จริง

ตัวอย่างที่ผมชอบคือพร้อมต์ของ @Ror_Fly ที่สั่งสั้นมาก [4]

"ลองทดสอบหน่อยได้ไหม คุณช่วยเรนเดอร์แอนิเมชันกราฟิกเคลื่อนไหวสูตรค็อกเทลด้วยจาวาสคริปต์หรือ HTML ให้ดูสูตรตั้งแต่ต้นจนจบ ... ควรเป็นวิดีโอ 30 วินาที" (แปลจากอังกฤษ)

ไม่มีสเปกสี ไม่มีขนาดจอ ไม่มีรายละเอียดการเคลื่อนไหว

โมเดลต้องเติมทุกอย่างที่เหลือเอง

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

ตัวเลขสามตัวที่คนอ่านสับสน

README ของรีโปแยกเลขสามตัวนี้ไว้ชัดว่ามันนับคนละอย่าง [3]

703 คือจำนวนพร้อมต์ทั้งหมดในคลัง

418 คือจำนวนพร้อมต์ที่ Skillry นำไปรันใหม่และมีวิดีโอเทียบให้ดู [5]

100 คือจำนวนคลิปที่ถูกไฮไลต์บนหน้าแรก

ถ้าจำสามตัวนี้ปนกัน คุณจะคิดว่าคลิปทั้ง 703 อันถูกรันใหม่ทั้งหมด ซึ่งจริง ๆ มีเรมิกแค่ 418 อัน อีก 285 อันมีแค่คลิปต้นฉบับกับพร้อมต์ของเจ้าของ [3][4]

มันเป็นความต่างเล็ก ๆ ที่ทำให้คนประเมินขนาดของกระแสนี้ผิด

ลองเองได้ในสามขั้น

รีโปเขียนวิธีใช้ไว้สั้น ๆ สามขั้น [3]

หนึ่ง เปิดไฟล์พร้อมต์ แล้วคัดลอกบล็อกใต้หัวข้อ Prompt

สอง วางใน Claude Opus 5.5 ไม่ว่าจะผ่าน Claude Code แอป Claude หรือเอเจนต์ที่รันโมเดลนี้

สาม สั่งให้เรนเดอร์ออกมาเป็นไฟล์ HTML ไฟล์เดียว แล้วอัดหน้าจอถ้าอยากได้เป็นวิดีโอ

ถ้าจะให้ผมสรุปเป็นภาพ มีแค่นี้

prompt.md  →  Opus 5.5  →  index.html  →  อัดหน้าจอ  →  คลิป
Enter fullscreen mode Exit fullscreen mode

จุดที่น่าสนใจคือขั้นสุดท้าย

"วิดีโอ" กลายเป็นผลพลอยได้จากการอัดหน้าจอ ไม่ใช่ผลลัพธ์หลักของงาน

เรื่องที่ต้องรู้ก่อนเอาไปใช้กับงานลูกค้า

ผมมีสี่เรื่องที่อยากเตือน

เรื่องแรก พร้อมต์จำนวนมากไม่ครบ

ใน 703 อัน มี 207 อันที่เจ้าของแชร์มาไม่เต็ม หรือแค่เล่าผลลัพธ์ในโพสต์ [4] คิดเป็นเกือบสามในสิบ

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

เรื่องที่สอง เรมิกไม่ใช่ต้นฉบับ

418 อันที่มีวิดีโอเทียบ เป็นการรันใหม่โดย Skillry ไม่ใช่ไฟล์เดียวกับที่เจ้าของทำ [5]

ความต่างอาจเล็กจนดูไม่ออก หรือใหญ่จนคนละเรื่องก็ได้

และเว็บที่โฮสต์เรมิกคือ Skillry ซึ่งมีทั้งหน้าขายแพ็กเกจและ FAQ การยกเลิกสมาชิกอยู่ในหน้าเดียวกัน [5] เวลาอ้างอิง ผมจึงระบุชื่อเว็บกำกับไว้ทุกครั้ง

เรื่องที่สามที่ผมจะเพิ่มเอง สัญญาอนุญาตไม่ได้แปลว่าพร้อมต์เป็นของคุณ

ตัวรีโปเป็น MIT [3] แต่รีโปเขียนไว้ชัดว่า คลิปและพร้อมต์เป็นของนักสร้างแต่ละคน และถ้าเจ้าของอยากให้แก้หรือลบ ให้เปิด issue [3]

แปลว่าคุณใช้โค้ดของรีโปได้ แต่การหยิบพร้อมต์ของคนอื่นไปขายต่อเป็นงานลูกค้า เป็นอีกเรื่องที่ต้องคิด

เรื่องที่สี่ งานแบบนี้หนักที่เบราว์เซอร์

ในมุมมองของผม คลิปที่ดูลื่นบนคอมอาจกระตุกบนมือถือ โดยเฉพาะงานกลุ่ม threejs ที่มี 131 รายการ และ shader ที่มี 92 รายการ [4]

ก่อนส่งงาน ต้องลองบนเครื่องจริง ไม่ใช่ดูจากวิดีโอที่อัดมา

สิ่งที่ผมคิดว่าคนทำคอนเทนต์ควรจับตา

คลิปพวกนี้ไม่ได้บอกว่าโมเดลวิดีโอหมดอนาคต

มันบอกว่ามีอีกเส้นทางหนึ่งที่ถูกกว่าและแก้ง่ายกว่า สำหรับงานที่ไม่ต้องการความสมจริงระดับหนัง

เส้นทางนั้นคือการย้าย "วิดีโอ" ไปเป็น "หน้าเว็บที่เคลื่อนไหวได้"

และผลข้างเคียงที่น่าสนใจคือ ทักษะที่ต้องใช้ไม่ใช่การตัดต่อ

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

ทั้งหมดนี้เป็นทักษะของคนทำงานหน้าเว็บอยู่แล้ว

เพียงแต่ตอนนี้มันถูกใช้ผลิตสิ่งที่คนเรียกกันว่าวิดีโอ

แหล่งอ้างอิง

[1] Anthropic, "Claude Opus 5.5", 22 ก.ย. 2026 - https://www.anthropic.com/claude-opus-5-5
[2] Reuters, "Anthropic unveils Claude Opus 5.5", 22 ก.ย. 2026 - https://www.reuters.com/business/anthropic-unveils-claude-opus-55-2026-09-22/
[3] yihui-dev, "awesome-opus5-5-videos" (GitHub repo: README และ LICENSE), 2026 - https://github.com/yihui-dev/awesome-opus5-5-videos
[4] yihui-dev, "data/videos.json" และโฟลเดอร์ prompts/, GitHub, 2026 - https://raw.githubusercontent.com/yihui-dev/awesome-opus5-5-videos/main/data/videos.json
[5] Skillry, "Opus 5.5 videos", 2026 - https://skillry.dev/ai-videos/opus-5-5
[6] Vibe Coding Thailand, โพสต์วิดีโอเกี่ยวกับคลังนี้, Facebook, 2026 - https://www.facebook.com/share/v/1Cuq3cybe2/

Top comments (0)