🧠 Claude Skills

Frontend Designer Pro

AI ออกแบบเว็บที่ไม่หน้าเหมือน AI — ผ่าน Taste Checklist 8 ข้อ ก่อน output ทุกครั้ง

1·v1.0.0·50 KB

เกี่ยวกับ

Claude Skill สำหรับการออกแบบ UI/UX — auto-trigger เมื่อคุณขอ design/decorate/polish. มี 6 archetypes (Editorial · Kinetic · Brutalist · Soft Minimal · Premium Dashboard · Warm Hospitality), 8 industry-preset palettes, anti-pattern gallery, motion recipes, Thai font support.

ฟีเจอร์เด่น

Taste checklist 8 ข้อ verify ก่อน output
6 aesthetic archetypes พร้อม code patterns
8 industry-preset palettes (Tech/Spa/Cafe/E-com/Trust/Creator/Luxury/Editorial)
Typography pairing matrix (Latin + Thai)
Motion recipes 5 แบบ
Anti-pattern gallery บอกชัดว่าห้ามทำอะไร
Mandatory output template (Direction · Tokens · Code · Notes)

สิ่งที่คุณจะได้

→SKILL.md (264 บรรทัด) + references/archetypes.md (377 บรรทัด)
→Auto-trigger ใน Claude Code/Desktop/Web
→Lifetime updates ฟรี
→Commercial license OK

วิธีติดตั้ง

## ติดตั้งใน 30 วินาที 1. Download zip จากปุ่ม **Download** ด้านบน 2. Unzip 3. ย้ายโฟลเดอร์ `frontend-designer-rongrianai` ไปที่ `~/.claude/skills/` 4. Restart Claude Code (`/quit` แล้วเปิดใหม่) ✓ Done — skill auto-trigger ทุกครั้งที่คุณขอออกแบบ UI

หรือ one-liner:

curl -sSL rongrianai.com/install/frontend-designer | sh

Requirements

Claude Code / Claude Desktop / Claude.ai (ฟรีก็ได้)