←Blog
Figma2026-05-15·1 min read

DESIGN.md กับ SKILL.md ต่างกันยังไง อย่าเอามายัดรวมกัน

D

Design Lazyyy

Design Lazyyy

DESIGN.md กับ SKILL.md ต่างกันยังไง อย่าเอามายัดรวมกัน

ใครที่เริ่มจะ Vibe ช่วงนี้คงอาจจะเคยได้ยิน DESIGN.md กับ SKILL.md ว่ามันต่างกันยังไง เพราะมันปิดด้วย .md เหมือนกัน . เอาล่ะแอดอธิบายแบบนี้ละกัน นามสกุล .md เหมื

ใครที่เริ่มจะ Vibe ช่วงนี้คงอาจจะเคยได้ยิน DESIGN.md กับ SKILL.md ว่ามันต่างกันยังไง เพราะมันปิดด้วย .md เหมือนกัน
.
เอาล่ะแอดอธิบายแบบนี้ละกัน
นามสกุล .md เหมือนกัน AI อ่านได้ทั้งคู่ คนเลยมั่ว
เอา design system ไปยัดใน SKILL.md
เอา instruction ไปยัดใน DESIGN.md
.
ผลที่ออกมาคือ AI งง output เพี้ยน สุดท้ายโทษ AI ว่ามันโง่ ก่อนจะบอกว่ามันโง่เราต้องมาทำความเข้าใจมันก่อน อันที่แท้จริงเราใส่มันผิดที่
.
แอดขออธิบายให้เห็นภาพง่ายๆ
DESIGN.md คือ "บ้านที่เราจะสร้าง"
เราบอก AI ว่าโปรเจกต์เราหน้าตายังไง เช่น
*สีอะไร
*font อะไร
*spacing เท่าไหร่
*component แต่ละตัวมี props อะไรบ้าง
พูดง่ายๆ คือเอา Design System ทั้งก้อน บีบลงมาเป็นไฟล์เดียว
AI เปิดอ่านทุกครั้งที่จะสร้าง UI เพื่อให้ทุกหน้ามาจากภาษาเดียวกัน
ปุ่มหน้านี้สีน้ำเงิน หน้าถัดไปก็ต้องน้ำเงินเฉดเดียวกัน
ไม่ใช่หน้านี้ blue-500 หน้าโน้นเป็น #3B82F6 อีกหน้าใช้ rgb มาเฉยๆ
DESIGN.md ตอบว่า "บ้านนี้หน้าตาเป็นยังไง"
.
SKILL.md คือ "วิธีสร้าง"
เราบอก AI ว่า "ถ้าเจองานแบบนี้ ทำตามขั้นตอนนี้"
เช่น
*สร้างไฟล์ PDF / ทำสไลด์ตามแบรนด์ / ดึง design token จาก Figma / กรอกฟอร์ม
โดยสร้าง folder skill ขึ้นมา ข้างในมี SKILL.md อย่างน้อยหนึ่งไฟล์ ถ้ามี skill มากกว่านั้นก็เพิ่มเข้าไปได้เหมือนกัน
.
ส่วนหัวเป็น YAML บอกชื่อ skill กับ description ว่าใช้ตอนไหน
ที่เหลือเป็นคำสั่ง step by step ว่าทำยังไง
.
จุดสำคัญที่คนพลาด คือ AI ไม่ได้อ่าน SKILL.md ตลอดเวลา
มันจะหยิบมาอ่านเฉพาะตอนที่งานตรงกับ description ที่เราเขียนไว้
นี่คือ Progressive Disclosure ที่ Anthropic ทำเป็น open standard
ตอนนี้ Claude, Codex, Cursor รองรับหมดแล้ว
SKILL.md ตอบว่า งานนี้ทำยังไง
.
ความต่างที่ต้องจำให้ขึ้นใจ (อย่าสับสน)
DESIGN.md ติดโปรเจกต์ ย้ายไปโปรเจกต์อื่นไม่ได้ เพราะมันคือ context ของบ้านหลังนี้โดยเฉพาะ
SKILL.md ติดตัว AI ย้ายข้ามโปรเจกต์ได้ทั้งโฟลเดอร์ ใช้กับงานอื่นได้เลย DESIGN.md โหลดทุกครั้ง เพราะเป็น context หลัก
SKILL.md โหลดเฉพาะเมื่อเจอ trigger เพราะเป็นทักษะที่หยิบมาใช้
.
DESIGN.md เป็นสเปคของบ้าน
SKILL.md เป็นวิชาของช่าง
.
แล้วใช้ตอนไหน
อยากให้ทุกหน้าจอออกมาเหมือนกัน → DESIGN.md
อยากให้ AI ทำงานซ้ำๆ ได้เหมือนเดิมทุกครั้ง → SKILL.md
โปรเจกต์ที่ทำกับ AI จริงจัง ต้องมีทั้งคู่
DESIGN.md บอกว่าบ้านเป็นยังไง
SKILL.md บอกว่าจะทำอะไรในบ้านนี้ยังไง
ขาดอย่างใดอย่างหนึ่ง คือทำงานได้แค่ครึ่งเดียว
.
นี่ไม่ใช่ฟีเจอร์ใหม่ที่เอาไว้ลองเล่น
มันคือ infrastructure การทำงานกับ AI ของปี 2026
ใครยังไม่จัดโฟลเดอร์ของโปรเจกต์ตัวเอง คือเริ่มช้ากว่าคนอื่นไปแล้ว
#designlazyyy #designmd #designsystem #Claude #claudecode #vibecode

Share this article

Register Now

JOIN
BATCH 3

สมัครเรียน AI Design System Bootcamp รุ่นที่ 3

Course Details

3 เดือน | 12 สัปดาห์ | 78 ชั่วโมง

ทุกวันเสาร์ 09.30-16.00 | Online

เริ่มเรียน วันที่ 5 ธันวาคม 2569

฿25,000฿45,000

เรียนย้อนหลังได้ฟรีตลอดชีวิต

ปิดรับสมัคร: 15 พฤศจิกายน 2569

Contact

designlazyyy@gmail.com

⏳

เปิดลงทะเบียน 2 สิงหาคม 2569

อีกไม่นานแล้ว! เตรียมตัวให้พร้อม

00
Days
00
Hrs
00
Min
00
Sec