เรากำลังทำผิดพลาดแบบ Dreamweaver อีกครั้ง

AI กำลังทำให้งานดีไซน์กลับมาเป็นผู้ควบคุมโค้ดอีกครั้ง

เป็นเวลา 20 ปีที่เราพยายามแยกบทบาทเหล่านี้ออกจากกัน ดีไซน์เนอร์ทำหน้าที่ออกแบบ นักพัฒนาทำหน้าที่สร้าง และมนุษย์ทำหน้าที่เป็นสะพานเชื่อม

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

ฟังดูเหมือนจะมีประสิทธิภาพ แต่มันก็มาพร้อมกับความเสี่ยง

ในยุค Dreamweaver สมัยก่อน มนุษย์จะอยู่ตรงกลางเพื่อควบคุมคุณภาพ แต่ด้วย AI งานดีไซน์จะพุ่งตรงไปสู่โค้ดโดยไม่มีใครคอยควบคุมทิศทาง

มีสองสิ่งที่ต้องทำความเข้าใจ:

  • ไฟล์ดีไซน์ไม่ใช่ระบบดีไซน์ (Design System) ไฟล์ถูกตัดสินจากรูปลักษณ์ แต่ระบบถูกตัดสินจากความสามารถในการนำกลับมาใช้ใหม่ ความทนทาน และสถานะต่างๆ (States) ซึ่ง AI กำลังทำให้เส้นแบ่งนี้พร่าเลือน
  • AI นั้นยอดเยี่ยมสำหรับเว็บไซต์แบบ Static หากคุณต้องการเพียงแค่ภาพจำลอง (Snapshot) ก็ใช้มันได้เลย แต่ปัญหาจะเริ่มขึ้นเมื่อคุณสร้างระบบที่นำกลับมาใช้ใหม่ได้ เช่น custom CMS หรือ dynamic UI

ความล้มเหลวที่แท้จริงเกิดขึ้นในรายละเอียด

ทีมงานมักจะสร้าง code pipeline โดยอิงจากชื่อตัวแปรใน Figma การตั้งชื่อคือทางเลือกในการออกแบบ แต่ AI กลับเปลี่ยนมันให้กลายเป็นข้อตกลงที่ตายตัว (Rigid contract) หากดีไซน์เนอร์เปลี่ยนชื่อตัวแปรเพียงตัวเดียว pipeline ทั้งหมดก็จะพังลง

งานดีไซน์คือภาพจำลองที่หยุดนิ่ง มันแสดงหน้าจอเพียงหน้าเดียวในสถานะเดียว แต่มันไม่ได้แสดง:

  • สถานะการโหลด (Loading) หรือสถานะข้อผิดพลาด (Error states)
  • เลย์เอาต์ที่ขับเคลื่อนด้วยเนื้อหา (Content-driven) เทียบกับเลย์เอาต์แบบคงที่ (Fixed layouts)
  • วิธีที่ CMS ส่งข้อมูลมาให้

บริบทเหล่านั้นอยู่ในหัวของนักพัฒนา ไม่ได้อยู่ในไฟล์ดีไซน์

ผู้นำในอุตสาหกรรมกำลังพยายามแก้ไขเรื่องนี้ Google ได้ปล่อย DESIGN.md เพื่อให้ AI มีโครงสร้างมากขึ้น ส่วนเครื่องมืออย่าง Fixel ก็ช่วยตรวจจับ design drift โดยการตรวจสอบความถูกต้องของโค้ดเทียบกับ Figma

แต่แม้แต่เครื่องมือที่ดีที่สุดก็ยังมีขีดจำกัด พวกมันสามารถดึงข้อมูล pixels หรือ tokens ออกมาได้ แต่ไม่สามารถตัดสินใจเชิงสถาปัตยกรรม (Architectural decisions) ได้ พวกมันไม่สามารถตัดสินใจได้ว่าจะนำคอมโพเนนต์ที่มีอยู่แล้วมาใช้ใหม่ หรือจะสร้างอันใหม่ขึ้นมา

อนาคตไม่ใช่เรื่องของการให้ดีไซน์ขับเคลื่อนโค้ด แต่มันคือเรื่องของ "ทางสายกลาง"

ผมเชื่อว่าทางสายกลางนี้ต้องการ:

  • การรับค่า CSS แบบมี Type (Typed CSS inputs) ในช่วง build time
  • การให้ AI เสนอวิธีการแมปงานดีไซน์เข้ากับระบบที่มีอยู่เดิม
  • การให้ UX engineer เป็นผู้ตัดสินใจขั้นสุดท้ายเกี่ยวกับพฤติกรรมและความหมาย

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

เราต้องไม่ตัด UX engineer ออกจากกระบวนการ เราต้องการคนที่รับผิดชอบเรื่องการแมป (Mapping) และข้อตกลง (Contract) ระหว่างงานดีไซน์และระบบ

คุณจะตัดสินใจอย่างไรว่าสิ่งไหนควรเป็นสิ่งที่ AI เสนอ และสิ่งไหนควรเป็นสิ่งที่คุณต้องตัดสินใจเอง?

Source: https://dev.to/slafleche/were-making-the-dreamweaver-mistake-again-on-purpose-this-time-ema