design-farmer - สกิลสำหรับ AI coding agent ที่อ่านโค้ดเบสแล้วจัดระเบียบเป็นดีไซน์ซิสเต็ม

วิเคราะห์รีโพซิทอรี ดึงแพตเทิร์นการออกแบบที่มีอยู่ แล้วต่อยอดให้เป็นดีไซน์ซิสเต็มที่อิง OKLCH พร้อมโทเคน คอมโพเนนต์ การทดสอบ และเอกสาร

ทำไมถึงจำเป็น?

เมื่อทำงานกับ AI agent และ vibe coding สิ่งแรกที่มักพังคือความสม่ำเสมอของดีไซน์ สีไม่ไปในทิศทางเดียวกัน ระยะห่างไม่เท่ากัน และ dark mode ก็ถูกมองข้ามไปก่อน หากกำหนดข้อจำกัดด้านดีไซน์ที่ชัดเจนให้เอเจนต์ ก็จะได้ UI ที่สม่ำเสมอมากขึ้นมาก แต่การทำสิ่งนั้นด้วยตัวเองกลับเป็นงานที่ไม่คุ้มแรง

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

ฟีเจอร์หลัก

• จัดระเบียบ design token บนพื้นฐาน OKLCH
• จัดโครงสร้างลำดับชั้นของ primitive / semantic token
• สร้างคอมโพเนนต์พื้นฐานโดยคำนึงถึงการเข้าถึง
• ขยายรองรับ dark theme
• สร้าง DESIGN.md
• ตรวจสอบ style drift และการใช้โทเคนผิดวิธี

เป้าหมายคือการสร้างเวิร์กโฟลว์ด้านดีไซน์ที่ทำซ้ำได้ เพื่อให้เอเจนต์สามารถอ้างอิงต่อได้อย่างต่อเนื่องในการทำงานครั้งถัดไป

หากใส่ไฟล์ DESIGN.md จาก awesome-design-md ไว้ในโปรเจกต์ ระบบจะเริ่มต้นด้วยการทำความเข้าใจซิสเต็มที่ผู้ใช้ต้องการ