Open Design: ทางเลือก Open-Source แทน Claude Design ที่พุ่ง 2,700 ดาวใน 24 ชั่วโมง

ถ้าฟีลคล้าย Claude code แต่ไม่ต้องใช้ claude subscription ลองกันได้ครับ

——---

Open Design: ทางเลือก Open-Source แทน Claude Design ที่พุ่ง 2,700 ดาวใน 24 ชั่วโมง

เมื่อ 17 เมษายน 2026 Anthropic เปิดตัว Claude Design พร้อมกับโมเดล Opus 4.7 - เปลี่ยน LLM จากการเขียนข้อความธรรมดา มาเป็นการสร้าง design artifact จริงๆ โพสต์ไวรัลทันที แต่ติดปัญหาใหญ่: ปิดซอร์ส, ใช้ได้แค่บน claude.ai, จ่ายเงินเท่านั้น, ล็อคอยู่กับโมเดลของ Anthropic ไม่มีวัน self-host หรือ deploy เองได้

Open Design (OD) คือคำตอบ open-source ที่เกิดขึ้นห่างกันแค่ 11 วัน

แกนหลัก 6 ข้อที่ทำให้ OD ต่างจาก Claude Design

1. เราไม่ต้องส่ง agent มาให้ - ของคุณดีพอแล้ว OD ไม่ได้มาพร้อม agent ของตัวเอง แต่สแกนหา coding agent ที่คุณมีอยู่แล้วบนเครื่อง - Claude Code, Codex CLI, Cursor Agent, Gemini CLI, OpenCode, Qwen Code หรือ GitHub Copilot CLI - แล้วใช้ตัวนั้นเป็น design engine เลย ไม่มี agent? ใช้ Anthropic API แบบ BYOK ได้

2. Skill คือไฟล์ ไม่ใช่ plugin ตาม convention ของ Claude Code SKILL.md แต่ละ skill ก็คือโฟลเดอร์ (SKILL.md + assets/ + references/) ดรอปเข้าไปใน skills/ รีสตาร์ท daemon ก็เสร็จ ไม่ต้อง build ไม่ต้อง registry มี 19 skills พร้อมใช้: prototype, deck, mobile app, dashboard, pricing, docs, blog, SaaS landing, email marketing, social carousel, sprite animation และ document templates อีก 10 แบบ (PM spec, OKRs, runbook, invoice, kanban ฯลฯ)

3. Design System คือ Markdown ไม่ใช่ theme JSON เรือธงเรื่องนี้เลย - 71 design systems ที่มาเป็นไฟล์ DESIGN.md 9 หมวด (color, typography, spacing, layout, components, motion, voice, brand, anti-patterns) สลับระบบได้ทันที artifact ต่อไปก็ใช้ token ใหม่ มีตั้งแต่ Linear, Stripe, Vercel, Airbnb, Tesla, Notion, Apple, Cursor, Supabase, Figma, Coinbase, Binance, Shopify, Spotify ไปจนถึง SpaceX

4. Question Form ป้องกัน 80% ของการ redirect กฎข้อ 1 ของ OD: turn แรกต้องเป็น <question-form> เท่านั้น ห้ามเขียนโค้ด ห้ามคิด ห้ามเรนเดอร์ surface, audience, tone, brand context, scale - ตอบ 30 วินาทีด้วย radio button ดีกว่าเสียเวลาแก้ 30 นาทีหลังเสร็จ

5. Daemon ทำให้ agent รู้สึกเหมือนอยู่บนเครื่องคุณ - เพราะมันอยู่จริงๆ Daemon spawn CLI ของคุณใน project folder จริงๆ agent ได้ Read, Write, Bash, WebFetch ครบ - เข้าถึง filesystem จริง อ่าน template, grep หา hex color, เขียน brand-spec.md, สร้าง .pptx/.zip/.pdf ที่ปรากฏใน file workspace ทันที session ทั้งหมดเก็บใน SQLite เปิดมาวันต่อมา todo card ยังอยู่ที่เดิม

6. Prompt stack คือตัวผลิตภัณฑ์ ที่ส่งไปไม่ใช่แค่ "system + user" แต่เป็น 7 เลเยอร์: DISCOVERY directives + identity charter + active DESIGN.md + active SKILL.md + project metadata + skill side files + deck framework directive (ถ้าเป็น deck mode) ทุกเลเยอร์แก้ไขได้ ทุกเลเยอร์คือไฟล์

Anti-AI-Slop: กลไกป้องกันผลงาน AI ที่ดูเป็น AI

นี่คือสิ่งที่แยก OD ออกจาก "AI ลองทำ design" ทั่วไป:

  • Question form ก่อนเสมอ - Turn 1 คือคำถามเท่านั้น ไม่มีโค้ด ไม่มีการคิด

  • Brand-spec extraction - 5 ขั้นตอน: locate, download, grep hex, codify brand-spec.md, vocalize - ห้ามเดาสีแบรนด์จากความจำเด็ดขาด

  • 5-dim self-critique - ก่อนส่ง artifact agent ต้องให้คะแนนตัวเอง 1-5 ตาม philosophy, hierarchy, execution, specificity, restraint ต่ำกว่า 3/5 = แก้ใหม่

  • Slop blacklist - ไล่แบน purple gradient, generic emoji icons, rounded card + left-border accent, hand-drawn SVG humans, Inter เป็น display face, invented metrics

  • Placeholder ที่ซื่อสัตย์ > ตัวเลขปลอม - ไม่มีข้อมูลจริง = ใช้ — หรือ grey block ห้ามเขียน "10x faster" แบบไม่มีที่มา

Visual Directions: 5 ทิศทางไม่มี AI Improvise

เมื่อผู้ใช้ไม่มี brand spec agent จะเสนอ 5 ทิศทางให้เลือก แต่ละทางคือ deterministic spec ครบ - palette ใน OKLch, font stack, layout posture cues, references เลือกคลิกเดียว = ระบบ visual พร้อมใช้ ไม่มีการ improvise:

ทิศทาง

บรรยากาศ

Editorial - Monocle/FT

นิตยสารสิ่งพิมพ์, หมึก + ครีม + warm rust

Modern Minimal - Linear/Vercel

เย็น, โครงสร้าง, accent น้อย

Tech Utility

หนาแน่น, monospace, terminal

Brutalist

ดิบ, type ขนาดใหญ่, ไม่มีเงา, accent แรง

Soft Warm

กว้าง, contrast ต่ำ, neutral อบอุ่น

เปรียบเทียบรวดเดียว

Claude Design

Open Design

License

ปิด

Apache-2.0

Deploy เองได้

ไม่ได้

Vercel / local

Agent

มาพร้อม (Opus 4.7)

ใช้ agent ที่มีอยู่

Skills

กรรมสิทธิ์

19 SKILL.md file-based

Design systems

กรรมสิทธิ์

71 ระบบ markdown

Init question form

ไม่มี

มี (hard rule)

Anti-slop

ไม่มี

5-dim critique + blacklist

Export

จำกัด

HTML / PDF / PPTX / ZIP / MD

สถานะปัจจุบัน

เพิ่งเปิด 28 เมษายน 2026 - วันเดียว 2,710 ดาว, 329 forks closed loop หลัก (detect agent, เลือก skill + design system, chat, parse artifact, preview, save) ทำงานได้ครบจบ prompt stack และ skill library คือจุดที่ value สูงสุดและ stable แล้ว UI component ยัง update รายวัน

Roadmap ที่กำลังจะมา: comment-mode surgical edits, AI-emitted tweaks panel, Vercel deployment recipe, npx od init, skill marketplace

ลองเลย

git clone https://github.com/nexu-io/open-design.git
cd open-design
nvm use
corepack enable
pnpm install
pnpm dev:all    # daemon (:7456) + Vite (:5173)
open http://localhost:5173

ที่มา: https://github.com/nexu-io/open-design