Claude Design มาใหม่แบบไม่พัก
Claude Design เปิดตัวใหม่ เลยเอามาแชร์กัน
https://claude.ai/design
.
✅ได้ → ใช้เวลาไม่กี่นาที สั่งให้มันทำ UI หน้าแอป
✅ ได้ → ต่อด้วย Prototype แบบ interactive
✅ ได้ → ลองให้ generate Design System พร้อม token
✅ ได้ → ขอ Storybook ของ component ทั้งหมด
.
เร็วมากจนรู้สึกว่ากระบวนการที่เคยใช้เวลาเป็นวัน ถูกบีบเหลือเป็นนาที
.
แต่ยังมีข้อจำกัดที่ต้องพูดถึง
❎ ไม่ได้ → Claude Design ยังไม่สามารถ export งานไป Figma ไ ด้โดยตรง แบบที่ Google Stitch ทำได้
.
สำหรับทีมที่ workflow หลักอยู่บน Figma ตรงนี้ยังเป็นจุดที่ต้องรออัปเดต
ต้องมาดูกันต่อว่าอนาคตใครจะพัฒนาฟีเจอร์เหนือกว่ากัน
.
การแข่งขันในสาย AI design tool กำลังเข้มข้นขึ้นเรื่อยๆ
.
🤔 สิ่งเดียวที่แน่นอนคือ เหล่า designer ต้องปรับตัวตาม tools ไปเรื่อยๆ
.
เพราะถ้าเราต้านทานไม่ได้ เราก็ต้องเข้าร่วม 5555 อ่ะ ไปลองกัน 🤣
.
ปล. แอดใช้ Claude Pro Plan นะครับ
.
.
🔥 ใกล้เต็มแล้วววว UXUI รุ่น 49 - UXUI Process ครบ จบ ในที่เดียว
.
Unlock Skill UX/UI รุ่น 49
วันที่ 25, 26 เมษายน และ 10, 23, 24 พฤษภาคม 69
✅ https://www.facebook.com/share/p/1AfJpo6H5X/
.
👉 สำรองที่นั่ง/สอบถามข้อมูลเพิ่มเติม
FB PAGE : https://m.me/uxuistudio9
.
#uxuistudio #uxdesign #uidesign #graphicdesign #uxui #uxuiworkshop #uxworkshop #uiworkshop
#เพราะเราเข้าใจว่ามือใหม่ต้องการอะไร
ถ้าใครกำลังค้นหาเรื่อง “claude ui / claude design” แล้วอยากรู้ว่ามันช่วยงาน UX/UI ได้จริงแค่ไหน นี่คือสิ่งที่ผมลองแล้วเวิร์ก (และสิ่งที่ยังต้องทำมืออยู่) แบบประสบการณ์ใช้งานจริงๆ 1) เริ่มต้นให้ได้ผลเร็ว: เขียนโจทย์ให้ชัด ผมพบว่า Claude Design ทำงานเร็วมากเมื่อเรา “ล็อกโจทย์” ตั้งแต่ต้น เช่น ประเภทแอป + ผู้ใช้ + flow หลัก + สไตล์ภาพรวม ตัวอย่างที่ผมลองคือแอปจองตั๋วรถทัวร์ (แนว “Tour by Claude”) เลยกำหนดหน้าที่อยากได้ชัดๆ: หน้าหลัก, ผลการค้นหา, เลือกที่นั่ง, E-ticket/QR Code แล้วขอให้ทำเป็น mobile-first ทิปเล็กๆ: ระบุด้วยว่าอยากได้แนว material/ios-ish, โทนสี, ขนาดตัวอักษร, และสถานะหน้าจอ (loading/empty/error) จะได้ UI ที่ใช้งานต่อได้จริงมากขึ้น 2) ให้มันทำ “Prototype แบบ interactive” แล้วเช็ค flow จุดที่ผมชอบคือมันต่อ flow ให้ดูได้ไวมาก เหมาะกับช่วง validate ไอเดีย เช่น จากหน้าผลการค้นหา → เลือกรอบ → เลือกที่นั่ง → ชำระเงิน → ได้ E-ticket (มี QR) สิ่งที่ควรเช็คเองคือ copywriting, state ของปุ่ม (disabled/enabled), และ edge cases เช่น ไม่มีที่นั่งว่าง หรือกรอกข้อมูลไม่ครบ 3) Design System + Tokens: เอาไปใช้เป็นฐานมาตรฐานทีมได้ ลองสั่งให้ generate Design System พร้อม token แล้วรู้สึกว่าประหยัดเวลา “ตั้งต้น” มาก โดยเฉพาะสี (primary/secondary/surface), spacing, radius, shadow, typography scale และ component states (default/hover/pressed/disabled) แนะนำให้ขอเพิ่ม: - ชื่อ token ให้เป็นระบบ (เช่น color.primary.500) - กติกา accessibility คร่าวๆ (คอนทราสต์, ขนาดตัวอักษรขั้นต่ำ) - รายการ component ที่จำเป็นกับโปรเจกต์ (button, input, card, seat selector, ticket) 4) Storybook ของ components: เหมาะกับทีม dev ที่อยากเห็นภาพเร็ว การขอ Storybook ช่วยให้เห็นการแตก variant ของคอมโพเนนต์ไวขึ้น เช่น Button หลายขนาด/หลายสถานะ หรือ Card หลายรูปแบบ แต่ผมยังแนะนำให้ทีม dev ช่วยรีวิวโครงสร้าง props และ naming อีกที เพื่อให้เข้ากับ codebase จริง 5) ข้อจำกัดที่เจอ: ยังไม่ export ไป Figma ตรงๆ อันนี้เป็นจุดตัดสินใจสำคัญสำหรับหลายทีม เพราะ workflow หลักอยู่ใน Figma ถ้าต้องย้ายไป-มา อาจมี friction วิธีแก้ชั่วคราวที่ผมใช้คือเอา Claude Design เป็น “ตัวเร่งรอบแรก” (draft) แล้วค่อยย้ายไปจัดระเบียบใน Figma ด้วยมือ (หรือใช้วิธี capture/spec เป็น reference) สรุป: Claude Design เหมาะมากกับการทำ draft UI, ทดลอง flow, ตั้งต้น design system และสื่อสารกับทีมให้เห็นภาพเร็ว แต่ถ้าทีมคุณต้องส่งมอบไฟล์ Figma เป็นหลัก ให้เผื่อเวลาสำหรับขั้นตอนย้ายงาน/จัดระบบซ้ำอีกนิดครับ
