Hallmark คืออะไร? สกิลที่บังคับให้ AI ทำเว็บไม่ให้ดูเป็น AI

โดย Nokka (นก-กา) | ตรวจข้อมูล 29 ต.ค. 2026

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

ถ้าคุณเคยให้ AI สร้างหน้าเว็บสักสิบหน้า คุณคงสังเกตเห็นอะไรบางอย่าง

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

ผมคิดว่าความเหมือนนี้ไม่ใช่เรื่องบังเอิญ มันออกมาจากที่เดียวกัน คือรูปแบบที่โมเดลเรียนจากหน้าเว็บจำนวนมหาศาล

ผมเจอเครื่องมือที่สร้างมาเพื่อสู้กับเรื่องนี้โดยเฉพาะจากคลิปของ @aijaidee10 [1] มันชื่อ Hallmark

Hallmark คืออะไร

Hallmark เป็นสกิลสำหรับ AI coding agent ใช้ได้กับ Claude Code, Codex, Cursor และ OpenCode [2]

จุดยืนของมันเขียนไว้ชัดในรีโป คือ "ปฏิเสธที่จะดูเหมือนงานที่ AI สร้าง" และมันทำงานโดยการบังคับกฎ แล้วปล่อยให้โมเดลทำงานต่อ [3]

ตัวเลข ณ วันที่ผมตรวจคือ 40,998 ดาว 2,126 forks สัญญาอนุญาต MIT สร้างเมื่อ 27 เม.ย. 2026 และอัปเดตล่าสุด 28 ต.ค. 2026 [2]

รีโปนี้พัฒนาโดยทีม Together AI ตามที่ระบุใน README [3]

กลไกที่ทำให้มันต่างจาก prompt สวย ๆ

สกิลออกแบบเว็บทั่วไปมักเป็นไฟล์ Markdown ที่บอกว่า "จงออกแบบให้สวย ทันสมัย อย่าใช้สีฉูดฉาด"

Hallmark ไม่ได้หยุดที่คำแนะนำ แต่มีด่านตรวจที่รันโค้ดจริง

ขั้นที่ 1: อ่านโปรเจกต์ก่อนออกแบบ

ก่อนเริ่ม มันจะอ่านโปรเจกต์เพื่อดูฟอนต์ ชุดสี เฟรมเวิร์ก และไฟล์ design.md ที่ถูกล็อกไว้ แล้วถามหาวัสดุจริงอย่างรูปถ่าย ภาพหน้าจอ และตัวเลขจริง [3]

จุดนี้สำคัญเพราะปัญหาหนึ่งของงาน AI คือการแต่งข้อมูลขึ้นมา ถ้าไม่มีข้อมูลจริง มันจะไม่ยอมแต่ง

ขั้นที่ 2: แจกธีมสามจากห้าสิบ

คำสั่ง theme.mjs deal จะเลือกธีมสามชุดที่เข้ากับโจทย์ และกันไม่ให้ซ้ำกับสามงานล่าสุดที่บันทึกไว้ใน log [3]

ธีมแต่ละชุดเป็น "วัสดุ" ไม่ใช่ "แผนผัง" มันกำหนดเนื้อสัมผัส สี ตัวอักษร และคอมโพเนนต์ แต่ไม่กำหนดว่าแต่ละหน้าต้องมีอะไรบ้าง [3]

ผลคือสองงานที่ใช้ธีมเดียวกันจะออกมาไม่เหมือนกัน

ขั้นที่ 3: สร้างเฉพาะส่วนหัวก่อน

ตรงนี้คือหัวใจของวิธีคิด มันบังคับให้สร้าง hero ให้เสร็จก่อน แล้วเรนเดอร์ออกมาดูด้วยตาเปล่าก่อนที่ส่วนอื่นจะถูกสร้าง [3]

ถ้าส่วนหัวยังไม่ดี ส่วนที่เหลือก็ไม่ต้องเสียเวลา

ขั้นที่ 4: ตรวจด้วย linter ที่รันในเบราว์เซอร์จริง

sloplint.mjs --render จะเปิดหน้าเว็บจริงที่ความกว้างแปดระดับ แล้วตรวจสัญญาณที่อ่านแล้วรู้ว่าเครื่องทำ [3]

จากนั้นมี subagent อีกตัวที่เข้ามาอ่านด้วย "สายตาใหม่" คือบริบทเปล่า ไม่รู้ว่าใครเขียนอะไร เพื่อตรวจรอบสุดท้าย [3]

สัญญาณที่มันจับ

ผมอ่านรายการที่ Hallmark ใช้จับแล้ว คิดว่านี่คือส่วนที่มีค่าที่สุดของรีโป เพราะมันคือรายการอาการของงานออกแบบที่ AI ทำบ่อย [3]

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

README ไม่ได้อ้างงานวิจัยรองรับรายการนี้ นิยามของมันคือ "สัญญาณที่อ่านแล้วรู้ว่าเครื่องทำ" ส่วนเกตบางตัวถูกตั้งเป็นกฎประจำบ้าน เพราะมันคือค่าตั้งต้นที่โมเดลตกไปเอง [3]

ด่านสามชั้นที่ออกแบบมาดี

สิ่งที่ผมชอบที่สุดใน Hallmark คือการแบ่งด่านเป็นสามระดับ ไม่ใช่การบังคับทุกอย่างเท่ากัน [3]

• Floor ห้ามผ่านเด็ดขาด ได้แก่ คอนทราสต์ การเข้าถึงด้วยคีย์บอร์ด การลดการเคลื่อนไหว ข้อมูลที่กุขึ้น และเลย์เอาต์มือถือที่พัง
• Reflex คือพฤติกรรมที่โมเดลมักทำโดยอัตโนมัติ ถ้าทำงานนี้มีเหตุผลจริงสามารถ override ได้ แต่ต้องบันทึกไว้
• Finish คือรายละเอียดงานฝีมือที่ไม่บล็อกการส่งงานเด็ดขาด

การออกแบบแบบนี้ฉลาดเพราะมันแยก "ข้อผิดพลาดที่ยอมรับไม่ได้" ออกจาก "รสนิยม"

ถ้าบังคับทุกอย่างเท่ากัน เครื่องมือจะกลายเป็นคุกที่ไม่มีใครใช้

เรื่องลิขสิทธิ์ที่หลายคนมองข้าม

จุดที่ผมคิดว่าน่าสนใจที่สุดใน README ไม่ใช่เรื่องดีไซน์ แต่เป็นเรื่องภาพถ่าย

Hallmark มีคลังภาพ 755 รูปที่ลิขสิทธิ์แบบเปิด แต่ละรูปมีเงื่อนไขของตัวเอง ทั้ง CC0 สาธารณสมบัติ CC BY และ CC BY-SA และมันเครดิตทุกครั้งที่ใช้ [3]

มันระบุชัดว่า ไม่ใช้ Unsplash, Pexels หรือ Pixabay เพราะเงื่อนไขของเว็บเหล่านี้ห้ามเครื่องมือ AI เลือกภาพ [3]

รายละเอียดนี้บอกอะไรบางอย่างเกี่ยวกับวุฒิภาวะของทีมที่ทำ เพราะมันเป็นจุดที่เครื่องมืออื่นมองข้ามง่ายมาก

โหมดที่ผมคิดว่าใช้งานได้จริงที่สุด

นอกจากสร้างใหม่ Hallmark ยังมีสองโหมดที่ผมคิดว่ามีประโยชน์กับงานจริงมากกว่า [3]

• /hallmark redesign <path> สร้างหน้าใหม่โดยคงเนื้อหาและการเชื่อมต่อเดิมไว้
• /hallmark audit <path> ตรวจเฉย ๆ ไม่แก้อะไร

จุดที่ฉลาดคือก่อนรีดีไซน์ มันจะบันทึกลิงก์ ฟิลด์ ตัวจัดการเหตุการณ์ และหัวข้อทั้งหมดไว้ก่อน แล้วมีคำสั่ง --kept ที่จะทำให้งานล้มเหลวถ้าองค์ประกอบใดหายไป [3]

แปลว่ามันออกแบบมาเพื่อกันความผิดพลาดที่พบบ่อยที่สุดของการให้ AI รื้อโค้ด นั่นคือการทำของเดิมหาย

วิธีติดตั้ง

คำสั่งติดตั้งสั้นมาก และรองรับหลายเครื่องมือ [3]

npx skills add nutlope/hallmark -g

ต้องใช้ Node 18 ขึ้นไป ถ้าต้องการให้ตรวจในเบราว์เซอร์ด้วย ต้องติดตั้ง puppeteer-core และ Chrome เพิ่ม ถ้าไม่มีสองตัวนี้ การตรวจแบบ static ก็ยังทำงานได้ [3]

สำหรับ Claude Code ติดตั้งเป็นปลั๊กอินได้ด้วยคำสั่ง /plugin marketplace add nutlope/hallmark [3]

ข้อจำกัดที่ต้องพูดตรง ๆ

ดาวสี่หมื่นดวงในหกเดือนเป็นสัญญาณความสนใจ ไม่ใช่หลักฐานคุณภาพ

และ Hallmark ไม่ใช่ตัวแรกในตลาดนี้ README เองไล่รายชื่อแรงบันดาลใจไว้เก้ารายการ ทั้ง Impeccable, frontend-design ของ Anthropic, Kami และ taste-skill [3]

แปลว่าปัญหา "AI ทำเว็บซ้ำกัน" เป็นปัญหาที่คนจำนวนมากกำลังแก้ และยังไม่มีใครชนะขาด

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

ถ้าเนื้อหาว่าง ดีไซน์ดีแค่ไหนก็ไม่ช่วย

สิ่งที่คนทำเว็บไทยเอาไปใช้ได้เลย

ถึงคุณจะไม่ติดตั้ง Hallmark รายการด้านล่างนี้เอาไปใช้ตรวจงานตัวเองได้ทันที

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

ถ้าจะสรุปเป็นประโยคเดียว Hallmark ไม่ได้สอน AI ให้สวยขึ้น แต่สอนให้มันตรวจงานตัวเองด้วยกฎที่เขียนไว้ก่อน แล้วยอมให้มนุษย์เป็นคนตัดสินใจเรื่องรสนิยม

คำถามที่ผมคิดว่าควรถามต่อคือ ถ้าเครื่องมืออย่างนี้กลายเป็นมาตรฐาน หน้าเว็บที่ AI สร้างจะกลับมา "เหมือนกัน" อีกครั้งในสไตล์ใหม่หรือไม่

REF

[1] TikTok @aijaidee10 (28 ต.ค. 2026) · สกิลอันทำให้เว็บที่ AI สร้างจะไม่เหมือน AI สร้าง. https://www.tiktok.com/@aijaidee10/video/7701586751411834132

[2] GitHub (2026) · Nutlope/hallmark repository metadata. https://github.com/Nutlope/hallmark

[3] Together AI (2026) · Hallmark README. https://raw.githubusercontent.com/Nutlope/hallmark/main/README.md